Fundamentals of Graphic Design

Accessibility

• Focuses on designing products and websites usable by everyone, including those with disabilities.
• Similar to providing ramps next to stairs, offering alternative paths to achieve a goal.

Alignment

• Arranging elements (text, images) on a page in a way they visually line up.
• Improved alignment creates a professional, organized look.

Balance

• Distributing design elements evenly (or unevenly) to achieve visual harmony.
• A seesaw analogy illustrates the concept of equilibrium.

Color Theory

• The study of how color affects perception and its uses in design.
• Involves color wheels, warm/cool colors, and creating pleasing color combinations.

Contrast

• Using differences to highlight elements.
• High contrast (black on white) and low contrast (similar shades) are both valid design options.

Hierarchy

• Arranging elements by importance to guide the user's eye.
• A clear example is a newspaper headline emphasized more than other text.

Human-Centered Design (HCD)

• Design process emphasizing the impact of design on all users.
• Considers the wider influence of a design, not just immediate users.

Information Architecture (IA)

• Organizing content on websites or apps for easy navigation and understanding.
• Example: How libraries structure sections and shelves aids finding information.

Interaction Design

• Designing how users interact with a product.
• Includes actions like clicking buttons or swiping on mobile devices.

Journey Map

• Visual illustration of a user's experience interacting with a product.
• Shows user steps, emotions, and pain points.

Negative Space

• Empty areas around design elements.
• Properly used negative space gives a design room to breathe and adds visual appeal.

Proportion

• The relationship between element sizes in a design.
• A contrasting size aspect between a large image and a small caption below is an illustration.

Prototype

• A basic model of a design idea.
• Can range from simple sketches to functioning software models, allowing cheap and quick testing.

Repetition

• Using repeating patterns or elements for consistency and unity.

Typography

• The art of selecting and arranging fonts for style and readability.

User Experience (UX)

• How a person feels during product use.
• UX considers emotions, ease of use, efficiency, and overall impression.

User Flow

• The path a user takes to complete a task on a website or app.
• Simulates actions like purchasing online items through steps.

User Persona

• Fictional representation of a typical product user.
• Helps designers anticipate user needs and behaviors.

User Research

• Understanding users' needs, behaviors, and challenges.

Usability Testing

• Observing real users interact with a design.
• To find usability issues and improve ease of use.

Wireframe

• A basic outline of a website or app's layout.
• Similar to a house blueprint, outlining structure before building.

Tools

• Adobe Creative Suite (Photoshop, Illustrator, InDesign): Professional graphic design tools.
• Canva: User-friendly online design platform with templates.
• Color Wheel: Visual tool for understanding color combinations.
• Figma: Software for design, prototyping, and collaboration.
• Font Libraries: Resources for different fonts.
• Fluent 2: Microsoft's design system.
• Optimal Workshop: Suite for user research.
• Miro: Virtual whiteboard for collaboration.
• PowerPoint: Presentation software.
• Pen and Paper: Basic sketching for quick ideas.
• Sketch: Design software comparable to Figma.
• Whimsical: Online tool for wireframes and diagrams.

Models and Methodologies

• Agile UX: Adapting Agile to UX design with short cycles, feedback, and collaboration.
• Design Sprint: Time-boxed process (a week) for quickly tackling a design problem.
• Design Thinking: Human-centered problem-solving, comprising empathize, define, ideate, prototype, and test phases.
• Heuristic Evaluation: Reviewing a design against usability principles.
• Lean UX: Quick cycles for building, measuring, and learning in UX design.
• Participatory Design: Including users as co-designers.
• Surveys: Questionnaires for gathering user insights.
• Tree Testing: Evaluating website or app information structure.
• User-Centered Design (UCD): Prioritizing user needs, behaviors, and goals in the design process.