Skip to main content
Enterprise sales · Financial services · design and build, solo

Letting the buyer take the controls.

Enterprise demos fail in a specific place: the buyer never touches the product. This is a five-minute, hands-on walkthrough of a wealth-management platform that the buyer drives themselves — and that a sales rep can compose in under two minutes, because if composing takes longer than writing the email, no rep will ever use it twice.

  • Enterprise sales
  • Financial services
  • Working prototype
  • Design and build
At a glance
Role
Design and build — research to front end
Timeline
May 8–13, 2026 · six sessions
Deliverables
Next.js prototype + static HTML twin
Status
Proof of concept, in review

Six minutes end to end. In a hurry? The four decisions are the argument, and the gap register is the honesty.

The client — a North American wealth-management firm — and the prospect firms are anonymized, and product names have been genericized. The prototype's sample names, figures and visuals are illustrative and are not client property. Every number on the rep's brief is authored fixture data, and the prototype says so on the screen where it matters.

Capture A — the buyer landing screenImage to come

“Who sent me this, how long is it, and what happens to my data?” — asked in that order, in about four seconds. The landing answers all three before the start button.
Verdict first — for people with forty portfolios open

A hands-on demo the buyer drives themselves, composed by a rep in under two minutes — proven far enough that three of five steps respond to direct manipulation, and honest enough to file the ten places it still breaks.

Routes in the prototype

6

Routes in the prototype

The rep's compose flow and the buyer's walkthrough, one Next.js app

User layers

2

User layers

The rep who composes it; the buyer who drives it

Walkthrough steps

5

Walkthrough steps

Three respond to direct manipulation — the three that carry the demo

Complete builds

2

Complete builds

The React prototype, and a static HTML twin anyone can open and forward

The brief — what this solves, and for whom

The buyer is evaluating a product they have never operated.

The problem

The demo produces no evidence.

The buyer watches a screen-share, nods, and asks for it again next week with two more people in the room. The rep walks away with no record of what the buyer lingered on or what they asked at minute four. Both failures have the same root: nobody's hands touch the product, and nothing about the hour survives it.

Who it's for

Consulting firms evaluating a resell — not retail investors.

The buyer is a consulting or systems-integration firm deciding whether to embed or resell the client's product for their own client base. That framing sets the register for every line of copy in the product, and it rules out most of the reassuring consumer-finance patterns you would otherwise reach for.

What I left out

Everything that wasn't the interaction model.

No backend, no auth, no real link generation, no telemetry — every number on the rep's brief is authored fixture data, and the screen says so where it matters. And no mobile layout, a call I now think was wrong; it's filed in the gap register below.

Four decisions that shaped it

Finding 01
Evidence: three file timestamps, 32 minutes apart

I killed my own design direction half an hour after writing it.

The fork

Keep the editorial system I had just specified — a display serif, a cream ground, restrained gold, and a written argument for why that risk was the right one — or derive the visual language from the client's actual product surface.

The tension

The editorial direction was better-looking, and it was mine. But this demo's whole claim is that the buyer is touching the real product. A cream-and-serif surface would have made every checkpoint feel like a mockup of the product rather than the product itself — the exact impression the format exists to avoid.

The call

I pulled apart the client's live retirement pages and wrote the structure down: two-tier header, light gray page with white cards, serif headings, pill buttons, link blue. Then I rebuilt the token set against that spec — thirty-two minutes after writing the direction it replaced.

The consequence

The prototype reads as the client's own product at a glance, which is what makes the hands-on steps land. Exactly two things survived from the editorial direction — mono for compliance type, and gold as a single reserved accent — because they carry meaning rather than mood.

Writing the dead direction down first wasn't waste. It's what made the reversal fast and specific: I knew which two elements were load-bearing and which were taste, so the second system took half an hour instead of a day.

Finding 02
Evidence: captures 18:07–18:29, rebuild 18:37

The tour was static for five days — and they were the wrong five days.

The fork

Ship the narrated walkthrough — finished, and it looked right — or capture real product screens and rebuild every step as live components.

The tension

Rebuilding meant an 860-line component and throwing away work that already demoed well. But a walkthrough the buyer can't change anything in is a video with extra steps — I would have been presenting the idea of the bet rather than the bet.

The call

I captured four real screens and rebuilt the steps as working components against them. The contribution percentage became an editable input that recalculates the year-to-date donut; the strategy picker drives a live detail panel; the fund table filters in place.

The consequence

Three of the five steps now respond to direct manipulation, and they are the three that carry the demo. But the rebuild was rushed and left two marks: one step has no source screenshot, and step 02 got its screenshot without its interactivity — still flagged hands-on, still inert, and the first checkpoint the buyer meets.

