What is the procedure to design a mobile app?
Seven steps. The mobile app design process runs in this order for a reason: each step produces the material the next one needs. A small team can run the whole thing in four to six weeks for a first version.
Step 1: Research who it is for and what job it does
Talk to six or eight people who have the problem. Ask what they do today, not what they want. Watch them do it if you can.
Write down three things: who the user is, the job they hire the app for, and the phone they hold while doing it. A budget Android with a small screen is a different design brief from a new iPhone.
You produce: a one-page user research summary and three user quotes you will argue with later. Time: three to five days. The mistake: asking people what features they want. They will tell you, and they will be wrong.
Step 2: Map the flows before you draw a screen
A flow is the sequence of decisions between opening the app and finishing the task. Draw it as boxes and arrows. Do this on paper or a whiteboard, because it should be fast and ugly.
Start with the main job, then map two paths that go wrong: no data yet, and something failed.
You produce: a flow map for each core task. Time: two days. The mistake: going straight to screens. Screens hide missing decisions.
Step 3: Decide the structure and the navigation
Information architecture means where things live and what the app calls them. On a phone this is mostly one question: what goes in the bottom bar?
Three to five destinations is the practical limit. Name them with the user's words, not your internal ones. If two destinations sound similar, one of them is not a destination.
You produce: a sitemap and a navigation model. Time: one to two days. The mistake: a hamburger menu holding the features you could not rank. A hidden feature is an unused feature.
Step 4: Wireframe, thumb zone first
Now the screens, still in grey boxes. Place the main action in thumb reach, put the supporting content above it, and leave the top for things people read rather than tap.
Draw every state while you are here: filled, empty, loading, error. It takes ten extra minutes per screen at this stage and days later.
You produce: wireframes for each screen in the flow. Time: three to five days. The mistake: wireframing only the happy path. See rule five.
Our roundup of UI and UX design tools covers what to use here. Any of them work. The tool is not the hard part.
Step 5: Visual design and a small design system
Now the paint. Type scale, colour, spacing, icons, components. Build them once as a small system so screen twelve does not invent a new button.
Check contrast and accessibility as you go rather than at the end. Retrofitting accessible colour into a finished palette is painful, and it is the fix that always gets dropped.
You produce: final screens and a component library. Time: one to two weeks. The mistake: designing on a 27-inch monitor at 200% zoom. Mirror everything to a real phone daily.
Step 6: Prototype and test with five people
Link the screens, hand the phone to someone outside the team, give them a task, and say nothing. Watching one person struggle in silence teaches more than a month of internal debate.
Five is enough to start. Nielsen Norman Group's finding is that a study with five participants surfaces about 85% of the usability problems, which is why three small rounds beat one big one.
You produce: a list of problems ranked by how many people hit them. Time: one week including recruiting. The mistake: explaining the screen before they use it. If it needs your narration, it fails.
Our guide to running user testing properly covers the script and the recruiting.
Step 7: Hand over, then measure
Handover is a deliverable, not an email. Developers need every state, every measurement, the real copy, the assets exported, and a named person to ask when something is missing.
Then instrument the flows you designed. If step four of your onboarding loses half the users, you want to know in week one, not at the next review.
You produce: a handover file, a spec for edge cases, and an analytics plan. Time: two to three days. The mistake: treating design as finished at handover. The first build always reveals three decisions nobody made.
Platform choice sits next to this step rather than inside it. Whether you go native or hybrid changes some interaction details, so make that call before step five.
