Toyota Digital Redefined

The Existing Experience

This large-scale initiative spans every page across three platforms and is expected to influence the future design of Toyota's mobile app. I joined the project during the initial exploratory phase and remained through the MVP launch at the end of the fiscal year. This case study focuses on the MVP, which centered on a complete redesign of the logged-in Owner My Vehicle Dashboard.

I identified several areas of opportunity within the existing logged-in Dashboard, focusing on preserving components with high customer engagement while consolidating or removing elements with low usage. The following components were evaluated:

• Vehicle Selector — Enables users to select a vehicle by model and year; historically exhibited very low engagement
• Dashboard Marquee — Displays top-level vehicle information and dynamically updates based on VIN entry status
• Resources — A collection of links and tools that help users navigate the site and access vehicle-specific information
• Service History — Provides a record of all services performed on the vehicle; availability is dependent on VIN entry
• Servicing Dealer — Offers quick access to the dealer associated with the vehicle or selected by the user

Proposed Direction

After establishing a stylistic framework during the exploratory phase, I created a component diagram to scope the MVP — determining what to include, defer, or cut entirely. Key decisions:

• Quick Tools Menu — Consolidated lower-engagement links into a focused menu to reclaim in-page real estate
• Search — Moved to global navigation, reducing redundancy across the experience
• Recall Banner — A legal requirement requiring careful handling due to data feed inconsistencies
• Service History — Among the highest-utilized features on the existing site — retained and refined as a core MVP component

With scope defined, I planned for the page's multiple user-dependent states: VIN entry (users who provide a VIN unlock vehicle-specific data feeds), Connected Services enrollment (visible only in the VIN-entered state), and Model/Year variations (the page needed to flex across Toyota's full vehicle lineup). To map dependencies, conditions, and content triggers across every scenario, I created a flow chart covering each use case end to end.

Shifting Scope

To accommodate the MVP requirements while leaving room for iterative post-launch improvements, I proposed the following approach:

• Timeline — 6 weeks (3 sprints) for design; 4 weeks (2 sprints) dedicated to Experience Design, allowing the Visual Designer time for high-fidelity refinement prior to handoff
• Design Approach — I recommended designing each component independently and constructing pages like Lego blocks. Each component was built to account for variations in data, user state, and functionality — enabling flexible assembly for different states (VIN-entered vs. non-VIN, Model/Year variations)

Marquee & Sub-Marquee

The Sub-Marquee surfaces the most relevant snapshot of a user's ownership status — maintenance due dates, enrollment state, dealer info — directly below the vehicle hero. Because each card pulls from a different data feed, I designed them to function independently, which allows for more targeted information like subscription expiration warnings not currently available in production. New cards can be added without restructuring the component, leaving room for additional data feeds in future iterations.

Quick Tools Menu

The Resources section of the current site had low engagement — useful content that wasn't being found. Rather than cutting it or surfacing it in the main navigation, I consolidated these links into a Quick Tools Menu: a compact, on-page component that keeps them accessible without competing for attention. Key decisions include:

• App Subscription Management — Managing subscriptions requires the mobile app, so App Store and Google Play links on desktop go unused. I replaced them with a QR code generator that sends users directly to the relevant page on their phone
• VIN-Entry Modal — When users click 'Vehicle Specs' without a VIN entered, a VIN-Entry Modal opens inline so they can provide it without leaving the page
• Iconography — Working with the visual designer to create new iconography for Parts & Accessories, Audio Multimedia, Warning Lights, and Manuals & Warranties

Vehicle Health Report

The Vehicle Health Report (VHR) gives owners a clear read on their vehicle's condition — surfacing the information that matters most, from dashboard alerts and mileage to service status and subscriptions, without overwhelming them with raw diagnostic data. I redesigned it as a modular set of cards, each pulling from an independent data feed, so the component can scale as Toyota's telematics capabilities expand. Key revisions include:

• Graph Removal — The original graph was ambiguous and posed potential ADA compliance issues at mobile breakpoints. The tool now defaults to a collapsed chart view
• Dashboard Alerts as Cards — Alerts are presented as individual cards that clearly identify the type of issue and direct users to the appropriate page for resolution
• Schedule Maintenance Card & CTA — A top user priority and key dealership revenue driver; provides direct access to scheduling maintenance
• Horizontal Scroll Layout — Lets the component show more services without adding vertical height

The comparison below shows the current production version alongside the redesign:

Full Page Layout

I designed each component independently across five breakpoints — from Mobile to Desktop XL — and provided detailed annotations for functionality and technical requirements before handing them off to the Visual Designer for stylistic refinement. Following this handoff, we collaborated closely to iterate on the designs based on stakeholder feedback and evolving scope.

This example illustrates the full page layout for a user with a VIN-entered vehicle enrolled in Connected Services. All other use cases are variations of this layout, with each component adapting dynamically to the user's state and available data.

1. Marquee and Sub-Marquee — Worked with the Visual Designer to ensure 3-up and 4-up card variations hold across all breakpoints
2. Quick Tools Menu — Consolidated all Model/Year-specific links into a single on-page source
3. Vehicle Health Report (VHR) — Modular card structure scales as Toyota's telematics capabilities expand
4. Service History — Redesigned to simplify manual entry of service instances, especially for users visiting non-Toyota dealerships
5. Contextual Promotional Content — Promotions display conditionally using an existing pattern, appearing only when relevant
6. Servicing Dealer — Added a Google Map integration based on analytics showing ~60% of users access this page on mobile

Post-MVP

Though the project shifted from the original plan, the clients have remained receptive throughout. We had proposed reconciling global navigation before launching new pages, but the team pivoted — and the Dashboard direction is now well-defined. Designing the page modularly means components can be added or changed as the experience evolves, giving the work a longer shelf life regardless of how priorities shift.

• User Testing — I developed a user testing plan covering Dashboard components, navigation structure, and naming conventions
• Map Consolidation — Four separate dealer maps exist across the Owner experience; I recommended consolidating them into a single, faceted map
• Global Navigation — Competitor research revealed no clear standard for integrating the Owner space into global nav, so I proposed building and testing several models with users
• Logged-Out Experience / Benefits of Ownership — With the extended timeline, the future launch will include the Logged-Out experience