Infotainment System

Overview

The infotainment system of Google and Mercedes shows, how the design of a infotainment system has to change according to the coporate identity. The project was realized as part of a study about the connection between trust and design for infotainment systems. <br><br>As design base, multiple companies could be selected. But I went for Google and Mercedes, to get two very different approaches of designing a app. <br>After the briefing, the project was made up of two tasks: Icon design and screen design.

Concept

A wireframe of the infotainment system.
A screen of the prototype for the infotainment system.

The project was conducted as part of a study. For that, I worked together with two students from a higher semester.My elder colleagues made the concept for the infotainment system, so then the task of the younger semester was to make a design.

Out of all infotainment sytems, the best were selected by the professor to be part of a usability study. The study was a combined effort by the Washington University in St. Louis and the Technischen Hochschule Ingolstadt.

In return, the older semesters were also composed as teams. The people that gave me the design later chose it from four to six other screen designs to implement as prototype.

Icon design

The icons were designed, so that suited the coporate identity of the companies. It was very important for a consistent look.

The finished icons, which were used for the Google screen design.
The finished icons, which were used for the Google screen design.
Sketches of the icons as base for the Mercedes screen design.
Sketches of the icons as base for the Mercedes screen design.

The project was conducted as part of a study. For that, I worked together with two students from a higher semester.My elder colleagues made the concept for the infotainment system, so then the task of the younger semester was to make a design.

Out of all infotainment sytems, the best were selected by the professor to be part of a usability study. The study was a combined effort by the Washington University in St. Louis and the Technischen Hochschule Ingolstadt.

In return, the older semesters were also composed as teams. The people that gave me the design later chose it from four to six other screen designs to implement as prototype.

Screen design

Based on the prototype I developed a grid. This grid was then used for the screen design.

Construction of the grid with sketches.
Construction of the grid with sketches.

First I studied how the different companies presented themselves via design. Then I came up with different adjectives to describe this asthetic choices: Google shold feel bright, clean and friendly. Mercedes should come across as dark and luxurious.

Both designs should follow flat design, so I decided against using material design (like brushed metal for Mercedes).

WIP

The first version of the screen design for Google.
The final version of the screen design for Google.
The first version of the screen design for Mercedes.
The final version of the screen design for Mercedes.