Topic 3 — The design process and design thinking

Goal: Learn the repeatable process behind good design.

Lesson 3.1 — The blank screen and the myth of genius

Tessa's first week at Wanderwell, the travel-booking startup, Priya the product manager drops a problem on her desk: bookings get abandoned halfway through. Tessa opens Figma, stares at the blank canvas, and freezes. For eight years as an interior stylist she'd walk into a retail space and see the answer. Here, nothing comes. She assumes she's just not creative enough for this yet.

Marcus, her mentor and the lead product designer, finds her there and laughs gently. Nobody on his team starts at the blank screen, he tells her. They start much earlier, and they follow a path.

That path is the whole point of this topic. Good design follows a repeatable process, not a flash of genius. The professionals around Tessa aren't waiting to be struck by inspiration. They run a method that reliably produces good work even on a tired, uninspired Tuesday. Design doesn't begin at the blank screen; the blank screen is where a lot of earlier thinking finally lands.

Beginners wait for the idea. Professionals run the process that produces the idea.

Lesson 3.2 — Five stages, and why it's a loop

Marcus sketches the most common version of that process on a whiteboard. It's called design thinking, and it runs in five stages, made well-known by Stanford's d.school:

1. Empathize — understand the users and what they're going through (research, interviews, watching real people).
2. Define — pin down the exact problem you're solving, in one sharp sentence.
3. Ideate — generate many possible solutions, not one.
4. Prototype — build a rough, testable version, fast and cheap.
5. Test — put it in front of real users and watch what actually happens.

Tessa reads it as a checklist: do step one, then two, then five, then you're done. Marcus stops her. The arrow doesn't end at Test, he says, and draws it curving back to the start. When you test, users do something you didn't expect, and that sends you back to refine. Hannah, the team's researcher, has watched it happen a hundred times: a prototype tests badly, and that failure becomes the most useful information of the week.

So the five stages are a loop, not a line. You move through them, learn, and circle back. Real teams also run them a little out of order and overlap them. The sequence is a guide, not a law. What stays true is the looping: you keep cycling until the thing works.

Lesson 3.3 — Two diamonds, one shape

The five stages tell you what to do. There's a second framework that shows you the shape of the whole journey, and once Tessa saw it, the process finally clicked.

It's called the Double Diamond, formalized by the British Design Council in 2005 after they studied how design actually happened inside companies like Lego, Sony, and Starbucks. It's two diamonds sitting side by side.

• First diamond — the right problem. Its two halves are Discover (go wide: research, talk to users, gather everything you can) and Define (narrow down: synthesize all of that into one clear problem statement).
• Second diamond — the right solution. Its two halves are Develop (go wide again: generate many possible designs) and Deliver (narrow again: build, refine, and ship the one that works).

Each diamond is the same move, performed twice: widen, then narrow. The fat middle of a diamond is you exploring broadly; the point is you committing to one direction. The Design Council found that strong projects in every industry followed this widen-then-narrow rhythm twice over, once to nail the problem and once to nail the solution.

The two frameworks aren't rivals. Design thinking's Empathize and Define live inside the first diamond; Ideate, Prototype, and Test live inside the second. Tessa pins a printout of the two diamonds above her monitor. It's the map that tells her, at any moment, whether she should be opening options up or closing them down.

Lesson 3.4 — Solve the right problem first

Here's the part that surprises every career-changer. The entire first diamond happens before anyone draws a screen. On purpose.

Tessa wants to fix Wanderwell's abandoned bookings by redesigning the payment page, because that's where people drop off. Marcus asks her to hold. Hannah's interviews show something else: people aren't quitting because the payment page is ugly. They're quitting because, three steps earlier, they couldn't tell whether the price included baggage and taxes, so they bailed to go check on another site and never came back. Redesigning the payment screen would have been a beautiful fix to the wrong problem.

That's the trap the first diamond exists to prevent. The most expensive mistake in design is solving the wrong problem beautifully. A gorgeous, pixel-perfect screen for a problem users don't actually have is wasted weeks. As the old line goes:

A problem well defined is half solved.

So the Define step produces something concrete: a sharp problem statement. Not "make booking better," but "users abandon checkout because hidden fees surprise them late, so they leave to price-check elsewhere." That one sentence does real work. It points straight at a solution, and it keeps the whole team — Tessa, Priya, Dev the engineer, Hannah — aimed at the same target instead of quietly solving four different problems. When Dev later asks "wait, what are we actually fixing?", the problem statement answers it in a breath.

Lesson 3.5 — Diverge, then converge

Inside each diamond, designers flip between two modes of thinking, and learning to feel which one you're in is a genuine skill.

Diverge means open up. Generate lots of ideas without judging any of them yet. When Tessa tackles the hidden-fees problem, Marcus has her sketch ten different ways to surface the full price early: a running total in the corner, a price breakdown that expands, a "what's included" badge, a slider, and on down to slightly silly ones. Quantity first. Wild ideas often spark the good ones, and you can't get to idea number nine if you stop at number one.

Converge means narrow down. Now you judge. You critically combine and cut, pulling the strongest pieces into a single direction worth prototyping. Tessa and Marcus land on a persistent price summary that updates as you add options, borrowing the breakdown idea from one sketch and the badge from another.

The classic beginner mistake is converging too early — falling in love with the first idea and never exploring past it. Tessa's instinct, fresh from years of trusting her eye, was to lock in sketch number one because it looked clean. The first idea is rarely the best one; it's just the first one your brain happened to reach. Professionals deliberately push themselves to stay wide a little longer than feels comfortable before they commit.

And this rhythm applies well beyond design. Widen your options, then narrow to a choice. It's a habit you can run on a vacation plan, a career move, or which apartment to rent. Once you feel it, you start noticing every time you (or your team) slammed shut on the first idea too soon.

Worked example — Tessa fixes the abandoned booking

Watch the whole process run once, end to end, on Wanderwell's dropped bookings.

Empathize / Discover (go wide). Tessa stops guessing and joins Hannah's user interviews. They watch eight people try to book a trip. A pattern jumps out: five of them hesitate, scroll up and down hunting for the real total, and two abandon the flow entirely to check the price on a competitor's app.

Define (narrow). The team writes one problem statement: "Travelers can't see the full trip price — with baggage and taxes — until the final step, so they leave to price-check elsewhere and don't return." Priya agrees this is the bet worth making. Notice: still no screens drawn.

Ideate / Develop (go wide again). Tessa sketches ten ways to show the true price early. No judging yet — she just fills the page.

Converge. With Marcus, she narrows to one: a price summary that stays on screen and updates live as you add bags or seats. Dev confirms it's feasible to build.

Prototype. She builds a clickable rough version in Figma — gray boxes, real numbers, no polish.

Test (and loop back). Five users try it. Four love it; one is confused because the summary scrolls off on mobile. That failure isn't the end — it sends Tessa back to refine. She pins the summary to the bottom of the screen and tests again.

One full lap of the loop, no flash of genius required. Three months in, Tessa runs this path without thinking about it. That fluency is exactly what this topic is built to give you.