Subjects and lessons to explore.

Law

UX/UI Design · Foundations

Low-Fidelity Prototypes

9 min read 5 practice questions
8 key termsSourcesReport an error
Want it in plain words first? Jump to Eli explains — the same idea, no jargon.
On this page 9 sections
  1. In 30 seconds
  2. Why this matters
  3. The college version
  4. Eli explains
  5. Worked example
  6. Key takeaway
  7. Quick check
  8. Study tools
  9. Sources & references

In 30 seconds

A is a rough, quickly made representation of a design that tests ideas before any code is written. It can be a paper sketch, a simple , or screens filled with . Because it is cheap to build, it is also cheap to change — so teams test the idea while fixing it still costs almost nothing. Low-fidelity prototypes are built to test , , and structure, not visual polish, exact spacing, or real content.

Why this matters

The biggest design mistakes are not visual; they are structural. A checkout that asks for the same address twice, a settings page that buries the important option, a flow that quietly drops the user — these problems live in the layout, flow, and structure of a design, and they are far cheaper to fix before a single line of code exists. A low-fidelity prototype is the cheapest way to find them: it takes minutes to sketch, costs almost nothing to change, and still tells you whether the idea works. Teams that test rough prototypes early avoid paying for polished versions of broken ideas.

The college version

What a Low-Fidelity Prototype Is

A low-fidelity prototype is a rough, quickly made representation of a design, built to test ideas before code is written. The Nielsen Norman Group, a UX research firm, frames any user interface prototype as a hypothesis — a candidate design solution for a specific problem — and the most straightforward way to test that hypothesis is to watch people work with it. The Interaction Design Foundation, a design education organization, defines prototypes as early models of a product that simulate its design and functionality, created to test concepts, gather feedback, and iterate before the final product is developed. Put the two together and you get the working definition used here: a rough, quickly made representation of a design that tests ideas before code. Two words carry the meaning. Rough means it is not finished — it does not look like the final product, and it is not supposed to. Quickly made means the whole point is that it costs little in time and money, so throwing it away and starting again costs little too.

What Low Fidelity Looks Like: Paper Sketches, Clickable Flows, and Placeholders

Low is a range, not a single thing. At one end are paper sketches: screens drawn by hand on paper or index cards. The Nielsen Norman Group describes how a person who knows the design plays the part of the "computer" — laying the pages within reach and swapping in the next card when the user taps or clicks a paper screen. At the other end of the low-fidelity range are simple clickable flows: a handful of rough screens linked together in a tool, just enough that a user can click through the main path. What makes both low fidelity is the same: the visuals are crude, and the content is not real. Screens carry placeholder content instead — a gray box labeled "photo," a line like "Headline goes here," a button that says "Next" and nothing else. The Interaction Design Foundation lists paper prototypes and sketches among the classic examples and notes that anyone can produce them. The roughness is the feature, not the bug: it tells everyone involved that this is a test, not a product.

Why Low Fidelity First: The Speed Argument

The core argument for low fidelity is speed, and speed is money. The Nielsen Norman Group makes the point bluntly: code is expensive to tear up; a rough prototype is not, especially when it is just a piece of paper. Jakob Nielsen's long-standing estimate is that it is about 100 times cheaper to change a design before code is written than after the implementation is complete — and that usability data gathered early in a project is worth roughly ten times what the same insight is worth late. The Interaction Design Foundation makes the same point in softer form: modifying a prototype costs far less than reworking a fully developed product, because changes get more expensive the further a project advances. Low-fidelity prototypes are fast to build, disposable, and easy to change between one test and the next. That is what "test the idea while it is cheap to change" means: a sketch that fails costs an afternoon; a built product that fails costs a team.

What Low Fidelity Is Good For — and What It Is Not

