Skip to content
Module
Module 3 of 5Lesson 2 of 2~12 min

Wireframes, screen states and heuristic critique

A screen mocked up only in its ideal state often hides gaps that users will find for you. This lesson helps you produce low-fidelity wireframes that cover every situation a screen can be in, then put them through usability heuristics before any test with users.

Take this lesson: your first course is freeSee the full syllabus

Lesson objective

By the end of this lesson, you will be able to produce low-fidelity wireframes that cover every state of a screen, and critique them with Nielsen's heuristics before showing them to users.

Topics covered

  • wireframes
  • screen states
  • Nielsen heuristics
  • heuristic evaluation
  • UX mockups

Where it fits

Design the solution

What does the experience look like, including when things go wrong?

Lessons in this module

  1. Map the flow and its edge cases
  2. Wireframes, screen states and heuristic critique (this lesson)

What you will learn in the course

This lesson is part of the course Design and validate a product experience with AI

  • Write a user-centered, testable problem statement backed by discovery evidence.
  • Prepare, run and synthesize unbiased discovery interviews, using AI for preparation and synthesis without delegating judgment to it.
  • Build a persona and job stories grounded in real quotes, then choose a target opportunity in an opportunity solution tree.
  • Map a flow with its edge cases and turn it into low-fidelity wireframes that cover every screen state.
  • Choose a prototype's fidelity and tool (including an AI prototyping tool), run a usability test and prioritize the problems observed.
  • Prioritize a backlog with an explicit method (RICE, MoSCoW, value / effort), making the score's assumptions visible, and justify the trade-off.
  • Build an outcome-based roadmap with success criteria, and write a handoff spec with acceptance criteria.

Related courses