Research
Heuristics
No way to get clear comparison of trim levels; No way to find out which trim levels have which options available.
Duplicate vehicle cards for multiple model years; eg. "Tacoma 2023" & "Tacoma 2024"
Engine choice included more than just the engine, often including transmission, drivetrain, and in the case of Sienna, seating configuration.
Accessories increased from a around 25 to over 100.
Cab & Bed selection had inconsistent and conflicting language without any visual depiction until selected.
Problem
Users are unable to find options they are looking for, it's unclear which grade to select to add desired options.
"Which grade has Apple CarPlay?"
"I want a moon roof."
"I want heated seats."
Cognitive load among certain steps is unecessairly high.
Vehicle render scrolls out of view on both mobile and desktop.
Strat Overview
Primary Goal Education
Among both high & low funnel guests, educating about vehicle configuration possibilities is the main goal of the tool.
Experience Pillars Effortles / Conclusive / Gratifying
Conflict.. Among users who encounter conflict, a larger percentage complete through summary.
Challenges.. "Which grade has Apple CarPlay?", "I want a moon roof.", "I want heated seats."
Architecture
User Flow Update
Design
Reimagined Interface
Option 1
Horizontal interface — Individual Category Pages allow focus on single step at a time.
Option 2
Vertical interface — Individual Category Pages allow focus on single step at a time.
Option 3
Mobile: Vertical interface
Desktop: Combination Horizontal interface + vertical
Continuous scroll - “everything at your fingertips”
Vehicle Select Page
Updated Experience
Vehicle Select Card
Vehicle Selection Cards were increased in size allowing for the inclusion of more engaging lifestyle photo.
Options “card-flip” interaction added to educate users about what options are available for any vehicle.
Model Year toggle included to reduce redundancy of cards when more than one model year was present.
Previous Experience
Vehicle Select Card
Comparison: Mobile & Desktop
- Previous Experience Left
- Updated Experience Right
Reduction of the number of vehicle cards by ~35%, going from around 67 to 50 cards.
This also reduced the density of content and overall scroll height of the page.
Model Select Page
Updated Experience Trim Select Page & Trim Details
Previous Experience Trim Select Page & Trim Details
Redesign & Rearchitect
Packages
Redesign ..eliminate the modal overlay.
We were able to eliminate the need for an overlay buy creating an accordion feature that kept user within the configurator interface when details existed, and otherwise eliminated the redundant overlay when it didn’t have any additional info to offer.
Previous Layout
Updated Layout
Rearchitect ..eliminate the endless concatenations.
Users were bewildered, and so were we.
Careful analyzation reveled that only a few different items were combined in countless ways creating upwards of 25 slightly different choices …nearly all with the same label.
Leveraging check box functionality rather than radio button functionality allowed us to significantly reduce cognitive load.
No longer was every possible combination needed. What was 25 choices is now 7.
Previous Functionality
Updated Functionality