FutureCalc: radial mobile UI as a possible future
Some time ago, inspired by C. Y. Gopinath’s How I moved from a square to a circle, I decided to give it another try and redesign the numeric keypad from scratch. Only this time specifically for the mobile UI.
Firstly, a bit of a high-level view of the problem. I think we should agree that handheld devices, such as remotes and mobile phones, pose a UI/UX problem: put simply, they are not very convenient in operation when used with only one hand, despite that they are meant to be used single-handedly.
For example, a typical TV/DVD remote has so many buttons that it can’t provide easy access to all of them. You either reposition the device in your hand to reach the top and bottom keys, or sometimes just use both hands. That’s why more or less good remote designs tend to group most frequently used functions in the middle or top-middle part of the surface.
In fact “good design” in this context is very relative. I think the remote controls in general are in need of a major design overhaul/disruption in their own right. This whole industry at the moment reminds the pre-2007 era mobile phones.
Speaking of which, Nokia and the derivatives: enter another class of handheld devices that in addition to keys also have a screen.
The natural choice at the time was to put the screen above and the keys below it. That, however, essentially made this entire class of devices a bit uncomfortable to use despite their reasonable overall size. The reason being, the keys at the bottom can be, again, a bit tricky to reach.
(Actually, I’m wondering if anyone ever thought of turning it upside down, i.e. keys at the top (maybe top-middle) and the display at the very bottom. Might not necessarily be such a bad idea. Take your good old Nokia and imagine the display residing at the bottom and the keypad above it. You will see that the screen would always be perfectly visible, and the keys perfectly usable too. Seriously.)
But let’s move on to the next class: touch devices. Now the entire surface is the screen and the control panel at the same time, and the device is also wider than the remote and the previous generation mobile phones. Let’s now look closer at how we use these devices specifically when we want to do it with one hand, not two.
There is one method that we use occasionally, let’s call it a “light grip”, when you just lightly support the back of the phone with your 4 fingers, while your thumb gains access to pretty much the entire screen relatively easily. Sometimes you support the bottom of the phone with your pinky to be able to control the angle.
It’s a bit awkward though: I’ve seen people doing it on the train for example, and dropping their phones. Or while doing something else with their other hand. Not a great method.
The one that we use most of the time, however, is the most natural one: just hold the phone tight and use the thumb as much as you can. In this case, the area covered by the thumb without repositioning the phone, might look like this for an average palm and the iPhone 5:
Out of this very observation the idea of FutureCalc was born. I think the following screenshot should speak for itself:
The interface is of course flippable, so that you can use it in either hand. Apart from placing the keys on the wheels I made a few other interface optimizations, such as there is no equal key here: the result, instead, is shown as you type. Also, there is only one Clear button instead of two: you double-tap on it to reset the calculator.
A slightly modified design that retains the physical key sizes is used on the iPhone 6 screens:
FutureCalc hasn’t been customized for the 6 Plus yet, but will definitely be in the future releases (currently it uses the iPhone 6 design above).
Those who have already tested it notice an improvement in usability, and overall it does seem like a good compromise and a nice little advancement in UX.
So where does this all go? I suppose some apps could use animated radial popup menus. Wheels can also spin and reveal more menu items, which would be even more fun to use. A radial phone dialer would be interesting to have as another example.
That’s pretty much it. You are welcome to have fun with FutureCalc, and I would appreciate your feedback!
Feb 2016 update: made an app with a slightly different design principle I call “concave” (unlike the radial one used for the calc), check out FutureDialer!
