Design a Clickable Prototype for a Mobile App
Part of the UI/UX Design Roadmap
In short
This project ties the phase together: wireframe, design and prototype one real mobile flow, then test it with people. It's the kind of end-to-end case study recruiters love to see.
The practice project for this phase — design and prototype a complete, testable flow for a mobile app idea, from wireframe through interactive prototype.
Think of it like this
The science exhibition model
For the science fair, you don't build a real power plant. You build a working model that shows how it works and lets judges press the button. Your prototype is that model: real enough to try and judge.
Watch it happen
Build plan for your prototype
1/6Choose one clear task, like 'order a canteen meal for pickup'. One flow done well beats five half-done.
The big ideas
What you need to know
One complete flow
Start to finish, including errors and empty states. Completeness shows real design thinking.
Use components
Buttons, inputs and cards as components prove you can work like a professional team.
Test on a phone
Run tests in the Figma mobile app so tap sizes and text are judged on a real device.
Show your process
Your case study should show the problem, flow, wireframes, tests and what you changed.
Save yourself the pain
Common mistakes
Oops
Designing ten disconnected screens for a whole app.
Do this instead
Go deep on one flow that's fully linked and tested. Depth beats breadth in portfolios.
Oops
Skipping testing because the prototype 'looks done'.
Do this instead
Test it. Showing what you learnt and changed is the most convincing part of the case study.
Your mission
Milestone 1: flow and wireframes
Quick check
What makes a prototype project stronger in a portfolio?
Go deeper
- 1Choose a focused app idea with 4-6 core screens, not an entire sprawling product.
- 2Build wireframes first, then high-fidelity screens, then link them into a prototype.
- 3Test the prototype with at least one real person and note what confused them.
Stuck on this topic? Ask an Insider
Get 1:1 guidance from people who've walked this exact path — on the InsideEdge app.