Low-fidelity prototypes earn their keep on structure. They are at their best testing layout — where things sit on the screen; flow — the order of steps a person moves through; and structure — which screens exist and how they connect. The Interaction Design Foundation says low-fidelity prototypes are best for early-stage concept exploration and for gathering initial feedback on basic functionality and flow. They are the wrong tool for three named things. Visual polish: a hand sketch cannot show whether a color scheme works or whether a design feels premium. Exact spacing: the Nielsen Norman Group notes that spacing and element priority may or may not be preserved in a low-fidelity prototype, so pixel-level feedback is meaningless at this stage. And real content: a low-fidelity prototype carries stand-ins — summaries and gray boxes — so judging real copy or real imagery is impossible. The same roughness that makes a sketch easy to change also means users have to imagine parts of the experience, so results are about direction, not details.

Fidelity Should Match the Question

The honest framing is that fidelity is a tool you choose, not a ladder you climb. The Interaction Design Foundation advises designers to choose the fidelity level that fits their goals and stage of development — the level of fidelity should be appropriate for the feedback they need. The Nielsen Norman Group says the choice of prototype depends on the goals of the testing, the completeness of the design, and the resources available. The rule of thumb: test structure with rough, test polish with refined. If the question is "does the order of steps make sense?", a paper sketch answers it as well as a finished build would. If the question is "does this look ready to launch?", no sketch can answer it — that is a job for a , which has its own lesson. Matching fidelity to the question is what keeps prototyping fast instead of wasteful.

Eli, the EliExplains learning guide

Eli explains

The same idea, in plain words

Explain it like I’m 10

A low-fidelity prototype is a rough, fast version of a design that you use to test an idea before building the real thing. Imagine you want to redesign the school library app. Instead of writing code, you draw the screens on index cards: a search box, a list of books, a button that says "Reserve." A friend pretends to be the app: when someone taps "Reserve" on the card, your friend hands them the next card showing what happens next. The whole thing takes an afternoon and costs nothing. Now watch what people do with it. If everyone taps the wrong thing, you redraw the card — you do not rewrite the app. That is the whole trick: the rougher the prototype, the cheaper it is to change, and the cheaper it is to change, the more willing you are to test it early.

Picture it like this

A low-fidelity prototype is like a rough floor plan drawn on a napkin before anyone builds a house. The napkin plan shows where the kitchen goes, where the stairs go, and how the rooms connect. It does not show the paint color, the light fixtures, or the exact distance between the counter and the wall. No one mistakes the napkin for the house. But the family can gather around it, point at the stairs, and say "the bedrooms are too far from the bathroom" — and the architect redraws the napkin in two minutes instead of moving walls.

Where the picture stops working

The napkin-plan analogy makes design look neater than it is. A floor plan still shows every room, while a paper prototype usually shows only part of an experience, and people must imagine the rest. And a napkin plan cannot tell you whether the house will feel spacious — just as a rough sketch cannot tell you whether a design will feel polished. That is the honest limit of low fidelity: it tests structure, not feeling.

Worked example

Marco's team is designing the sign-up flow for a community garden app. Before writing any code, they sketch five screens on index cards: welcome, choose a plot, pick a date, confirm, done. During a test, Maya plays the "computer": she lays the cards in order and swaps them as each volunteer taps. The second volunteer taps "Choose a plot" before the app asks for her name, and Maya realizes the cards never explained why an account is needed. Marco redraws the welcome card to say what the app does in one line, and the next three volunteers follow the intended path. The whole round of testing and fixing took one morning, and no code was written or thrown away.

Key takeaway

Low-fidelity prototypes are rough, fast, and cheap by design: they test layout, flow, and structure before code, while changes still cost almost nothing. Match fidelity to the question — rough for structure, refined for polish.

Quick check

3 questions here, of 5 in this lesson’s practice set. Answers stay hidden until you check.

Question 1 of 3foundational

What is a low-fidelity prototype?

Choose an answer, then check it.
Question 2 of 3intermediate

