Left-to-Right UX
Posted
Listen to this post
Google Fit is a pretty ok tool. However, its weight entry screen is awfully deigned. The worst part about it is that they tried to be clever, but in doing so just made it worse.
Here is a quick example. I’ve gone from 91.2 kg to 90.8! Watch me try to enter it into the app.
Did you see that? When I was setting the tenths of a kilo it adjusted the kilo column “for me”. Now I have to go back and move 89 back to 90 (if I was perceptive enough to notice).
It seems clever, I could have just moved the tenths column up 4 to adjust my weight. It would have been easier! Most people’s weights don’t change rapidly, so most of the time that is all you need to do.
But the problem is that as an English-speaker I read left-to-right. So naturally I start at the left and read out “ninety point eight” as I first set the kilos column to 90, then set the tenths column to 8. By the time I get to the tenths column the kilos are already correct, so the “helpful adjustment” is harmful.
This is similar to address entry-forms that put “country” at the bottom, then reset the form and rename all the fields when you change it. If the other fields depend on the value of country it should come first, which for most locales is the top-left of the form.
So what is the best option here? We can’t swap the columns, that isn’t how we write numbers. I can think of a few options but none of them are excellent (and a few are fairly bad). Like all UX, the only reliable way to do a good job is to watch actual users try to use it. So let’s brainstorm a few ideas that I would experiment with.
Unlink
Just unlink the dials. The user can first set the left one then the right one.
Number Input
We could switch to a regular keyboard number input. This is a good option for most numbers, but since the app knows your previous weight, and your weight usually doesn’t change a large amount the dial interface may be more convenient.
Join the Dials
Instead of having two separate dials just have one. Then the user will understand how they move. This could be annoying if you need to change the value far away from the initial input but for a weight tracker that is unlikely to be a common occurrence.
Interaction Tracking
Don’t do the adjustment if the user has already touched the dial. This way if the user does move the right dial first they get the shortcut of only moving one dial, but we don’t mess up their input if they already set the left one. The downside is this may be confusing. It isn’t clear to a user why sometimes the right dial affects the left one, but other times it doesn’t.
Remove Wrap-around
A core source of the problem is that the numbers wrap around. I can go from 9 to 0. If we remove this wrap-around then we avoid the whole issue. The problem is that users probably expect the wrap around. Most dials in the real world (like combination locks) wrap, why shouldn’t this one?