The gap between flagged-as-interactive and actually-interactive is invisible in a walkthrough you narrate yourself, and obvious within four seconds to anyone you hand it to.

Capture B — the contributions stepImage to come

The moment the demo stops being a demo — the buyer changes a number and the product answers.
Finding 03
Evidence: the seeded data's final edit

Cutting the prospect list in half made the copy work.

The fork

Keep a seeded roster broad enough to suggest the platform works for any prospect — two consulting firms, two banks — or narrow it to one buyer type.

The tension

A wider list looks more capable in a demo. But every seeded intro note has to be specific enough to prove the personalization claim, and no note is simultaneously right for a systems integrator reselling a platform and a bank buying one for itself. Serving both produced notes that named no one's actual problem — mail-merge personalization, which reads as worse than none.

The call

I cut the banks and kept four consulting and professional-services firms, then rewrote each intro note against the specific thing that buyer would care about — a multi-region rollout for one, a client engagement for another, an executive review deadline for a third.

The consequence

The notes got noticeably more specific, and the whole product's register settled. What it cost: demoing a very different buyer type now means writing new fixture data. Fine for a proof of concept, and a real constraint for phase two.
Finding 04
Evidence: the rationale is on the screen itself

Weighting Modify above Accept, on purpose.

The fork

The rep's brief opens with a machine-generated recommendation and a confidence score. Make Accept the primary action — the fast path, the one the interface expects — or weight Modify above it.

The tension

Reflexive acceptance is the actual failure mode of this kind of screen. A rep who clicks Accept on every recommendation has converted a judgment tool into a rubber stamp, and the CRM fills with decisions nobody made. But making the fast path harder is a real cost — exactly the kind of thing a later funnel optimization quietly designs out.

The call

Modify is the full-width primary and carries the label “recommended”. Accept is a secondary outline. Override stays available as a quiet tertiary — not hidden, because hiding it would be its own kind of coercion. And the reasoning is printed directly under the card, on the screen, so the next person to touch this knows it was deliberate.

The consequence

It reads as strange for about two seconds and then as obviously right. Printing the rationale onto the screen is the part I would repeat — the cheapest possible defense against a well-meaning future redesign. What's still missing: choosing Modify sets state and opens nothing. The interaction argues for editing and then doesn't let you edit.

Capture C — the rep's briefImage to come

One answer, not a dashboard. Engagement data, the buyer's captured questions and the compliance ledger sit behind one more click — available, never the first thing the rep has to read.
The walkthrough — as the buyer meets it

Five steps, one job per screen.

Thin chrome, the buyer's hands on real components, and the rep's side kept to a single card.

01 · Welcome
Orientation — the platform's real entry screen, addressed to the buyer by first name. Deliberately narration-only: the first screen is not where you ask someone to do something.
02 · Dashboard
“Would someone who logs in once a year understand this?” Net worth, a peer-savings comparison, goals and quick actions on one page. Flagged hands-on — and this is where the prototype currently breaks its promise. See the gap register.
03 · Contributions
The screen employees touch most, and the one that decides the evaluation. The buyer's own plan name across the top, and the contribution percentage as a live input — change it and the year-to-date donut recomputes against the employer match.
04 · Strategy
“How much work is this asking of our people?” Three paths — single fund, managed account, build your own — each carrying its fee, effort level and time commitment. Picking one updates the detail panel. Managed account is preselected, which is also the higher-revenue conversation.
05 · Performance
Due diligence. The plan's full fund list — asset class, year-to-date return, expense ratio — filterable in place. Nothing here needs a follow-up email to answer.
Then, the rep
A single card with one recommended next action, a confidence score, and three lines of reasoning behind a collapsed control. An answer, not a dashboard — a pile of engagement charts moves the work back to the rep; one recommended action does not.

Capture D — the strategy stepImage to come

Capture E — the performance stepImage to come

The log — six sessions, two blocks

What actually happened, in order.

Reconstructed from the repository rather than from memory: file timestamps, superseded documents, comments left in the token config, artifacts built and then bypassed. Where reasoning is attributed to a decision, the evidence sits beside it.

