01
UX Audit of Existing Product (or Product Brief for New Builds)
We begin by reviewing what already exists, or, for new products, by working through a structured brief that documents user roles, core tasks, and product goals. For existing products, the audit covers navigation structure, onboarding flow, task completion paths, and any UK GDPR UI requirements. You receive a written findings report with prioritised recommendations before any design work begins.
02
User Journey Mapping
We map the key journeys your users take through the product: activation, core task completion, account management, and offboarding. Each journey identifies friction points, drop-off risks, and moments where the product fails to support what the user is trying to do. These maps become the brief for every subsequent design decision.
03
Wireframes
Before any visual design, we produce low-fidelity wireframes for every key screen and flow. Wireframes are reviewed with your team, iterated based on feedback, and signed off before we move to high-fidelity design. This is the stage where structural decisions are made cheaply, before they are expensive to change.
04
High-Fidelity UI Design in Figma
Every screen, state, and interaction is designed in Figma at full fidelity. This includes empty states, error states, loading states, and edge cases your developers will ask about. The Figma file is organised by section so your team can navigate it without needing a guided tour.
05
Design System (Components, Tokens, Patterns)
We build a component library that covers every UI element in the product: buttons, inputs, modals, tables, navigation, notifications, and data visualisation components. Design tokens cover colour, typography, spacing, and border radius. The system is documented so your team can extend it without breaking consistency.
06
Developer Handover Specifications
Every screen includes spacing annotations, interaction notes, responsive behaviour documentation, and asset exports. Your developers receive a handover file that answers every question they would otherwise ask you, including how components behave at different breakpoints and what happens in error states.
07
Implementation Review Round
After development begins, we conduct a structured review of the built product against the Figma designs. We document discrepancies, provide clear guidance on what to fix, and confirm that the implemented UI matches the design intent before launch. This review is included in the engagement.