Dirty Aura

I was visiting a friend a couple of weeks ago and saw a one-and-half-year-old girl using an iPhone and it got me thinking. Touch interfaces are going to change modern graphical user interfaces more than anything in the past 25 years.

The smart young lady wasn’t the first toddler I have seen using an iPhone or a mobile phone in general. It’s only a natural part of their development that children imitate things that their parents do. Many seem to figure out TV remote controls almost on their own. However, I haven’t seen any kid experimenting and playing with a more traditional mobile phone with the same ease as an iPhone. They know how to unlock it with a swipe; they find their favourite visually appealing app, be it a simple game or an interactive toy; they spend inordinate amounts of time playing with it and they figure out a Home button to exit and try something else. They are really using iPhone’s interface.

iPhone UI has a certain sense of physicality to it. It feels very natural, touchable. Touch is the main component of this experience, but it isn’t the only necessary ingredient. In my opinion three other aspects play important roles to give that sense of naturalness and ease of use: animations, response times and overall simplicity of UI.

Animations

People used to think of animations as eye candy for UI. They are not: quite on the contrary, they are one of the most effective means to show causation in UI design.

For touch UIs, animations are a fundamental ingredient. Think about photo browsing on iPhone. Without an accompanying animation, the swipe gesture would feel totally unnatural – your mind would have a hard time connecting the gesture to the state change of UI. But with the animation, you don’t ever think about it, it just feels right.

iPhone really shines on animations. Now that I’m developing games, I have learned how delicate an art animation design is. You need to try out different timings, different kinds of ease-in and ease-out, and different movement patterns to get that natural feeling for even simple animation. iPhone SDK is offering powerful APIs to implement animations, but they are still quite clumsy to use. As animation design is a creative trial-and-error process, we need much more convenient tools for it. I bet that in coming years we will see a lot of innovation in both design and programming of animations.

Responsiveness

With any kind of user interface, if you press anything, something should happen immediately. If there’s a delay of even a few hundred milliseconds, the illusion of realness is broken.

Why would anyone make an unresponsive application? Any UI programmer knows that without careful programming, keeping your application responsive is one of the toughest aspects of UI programming. The truth is that modern UI libraries offer poor abstractions and tools to program responsive applications. They don’t support convenient asynchronous programming models or easily multithreading your application code without stumbling into all the dangers of traditional multithreading.

iPhone is not an exception in this case. Its libraries are good, but don’t really push the boundaries of UI programming. It’s just that OS and most of the apps seem to be carefully programmed and stay responsive better than their competitors. For example, Nokia’s flagship touch UI phone N97 has very sporadic responsiveness, which totally kills the experience.

Simplicity of the UI design

When iPhone was released, its UI design was outrageously simple compared with competing smartphone UIs. For example, the application menu, or SpringBoard as it’s called, was a super-simple flat representation of your apps without folders or other hierarchies.

The curse of desktop interfaces is their menus. Menus basically offer unlimited slots to dump functionality. Menus are common in many smartphone platforms and in my opinion the main culprit of bad UI design. iPhone doesn’t really have menus of unlimited items; you can usually just have max 4 items on a menu-like popup. This is wonderful as it forces every average designer and developer to think in terms of less, not more. If you add a new feature to your application, on iPhone you really need to think about how to surface it on the UI as there aren’t any functionality dump yards like menus.

Touch UIs that are operated with fingers have an inherent character that drives UI design towards simplicity: your finger can hit only large-enough areas. Although screen resolutions will increase with advances in technology, you still need to be able to operate UIs with your finger. On a mobile phone screen, this means that there are usually fewer than 10 possible selections visible at a time. This drives all designs towards simplicity.

Apple’s new device

Apple is going to release a new device today. Rumours are indicating that it’s a tablet device for casual computing. I’m not personally super-excited about something that sits between a phone and a laptop. A phone I can carry anywhere in my pocket and use for casual computing, and as a programmer I’m going to need a full-powered laptop for work-related tasks. But I’m super-excited that whatever Apple is announcing today is probably a new step towards the next generation of computer UIs. Laptops as we know them are going to change and touch interfaces will play a central role in this revolution.

Mobile animation, design, iPhone, programming, touch UI