Google’s New Mobile Tab Interaction

It’s always interesting to observe how regular desktop web interactions can be translated to mobile. With the launch of Google+ with accompanying mobile web app, Google has changed the tab bar along the top of their mobile web apps. At first sight, they seem to have shrunk significantly:

When looking more closely you notice an orange thing at the top right. What’s up there? To find out you can swipe the tab bar downwards:

As it turns out that each tabs is accompanied with a giant product icon that creates a large enough touch surface to select it even with the thickest of fingers. At the right there’s the Google+ notification counter with a “More” area. When you select it, it slides down and shows more Google products.

As it turns out, this “More” section contains sub-sections of its own: “Search”, “Apps” and “Notifications”. When selecting “Notifications” a list of Google+ notifications appear that can be acted upon:

Note that all this action takes place in the tab section of the screen. At the bottom of the screen, you can still interact with Gmail as usual. This is Google’s mobile version of the pop-over it uses in the desktop browser versions of its applications:

A clever solution that works very well in practice.