Are new app designs deviating from conventional (better?) Interaction designs?

Question

I am on the 3rd chapter of Joshua Clark's Tapworthy : Designing great iPhone apps

And I was really taken aback by the first few pages. In these first few pages Joshua Discusses the "thumb hotspot" i.e area of the iPhone screen over which the thumb can wander without being stretched or squashed.

He also shows some examples like this ToDo list app :

The standard iPhone toolbar and tab bar always go at the bottom edge of the iPhone screen in convenient thumb-tapping range. ToDo list app Things puts the Edit button at top right safely out of accidental tap range .

New app interfaces clearly deviate from this . For example apps like Vine and Google+ and others Place navigation controls at the top left corner

which clearly is not in the "thumb tapping" zone. Is this a good or a bad thing ?

On a similar note , considering Google Drive's iPhone app

IMO adding (+) a file is a more frequent and important function than refreshing . Still the app has (+) button away at the top right corner (out of the thumb zone) and refresh button at the bottom left (inside the thumb zone) which clearly contradicts with the ToDo list app example.

To be honest I find tapping the (+) button at the top right easier than bottom left refresh button. So, What's up?

I can't question the credibility of the book, since it's a bestseller and Joshua Clark is a really talented and well known interaction designer.This book was published in 2010, have practices changed in three short years ? I hope not. It'd be great if someone can pull me out of this mess. Thanks

Answer 1

Google doesn't always make the best or consistent UX decisions. Their Google Voice application (which I assume is created by an entirely different team) has "New" and "Refresh" buttons at bottom-left corner.

But I agree with you, putting the "+" in the top right corner is poor usability for frequent-user of the app. However, it does make the button stand-out more. So more likely than not, Google learned that first-time users were rarely uploading anything. So they made a business-driven UX decision to make the "+" more prominent by putting it at the top right corner.

With that said, when the book was published, iPhone's 3.5" was the most common screen size. It also happened to be just small enough that one-handed operation was feasible by just about everyone, which led to people coming up with ergonomic guidelines for one-handed operation.

Fast forward 3 years.

Screens are not only much bigger, but they're also taller. Comfortable one-handed operation of most new smartphones is simply out of the question for a majority of population. The old guidelines no longer apply, because the large variance in device size no longer guarantees people are using their phones in same way.

So creators are taking more liberty with designs, which is a great thing.

Answer 2

What I've learned from observing some mobile usability tests: Don't care too much about "thumb hotspots".

Which areas of a smartphone display are more accessible differentiates a lot from user's individual abilities and habits. As there are:

1. Individual phone holding: Some users are holding their phones more at the bottom, others at the phone's mid. The "thumb hotspots" Joshua describes are shifting then too.

2. Hand sizes: As a righty with average male-sized hands, I can reach all four corners but the bottom-right is more uncomfortable for me as it's covered by my thumb. For my girlfriend's smaller hands, the upper-left is much harder to reach.

3. Left or right-handed: As it speaks for itself, you can't predict which side is better to reach as it depends in which hand the user is holding the phone.

4. Hand movement abilities: Especially older people aren't able to move their fingers in any directions. Some have problems stretching them, other have problems to bend the thumb.

Finally, you shouldn't forget that users have learned to be more flexible and are pretty fast in changing the phone's position to reach a button. I recommend to observe a few people while using their phones. Just ask them to make a few moves with the facebook app (or whatever app they're familiar with) and you'll see how playful they are dealing with these challenges.

Answer 3

I will start by questioning the thumb zone depicted in the first image. iPhone is specially pre 5 (which the book will be talking about) is small. A normal adult will be able to cover 3 corners - two bottom and top depending on which hand they are holding the phone in, if not all 4, easily.

In terms of reach, I will classify the zones in tearms of easy of reach.

^{download bmml source – Wireframes created with Balsamiq Mockups}

Now, the difference between the top and the bottom is: The entire bottom bar is within read of a person's thumb (by tilting the phone is need be), but, the top bar is a bit tricky, it can be within reach, but, might need a bit more maneuvering to reach all the corners.

Now, I have seen both, the top and bottom bar being used as navigation bars. If you look at the native apps like phone, calendar, etc. the bottom bar acts as the navigation between different modes (favorites, recents, contacts, etc.) while the top bar is used for actions (adding, editing, deleting items, etc.)

Regarding the + button placement. I would say that since the title bar is already being used and has no other controls on it. The + icon does not fit in the 'navigation hierarchy' and hence rather than grouping it together is left alone in the title bar. A similar result is also seen with 'Search' functionality. Many apps have it in the title bar (like IMDB).