VW e-Golf digital commerce experience.

Designing a desktop commerce and digital advertising experience for the launch of the 2017 e-Golf.

A new initiative by Volkswagen Canada with a complete change to its business process. The intent behind the e-Golf e-commerce program was to determine if consumers would be willing to place a $1,000 deposit online for an electric e-Golf model that had never previously been available in Canada, with no idea on cost, timing or drivability.

Roles: Product Designer
Agency: DDB/Tribal Worldwide
Client: Volkswagen Canada

The Challenge

With no previous electric car in their line-up nor an on-line platform for direct to consumer sales initaitive, the challenge is to create a digital ecosystem to communicate the new environmentally friendly electric car that VW will be launching and to create a seamless sales and reservation tool for customers to be able to reserve their e-golf, customized to to the colour they like. 

My Responsibilities

Designing an end-to-end comprehensive digital experience from art direction, interactive tools, asset management, to customer sales experience. Cross team collaboration was key in the success of the program, working with production artists, UX and creative copywriters, developers, campaign art directors, social media managers and business analysts. 

e-golf_map_plan

What I did  #1 :

Designed the reservation and information sign-up page.

Designed the UX flow of the reservation and sign-up page combined. Worked with a campaign art director to land on the right imagery and direction for this page. The intent of this page so customers can easily reserve their e-golf and make a reservation deposit. Customer can cancel their deposit anytime they feel like. 

The the page has multiple entry points for customers making a deposit and a heroic imagery of what the e-golf might loook like. Though it is a renderring, I worked with a production artist to get the renderring as close as possible to reality. 

Additionally, ensuring the page to set clear customer expectations on what happens next after the deposit as well as sign-up for e-mail updates to get the latest news around the e-golf launch in Canada. I designed the infographic of steps of the reservation process with an 'electrifying' typographic and call to action graphic elements. 

egolfsignup

What I did #2 :

Designed the reservation form.

The reservation form was the key element in this whole experience. This page needs to be seamless, simple and to the point to ensure customers satisfaction and speed of closing the sale. Furthermore, setting expectations and frequent communication is key to keep customer's trust. 

egolfOnlinedeposit

What I did #3 :

Designed the colour picker for the landing page. 

With an offering of 40 different colours, my challenge here is to create a seamless interactive tool that lets customers preview and experience all the different colour VW E-golf has to offer. Designing the right and intuitive tool is key part on the customer journey. 

With the many different colours, I had to simplify the experience by utilizing a horizontal scroll, toggle and selection picker reduce customer's cognitive load and at the same time provide a delightful experience. Additionally, the simplified experience means that it will be scalable to a mobile device and using the mobile space more efficiently.

I designed 2 different types of interaction layout showing all the colours at once (A), and the other with the layered experience with a combination of simple interaction patterns (B). Using A/B testing, B performed way above expectations. 

Furthermore, I supervised the asset creation with each vehicle rendering with the different colours to ensure the most accurate colours are presented on the page. I art directed the scene where the background is 'neutral' where the focal point is the vehicle and interaction tool. 

I also worked closely with the developer to ensure pixel perfect prouction of the colour picker. 

Base_colour_
Custom_colour_
Early sketches for the colour picker

What I did #4 :

Designed the post-launch landing page. 

With the launch date announced, customers can explore more of what the e-golf has to offer. Using the assets created pre-launch, like the colour picker and the hero image, I was able to reuse them on the landing page in addition to designing the full experience of the page. 

Using data from user studies, eye tracking and heatmap pattern, I put in place where each information of the page goes. Price, performance, build, and personalization were the top 4 features that customers want to see immediately. Car features like technology package or design were secondary.

Visually, I created icons and infographics pertaining to the performance of the E-golf. Working with a production designer 3D renderring tools,  I chose and art directed feature images using both exisiting imagery as well as rendering non-existent assets. 

I worked with developers to ensure that the functionality of each modules were implemented correctly, insisting on a pixel perfect, high quality output for customers. 

 

egolfpage_12
egolfpage_22
AWARDS:

AWARDS:

2017 CANADIAN MARKETING ASSOCIATION
BRONZE. 1 : 1 CUSTOMER ENGAGEMENT AND LOYALTY

Senior art director for Volkswagen e-Golf Digital Campaign and reservation system.

2017 Canadian Marketing Association. Bronze. 1:1 Customer Engagement and Loyalty

AWARDS:

2017 CANADIAN MARKETING ASSOCIATION
BRONZE. 1 : 1 CUSTOMER ENGAGEMENT AND LOYALTY

Senior art director for Volkswagen e-Golf Digital Campaign and reservation system.

Senior art director for Volkswagen e-Golf Digital Campaign and reservation system.

AWARDS:

2017 CANADIAN MARKETING ASSOCIATION
BRONZE. 1 : 1 CUSTOMER ENGAGEMENT AND LOYALTY

Senior art director for Volkswagen e-Golf Digital Campaign and reservation system.

Credits

Senior Art Director: Dirga Agoes / Designer: Dirga Agoes / Jr. Art Director: Dean Hamman / Senior UX Copywriter: Lisa Gervis / Jr. Copywriter: Evan Wallis / Strategist: Andrew Ahern / VP, Business Unit Director: Neil MacLellan / Account Director: Reuben Segelbaum / Account Executive: Hannah Jordan / Program Manager: Nathalie Chenard / Project Manager: Alice Pinto / Business Analyst: Shane Sincich / User Experience: Sean Walsh & Dirga Agoes / Technical Director: Dylan Dempsey / Dev Ops: Rob Cimicata / Developer: William Chong / Quality Assurance: Enzo Licata

More Works

RevolvaProject type

2017 VW Full LinePrint Design

2019 JettaArt Direction

MGDUX & Web design and tools

SchlumbergerGraphic Design

Gibson's FinestGraphic Design

Miller LiteUX & Web design and tools

VW Special OffersUX & Web design and tools

Get in touch to learn about his current work, or just to chat.

hello@dirga.ca / +1 778.980.8046 / instagram / LinkedIn