-
Audi: myAudi app
(2020-2021) -
A comprehensive re-design of an Audi mobile application, encompassing everything from information architecture to user interface
-
Digital Product Design, Visual Design, Design Systems
-
-
About the myAudi app
myAudi aims to seamlessly integrate Audi vehicles into users' lives through a variety of different features and services.
The app provides real-time information such as fuel level, estimated driving range, vehicle notifications and warnings. Users can also plan trips in the app and send destinations and routes directly to their vehicle. Auxiliary heating and the opening and closing of the vehicle doors can also be operated remotely via the app.
-
-
Project Background
-
After commencing the role of lead digital agency for the four rings, SinnerSchrader proposed a redesign of the app to Audi.
The previous version was riddled with usability issues, low app store ratings and a multitude of customer complaints. The "paper-roll" dashboard posed navigation challenges for users, while the cluttered interface and lack of clear interaction cues reduced discoverability. It did not reflect the brand's reputation for innovation and quality, and was in clear need of improvement:
-
Role & working setup
As a member of a small cross-functional product team at SinnerSchrader, my primary focus was on the development of the app's updated design language. This involved close collaboration with Audi’s CI department, together with branding agency, Strichpunkt, who were in the process of updating Audi’s corporate identity at the time.
In parallel, I collaborated with with the team at SinnerSchrader, Audi's business partners and engineering agency Quartett Mobile, to enhance the user experience of the myAudi app's various functions and features. This was accomplished using an agile approach, with two-week sprints which involved planning, kitchen views and reviews. All of these cadences were conducted with the participation of relevant stakeholders.
At SinnerSchrader, I worked in a small design team consisting of three other product designers and two user researchers. We collaborated on various project features as a team, while also individually handling certain functions and deliverables.
-
-
Collaborative Design Sprint & Research Phase
-
-
As a genesis to the project, we conducted a series of user interviews, card sorting and tree tests to better understand the following overarching questions:
1. What is a users' mental model when it comes to a “remote control” of their vehicle?
2. What information is most relevant?
3. In what context is it expected?
Through conducting qualitative tests and quantitative online surveys involving more than 100 participants to help us answer the above questions, we gathered valuable insights that led us to develop a new information architecture.
We then proceeded to evaluate and enhance this architecture through a series of usability tests, iterating on the design along the way.
-
-
Information Architecture remodelling
-
We coined the term 'Carsona' to represent the different vehicle types users can access through the app. Each Carsona has specific functions based on varying drive types and levels of connectivity. The entire vehicle fleet can be categorised into four distinct Carsona groups: Non Connect, Advanced, e-tron and Guru.
The level of app functionality available is dependant on the Carsona type, as depicted in the diagram below:
-
Regardless of the Carsona type and the subsequent level of functionality available, the app’s menu bar was redesigned and divided into 4 top-level items: Vehicle, Navigation, Service and Profile. The features contained within each tab are detailed below:
-
-
Combined with the new design language, this new structure promotes an intuitive discovery experience for users, and a far more logical division of the apps extensive feature set.
We decided to implement a fourth tab for users to manage all things Service related, instead of the arbitrary entry point on the previous iteration of the vehicle dashboard.
-
Updated design
-
-
The updated myAudi app is an elegant, unobtrusive interface which places the most critical information at the users fingertips.
After extensively testing and gathering feedback from both users and internal stakeholders at Audi, we decided to incorporate Material Design's Cards as a foundational interface element. This enabled related content to be clearly grouped using an ubiquitous interface pattern in modern digital products.
The generous application of white space in the visual design not only enhances the brand's premium identity, but also provides users with a clear visual hierarchy.
As demonstrated in the video above, we also introduced a new core feature called the Quick action drawer as part of this initiative. Taking inspiration from Google Maps' "Explore Nearby" draw and the iOS control center, this feature allows users to easily access frequently used functions with a simple upward swipe.
-
-
UI Kit
-
-
The above video showcases my main contribution to this project: developing the UI Kit for the myAudi app. This was an iterative process carried out alongside the team's work on the app's features. Although challenging to manage at times, it provided structure and guidance for the team's solution-building, and set the foundation for future iteration.
-
-
Documentation
-
-
As per Audi's request, we utilized Confluence to thoroughly document both the design system of the app and its individual features. The above walkthrough offers a glimpse into the organisation of this documentation and highlights the significant scale of the task.
-
-
Project impact & final thoughts
-
The changes introduced in this iteration are clear improvements to the app, however it's difficult to quantify the impact. Tracking was not introduced initially, but later implemented as a fast follow following my departure.
App Store ratings have improved since the update, with average ratings of 4.1 for iOS and 4.0 for Google Play at the time of writing. The visual design has undergone additional positive iterations whilst maintaining the look and feel that was established.
However, some users still experience issues with core vehicle backend problems, causing significant latencies and a subpar experience. While not included in scope of this initiative, solving these issues is crucial for a seamless user experience.
Regardless, the myAudi app’s updated design language and improved information architecture add invisible finesse and elegance to a brand renowned for its innovation and future thinking.
-
Responsibilities
User research
Visual design
Design system creation
Documentation
-
Partners
SinnerSchraderFelix Lehmann
Markus Ölhafen
Johanna Kleyla
Lina WeinlandNora Taake
Jana Bartels
Sabrina LahoussePhilip Behr
Philipp von Essen
-
Audi
Tim Gotthardt
Christoph Andresen
Roland PezziFlorian Leicher-van Deun
Philippe ErieauMarion Braun
-
Quartett Mobile
Can Yumusak
Leon von Tippelskirch
Jonas Reimers
Adrian Ille
Matthias Schwab
-
Next case study: