Start with journeys and content
Define who arrives, what they know, which decision they face, and what information advances them; products also need roles, states, re-entry, and failure consequences.
Use real copy, tables, media, and validation rules before final composition because placeholders hide long labels, weak evidence, and missing explanations.
Use prototypes to test logic
A low-detail prototype exposes hierarchy and transitions before visual polish, making missing states and unnecessary steps cheaper to correct.
For high-risk journeys, observe representative users attempting the task without author coaching and turn each obstacle into a specific design decision.
Build a system that can expand
Typography, colour, grid, components, and states must survive catalogues, long forms, errors, and account areas rather than only one presentation screen.
Show mobile and wide versions of key pages plus navigation, forms, loading, empty, failure, and success states, with components named by purpose rather than appearance.
Treat implementation as part of handoff
Document responsive behaviour, states, assets, and content rules, then review the running interface on real devices with the engineering team.
Only the running product reveals font loading, keyboard focus, scroll behaviour, intermediate widths, and performance, so visual acceptance cannot end at the design file.