Alfa Romeo Configurator
An intuitive, visually elevated vehicle configurator experience packed with features, impressive options and a bonus movie maker experience.
OVERVIEW
Redesign of the Build & Price experience for Alfa Romeo to build on the premium character of the brand and improve the overall configuration experience. The new design features a rotating vehicle exterior, improved organization of content, a less intrusive conflict resolution experience and a more editorial, elegant look and feel.
With the new redesign of the configurator, configuration completions by users increased by 20%
Vehicle and Model Selection
The configuration process begins with a vehicle and model selection. The model selection page has a comparison chart mode to allow users to compare key model details such as features, specs and pricing.
Exterior Configuration
The exterior configuration section of this experience features a rotating vehicle model that updates to reflect user selections. The vehicle begins in a front 3/4 view, but turns to a side view and close-up when the user reaches the wheel and tire selections. The vehicle rotates to a back 3/4 view when the user is at the rear exterior options. The red information icons open modals with detailed information and larger images of the available options.
prototypes to demonstrate exterior vehicle rotation animation:
Interior, Powertrain and Packages
The next stages of configuration are for the interior of the vehicle, the powertrain and packages. The “listen to engine” button in the powertrain section, initiates an animation including the engine sound.
Conflict Resolution
ending on user selections, conflicts may occur due to incompatibility or availability of specific combinations. The conflict resolution process was redesigned to be less intrusive, use clear language and be easy to navigate. Different types of conflicts and resolution paths needed to be accounted for during the design of this part of the experience.
Your Alfa Romeo
The “Your Alfa Romeo” drawer built into the navigation allows the user to view the exterior and interior appearance of their current configuration at any point during the experience. It also lists pricing information and calls to action for the user to search for dealerships and the availability of their current configuration.
Summary
The summary section displays images of the vehicle configuration in different angles for an editorial-like display. Like the “Your Alfa Romeo” drawer, it also displays pricing and dealership information. The summary lists out all selections made through the configuration experience, with an option to edit choices.
Movie Maker
Following the configuration experience, users have the opportunity to create a custom movie of their Alfa Romeo. This accompanying project was also used as a promotional experience with its own entry points in other areas of the brand site. In this Movie Maker, users choose and arrange video clips in the timeline drawer fixed to the bottom of their viewport. After completing this task and selecting a soundtrack, a movie of their configured vehicle is generated. The final result can be saved or shared via social media.
