At Luxoft, I spent over seven years working on automotive UX projects, including the Mercedes-Benz MBUX design system and other automotive clients. My contributions centred on design systems, prototyping, and high-fidelity interfaces, while collaborating with cross-functional teams, facilitating design workshops, and mentoring junior designers to promote a user-first approach across projects.
MB UX
MBUX (Mercedes-Benz User Experience) is the advanced multimedia and infotainment system powering Mercedes-Benz vehicles. This integrated platform combines cutting-edge hardware and software to deliver a premium user experience.
I spent over over 3 years of experience with Atomic Design System Methodology for MBUX system design for Mercedes-Benz projects and its Design System evolution.
I spent over over 3 years of experience with Atomic Design System Methodology for MBUX system design for Mercedes-Benz projects and its Design System evolution.
Challenges
One of the main challenges was ensuring design consistency across multiple infotainment platforms, each with unique hardware and UX constraints. The aim was to develop a scalable design system that could adapt to different screen sizes and evolving client needs while maintaining a cohesive user experience.
To ensure consistency, we introduced a two-tier Design System:
1. A Foundation Library (in Figma/Sketch) for core styles and components.
2. A high-fidelity prototype that precisely reflects the final product specifications.
Creation and maintenance of new components for the apps, such as Media, Parking, Personal Assistant, and Messages, while ensuring the look and feel remain consistent with the system components.
New components need to follow the restraints set by the Web Content Accessibility Guidelines (WCAG).
Tools:
Figma, Sketch, Illustrator, Photoshop, QML (QT), JavaScript
One of the main challenges was ensuring design consistency across multiple infotainment platforms, each with unique hardware and UX constraints. The aim was to develop a scalable design system that could adapt to different screen sizes and evolving client needs while maintaining a cohesive user experience.
To ensure consistency, we introduced a two-tier Design System:
1. A Foundation Library (in Figma/Sketch) for core styles and components.
2. A high-fidelity prototype that precisely reflects the final product specifications.
Creation and maintenance of new components for the apps, such as Media, Parking, Personal Assistant, and Messages, while ensuring the look and feel remain consistent with the system components.
New components need to follow the restraints set by the Web Content Accessibility Guidelines (WCAG).
Tools:
Figma, Sketch, Illustrator, Photoshop, QML (QT), JavaScript
Timeline:
MBUX Design System:
Over 7 years of continuous evolution, steadily refined and scaled across numerous client projects.
Responsibilities
•Led design critiques and workshops with cross-functional teams, aligning UX, engineering, and product stakeholders.
•Worked closely with developers to reduce handoff friction by providing detailed specifications and interactive prototypes.
•Championed user-centric design choices, balancing usability with technical feasibility.
MBUX Design System:
Over 7 years of continuous evolution, steadily refined and scaled across numerous client projects.
Responsibilities
•Led design critiques and workshops with cross-functional teams, aligning UX, engineering, and product stakeholders.
•Worked closely with developers to reduce handoff friction by providing detailed specifications and interactive prototypes.
•Championed user-centric design choices, balancing usability with technical feasibility.
Impact
•Contributed to the development of a scalable design system now used across multiple production vehicles.
•Supported the creation of reusable components and comprehensive specifications, helping to reduce design-to-development handover issues.
•Aided in streamlining delivery by working on standardised design patterns, which decreased rework and improved consistency.
•Collaborated with the team to maintain a cohesive user experience across various infotainment platforms.
Project Halo
Project Halo - Proof of Concept (CES 2020)
Project Halo is a Proof of Concept (PoC) for a Mobility-as-a-Service (MaaS) application designed for autonomous vehicles.
The app allows users to:
•Request an autonomous car for on-demand rides
•Access advanced multimedia features available in modern vehicles
•Access advanced multimedia features available in modern vehicles
Developed as a showcase of Luxoft’s UX design and software engineering expertise, this project was presented at leading automotive and innovation events.
The Halo proof of concept comprised both a mobile application and an in-vehicle infotainment system.
Process & Approach
Tools:
Adobe XD, Illustrator, Photoshop
Impact
Process & Approach
•Designed mobile and IVI interfaces in parallel to ensure cross-platform consistency.
•Created high-fidelity prototypes in Adobe XD to demonstrate interactions.
•Worked in close collaboration with developers to translate the designs into a live demo for CES.
Tools:
Adobe XD, Illustrator, Photoshop
Impact
• Project Halo was successfully showcased at CES 2020, receiving positive feedback as a visionary MaaS experience.
• Helped position Luxoft as an industry innovator in automotive UX, extending beyond production design into future mobility concepts.
Bellow are some media of the booth in the CES 2020 (Consumer Technology Association) where Halo was presented by Luxoft hosts.
