UX/UI Designer how-to

How to Create a Wireframe

Wireframes let teams agree on structure before visual design.

Updated By the Career Education Institute Curriculum Team
Quick answer

Wireframes let teams agree on structure before visual design. In short: define; list; sketch, then complete the remaining steps below.

Step by step

  1. Define the page goal and user tasks.

  2. List content and actions needed.

  3. Sketch layouts on paper first.

  4. Build low-fidelity wireframes in Figma.

  5. Annotate interactions.

  6. Review with stakeholders before adding visuals.

Safety reminders for UX/UI designers

  • Protect user research data and consent
  • Design ethically, avoiding deceptive patterns
  • Take screen breaks
  • Use ergonomic setups

UX · UI · Wireframe · Prototype · User flow · Persona: see the full UX/UI designer glossary.

More UX/UI designer how-to guides

Learn this in UX/UI Designer trainingTake the practice test
Enroll in trainingTake fit quiz