Tesla Interface Concept

Inspired by the 17 inch touchscreen of Tesla's awesome Model S we designed an interface concept for a new generation of car infotainment systems. Our concept uses responsive widgets that can be rearranged on a flexible grid. The widgets are available in multiple sizes and can freely be combined for a customized user experience.

Tesla@2x-1

The Grid

The entire layout is based on a flexible grid that allows for a variety of different widget sizes.

01-Grid@2x

The Widgets

Important buttons and touch-areas are big enough to allow for a precise navigation while driving.

02-Widgets

Drag'n'Drop

The widgets can easily be rearrange on the screen by dragging and dropping them.

03-drag-and-drop-1
04-save-screens

Save Screens

Multiple screen layouts can be saved and managed through a dropdown menu in the statusbar. 

Hitting the startscreen button always takes you back to the customized startscreen.

Pinch to Zoom 

The widget size can be adapted either by hitting a button or using a “pinch to zoom” gesture.

05-pinch-to-zoom-1

Climate Control

Temperature and climate control buttons are always available at the bottom of the screen.

06-climate-control-1

Car Controls

The main car settings for lights, doors, sunroof, etc. can be reached through the “Controls” button.

07-car-controls

Navigation

The XXL Navigation widget supports a split screen mode to show two maps at once.

08-navigation-1

Screen Layouts 

The flexible grid allows for countless screen layouts and automatically anchors the widgets in place.

09-screen-layouts-1
09-screen-layouts2-1
09-screen-layouts3-1
09-screen-layouts4-1

Various Themes

Additional themes include a white version and a night mode.

10-various-themes
10-various-themes2

3rd Party Widgets

The preset widgets can be combined with additinal 3rd Party widgets. 

11-3rd-party-widgets-1