Mini Head-Up Display

Designing a head up display for a city car.

Brief

The goal of this design project was to design a head-up display (HUD) for a specific car. The HUD should be tailored to the car's style and primary use case. We decided to design a HUD for the Mini, a car we both like very much and use often through the car sharing service Drive Now.

Research

We started by looking up the current Mini model at the local dealership. There we talked to a clerk who told us a little bit about the people who buy a Mini: Young (25-35), primarily male and living in cities.

This gave us our primary user and our primary use case: Short trips in town.

Use Case

The mini is a city car. It is mainly being driven in an urban environment by young people. What's really important when driving in a city? We arrived at a few basic functions that are key:

  1. Speed & speed limit: It's important to know how fast you are going and how fast you are allowed to go. Especially as the Mini is quite a sporty car to drive it's easy to reach and go past speed limits in the city.
  2. Navigation: Cities can be big and it can be hard to find your way around. Having the navigation in sight while still being able to concentrate on the road can make a big difference.
  3. Communication: People like to talk on the phone while driving. When a new call or text comes in it's good to see who it is from. It might be about that meeting you're driving to right now. Though it should be made very clear that the head up display should only be show an indication of who is calling or texting, it should not display the text message itself as that would be very distracting.
  4. Entertainment: The car is the place to list to music, podcasts or just the radio.

Sketching

We had identified the main functions a normal Mini owner would like to have in his head up display. Now we started sketching.

Early sketches show 5 selectable options instead of just 3.

Early sketches show a wide number of features we wanted to put into the HUD which we eventually narrowed down to make it simpler.

A sketch illustrating the input options on the steering wheel.

Design

After a some iteration we arrived at a solution that was much simpler than the earlier designs and it now features the 4 main functions: Speed & speed limit, navigation, communication and entertainment.

1. Speed & Speed Limit

On the left side of the HUD there is the display for current speed and the speed limit. The current speed is the biggest font size in the HUD in order to be easily readable even at high speeds and with reflections from the road. Around it is a ring segment which mimics the tacho from the dashboard but with one key difference: It shows the current speed limit, both as a stylised version of the road sign (at least how they look like in Germany) and as a little dash on the tacho itself. If the driver goes faster than the speed limit, the amount over is displayed in red.

Speed limit: 50 km/h. Current speed: 56 km/h.

Speed limit: 100 km/h. Current speed: 89 km/h.

2. Navigation

The circle on the right of the HUD displays the currently selected option. If navigation is selected, the ring displays: an icon that indicates the next turn, the distance to the next turn and the ETA.

3. Communication

If a call comes in the ring on the right displays the callers ID and the length of the call in minutes. Should it be necessary the navigation ring can take over again to inform the driver about a potential turn and then jump back to the call. Once the call is ended the navigation ring takes over again.

4. Entertainment

Switch to a new station or skip to the next song: The HUD will display the new song or the new station for a moment and then go back to navigation.

Video Prototype

The best way for me to visualise the concept was through a video prototype. This way I could show a scenario of driving in the city with the navigation on while receiving a phone call.

In this version I chose to visualise the HUD in a way that the focus point is the same with the windshield. HUDs normally have the same focal point as the road, so the driver doesn't have to refocus every time he or she wants to look at it.

There are HUDs though that have their focal point right on the windscreen and I chose to design with that restriction in mind.

Learnings

The best way for me to visualise the concept was through a video prototype. This way I could show a scenario of driving in the city with the navigation on while receiving a phone call. Putting the design in context (the windshield) really helped to make clear what works and what doesn't work.

Bright colors (like white and light green or yellow) work best as they are the most visible even in sunlight. Dark colors (black, grey, navy etc.) cannot be displayed in a HUD.

As there are no screen boundaries in a HUD the layout of elements in the HUD needs to be designed with that in mind.

You can find out about the other projects from this course here.