The UX process end to end

In one line: good process is a rhythm of opening up to explore and narrowing down to decide — done deliberately, it turns a vague brief into something worth building and then actually builds it.

What it is

The UX process is the sequence of work that takes you from "we think there's a problem here" to "we shipped something that helps." A useful way to picture it is the double diamond: two diamonds side by side. The first is about finding the right problem (discover, then define); the second is about finding the right solution (develop, then deliver). Each diamond widens — you generate options — then narrows — you commit.

The widening is divergence: explore broadly, gather signals, sketch many directions, resist deciding. The narrowing is convergence: synthesize, choose, refine. The skill is knowing which mode you're in, and not collapsing them — deciding while you should still be exploring is how teams build the wrong thing quickly.

Why it matters

Skip discovery and you solve a problem nobody has. Skip definition and you boil the ocean. Skip the deliberate divergence in develop and you ship the first idea, not the best one. The process isn't ceremony — each phase exists to answer one question and produce one artifact, then hand off a clearer thing to the next. Sized to a two-week project it's light; sized to a year it scales. What stays constant is the rhythm: open, then close; open, then close.

See it

How it works

Each phase answers a question and leaves something behind:

1. Discover (diverge). What's really going on? Talk to people, watch them work, gather signals. Output: a pile of honest observations.
2. Define (converge). Which problem is worth solving? Synthesize the pile into one sharp problem statement. Output: a focused brief.
3. Develop (diverge). What could we build? Generate many solutions — sketches, flows, prototypes. Output: candidate directions.
4. Deliver (converge). What actually works? Test, narrow, refine, and ship. Output: a real thing in front of real users.

You can loop back at any boundary — discovery in deliver often sends you to redefine. The diamonds are a rhythm, not a one-way street.

Build it

A phase tracker is a small but real piece of UX: it tells someone where they are and what's next. Here's an accessible one that marks the current phase with aria-current, so the meaning reaches assistive tech, not just sighted users.

<nav aria-label="Project phase" class="phases">
  <ol class="phases__list">
    <li class="phases__step">Discover</li>
    <li class="phases__step" aria-current="step">Define</li>
    <li class="phases__step">Develop</li>
    <li class="phases__step">Deliver</li>
  </ol>
</nav>

.phases__list {
  display: flex;
  gap: 0.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.phases__step {
  flex: 1;
  padding: 0.5rem 0.75rem;
  text-align: center;
  font-size: 0.85rem;
  border-radius: 0.5rem;
  background: #eceef3;
  color: #5b606b;
}
/* The current step is bolder AND outlined, so it reads without color. */
.phases__step[aria-current="step"] {
  background: #1f2330;
  color: #fff;
  font-weight: 700;
  outline: 2px solid #1f2330;
  outline-offset: 1px;
}
@media (prefers-reduced-motion: reduce) {
  .phases__step {
    transition: none;
  }
}

Make it yours

Reproduce it with an LLM

Pitfalls & accessibility

Related

Further reading

• A primary write-up of the double-diamond framing from a national design body, in your own words.
• Any solid text on lean, timeboxed product discovery, for how to size each phase to the work.