Staking out a higher-converting lead form.
A controlled redesign of the Oregon Lawn Barbers quote form — replacing a single high-friction form with a progressive-disclosure wizard, then defining how the change would be measured in a controlled A/B test. Built in React. Instrumented for behavior. Designed to be judged by data, not taste.
The case, in four measured plots.
Every optimization starts as a survey: define the ground, form a hypothesis, build the instrument, read the result. No step skips ahead of its evidence.
Friction at the ask
A local service page where the quote form is the whole funnel — and a wall of fields is the last thing a visitor sees before leaving.
Trade depth for momentum
Breaking one long form into staged steps — and returning instant value mid-flow — should lower abandonment versus the existing single form.
Built to be measured
Both variants engineered in React with per-field telemetry, deterministic bucketing, and accessibility held to a fixed floor.
Await field traffic
A planned two-proportion test will decide it. The result lands when the required field sample does — not before.
Control vs. Challenger.
The control reflects the Oregon Lawn Barbers form documented at the start of this study — a fair baseline, not a straw man. The challenger changes the structure of the ask, not the honesty of the comparison.
Every field exposed at once. One decision point, high up front. This is the documented baseline for the test plan.
Staged disclosure. Step one asks for a tap, not typing. Step two returns an instant estimate. Contact comes last, once momentum exists.
Engineered to hold up under inspection.
The implementation decisions behind a testable build — not screenshots alone, but defined behaviors and measurement hooks.
Deterministic bucketing
Visitors hash to a stable variant and stay there on return. No flicker, no re-randomizing mid-session via a persisted visitorId.
Per-field drop-off
A useTelemetry hook logs step progression and the exact field_id where a session stalls — the raw material for a friction map.
Accessibility, non-negotiable
Full keyboard paths, visible focus rings, aria-live on the dynamic estimate, reduced-motion respected. Held constant across both variants so it never confounds the result.
Behavior, defined event by event.
The telemetry design captures the events that explain why a number moves — not just that it did. The trace below demonstrates the event schema with illustrative session values; it is not production traffic.
The verdict is a calculation, not a claim.
Completion rate tells you what happened. The significance test tells you whether to believe it. The test plan defines both before any field result is reported.
Sample size n calculated in advance from baseline CR and the minimum detectable effect. No early stopping in the test plan.
- Baseline CR (control)pending
- Observed CR (challenger)pending
- 95% CI on liftpending
- p-valuepending
- Required n / arm2,726
The interaction, prototyped end-to-end.
Alongside the shipped React build, the core progressive-disclosure flow was rebuilt and verified natively in Axure RP 11. The browser-accessible version below lets reviewers test the same service, estimate, validation, and success journey without an Axure account.
From interaction design to working instrument
The native source file documents the interaction design process; the launchable preview demonstrates service gating, linked square-footage estimates, contact validation, backward navigation, success, and restart.
- Four named dynamic-panel states
- Native conditional cases and global variables
- Boundary-tested estimate tiers
- Complete mouse and keyboard reviewer flow
Built in two honest phases.
The rig exists now. The result arrives when real traffic has spoken. The case study is transparent about which is which at every moment.
Build & validate
- React control + challenger variants
- Deterministic bucketing & persistence
- useTelemetry event layer
- Accessibility floor + reduced motion
- Documented sample-size calculation
Collect & conclude
- Deploy to an instrumented test surface
- Drive real traffic to both arms
- Reach documented n, no peeking
- Run two-proportion test + CI
- Publish the real verdict here
Estimate ranges shown are illustrative interaction demos, not the business's quote engine. Metrics labeled "illustrative" or "pending" are placeholders until real data is collected.