header-new

Designing a next-gen HMI for consumers in India and Thailand

Client

SAIC OIMT

 
Website

mgcars.com

Industry

Automotive & Mobility

 
Service Line

Digital Design

Overview

SAIC OIMT is a software development company for vehicle brands invested in by SAIC Motor – the largest automotive manufacturer in China, and the seventh-largest car manufacturer in the world. The company produces over seven million cars annually. MG Cars, a subsidiary of SAIC Motor UK, is a redesign and relaunch of the classic Morris Garages car brand. The new line of cars caters to the millennial driver, is 100% electric and uses state-of-the-art EV-technology.

hmi design mg cars - star case study

✓ Winner of a 2021 A’Design Award

✓ Successfully conducted live user testing in target markets of India and Thailand

✓ On-time delivery of a new HMI design to coincide with car production and launch in September 2019

✓ MG Cars with Star’s new HMI design are now on the road in India and Thailand

✓ New HMI design to be implemented across all MG product lines, including in the European market

The idea

SAIC OIMT approached Star with a daunting request: design and build a production-grade HMI in five months – without changing the vehicle’s hardware! The team needed to design the digital UX for a vehicle that was already in the assembly line, without touching any physical components. To further add to the task’s complexity, the HMI needed to cater to the Indian and Thailand markets.

hmi car design - mg cars

Project

The goal of the project was to create an HMI design that would meet the digital needs of young consumers in the two target markets. The design should embrace new technology trends centered around connectivity, digital touchpoints and smart assistants. The interface should be intuitive and strengthen consumers’ emotional relationship with the vehicle and the MG brand. 

The new design should harmonize with the MG brand’s visual design, which is present across the entire MG product line globally. 

The Star team set to work. The first step involved understanding market trends and competitors. Then the team conducted on-site ideation to understand the customer journey and quickly prototype core interaction frameworks. Equipped with three solid interaction concepts, the team then joined forces with SAIC’s innovation team to work on the visual concepts. Together, they produced six different design directions, tested these internally and selected three finalists. Now it was on to the target markets to test the prototypes in the field. Once SAIC had selected a final design direction, Star team developed a detailed visual and motion design, based on the vehicles’ function modules and the information architecture the team had created.  

Star’s approach ensured that the UX flows were finalized and validated and that all UI kits were ready for engineers to implement and develop. And what was the final result? MG Cars, equipped with the brand-new MG iSmart Infotainment System, are now on the road in India and Thailand.

Testimonial

“The Star team showed the utmost professionalism and creativity in their approach to this project. We were impressed by how quickly they were able to get up to speed with our business and develop an understanding of our target markets. They delivered to project specifications and according to the deadlines we set. They were a pleasure to work with.”

Mr. Sheng Jie Huang 

Senior Product Manager at SAIC OIMT

Scope

  • Market and user research
  • Target user profiles
  • UX wireframe creation
  • Information architecture solution
  • Visual design concept creation
  • Interactive concept prototypes
  • Concept user validation
  • Detailed UI design
  • Motion design

More
Cases

NIO

Co-designing the world’s first in-car companion

Lufthansa

Teaming up with Lufthansa Group to co-create a new premium travel experience

Loading...
plus iconminus iconarrow icon pointing rightarrow icon pointing rightarrow icon pointing downarrow icon pointing leftarrow icon pointing toparrow icon pointing top rightPlay iconPause iconarrow pointing right in a circleDownload iconResume iconCross iconActive Badge iconActive Badge iconInactive Badge iconInactive Badge iconFocused Badge iconDropdown Arrow iconQuestion Mark iconFacebook logoLinkedin logoLinkedIn logoFacebook logoTwitter logoInstagram logoClose IconEvo Arrowarrow icon pointing right without lineburgersearch