May 8, 22:36
Wrote the README first — product scope, four screens, a nine-step onboarding walkthrough, and the editorial design direction. A plan specific enough to argue with.
May 8, 22:47
Tore down the client's live retirement pages into a structural spec. The evidence that killed the plan.
May 8, 23:08
Rebuilt the token system against that spec. The editorial direction dead at thirty-two minutes old; mono and gold the only survivors.
May 9
Built Configure and Insights first — the two hardest screens — then the tour shell and the review navigator. Hard problems while fresh; connective screens left thin. Same day, the positioning clarified: consulting firms, not banks. Roster and copy reworked.
May 13, 18:07
Captured four real participant screens — the reference the rebuild needed.
May 13, 18:37
Rebuilt the tour as live components, eight minutes after the last capture. Setup, Build and Landing rewritten around it. The bet, finally testable — minus step 02.
May 13, 20:07
Built the entire prototype a second time, as six pages of plain HTML with no build step. Reviewers who need to forward a thing to someone else are not going to run a dev server, and a demo nobody can open is a demo that doesn't exist. Its README is blunt about what the twin loses — which is what made it safe to circulate.
Discarded en route
The editorial visual system, half an hour old. A nine-step onboarding product with no capturable screens, replaced by a five-step walkthrough with real ones. Four of the nine steps — the five-minute promise is only credible if the walkthrough is actually five minutes. Two of four prospects. The narrated tour, which looked finished and proved nothing. And the README still describes the version that died — the clearest record of how far the thing moved, and the first file a reviewer opens, so it gets rewritten before this circulates.
The gap register — written from the code, not from memory

Ten things wrong with it, ranked.

Which is why this list is longer and less flattering than the one I would have written from recollection.

high
The first checkpoint doesn't work
Step 02 is flagged interactive and its hint invites the buyer to move the peer-comparison slider. The panel holds no state. The buyer's first attempt to take control fails — the worst possible place for this to break.
high
Configuration never reaches the buyer
The intro note and checkpoint toggles the rep sets are local state; the buyer's screens read the seeded values. The central claim — configurable enough to feel personal — isn't demonstrated end to end.
high
Two screens assume the buyer is a woman
“Here is what she signaled” and “toggle off any she doesn't need” are hardcoded, and two of the four seeded prospects are men. A one-line fix to they/them that should never have shipped.
high
The buyer's exit lands on the rep's private notes
“Done” on the last step routes to the internal engagement brief — a real buyer would be reading the rep's analysis of them. The buyer has no ending of their own.
high
No mobile layout
The tour runs on fixed two- and three-column grids, while the highest-confidence quote on the rep's own brief is a buyer calling mobile a gating question for their committee. The prototype states the objection and then fails it.
medium
Nothing is measured
Every figure on the brief is authored. The prototype demonstrates the format of the insight, not its derivation — fine for a concept review, fatal if it ever reaches a CRM.
medium
Nothing can fail visibly
Send, the AI suggestion and the CRM writeback have no pending, success or failure states. A product where nothing can fail is a product that hasn't met a network yet.
medium
Accessibility is partial
Icon-only controls are labeled — the part people usually miss. But focus rings exist only on text inputs, two number inputs have no associated label, and the evidence tabs and filter chips expose no selected state.
medium
The seeded numbers disagree
Total time reads 8:38, the audit ledger says 6:16 hands-on, and the controlled steps total 8:00. A finance audience checks arithmetic.
medium
Four of five products are decoration
Only the workplace retirement plan has content, and the product choice is never carried forward — picking any other product silently serves the same tour.

Because nothing is instrumented, success this round is what a person can observe in a room — proposed, not agreed. A first-time user composes a walkthrough in under two minutes. A reviewer touches a checkpoint control without being told to — blocked by the step 02 gap today. After thirty seconds on the brief, they can restate the next action and one supporting reason. And a compliance reviewer raises no blocking objection to the disclosure, consent and audit framing.

Everything worth measuring after that — open rate, completion rate, checkpoint interaction, time from send to first meeting — needs real telemetry, and none of it is honest until the numbers stop being authored. That sequencing is worth being firm about: writing authored fixture data into a CRM would be worse than writing nothing, because it would put fabricated engagement evidence in front of people making revenue decisions, and it would be indistinguishable from the real thing once it was in there.

Open findings — filed against me

What I'd fix before anyone attentive sees it.

Open · Process

The shareable version came last. It should have come first.

The static twin was the final thing I built and the first thing anyone could actually open — six days of work had an audience of one until 8pm on the last day. Same inversion as step 02: I finished things in the reverse of the order a reviewer meets them.

Open · High

The demo raises the mobile objection against itself.

I wrote “60% mobile-first — a gating question for their committee” into the fixture data as the buyer's highest-confidence objection, then built desktop-only. The objection was taken seriously as copy and ignored as a requirement.

Open · Decision

Five questions need people who aren't me.

Where the buyer lands at the end. How intent is actually captured. What the confidence number means. Whether passive disclosure of engagement tracking is notice enough. Whether a second product or a second tenant comes next. Each is a sales- or compliance-process decision as much as a design one.