Lucid Motors

Designing the Future of In-Car Infotainment: From Concept to Production

Based in California, Lucid Motors is a luxury electric vehicle manufacturer, known for its flagship model, the Lucid Air, which blends cutting-edge design with a revolutionary infotainment system inspired by California aesthetics.

As part of the team, I helped create the in-car digital experience for the Lucid Air, working on everything from UX and UI to establishing a new art direction and editorial language that reflects the vehicle's luxury and innovation. Our team utilized various design and project management tools, and notably, helped in the transition of the R&D department from Sketch and Zeplin to Figma. This shift streamlined our workflow, enhanced collaboration, and improved the overall quality and cohesiveness of our design process.

Project Overview

Roles & Duration

User Experience Design
User Interface Design
Design System
Iconography

6 months (with ongoing retainer)

Primary Tools

Figma
Protopie
Jira & Confluence

Ensuring the synchronized visibility of the pulling and dragging response on both screens is essential for the new interaction paradigm to be ingrained as a learned behavior.

We joined Lucid Motors when their in-house team was formulating the System Interaction Model for the various screens within the vehicle. Our role was to establish intuitive and user-friendly UX principles. Our objective was to design a system where users could anticipate responses and behaviors without consulting a manual, and to create innovative interaction patterns that promote familiarity through repetition

Research & Explorations

“Our objective was to design a system where users could anticipate responses and behaviors without consulting a manual, and to create innovative interaction patterns that promote familiarity through repetition.”

One effective strategy we employed involved establishing a continuous relationship between the Instrument Cluster Right (ICR) and Center Information Display (CID) screens. This integration enables users to seamlessly transfer content from ICR to CID, providing them with the capability to perform additional tasks not suited for the limited real estate on ICR. We collectively agreed that while ICR serves as the primary screen for infotainment content, the layout and positioning of CID are ideal for handling detailed and complex tasks, such as entering a destination via the keyboard for Navigation.

As the Design Lead for multiple projects in the Infotainment Department, I spearheaded various initiatives, including UX/UI design for the media app, ensuring seamless integration with Spotify. Other projects encompassed features such as phone integration, seat controls, massage options, quick controls, and various vehicle system settings. These endeavors unfolded over several months of intensive collaboration at Lucid Motors headquarters in Newark, California.

Each project was organized with dedicated teams comprising a designer, product owner, engineer, and various stakeholders. In fulfilling my responsibilities, I frequently collaborated with safety lawyers, hardware engineers, and multiple other departments.

Key Contributions

Throughout these efforts, I acquired valuable experience in tailoring presentations for diverse audiences. When presenting ideas to engineers, the presentations needed to be technically comprehensive, anticipating any questions about functionality. In contrast, presentations for stakeholders and CEOs required a more visually focused approach. This flexible communication style allowed me to merge UX research with UI design and customize it for different audiences.

The success of these projects relied on a massive team effort, involving meticulous documentation, thorough exploration, and research. Our focus extended beyond design objectives, as we diligently addressed safety and legal requirements.

“I spearheaded various initiatives, including UX/UI design for the media app, ensuring seamless integration with Spotify. Other projects encompassed features such as phone integration, seat controls, massage options, quick controls, and various vehicle system settings. ”

We created a set of rules and guidelines for each screen within the infotainment system. For example, commonly used app such as Home, Nav, Media, and Phone would remain persistent within the Instrument Cluster on the right.

One of my initial projects involved defining the behavior of the phone app within the vehicle. This encompassed tasks such as Bluetooth pairing, managing profiles, and incorporating Alexa-specific commands for the phone. Recognizing that our primary user base consisted largely of business professionals, we prioritized features like seamless conference call management, quick merging, and the ability to place calls on hold. Additionally, we aimed to empower users to access comprehensive contact information, including addresses, phone numbers, and profile images. Looking ahead, our roadmap included plans to integrate calendar and email functionalities.

Creating an Integrated Phone App

“Recognizing that our primary user base consisted largely of business professionals, we prioritized features like seamless conference call management, quick merging, and the ability  to place calls on hold.”

In the collaborative process with the product owner and engineers, we developed numerous user cases during our regular meetings. These sessions were crucial for  aligning user expectations with technical capabilities, guiding us in generating user cases tailored for each sprint. Below is an example user story in-car contact list.

Alongside the product owner and engineers, we outlined a set of scenarios using the Given-When-Then (GWT) acceptance criteria, a structured syntax commonly used in Agile development to define the expected behavior of a user story. The 'Given' clause sets up the initial context or preconditions, the 'When' clause describes the action or event that occurs, and the 'Then' clause specifies the expected outcome. This method ensures that every feature, no matter how small or seemingly simple, is thoroughly documented and validated. In this case, we focused on a scenario involving the ability to access contacts from a linked device using the phone app on the ICR screen, ensuring that all possible conditions and responses were considered.

I played a key role in the team tasked with establishing the brand system for the entire in-car infotainment experience. This involved designing a cohesive visual language that spanned iconography, typography, and unique color themes tailored to each trim and model. We worked closely with the Lucid Motors marketing and interior design teams, holding regular meetings to align the infotainment system with the brand’s vision. Our design approach was heavily inspired by the car’s materials, colors, and California's landscapes, ensuring that the infotainment system harmonized with the vehicle's design elements rather than competing with them. This holistic approach resulted in a seamless integration between the car's physical and digital environments.

Creating a new Digital Design System

Enhancing Usability While Maintaining Design Consistency

Once we established the base model design system, it became the foundation for creating feature-specific screens. For instance, when designing the integrated phone app, we had to make adjustments to enhance usability. Some key changes included converting the icons from outlined to filled for better clarity, switching button shapes from squares to circles, and darkening the background to improve contrast and readability. These refinements significantly improved the phone app’s usability and functionality while staying aligned with the core design principles of the infotainment system, ensuring consistency across the entire experience.

“These refinements significantly improved the phone app’s usability and functionality while staying aligned with the core design principles of the infotainment system, ensuring consistency across the entire experience.”

These thoughtful adjustments not only elevated the user experience but also demonstrated the flexibility of the design system we created. By maintaining a balance between functionality and brand consistency, we were able to adapt to different use cases without compromising the overall aesthetic. The following visuals illustrate how these changes were implemented across the phone app.

Lucid Motors was the second in-car project I had the opportunity to collaborate on in my relatively short career. The experience provided valuable lessons in working with diverse teams, honing skills in project management, and effectively presenting my work to stakeholders and crucial investors. Leading various projects from inception to completion, I gained a comprehensive understanding of the entire design and development process. I collaborated closely with lawyers, government regulators, and engineers to ensure that our infotainment systems were not only visually compelling but also safe and compliant with industry standards.

Main Takeaways

“I collaborated closely with lawyers, government regulators, and engineers to ensure that our infotainment systems were not only visually compelling but also safe and compliant with industry standards.”

The structured design system we created for the infotainment screens has proven versatile, finding application not only within internal tools but also in crafting new themes for the latest models and vehicle trims. The public release of the Lucid Air in 2021 marked a significant milestone, and its subsequent recognition through various awards underscores the success and impact of the collaborative efforts invested in the project.