Principles of Animation in UI Design

Smashing Magazine posts a great article on some principles for including animation in mobile UIs.  I think the use of animation is under-estimated by some HF people because it’s hard to quanitfy the “performance benefit” (e.g., they may not increase the speed at which a user completes a task).

Some notable examples of animation are the infamous Apple’s page bounce-back, the page-curl in e-book apps or the bouncing icons on a Mac (or expanding/minimizing windows on Mac/PC).  Difficulty in quantifying objective benefits may lead some to dismiss animations as superfluous and unneccessarily ornate.  I wholeheartedly disagree.  Animations provide a fluidity that makes interfaces feel responsive even delightful.

The article provides a lot of reasons for the benefits and most appropriate use of animation. It’s typical Smashing Magazine (i.e., LOOONG) so save it to read later!

(post image from the article)

Goodbye Mouse?

Story in the Washington Post about the impending demise of the computer mouse in favor of touch screens:

“Most children here have never seen a computer mouse,” said Hannah Tenpas, 24, a kindergarten teacher at San Antonio.

“The popularity of iPads and other tablets is changing how society interacts with information,” said Aniket Kittur, an assistant professor at the Human-Computer Interaction Institute at Carnegie Mellon University. “. . . Direct manipulation with our fingers, rather than mediated through a keyboard/mouse, is intuitive and easy for children to grasp.”

I realize the media needs a strong narrative to make an interesting story but the mouse is nowhere near dead.  The story is more complicated and completely depends on the task.  There are certain applications where the precise pointing afforded by mice are just too cumbersome with touch screens.

The article also has a great graphic describing how touch screens work and a short retrospective of input devices.

(post image from flickr user aperturismo)