Prototype-to-Production Diagnostic

Find the gaps keeping AI-generated prototypes from matching production, and from producing code your team can actually ship.

$2,500founding price · one week · one flow

Jared HawkinsProduct design and design systems

01The gap

The prototype didn't save work. It added a round of interpretation.

Your team can generate product UI faster than ever. Then engineering opens it and finds components that don't exist in the system, states nobody accounted for, accessibility gaps, and patterns that have to be rebuilt.

The tools will keep getting better at the mechanical parts. What they won't decide for you is what counts as acceptable, who signs off, and whether the new process is actually reducing rework.

02The offer

One flow, one week, a straight answer.

You probably already know the prototype won't ship as is. This tells you why, and what to change so the next one does.

Bring one AI-generated flow, your design system and component library, and your target stack. I test the flow against all three and hand back a failure map: what broke, why it broke, and what to change, across components and states, tokens and rules, accessibility, and how the work gets reviewed and accepted. Recommendations are ranked by what to fix first, and some of them will be things you can fix without me.

Best for: Product teams with a design system or component library in production, already using AI to generate product UI. Most of my work has been B2B SaaS, and that's where I'm most useful.
The question: Where will this flow break down before production, and what should we fix first?
Scope is fixed: One flow, one system, one target stack. Written report, one kickoff call, one playback. No implementation, no retainer, no surprises on the invoice.

The week

Day 1
Kickoff, 30 minutes
You share the flow, the system, and who reviews.
Days 2–4
System and stack review
I run the flow against the system and the stack and write it up.
Day 5
Playback, 45 minutes
Failure map, what to fix first, and one of four calls: fix, pilot, rescope, or stop.

03How it's scored

Five areas reveal where production readiness breaks.

The prototype is the sample, not the patient. Each area separates the visible symptom from the system, process, or generation-context cause, then names what to change.

Example failure map

Illustrative composite, not findings from a client engagement.

AreaWhat brokeWhyWhat to change

Foundations

tokens and primitives

partial

Semantic aliases resolve in the prototype, then collapse to raw values when brand mode, density, or platform changes.

Plain English: The prototype may look right in one mode but cannot adapt reliably across brands, densities, or platforms.

The app compiles a runtime token graph; the generator receives a flattened CSS snapshot with no inheritance or mode metadata.

Expose the alias graph and mode contract in machine-readable form, then fail review when generated code introduces a raw value.

Bindings

how design maps to code

rebuild

The screen looks correct but composes private subcomponents and deprecated props that disappear in the next package version.

Plain English: The work can pass design review while relying on components engineering cannot safely ship or maintain.

Design names, package exports, and examples have drifted across three versions; retrieval ranks stale usage as canonical.

Publish a versioned component manifest with public APIs, allowed compositions, deprecations, and export-level validation.

Components

coverage and states

rebuild

The happy path uses the library; optimistic, retry, permission, and partial-success states split ownership between the page, hook, and component.

Plain English: The demo works, but real users encounter recovery and permission states the generated flow cannot handle consistently.

The contract is distributed across stories, backend error types, analytics events, and product rules. No single source describes it.

Create an executable state matrix for this flow: trigger, owner, UI state, recovery, telemetry, and acceptance evidence.

Structure

layout and composition

continue

No break in the sampled flow: URL, focus-return, and table-selection ownership remain consistent through drawer and responsive transitions.

Plain English: This area is healthy: navigation and state behavior remain intact as the layout changes.

This page archetype specifies navigation semantics and state ownership, not only layout and spacing.

Continue. Promote the archetype as the retrieval source and add its interaction contract to the acceptance fixture.

Governance

review and ownership

partial

Each screen can pass review while the flow still violates cross-entry-point rules for permissions, audit history, and analytics.

Plain English: Individual screens can look acceptable while the end-to-end release still fails access, audit, or measurement expectations.

Approval is split across design, platform, security, and product; nobody owns an executable definition of production-ready.

Create a named release gate combining system conformance, accessibility, entitlement, telemetry, and waiver evidence.

04Why Jared

Built inside production teams.

I’ve spent 20 years helping designers and engineers turn product ideas into software. Along the way, I’ve built and led design teams through an IPO and an acquisition.Jared Hawkins

20 years: in product design
2 teams: built from scratch, one through IPO at Medallia and one through acquisition at Split
0 to 1 + scale: experience building new teams and evolving mature product systems

05What comes after

A magenta module crossing into a stable green system

Fix the expensive thing, only if there is one.

If the diagnostic turns up something expensive to fix, we can scope a short pilot: one workflow, one component family, acceptance checks agreed up front, and one of your engineers working alongside me. Deployment stays with your team.

I also take on a small number of tightly scoped product design, UI, and design-system projects by referral.

Ready when you are

Send me the flow.

One real AI-generated product flow. One week. A clear call on what to fix first.

me@jaredhawkins.com

$2,500 · one week · one flow

Prototype-to-Production Diagnostic

The prototype didn't save work. It added a round of interpretation.

One flow, one week, a straight answer.