Prototype

A prototype is an interactive model of a product or flow, from clickable wireframes to working code, used to test an idea before it is fully built. It answers whether a design works, not whether it is finished.

Also called
Clickable prototype, Interactive prototype, High-fidelity prototype, Coded prototype
Updated

Nielsen Norman Group treats a prototype as a hypothesis: a candidate solution to a design problem, best validated by testing it with users. Prototypes vary in fidelity along three dimensions: interactivity (do clicks work on their own), visuals (sketchy or realistic) and content (placeholder or real). A prototype can be high on one and low on another, such as a clickable flow built from grey wireframes.

Common forms are paper or whiteboard sketches, clickable Figma prototypes linking screens with transitions, and coded prototypes that run in a browser with real or sample data.

Why it matters for a SaaS product

Building is the most expensive way to find out a flow is confusing. A prototype puts the onboarding, the upgrade path or a new AI feature in front of users, investors or sales calls in days, so you learn before engineering commits. For complex products it also aligns the team: a clickable flow settles arguments that specs and screenshots leave open.

How DesignMe handles it

On product design work we often take founders from a rough idea, prototype or early product to something ready to test or launch. We use AI for faster prototyping and exploration, but the decisions stay senior-led.

Some projects start from the other side: AI-built prototypes that worked in a demo and now need to become a product. Our AI MVP cleanup service reviews what exists, then decides what to keep, refactor, redesign or rebuild, filling the gaps prototypes usually skip: auth, permissions, validation, error handling, missing states and integrations.

Example

Say a team is adding an AI assistant to its analytics product. Before writing backend code, a mid-fidelity Figma prototype shows the assistant panel, a sample question, a streamed answer with a chart, and what happens when the AI cannot answer. Five customer sessions show users expect to edit the chart the AI produced. That requirement goes into the build plan before a line of production code exists.

Common mistakes

  • Shipping the prototype. A demo that works on one happy path is not production code.
  • Testing only the happy path. Include what happens on errors, empty data and wrong input.
  • Too much fidelity too early. Polished visuals invite feedback on colour when you need feedback on flow.
  • No question to answer. Decide what the prototype should prove before building it.

Questions

What is the difference between a prototype and an MVP?
A prototype exists to learn: it tests whether a flow or concept works and can be thrown away. An MVP is a real product that real customers use, with working data, accounts and support. A prototype can skip authentication, error handling and edge cases. An MVP cannot, which is why promoting a prototype straight to production causes trouble.
Can an AI-built app count as a prototype?
Yes. Tools like Cursor, Lovable, Bolt, v0 and Replit produce working prototypes quickly, which is useful for testing ideas. The risk is that they look finished. They often handle the happy path well but miss permissions, validation, empty and error states, and code structure a team can maintain.

You've reached the end, so now…

Tell us what you’re building.

We’ll help you map the right scope, team, timeline, and next steps.

Book a call