Ingenious Touchscreen UI for Cars

An Ingenious "Eyes-Free" Touch Based Interface for Cars

Cars these days have a lot of features built in to “enhance the driving experience”. Radio sets, central controls, GPS navigation, CD players… and for every new feature that’s added into the central console, there’s an ugly, unintuitive, horrible user interface. On one hand you might have knobs, buttons and dials that can be used without looking, or you can have a touchscreen interface that’s a but better to look at, less clunky, but requires you to take your eyes off the road. There’s always a tradeoff between form and function, visual appeal versus ease of use. 

Touchscreens today

Touchscreen Interfaces on cars these days, too similar to the button/knob paradigm that preceded it.

Touchscreen Interfaces on cars these days, too similar to the button/knob paradigm that preceded it.

The touchscreen interfaces found on cars today are Skeuomorphic. They adhere to the same layout, the same design language and basically the same way of interaction as the preceding standard, buttons-and-knobs, changing only the input method, which is the touch screen. Skeumorphism is not a bad thing in and of itself, Resemblance to real world objects helps understand and learn things better, as is seen in smartphone operating systems today- iOS and android use icons, text and buttons to great effect. 

However, there is a great difference in the usage scenario here. Smartphones can get away with skeumorphism because the user of the device looks at the display, and not anywhere else, while operating it.

While driving a car, the driver’s attention needs to be on the road. Touchscreen interfaces, in the form that they are in today, can’t simply be ported over for use in automobiles.  Virtual buttons and knobs offer no tactile feedback, and the user needs to search for the button every time.

A new solution

Designer Matthaeus Krenn has created a touch based user interface that can be operated completely without

 A car UI that departs from traditional skeumorphism

A car UI that departs from traditional skeumorphism

having to look at it. Instead of buttons, icons, text or menus, the interface is based on the number of fingers used to touch it, and some gestures like pinching and swiping.  Dragging upwards with two fingers turns up the volume; dragging up with three changes the audio source. Four fingers controls temperature; five for airflow. Each has a unique sensitivity based on its function and can be triggered starting anywhere on the touch surface. Moving up or down with your fingers spread a bit wider offers an additional set of controls. All eight of these can be remapped to the driver’s preference.

This new UI seems totally built from the ground up specifically for touch devices. However, it will take some time and effort for users to train themselves and learn this new interface, something which the designer himself admits needs to be addressed in future iterations. The application is currently available only for the iPad, and can be downloaded here.

In the future…

This focus on building a new touch interface from the ground up is a welcome change, and a step in the right direction. New control methods can offer exciting advantages previously impossible. But they also come with their own set of challenges. 

Augmented reality is another aspect of human computer interaction that looks promising. A user interface that combines both touchscreen technology and augmented reality may very well be the way we interact with our cars in the future. Critical information popping up on the windshield of the car, or Heads up displays found in Sci-Fi movies and video games may not be a fatfetched prospect. The only issue here is that augmented reality displays on car windshields may distract the driver, defeating the purpose of it all.

What do you think is the future of automobile interfaces? Let me know in the comments!


stLight.options({publisher: “2814c680-1ca3-4692-a110-0627022150af”, doNotHash: false, doNotCopy: false, hashAddressBar: false});

var options={ “publisher”: “2814c680-1ca3-4692-a110-0627022150af”, “position”: “left”, “ad”: { “visible”: false, “openDelay”: 5, “closeDelay”: 0}, “chicklets”: { “items”: [“facebook”, “twitter”, “googleplus”, “stumbleupon”, “pinterest”, “digg”, “reddit”]}};
var st_hover_widget = new sharethis.widgets.hoverbuttons(options);

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s