SEAT - HMI - Automotion
The project came from SEAT's Design and HMI Department and consisted of designing a hyperconnected radio: we created a visual language completely different from what was on the market, solved UX problems based on user testing, and ultimately built a fully touch-enabled screen with digital connectivity to the variety of devices found on the market today.
PROBLEM
UI/UX design for the console of SEAT's new generation of cars. A single design and look and feel for 8 radios across different trims, sizes, and feature sets. A radio that would be part of the most connected car in SEAT's history.
We worked within a multidisciplinary team that brought together more than five groups (Human Machine Interaction/HMI, Electrical, Engineering, Legal, Copy, etc.). To carry out the project we applied agile and SCRUM methodologies and collaborative working methods, using Jira, Confluence, and Kanban, among other tools.
The project ran for four years, and the main challenges we faced were:
- Interpreting, translating, and classifying information.
- Designing a simple interface where the most important functions had quick access.
- Understanding our user: a driver who needs to operate the different interfaces quickly and without distraction.
- Keeping objectives up to date over time and in step with technological advances (given the project's long duration).
- Scaling the visual solution across different car trims and five different screen sizes: 10", 9.2", 8.25", 8", and 6.5".
- Adapting the different features to the contexts designed within each available trim level (buyers could personalize which features they wanted in the car at the time of purchase).
SOLUTION
We designed a simple, innovative look and feel — flexible and scalable across all consoles. We used atomic design to create an organic, modular graphic system that integrated all the visual and functional elements of each product context.

CONCLUSION
There's a tendency to saturate the driver's space with screens. There's a high degree of driver distraction, caused not only by the instrument cluster and infotainment system but also by the use of mobile devices inside the car.
This is likely due to a lack of standardization. Today's automotive market offers as many approaches to this problem as there are cars — many different solutions for the same needs. Even screen size and orientation vary enormously: the number of screens (2, 3, or more), ultra-wide formats, 4:3 ratios, and even rearview-mirror displays in some cases. This level of complexity has a major consequence for setting standards: there are very few.
In addition, these designs need to undergo very rigorous testing, since they're used in situations that are potentially dangerous. Users need to be able to recognize commands and take the desired actions simply and directly, without distractions that put lives at risk. Continuous testing offers valuable insights for the design team, but it also makes the process slow and repetitive. Using a Design System, libraries, and other organizational tools is essential.
One of the most important lessons I can highlight from this experience is the importance of applying UX heuristic principles:
- Understanding heuristics: how the user understands and perceives a system.
- Interaction heuristics: how the user interacts with a system.
- Feedback heuristics: how the user gets information from the system.
MY ROLE: UI/UX Designer (March 2017 – March 2019)
- UI/UX design.
- Icon design.
- Context design: Media, Radio, Navigation, Phone, Menu, Sound, Driving, Settings, Full Link, etc.
- Coordination and design of the Volkswagen web app.
- Applying solutions based on user testing.
- Applying the look and feel and graphic system to console screens of different sizes.
ICONS
ISSUES ENCOUNTERED
- No defined iconography.
- No existing style guide.
- Contexts that kept changing at the fast pace of the work.
- High staff turnover, slow learning curve.
- Confidentiality security levels limited the work, as design sometimes had to happen somewhat blindly due to security clearance levels even between departments.
- Information architecture problems had to be solved on the fly.
- Functionality problems had to be resolved through heuristics.
LEARNINGS
- Teamwork is essential. There's a diversity of designer profiles that need to be taken into account throughout the process.
- The functionality of each screen must be clearly defined before it's designed.
- Building libraries makes collaborative work easier.
- Information architecture must be defined and applied across its four systems: classification, navigation, labeling, and search.
- Naming and terminology need to be unified; this includes learning automotive-specific terminology.
- The importance of knowing and applying the 10 usability heuristic principles.
- These principles should have been considered from the start of the process, in order to optimize results and timing.
Hello,
Want to know more?.
Want to talk about your next project?.
I will be glad to hear from you.
Thanks.
© 2016 Jhonatan Medina Caguana. All right reserved.