top of page

Public Charging App Design

Client

Audi - Charging

Duration

4 sprints (8 weeks)

Role

UX/UI Designer

iPhone right-1.png
iPhone right.png
iPhone right-2.png

Summary

As Audi electric vehicles become more mainstream, drivers face challenges navigating public charging options and maximizing benefits like free Electrify America credits. Our objective was to redesign the public charging experience to increase usability, and align with Audi branding.

The opportunity

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.

iPhone 14 & 15 Pro Max.png
iPhone 14 & 15 Pro Max-1.png

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:

 

  1. Understand current public charging behaviors, expectations, and pain points.

  2. Evaluate the usability of Audi’s charging experience for clarity, ease of use, and goal alignment.

  3. Develop actionable recommendations to enhance usability and improve the overall charging experience.

Image by visuals

Research results

Based on our moderated usability testing with 10 users, we identified the following actionable recommendations for the public charging app redesign:

  1. The app’s entry point should be properly grouped and more prominent within the myAudi app.

  2. Users seek a more intuitive and simplified process for starting and stopping charging sessions.

  3. A clearer explanation of energy credits and their usage is needed.

  4. A detailed history of previous charging sessions should be provided.

Screen Shot 2025-01-20 at 1.09.35 PM.png
Vehicle Manufacturers - main themes & fi

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

1.

User often do not understand how find the Charger ID and charge their vehicle at a public charging station.

2.

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 charging status, wait times, including 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.

User flow.png

Low fidelity wireframes

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.

Inputs filled out.png
iPhone 13 mini - 79.png

UI design approach

Our aim was to craft a cohesive and polished experience, enriched by subtle, delightful interactions. We addressed our problem statements with our redesign:

iPhone right-1.png

User often do not understand how find the Charger ID and charge their vehicle at a public charging station.


Since Audi provides customers with complimentary credits for Electrify America, we set it as the default starting point. From there, we incorporated a dropdown selector that prioritizes popular charge point operators, making it easier for users to find the right one.

Users do not have a clear understanding of the payment process for public charging sessions.


On the "Start Charging" screen, 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.

iPhone right-2.png
iPhone right.png
iPhone right-1.png
Highlighting the most important actions in the viewport helps users quickly understand and navigate the app with ease.

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.

Group 3264_edited.png
Group 3264_edited.png
iPhone right.png
iPhone right-1.png

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.

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

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. 

BIMM Website Design

Redesigning BIMM’s website to showcase their expertise, highlight DE&I initiatives, and enhance user experience across key pages and the mobile menu.

1458_edited_edited.png

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.

image 88_edited_edited.png
Group 3266_edited.png
Group 3264_edited.png

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.

Group 3267_edited.png
Group 3264_edited.png
Group 3240_edited.png
Group 3264_edited.png

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.

Group 3264_edited.png
Group 3273.png

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.

bottom of page