Turning the Page: Creating Natural-Feeling Touchscreen Interactions

Creating touchscreen user experiences (UX) that feel natural is an obsession here at ICS. When I say “natural” I’m referring to a comfortable and effortless touch and/or speech interaction experience. This is the definition of a Natural User Interface (NUI) —  and creating this type of experience should be the goal of any touch-interface designer.

But, achieving natural-feeling interactions is a significant challenge.

Natural. Comfortable. Effortless.

The concept of natural-feeling interactions is probably one of the most confounding in contemporary UX design. Designers are apt to say, “I know it when I see it” but are hard pressed to define the elements that add up to a multimodal UX that feels natural to use.

So, let’s clear things up.

The main difference between traditional graphical user interfaces (GUIs) and NUIs is the use of sensory interaction modalities, including touch and speech. With a GUI you use a pointing device like a mouse to interact with buttons and menus in order to access content. This works effectively with a mouse because it has precision, but can feel awkward and tedious using touch.

But with a NUI, the goal is to make touch and speech interaction comfortable, and interacting with the content directly is easier than tapping buttons and menus. When well executed, NUIs bring us closer to the sensations we experience when interacting with the non-digital world.

Achieving Natural-Feeling User Experiences

Natural Interaction is not about mimicking physical reality; it is about making it easier for users by employing their native capabilities that humans use to interact with the physical world. Hands are much more flexible than mechanical pointers like the mouse, capable of swiping, flicking, pinching and using various numbers of fingers.

So, when we set out to develop a touchscreen page-turner feature — check out the clip below to see what I’m talking about — we were not trying to recreate a physical book on a computer. We were not trying to create a good reading experience, like a Kindle does. What we were trying to do was provide the sense of paging, since turning pages is a comfortable, pleasurable human gesture. And, we wanted to avoid any strangeness — remember awkward and tedious? —  that took a user’s attention away from the content.  

To achieve a page-turning feature that’s as natural as possible we went through several iterations. Below you can examine a few of these iterations that were part of the development process.

Early iteration: The paper feels weightless, massless and very malleable. In a book format it feels strikingly odd. For instance, the pages are too flat as they move across the book and are hard to control.

Mid-development: The paper is now very stiff and feels thick and heavy. It’s harder to understand this version without actually trying it on a touchscreen, but each page feels as though it weighs a ton and it keeps it’s shape too much as it moves from left to right. Plus, the inertia of the pages to stay in place is too strong.

Current version: The first clip above showcases the version we are using at the moment. While not perfect, it offers a nice balance of page weight and inertia, and it feels comfortable. Almost like turning pages in an actual book.

Creating natural-feeling user experiences is extremely challenging. But, it is possible to define the elements that make up such an experience. I’ll explore the subject in more detail in upcoming blogs so stay tuned.

If you’d like to learn more in the meantime, check out Want to Create Touchscreen Layouts that Feel Great? Embrace Human Movement Patterns and Virtual Tactile-ness: Creating Engaging User Experiences.