Actually multitouch tables are designed to work completely intuitively. Unlike standard touch screens, the multitouch technology allows for use of more than one finger for controlling the screen, thus enabling interaction with gestures. Such a user interface is also referred to as a Natural User Interface (NUI) because elements of that interface can be handled like real-life objects.

The most common and intuitive gestural patterns to use with multitouch tables are depicted below.

To imitate a natural environment on the multitouch table, content elements should be movable, rotatable and scalable with these gestures.

This is particularly important for multi-user tables like the Microsoft Surface

that allow multiple users to control the interface from any side of the table at the same time. Users can then simply drag the element closer and rotate it to view it properly.

Some applications would work just like this without any buttons, scroll bars etc. that one knows from applications that work with hardware interfaces like a mouse or a keyboard. Even those using it for the first time would intuitively know how to interact with it. Jeff Han already explained this principle 3 years ago at the TED conference (still worth watching).

However, some applications can be so complex that they cannot be used with the standard gestures alone. You might want to hide extensive details somewhere or need to give the user advanced controlling options to adjust tools or forms.

One would then either have to work with gestures that have to be learned by users, or with designs that tell users how to interact with the respective element. Users usually do not have time for the former, unless it is a game or they really need/want to work with the application, so let’s start with the latter.

Starting Interaction

How do you get users to start interacting with a multitouch screen? People still might not be very familiar with gestural user interfaces, so merely telling them in big letters to touch the screen with a big hand image next to it would be the most obvious solution. They would then definitely know how to use the screen, but would they actually do it?

A better approach is to display a surface that users cannot resist touching. For example, an animation of a water surface or colliding bubbles. In this way, you can at the same time get users to utilise and understand the interface of the application.

Microsoft Surface Water Sreensaver

Flip

You want to hide details of a content element or you have several pages of content to place on the screen. Put it on the back of a content element and tell the users that they can flip it through tabs.

If the “details” are very important to you though, make sure you add an eye-catching button to the element.

Some applications use the round arrow to flip elements. I do not find this to be appropriate because users also know it as an icon to refresh content.

Minimize

Too many elements to show on one screen? Minimize them anywhere along the edges of the screen. Users can simply toss them to the side if they don’t need them, or drag them back if they do.

Click

Although everything on the screen is interactive, users still need to know which elements cause a special reaction. It might look old school, but button-like forms tell the users clearly what is clickable and what is not.

By Infusion

Glow

Want to combine two elements or drag one element into another? Give the user some sort of visual feedback to indicate that the elements can be combined. For example, a glow around the object or elements gravitating towards each other.

Switch

The user has to activate/deactivate options. With a keyboard/mouse interface, this is usually solved by checkboxes. However, on a multitouch screen, it feels strange to create checks with your finger. A switch is known to users from appliances and feels much more natural to use for this purpose.

Sliders and knobs

If you want an option to be adjustable without any step or with many steps being necessary, a slider would still be a good way to do this – as it is with a mouse-controlled interface.

By Design Affairs

A rotary knob can achieve the same thing but the spinning gesture can be inconvenient, especially on small objects. Tangible objects are the solution for this. Most multitouch systems can recognize the form and movement of tangible objects if they touch their surface. For example, a cylinder can be placed on the multitouch screen to imitate a rotary knob. The system recognises the object anywhere on the surface and can arrange information around it.

In use, the tangible rotary knob turned out to be the feature with the highest joy of use.

By Neue Digitale

Further Links:

YouTube playlist of multitouch applications

Bill Buxton: Multitouch systems that I have known and loved

Fast Company: 11 Killer Apps for Micrsosoft Surface

Recommended Reading: Designing Gestural Interfaces