Automotive HMI Dashboard & Controller Apps Design Concept.
Overview
This is a case study showcasing a dashboard and connected control app design concept for vehicle HMIs. Here I created a fully digital, distraction-free autonomous in-car experience. I showcased concept designs for a vehicle dashboard, a vehicle controller mobile app, and a smart-watch application.
Research Findings
Every good product out there is built on the foundations of solid qualitative and quantitative research. With the little time, I had to work on this project, I started by delving into the world of HMIs (Human Machine Interfaces), went further to read up on the latest trends in the automobile industry, and finally talked to some close friends about their experiences with automobile HMIs (getting to know user pain-points). I highlighted some of my findings as this informed my design decisions.
1) HMIs are interfaces that allow users to communicate/control machines; in this case a vehicle. It also allows one to get feedback or know the status of instructions given to that machine.
2) To delve more into the subject of this case study; Automotive HMI **enables drivers to communicate/control their vehicle via touchpads, buttons, or speech systems without getting distracted.
3) Some of the trends in the industry are; Advanced driver assistant systems (ADAS), Augmented reality Head-ups displays, Voice control systems, and Gesture controls.
Here are some of the feedback I got from some user experiences
1) A need for a more automated system, they want to be able to communicate with their vehicles from different devices e.g. mobile phones, smart-watches, tablets, etc.
2) Most users prefer a more futuristic interface design.
3) They want systems that prioritize their safety.
N.B: These are feedbacks from a handful of people, more thorough research might be needed to validate some of these findings.
The Solution.
The findings from my research gave me insight into the way I should approach the designs. I started with a mobile app controller that allows a user to perform important functions through their mobile, like unlocking and locking their vehicle doors, starting and offing their engines, etc.
Let's dive right in.
Mobile app car controller
I started with an onboarding screen, which introduces the user to the app, and what the app does. I designed the app using a futuristic and elegant approach.
This next screen allows users to perform the actions they would take to use their cars, which is to unlock the doors and start their engines. A minimalistic approach was used here, only the desired actions were allowed on the screen, Also users can see some info about their vehicles like; fuel level, estimated kilometers the vehicle could take them, and weather conditions.
Next, the user is able to access functionality in fuller detail, e.g. speedometer, fuel gauge, map system, weather conditions, and mileage.
Users can access a map system and plan their journey routes, this is synced with their car system and displayed also on their vehicle dashboard.
Given the time available to work on this case study I was only able to design these few screens, but not without working on a prototype on Figma to show how the app works.
Smart-watch app car controller
Just like the mobile app design, I started with an onboarding screen that introduces the app to the user.
Smart-watch app design forces one to be very intentional with the element placed on the screen. A minimalistic approach was used here, prioritizing only the important elements.
Users can off their engines, see their fuel levels, access their map system, see their speedometers and check weather conditions
Here is the map system for users right on their smartwatches.
I also worked on a Figma prototype for these screens.
Here is a futuristic HMI design for a vehicle that meets the needs of changing passengers. A minimalistic and elegant design approach was used here giving the users that luxurious experience.
Style Guide
I was intentional about my choices of color and typeface; I used a bright color for the main actions like starting or offing an engine etc. because it is attention-grabbing. Also, I want the designs to have an elegant and futuristic feel, and the Neue Machina typeface was just perfect, while I supported it with Poppins which is a more legible typeface.
Final Notes
The HMI industry is a growing market with a projected increase from $4.3 billion in 2020 to a whopping $5.6 billion in 2025. Most especially the automobile HMI industry is constantly growing with new innovative systems and solutions and as such it's a very profitable industry to niche down in.
I had a fun time working on this and I will be creating more solutions for this industry. Thank you for reading.
