Web Design

Visual design

Core areas that work together to create a page’s visual hierarchy include:

• Composition
• Layout: Principles of symmetry and common reading patterns
• Color: Build a color palette
• Typography

User experience

You need to know about information architecture and how to define the user flow of a website.

Design process overview

The design process is an iterative one:

1. UX research phase
   • ID what the user neeeds your website to fulfill
   • ID the target audience
2. User experience design
   • Focus on page layout, content placement, and flow of pages–how users get from A to B
   • This step is business requirments + needs ID’d in research phase
3. Design and build phases
   • Apply visual design elements such as color, typography, and animations
   • Develop code
4. Test and evaluate
   • Ensure what you built meets your user’s needs
   • If it doesn’t meet the needs, figure out why and make adjustments

Phases of design process

The design process steps can placed in two categories:

• user experience fundamentals: reseraching, building project scaffolding, and testing
• visual design fundamentals: added to the UX phase to bring character and hierarchy to the experience with colors, spacing, topography, and animation

UX fundamentals

UX is prevalent in all phases of the design process:

• reasearch
• planning
• wireframing
• prototyping and testing

Visual design fundamentals

Design is a way to solve a problem or provide information through visuals. Foundational design principles are the basis for establishing relationships between the content on the page, creating hierarchy, and drawing people in. They include the following:

• proximity
• contrast
• symmetry
• alignment

You need to know this before you go into the user experience phase, and eventually the visual design phase.

Create the hierarchy with color, type, and space. There is no inherent talent here, it can all be learned.