A designer draws a checkout flow on index cards. During a test, a teammate sits nearby and swaps in the next card whenever the shopper taps a button on the paper screen. What is the teammate doing?

Choose an answer, then check it.
Question 3 of 3intermediate

Which question is a low-fidelity prototype best suited to answer?

Choose an answer, then check it.
Practice all 5

Keep learning

Ready to build on this? Continue to the next lesson.

Practice this lesson
Study tools & related lessonsYou’ll learn to · Common mistakes · Easily confused · Key vocabulary · Related

You’ll learn to

  • Define a low-fidelity prototype as a rough, quickly made representation of a design that tests ideas before code.
  • Name the common forms a low-fidelity prototype takes: paper sketches, simple clickable flows, and placeholder content.
  • Explain why teams prototype in low fidelity first: the idea can be tested while it is still cheap to change.
  • Identify what low-fidelity prototypes are good for (layout, flow, structure) and what they are not good for (visual polish, exact spacing, real content).
  • Match the fidelity of a prototype to the question being tested.

Common mistakes

  • Skipping low fidelity and waiting until the design "looks good enough" to show anyone.

    Show the rough version early. The Nielsen Norman Group warns that if you wait, it is too late to translate what you learn into changes in the design's direction — and a sketch that fails costs almost nothing.

  • Using a low-fidelity prototype to judge visual polish, exact spacing, or real content.

    Use low fidelity for layout, flow, and structure. Questions about colors, pixel spacing, and real copy belong to a refined prototype, which has its own lesson.

  • Polishing the prototype — adding detailed drawings, real photos, and careful spacing — before testing.

    Keep it rough on purpose. Roughness keeps the team willing to change the design and signals to stakeholders that the work is not finished.

  • Expecting a low-fidelity test to answer every question about the design.

    A rough prototype answers structural questions — layout, flow, and order of steps. The honest framing is that fidelity should match the question: rough for structure, refined for polish.

Easily confused

Low-fidelity prototype vs. High-fidelity prototype

Low fidelity is rough, fast, and cheap, built to test structure; high fidelity is refined and closely resembles the final product, built to test polish. High-fidelity prototypes have their own lesson.

Paper sketch vs. Simple clickable flow

A paper sketch is static — a person plays the computer and swaps pages by hand; a clickable flow lets users advance screens themselves. Both stay low fidelity as long as the visuals and content remain rough.

Wireframe vs. Low-fidelity prototype

A wireframe is a static diagram of layout and content placement, while a low-fidelity prototype is built to be tested by people moving through a task. Wireframes have their own lesson.

Key vocabulary

low-fidelity prototype
A rough, quickly made representation of a design, built to test ideas before any code is written.
fidelity
How closely a prototype matches the look and feel of the final product; fidelity can vary in interactivity, visuals, and content.
paper prototype
A low-fidelity prototype made of hand-drawn screens on paper or cards, often operated by a person who swaps pages as the user interacts.
placeholder content
Stand-in text, images, or labels used in a prototype instead of the real thing, such as a gray box marked "photo" or a line reading "headline goes here."
clickable flow
A small set of rough screens linked together so a user can click through the main path of a task.
layout
Where elements sit on a screen; one of the structural things a low-fidelity prototype is built to test.
flow
The order of steps a person moves through to complete a task; one of the structural things a low-fidelity prototype is built to test.
high-fidelity prototype
A refined prototype that closely resembles the final product, used to test polish; it has its own lesson in this course.

Sources & references

  1. UX Prototypes: Low Fidelity vs. High Fidelity — Nielsen Norman Group
  2. Paper Prototyping: Getting User Data Before You Code — Nielsen Norman Group
  3. What is a Prototype? — Interaction Design Foundation (IxDF)

EliExplains lessons are original prose written from the open, credible references above. See Copyright & Licensing.

Researched 2026-08-21

Educational content only. It is not medical, legal or professional advice. Found an error? Tell us.