How I Design
Products That Work
A structured, research-driven process spanning 9 phases — from stakeholder alignment and user discovery, through wireframing, prototyping, and hi-fidelity UI, to developer handoff and documentation.
Project Kickoff &
Research Planning
Every great product begins with alignment. Before sketching a single wireframe, I bring together the cross-functional team, define shared goals and roles, establish a project brief, and map out a clear research plan — ensuring the entire team is rowing in the same direction.
A shared agreement defining each team member's roles, responsibilities, communication cadence, decision-making protocols, and design ownership across the project lifecycle.
A structured document outlining research objectives, key questions, scope boundaries, methodology choices, and timelines — giving the entire team a shared north star before research begins.
Workshop sessions with product owners, developers, and business leads to surface existing assumptions, align on success metrics, and identify potential blockers early in the process.
User Research
The most critical phase. I combine primary research — directly engaging real users through interviews, surveys, and contextual inquiry — with secondary research such as literature reviews, market audits, competitive benchmarking, and SWOT analysis to build a 360° picture of the problem space.
One-on-one semi-structured interviews to uncover deep motivations, mental models, and pain points. Paired with quantitative surveys (Google Forms / Typeform) to validate trends across larger sample groups.
Systematic evaluation of direct and indirect competitors — analyzing their features, UX patterns, visual language, pricing, and user reviews to identify market gaps and differentiation opportunities.
A 4-quadrant framework mapping internal Strengths & Weaknesses against external Opportunities & Threats — giving strategic context to every design decision made later in the process.
Synthesis & Definition
Raw data becomes insight. I cluster interview notes using affinity mapping, build data-driven personas representing real user archetypes, establish accessibility requirements, draft user stories, write problem statements using HMW framing, define design principles, and create a Value Proposition Canvas to anchor the entire product strategy.
Grouping hundreds of raw interview observations into thematic clusters on a digital FigJam board — surfacing patterns, recurring pain points, unmet needs, and key opportunity areas from the data.
Data-backed fictional archetypes representing key user segments — detailing goals, behaviours, frustrations, motivations, tech proficiency, and quoted verbatims to keep the team grounded in real user needs.
Mapping user jobs-to-be-done, pains, and gains against the product's features and benefits — ensuring every design decision is justified by a real user need or product differentiator.
Journey Map &
Information Architecture
Visualising the full user experience end-to-end. Journey maps reveal emotional highs and lows across every touchpoint. Task flows and user flows define the precise logical paths through the system. Storyboards contextualise the product in real-world scenarios. The IA sitemap then structures every screen and content hierarchy before a single pixel is drawn.
A timeline-based visualisation showing all user actions, touchpoints, emotional states, and internal thoughts across a complete product scenario — exposing friction moments and "wow" opportunities that guide design priorities.
Step-by-step decision-tree diagrams showing exactly how users navigate through screens to accomplish a goal — distinguishing between the system's task flow (what the system does) and the user flow (what the user experiences).
Hierarchical structures mapping all product content into logical groupings — validated through card-sorting exercises with real users — forming the structural blueprint for navigation, menus, and screen groupings.
Ideation & Conceptualisation
With the problem clearly defined, I run structured ideation workshops to generate a wide quantity of solutions before converging on the best. Divergent thinking exercises like Crazy 8s and 6-8-5 Brainwriting unlock creative volume. Feature matrices then help evaluate and prioritise which concepts best align with user needs and business goals.
A timed sprint where each designer generates 8 distinct concept sketches in 8 minutes — eliminating overthinking, producing a high volume of raw ideas that can then be evaluated and combined into stronger solutions.
Running dot-voting, impact/effort matrices, and early concept walkthroughs with users to validate which ideas resonate, which features are essential for MVP, and which can be deferred to future iterations.
Wireframe & Prototype
Ideas become testable structures. Starting with paper sketches and quickly advancing through low-fidelity and mid-fidelity Figma wireframes, I apply Gestalt Principles and Laws of UX to guide layout decisions. I actively audit every screen against dark pattern checklists to ensure the product earns — rather than manipulates — user trust.
A progressive fidelity approach — beginning with rapid paper sketches to test layout logic, then translating validated concepts into structured digital wireframes in Figma with proper grids, spacing, and placeholder content.
Applying cognitive psychology laws — Proximity (grouping related items), Similarity (consistent visual styling), Closure (completing incomplete shapes), and Figure-Ground — to create layouts users understand instantly.
A structured review against known dark pattern categories — confirm-shaming, hidden costs, roach motels, trick questions — ensuring the product earns user trust through honest, transparent interaction design.
Usability Testing & Evaluation
Structural validation before visual polish. I run usability test sessions on mid-fidelity clickable prototypes with real target users, logging friction points and success rates. Heuristic evaluation against Nielsen's 10 principles surfaces systemic issues. Findings directly feed back into wireframe iteration cycles until the experience is solid.
Recruiting 5–8 target users to complete scenario-based tasks on clickable prototypes while thinking aloud — observing where they hesitate, fail, or succeed to identify structural and navigational issues before visual styling begins.
An expert review of every screen against Jakob Nielsen's 10 usability heuristics — visibility of system status, match with real world, user control, error prevention, and consistency — producing a severity-rated issues report.
High-Fidelity UI &
Design System
Structure meets aesthetics. I build the full visual language — moodboards, typography systems, colour palettes, spacing tokens, and component libraries in Figma. Every screen is crafted to pixel perfection with micro-interactions, responsive behaviour, and scalable component variants that developers can implement with confidence.
Visual mood collages and style tile documents establishing the product's aesthetic direction — curating typefaces, colour systems, photography style, texture language, and interface component samples before full UI production begins.
A Figma component library with variables, tokens, auto-layout, and component sets — ensuring consistent design decisions across all screens, enabling rapid iteration, and giving developers a single source of truth for implementation.
Launch, Handoff &
Documentation
The final mile. I validate the hi-fi prototype through visual design testing and desirability testing, scope the MVP feature set, and prepare comprehensive annotated handoff documents for development teams. Detailed design system documentation and deep-dive case studies ensure the decisions, rationale, and outcomes of the entire process are clearly communicated and preserved.
5-second preference tests, A/B visual comparison checks, and Microsoft Product Reaction Card-based desirability tests to confirm that the final visual design communicates the intended brand personality and emotional response.
Annotated Figma files with pixel measurements, spacing tokens, responsive breakpoints, interaction states, component variant specs, and API connection annotations — enabling developers to implement designs accurately without design-to-engineering translation errors.
Comprehensive published documentation covering all design tokens, component usage guidelines, and accessibility standards — alongside a narrative case study documenting the problem, research findings, design decisions, metrics, and outcomes for portfolio and stakeholder presentation.
Ready to Start
Your Project?
Let's apply this proven framework to your product and create experiences your users will love.