_gif.gif)
Public Charging App Design
Client
Audi - Charging
Duration
4 sprints (8 weeks)
Role
UX/UI Designer
Summary
We tackled the challenge of helping electric vehicle owners easily locate and utilize public charging stations, including redeeming their free Electrify America credits. We also wanted to aligned with the business objective of interoperability across all public charging providers. Here’s how we designed a seamless solution to enhance their charging experience.
The opportunity
As electric vehicles become more mainstream, drivers face challenges navigating public charging options and maximizing benefits like free Electrify America credits.
The current public charging experience offered by Audi reflected poor user experience in its navigation and lacked consistent Audi branding.
This presented an opportunity to design a solution that simplifies the charging process, enhances brand alignment, and ensures users can confidently access and utilize available resources while on the go.
Starting with research
We began with a week of focused research in collaboration with the design research team. By testing prototypes with Audi users, we aimed to:
-
Understand current public charging behaviors, expectations, and pain points.
-
Evaluate the usability of Audi’s charging experience for clarity, ease of use, and goal alignment.
-
Develop actionable recommendations to enhance usability and improve the overall charging experience.
Research results
Based on our moderated usability testing with 10 users, we identified the following actionable recommendations for the public charging app redesign:
-
The app’s entry point should be properly grouped and more prominent within the myAudi app.
-
Users seek a more intuitive and simplified process for starting and stopping charging sessions.
-
A clearer explanation of energy credits and their usage is needed.
-
A detailed history of previous charging sessions should be provided.
Competitive analysis
Before diving into user flows and UX design, we aimed to assess the competitive landscape and analyze how our competitors address public charging for their users.
Goals:
-
Identify both direct and indirect competitors.
-
Evaluate competitors based on feature sets, strengths and weaknesses, trends, and overall visual appeal.
-
Identify opportunities to enhance or refine our current design to better align with user expectations, considering competitor offerings.
Key Findings:
-
Charging history is a common feature among most direct competitors.
-
Many competitors offer the ability for users to remotely stop a charging session.
We looked at both vehicle manufacturers and charge point operators apps, organizing our findings into two categories; working and not working.
Problem statements
User often do not understand how find the Charger ID and charge their vehicle at a public charging station.
Users do not have a clear understanding of the payment process for public charging sessions.
Our goals
To design an Audi public charging app that prioritizes:
Enhance user accessibility & convenience:
An intuitive interface enabling users to easily locate, access, and manage public charging stations seamlessly.
Improve real-time data and control: Integrate real-time updates on station availability, charging status, and wait times, with remote control for starting or stopping sessions.
Optimize experience for interoperability:
Design with scalability in mind to accommodate future integrations with multiple charge point operators.
UX design approach
After user testing and the competitive analysis was completed we moved into the UX design sprint where we focused on improving the user journey by simplifying the experience.
The user flow is streamlined for ease of navigation, ensuring that key features like starting a charging session, tracking charging status, and managing payments are easily accessible.
Low fidelity wireframes
Following stakeholder approval of the revised user journey, we transitioned to wireframing. Our primary objective was to streamline the screens, ensuring a clean and intuitive design that minimizes cognitive load and keeps users focused on their primary goal—charging their vehicle.
UI design approach
Following stakeholder approval of the UX, we transitioned to the UI phase, focusing on aligning the app with Audi's Corporate Identity (CI) guidelines. Our aim was to craft a cohesive and polished experience, enriched by subtle, delightful interactions. We addressed our problem statements with our redesign:
User often do not understand how find the Charger ID and charge their vehicle at a public charging station.
Using a drop-down selector with the most used CPO at the top allows the user to find the correct Charge point operator.
Users do not have a clear understanding of the payment process for public charging sessions.
In the "Start Charging" section, we implemented a default payment method that auto-populates based on the selected Charge Point Operator (CPO). For Audi users with complimentary Electrify America credits, the payment method section is pre-filled with these credits. An information icon is included to provide additional details about the selected payment method and its usage.
Utilizing the viewport to emphasize the most relevant actions enables users to quickly understand and navigate the app effectively.
Enrollment Screens
Highlighting the benefits upfront, we provided users with a seamless way to agree to the terms and conditions and optionally add their phone number to receive SMS notifications about charging status updates.
The outcome
The redesigned Audi public charging app successfully addressed key user pain points by providing an intuitive interface for locating and managing charging stations.
The integration of real-time updates on station availability and charging status, along with the ability to remotely control sessions, enhanced user convenience. Additionally, aligning the app with Audi's Corporate Identity guidelines ensured brand consistency, resulting in a cohesive and user-friendly experience.
Reflection
This project underscored the importance of user-centered design and thorough research in creating effective solutions. By actively engaging with users and analyzing competitor offerings, we identified critical areas for improvement and implemented features that directly addressed user needs.
At times, business objectives may not fully align with user needs, potentially resulting in an incomplete user journey. However, knowing that the redesign has significantly enhanced the overall user experience helps mitigate the impact of these limitations.
Post MVP updates
Following the successful redesign, we sought to address an additional pain point identified during our initial user research and corroborated by competitive analysis:
Charger IDs lack standardization in both their codes and their placement on charging stalls. Additionally, requiring users to manually input Charger IDs increases the likelihood of errors and user frustration. We also aimed to update the myAudi app to integrate with the charging experience, enabling users to seamlessly search for charging stations.
Initially, Audi's restrictions limited our ability to implement solutions to these challenges.
However, upon completing the project, we advocated for further research and developed a prototype that auto-populates the Charger ID when a user connects their vehicle. The prototype also included updates to the myAudi app, creating a seamless transition from searching for public charging stations to the charging experience itself.
Unfortunately, due to budget constraints, we were unable to proceed with testing to validate our assumptions.
Start charging
After a user selects the CPO and enters the Charger ID the screens transition to an in-progress status where we provide feedback on the session.
Charging history & session receipt
Users can access their charging history by selecting the left chevron, which allows them to browse through past sessions. At the top of each month, aggregated data provides insights into their charging habits.
From the overview screen, users can select a specific charging session to view the associated receipt.
Plug&Charge contract selection
To support interoperability, we designed screens that enable users to select, install, and manage contracts.
These contracts facilitate seamless charging via Plug&Charge at the associated Charge Point Operator (CPO) stations.
Complimentary card states
Leveraging a familiar credit card design pattern, we created a simplified view to display remaining credits, allowing users to quickly assess their balance at a glance.
The credit display was strategically positioned directly below the "Start Charging" input section, ensuring users could easily see their available credits while initiating a charging session. Below is an example showcasing the different states.