HMI design process & best practices

In brief

What does it take to design sleek and engaging automotive HMI, again and again? A proven process, of course. While every project is different, our team of engineers, designers and strategists always abide by clearly-defined HMI design principles. Here’s a glimpse at how we work and why automotive HMI design matters more now than ever.

The new wave of automotive human-machine interface (HMI) is transforming how drivers interact with their vehicles. HMI technology advancements, customer expectations and the steady growth of the connected and autonomous vehicle market will continue to drive developments in the automotive HMI industry, essentially elevating vehicles into smart machines. For drivers and passengers, HMI is the gateway to entertainment, safety and connectivity features and is critical to ensuring drivers are comfortable with autonomous driving capabilities. Increasingly, OEMs are personalizing the in-vehicle UX to reflect user behaviors and needs. Other trends include multimodal HMI systems that leverage multiple interfaces, in-car companion robots (cobots) and interconnecting the automotive HMI to a user’s mobile app.

Strong HMI design can strengthen the driver’s relationship with the vehicle and improve the car’s value. But getting HMI right is challenging and requires a sophisticated understanding of emerging technologies and design best practices. While the aim of HMI is to enhance driver safety and improve the experience for drivers and passengers, too many bells and whistles in the car “cockpit” can become a hindrance. Other common challenges when it comes to designing HMI are reflecting regional differences across automotive HMI, rolling out HMI updates quickly and cost-effectively, and educating drivers about features to increase adoption.

HMI design process overview

At Star, we use a proven process to overcome challenges and design game-changing HMI technology for our partners, from digital dashboards to award-winning cobots. Here’s our process overview.

Note: the process below applies to a typical visual touchscreen interface. Increasingly, in-vehicle HMI encompasses multimodal communication, including voice and voice assistant control, audio feedback and touch interfaces, such as hard key controls, haptic feedback and more.

For the inside scoop on how Star designs cutting-edge multimodal human-machine interfaces, drop us a line.

Phase 1: Research

We start with desk research to understand your brand and end customer and combine it with our knowledge of automotive HMI trends. We define who we are designing for, what value propositions we will address, and how we will unify the experience across car models and screen sizes.

We are always sure to assemble a cross-disciplinary team of experts to research and test automotive HMI design concepts that make use of emerging technology, HMI design best practices, and our client’s unique needs and objectives. We also keep the user at the heart of everything we do.

Typical output includes:

Competition analysis, UI architecture and structure ideas, driver profiles
Remote or in-person visual design workshop
Visual directions that define the general design intent
Refined UI structure and framework ideas – how we support screen sizes, layouts and screen orientation
User validation sessions

Phase 2: Interaction

Next, we dive into interaction design and create a high-level clickable prototype to ensure we are aligned on the concept and to visualize how users will engage with in-car interfaces. One cannot develop in-vehicle UX in a vacuum. We detail first and second-level screens and information architecture and consider how we can connect them for a more seamless end-to-end HMI experience. We also start with components library definition so it is clear what type of screen layouts we might need.

Typical output includes:

Lo-fidelity wireframes of core modules
Alignment workshop around interaction design
Ergonomic and accessibility testing (internal)
Finalized information architecture and UI layout

Phase 3: Visual & Library

In this final phase before project delivery, we complete user-friendly designs for all system screens and address every component and module. We also create a consolidated UI elements and page templates collection to make subsequent engineering phases simpler.

Typical output includes:

Final UI and visual design delivered via Figma
Theming approach explained and tested
All functional screens for all modules
UI components library
Screen templates library
Cross-language check

Phase 4: Motion

Another part of the Star process is creating a motion framework that includes every component of the automotive HMI design. This step happens in parallel to the Visual Design phase. The aim is to ensure a continuous experience loop in which we apply the same motion principles to all UI elements.

Typical output includes:

Animation for core components (buttons, labels, etc.)
Storyboards for transformable components (gages, widgets, cards, etc.)
Motion sequence files in After Effects
Motion parameters for the development team (values and guides)

Phase 5: Implementation

This is an ongoing phase in partnership with your team to ensure 1:1 implementation of our design, correct UI components usage and “atomic model” understanding. In this stage, we support any change or redesign request to align with implementation capabilities. We also continually consider the end-user and challenge ourselves to be sure their needs are met.

Typical output includes:

Ongoing visual and interaction design support
Design guidelines document
Adapting design scope, features and layout to meet any internal engineering deadlines
Quality control via development output review and testing

HMI design steps and best practices

To today’s customer, in-vehicle UX matters as much, if not more than the car’s exterior. Let’s take a look at some of the HMI design best practices and principles we consider throughout the HMI design steps.

User-centric by default

Star deploys an iterative design process in which we focus on users and their needs in each phase. For all of our projects, including automotive human-machine interface innovation, we seek ongoing feedback to make sure we are creating highly usable and accessible products with HMI technology that empowers, never hinders.

Know your audience – and your competitors

Effective automotive HMI design is impossible if you don’t understand the end-user. Desk research is an important part of our process and one in which we couple industry and trend expertise with deep user understanding. As important is an understanding of the competitive landscape so we can build HMI technology that differentiates your vehicle while reflecting best practices. As such, Star always performs a detailed competitive analysis when designing HMI.

Think cross-screen, region, make and model

In addition to considering the problem at hand and user needs and preferences, Star considers how we can translate and unify the HMI experience across vehicle makes and models. Our team also stays up-to-date on automotive HMI trends across regions and markets. It helps that we are a truly global team, operating from 14 locations around the world.

HMI design principles: stronger together and utter transparency

Collaboration is one of our hallmarks. We invite clients into every step to be sure we understand your objectives and end customers.

Modular approach

Star considers all system screens, components and modules when building automotive human-machine interface. To ensure consistency and simplicity, we create a library of design and UI elements that includes page template collections. We take a modular approach so it is easy to adjust and update HMI based on the region or car model.

Star: your end-to-end partner

Our proven automotive HMI design process is part of what makes Star unique. But it is not our only differentiator. By connecting strategy, design and engineering into a seamless workflow, we deliver impactful, innovative technology products. And, by adopting a startup mentality, we can maximize resources and deliver results fast.

From co-designing an award-winning cobot with NIO, to designing next-gen HMI for consumers in India and Thailand, our automotive expertise is vast and global. Our offerings include designing HMI and infotainment systems that raise the bar, creating easy-to-use applications and services, and building integrated mobility and vehicle platforms.