Interfaces that help you take action
Improve a page with the user’s task, using visual decisions you can justify.
What is it
An interface organizes decisions.
Why learn
Action clarity lets you evaluate the design by how it’s used. You can ask whether the person found and completed the task, instead of discussing only personal taste.
Key concepts
Task · Hierarchy · Primary · Alternative
What is it
Record the current page and identify concrete issues: cut-off text, ambiguous label, low contrast, or difficulty locating information.
Why learn
A specific observation leads to a smaller, easier-to-check intervention. The previous record lets you compare the result without relying on memory.
Key concepts
Baseline · Problem · Intervention · Regression
What is
When requesting layout options, keep content and purpose constant.
Why learn
Comparing proposals with the same data prevents one option from looking better just because it uses less content or hides a difficult state.
Key concepts
Criterion · Variable · Constant · Constraint
What is
A UI needs to handle an empty list, loading, error, success, and long data.
Why learn
Difficult states are part of the real product. Considering them prevents the page from working only with the short, complete data used in the demo.
Key concepts
Empty · Error · Focus · Extreme
What is
Small text and low contrast require more effort to read.
Why learn
Reviewing makes visual improvement inclusive and measurable. You avoid approving a beautiful design that makes reading harder or loses functionality on mobile.
Key concepts
Contrast · Reflux · Target · Scale
What is
Use a fake table with five orders, including a long name and a missing deadline.
Why learn
The exercise combines diagnosis, intervention, and testing. The habit of justifying each change helps maintain consistency when other people join the project.
Key concepts
Before · After · Rationale · Verification