Internship
Student login
← UI/UX Design learning path
UI/UX Design · Module 4 of 10

Wireframes and user flows

Sketch structure before visual design.

📖 Key ideas

  1. User flows map steps to complete a task.
  2. Wireframes are low-fidelity layouts without colours.
  3. Start with paper sketches, then digital wireframes.
  4. Focus on layout, hierarchy and content.
  5. Iterate quickly before investing in visuals.
💡 Real-life example: Wireframes are a building's floor plan before choosing paint and furniture.
User flowSteps to complete a task
WireframeLow-fidelity layout sketch
Low fidelitySimple, rough design
High fidelityDetailed, near-final design