Challenge
An Adaptable Reservation System for the VW ID.4 Launch
Volkswagen's debut electric SUV, the ID.4, wasn't just a vehicle launch. It was a test of whether they could deliver a fully digital shopping experience in a space traditionally dominated by dealership visits.
I joined the project midstream to help finalize and refine key flows in the reservation experience: trim configuration, checkout, and post-reservation onboarding. But just as we were preparing to launch, work came to a halt due to COVID-19. The team disbanded while the product was only a couple weeks away from going live—and it was up to the remote dev teams to bring the designs across the finish line.
- Role
- Product Designer (focused on configuration, checkout, onboarding flows)
- Timeline
- 6 months (joined midstream, delivered to launch)
- Team
- Myself + other Product Designers, 1 PM, 1 PO, with VW’s design system team in Germany
- Constraints
- Tight launch window, distributed global team, remote collaboration
- Outcomes
- Enabled VW’s first U.S. EV digital pre-orders at scale (see impact metrics below)
Impact at Launch
2,000+
Vehicles reservations placed within the first 8 hours
500+
Dealerships activated through the platform
35%
Organic search traffic increase
How we got there: focused on the critical path (configure → reserve → confirm), clear content design, and a componentized system that let multiple teams ship in parallel.
Challenges
Volkswagen's first EV launch in the U.S. needed a digital reservation flow that felt simple for consumers yet worked across a dealership-driven ecosystem. I joined midstream to stabilize trim configuration, checkout, and post-reservation onboarding. Constraints included mobile-first performance, localization readiness, and a fully remote, multi-team build after COVID paused work. I had to design for edge cases—failed deposits, timeouts, and configuration changes—without creating support load for dealers. The challenge was less ‘pretty UI,’ more ‘adaptable system’ that could launch and scale.
Approach
I framed the project around the critical path: configure → reserve → confirm. I mapped states and failure modes, then worked with concurrently evolving components so multiple dev teams could build in parallel. I created spec sheets for each step (inputs, validation, error/empty states), prototyped micro-interactions, and aligned design tokens, grid, and spacing for consistent handoff. Content design clarified labels, fees, timing, and next steps to reduce hesitation at checkout. We reviewed in Figma with daily stand-ups, cutting rework and keeping the release on track despite a distributed team.
Results
The platform shipped on schedule and enabled the first wave of pre-orders. Launch metrics included over 2,000 reservations within the first 48 hours—doubling VW’s internal target and validating the system’s usability under high traffic. In the first eight hours, 500+ dealerships activated through the platform, and a 35% lift in organic search traffic to the experience. Beyond numbers, the work delivered a reusable reservation pattern, clearer post-reservation onboarding, and a component library that sped up subsequent iterations. Dealers reported fewer ‘what happens next?’ calls, and the cross-team build cadence became a template for follow-on releases. The system proved durable under launch traffic and flexible for content updates.
Lessons Learned
- 01
I learned the importance of designing adaptable flows that could scale across regions and dealership networks, ensuring the system could handle variations in regulations and incentives while still delivering a consistent user experience.
- 02
I learned how critical it is to tie design decisions to business outcomes—simplifying trim selection not only made the experience clearer for users, it directly reduced drop-off and drove more completed reservations.
- 03
I learned the value of looking beyond the transaction—treating onboarding and confirmation as moments to build trust, which strengthened confidence in the brand and kept users engaged after checkout.
Designing for success and failure across the reservation journey
I partnered with engineering to anticipate edge cases—like abandoned configurations, payment declines, and missing confirmations—and designed UI states that kept users moving forward.
Configure
- SuccessTrim/features selected → Moves to checkout
- FailOption unavailable → Disabled state
- FailAbandoned config → Saved on return
Checkout
- SuccessPayment authorized → Reservation number created
- FailPayment declined → Retry message
- FailTimeout → Session expired screen
Confirm
- SuccessConfirmation screen → Email sent
- FailOrder error → Error page with retry option
- FailEmail not received → Support fallback
I led design on three critical flows
I led the design of Trim & Feature Selection, Checkout + Reservation, and Post-Reservation Onboarding flows under a tight launch timeline. I defined wireframes, state logic mapping, and content hierarchy, and drove iterative handoff in Figma during Agile sprints—ensuring clarity for both design and development while collaborating closely with product owners, engineering leads, and fellow designers.
The 1st Edition Trim
- Goal
- Highlight the exclusive 1st Edition model while making it easy for early customers to reserve quickly.
- Change
- Simplified comparison layout, clear feature highlights, and a persistent reservation CTA.
- Outcome
- Ensured smooth conversion of the first 2,500 pre-orders by reducing hesitation at launch.
Trim & Feature Selection Logic
- Goal
- Prevent abandonment when customers browsed trims and optional features.
- Change
- Introduced progressive disclosure, disabled unavailable options, and added save-state continuity.
- Outcome
- Reduced abandoned configurations and accelerated the path from selection to checkout.
Checkout Flow + Reservation Confirmation
- Goal
- Build trust and reduce drop-offs during payment and confirmation.
- Change
- Clarified pricing, fees, and delivery ETA; added inline error states; and designed a clear confirmation step with next actions.
- Outcome
- Increased mobile completion rates and reduced support calls from dealers about “what happens next.”
Post-Reservation Onboarding Experience
- Goal
- Keep customers engaged and informed after placing a deposit.
- Change
- Designed a step-by-step tracker showing production and delivery milestones.
- Outcome
- Reduced post-reservation uncertainty and improved alignment between dealers and buyers.