product designer
Audi-e-tron-1600x1066.jpg

Volkswagen Group

 

Electrify America is a catalyst for promoting zero-emission vehicle adoption by offering transformative, customer-centric infrastructure and energy management solutions.

Role and Responsibilities: Research and Design

Primary and Secondary Research, User/Usability Testing, Heuristic Analysis, Journey Mapping, Low to high fidelity design

Platform I worked on: Mobile App (iOS & Android)

Collaborators: Product Design, Research, Content Design, Engineering

Key Stakeholders: Business, Content, Marketing, Product Management

The Challenge: Create a seamless experience across the electric vehicle customer journey to grow the charge network and increase demand for zero-emission vehicles

The Opportunity: Create a cohesive user experience which marries the complex requirements of multi-platform design with Electrify America’s business goals and sustainability objectives.

 
Screen Shot 2021-08-31 at 10.08.35 AM.png



Research Overview

With our focus on making the electric vehicle charging experience more accessible and intuitive for all users, my team and I created a research plan to document our goals and assumptions. We investigated the domain through primary research interviews, competitive analysis on similar products, and reviewing pain points from customers on the initial Electrify America experience.



Research Summary

Our team filtered through various finding from the research phase into four core guiding principles for all future design and functionality…



Consistency | Clarity | Accessibility | Reliability




Research Process

Competitive Analysis - Onboarding / Sign Up Conversion Rate

Through task analysis, the times shown here indicate on average how long it took a user to get through the initial sign up and onboarding phase.

User Interviews - Legacy App

I could use more information on where the charger is
— Brian, Electrify America User

First Time User Journey

 

Personas

Personas were created based on data points synthesized from primary and secondary research findings. They are used to guide qualifications for user recruitment and overall business growth.

Design Overview

Ideation

Early sketches to brainstorm ideas based on research findings and knowledge of our target user personas.


Core Features

Initial overview of mai core features - Map View, Charger States, and Home Charging

Initial overview of core mobile app features - Map View, Charger States, and Home Charging. I primarily worked on the public charging user experience.

 

Map Experience

When working on the map view it was initially important to consider how a user would zoom and interact with different stations in their initial discovery phase. Based upon collaboration with our research team, we found most users using the map rather than search are likely in a long trip planning phase. Below illustrates three different map views and how the map pin size responds based upon user input (pinch to zoom).

Map Zoomed - Three Views

Map Zoomed - Three Views

There are multiple ways a user can discover a station depending on what type of scenario they are in. Through user research we found that users typically with either pre plan all stops if they are on a longer trip, or if they are on a shorter trip they may approach their search in a more spontaneous way, naturally leading them to visually search using the pins rather than using text input to plan a stop at a particular location.

Station Search Card - Collapsed, Half Up, and Full Card.

Station Search Card - Collapsed, Half Up, and Full Card.

Charging Experience

Once the user finds a station, they can tap the station to have a glance at the more granular offerings of that station. For EV users this is an absolutely critical part of their charge journey. I was responsible for creating 3D charger icons to illustrate what the different charger types look like. Having a visual indicator of each charger type is especially important for new EV users who might not be as familiar identifying the correct type of charger they need for their vehicle.

Additionally, I designed a feature here which allows for the user to set notifications for their charge session. From user feedback we found that the vast majority of users walk away from their vehicle while it is charging. With that in mind, we designed the charging experience so users can create custom notifications to inform them if their charge session is ever interrupted and/or when the charge session is complete.

A/A Test for Charger Recognition/Accessibility

Screen Shot 2021-09-01 at 4.56.32 PM.png
EV Plugs Modeled in Rhino 3D

Electric vehicle plugs modeled in Rhino 3D

Screen Shot 2020-10-27 at 2.37.41 PM.png
Screen Shot 2021-09-01 at 4.54.13 PM.png

With session summary, we are able to gather further data on overall charge experience. I designed this survey to be quick, manageable, and impactful for our product team. With this survey we are able to quickly gather large amounts of qualitative and quantitative user data while minimizing any inconveniences to the user.

Screen Shot 2021-09-01 at 4.54.51 PM.png
 

Select a plan / plan details

For our Electrify America Membership Plan, we initially offered just Pass (no monthly fee), Pass+ ($4/mo). The main incentive for users to upgrade to Pass+ is cheaper charge rates, especially for higher KWH chargers (350, etc.)

Later on, we were asked by stakeholders to include a premium offers option for users who get further incentives from their car manufacturer/dealership. (Example: Jeep may give two complimentary charges to customers who purchase a Wrangler 4XE in California.

Screen Shot 2021-09-01 at 4.59.43 PM.png
Draft of Car Model - I later mirrored the view to face the opposite direction in order to maintain organic flow with the already existing page content.

Draft of Car Model - I later mirrored the view to face the opposite direction in order to maintain organic flow with the already existing page content.

Based on user feedback we knew it was important to simplify copy and add visual depth to the page in order to get users interested to learn more about the benefits of our premium offerings.

Inspired by some quick competitive analysis, I 3D modeled a very simple electric sedan using Rhino3D to model the actual 3D form, texturing in Cinema 4D, and doing some color/lighting tweaks using Photoshop.

Business Impact

Within our first year of launching the redesign we were able to convert 268,000 electric vehicle charge sessions annually in 2020 into 1.45 million annually for the 2021 calendar year. That is an over 500% increase in charge sessions annually.

We were also able to successfully deliver on core sustainability goals:

41.4 gigawatt-hours of energy in our first year post app redesign resulting in roughly 5.7 million gallons of gas avoided.

Reached a record high 5.2% market share of new electric vehicle sales in the United States

You can read more about our impact here.

The Electrify America app is now the 27th most downloaded mobile app in the Navigation category with an average rating of 4.2/5 stars.

Appendix //

Design System

While I designed a lot of fun UI with very specific user purpose, I also created a very modular design system for use by our internal design team to easily build out new ideas with consistent visual language. This design system was also used by developers when Zeplin designs did not provide enough clarity on how everything should look and feel.

Map Pins.jpg