All work / MNTN Select / FlightPlan / Empty state
Design review · MNTN Select

Flight Plan empty state.

How I take a feature request from a ticket to five working concepts and a design review the team can act on.

Role
Design lead and designer
Ticket
MSS-4355
Output
5 concepts, 1 review page
Tools
Figma, Claude, HTML prototypes
Where I led
  • The review format the team now uses for every feature POC
  • Getting design, product and engineering to decide against the same criteria
What I designed
  • All five empty-state concepts, in Figma and as interactive prototypes
  • The review page itself
  • All of the hands-on design on MNTN Select, this feature included
The request

A panel that says nothing.

In the Flight Plan chat, the right panel showed a static message and four inactive pills. It did not reflect what the agent had learned, did not preview the plan, and gave no sense of how close the plan was to being built.

The ask: make it dynamic. Show progress as Content, Demographic, Budget and Timing are learned, say what is still needed, and hand off to the finished plan when all four are known.

My approach

Options first, then a decision.

1
Read the request

The ticket (MSS-4355) says the right panel is static: four inactive pills, no sense of progress. I restate it as a goal: show what the agent has learned, say what is missing, hand off when done.

2
Open the space wide

Instead of one answer, I explore five concepts before anyone commits, using my design system and Figma as prompt fuel so the first round is already on-brand.

3
Prototype every option

Each option is a working HTML prototype where you can toggle Content, Demographic, Budget and Timing in any order and watch the state change.

4
Review against criteria

I write acceptance criteria up front and mark each one met or partial, honestly, so reviewers see gaps without hunting.

5
Frame the decisions

I end with the questions the team has to answer, not a single recommendation dressed up as finished.

Five concepts

One problem, five answers.

Same four inputs, same finished plan. Each concept answers a different question about how much progress the panel should show and how.

A
Ghost plan

Blurred deal cards sharpen as each answer lands, finishing in real deal cards built from the Reco Card.

B
Brief sentence

A sentence with blanks that fill in as the agent learns each item.

C
Flight path

A plane moves to each stop on a route as items are learned.

D
Live estimate

Households and budget numbers appear as the answers that unlock them arrive.

E
Boarding pass

A ticket fills in and its barcode prints. Added in the prototype after the Figma round.

Open the review page Try the prototype
Try the prototype

The working POC, as the team saw it.

Pick an option, then use the swapper inside to mark Content, Demographic, Budget and Timing as learned, in any order.

Review

Acceptance criteria, scored honestly.

Every review page starts with the criteria from the ticket. I mark each one met or partial and say why. Three of six are fully met; two are partial and the page says so.

MetThe empty state updates as each of the four items is learned, in any order.
MetThe status line lists what is still needed and stops once everything is known.
PartialProgress shows as a count out of four and animates. Option C shows it on the route with no count.
MetAt 4 of 4 the panel shows a building state, then the finished deal cards.
PartialFinished cards match the Reco Card. Images and program names are placeholders.
MetNumbers use DM Sans per the design system.
Open items

What the team has to decide.

A good review ends with decisions, not a pitch. These went to product and engineering with the prototype.

DecisionWhich option do we take forward?
DecisionShould the headline keep rotating, or change only when the state changes?
QuestionWhere do real poster art and program data come from for the finished cards?
RiskOption E is in the prototype but not yet in the Figma file, which has A to D.
Why it matters

A repeatable way to ship features.

The same template works for any feature: ticket, Figma, working prototype, criteria, open questions. It keeps reviews short, keeps feedback specific, and lets a team of designers work the same way without me in the room.

See the AI workflow behind it, or the FlightPlan case study this feature belongs to.

Want to talk about how I run design reviews? Get in touch.
Get in touch