In the Spring of 2008 I started the project to collect and analyze examples of motion used in interfaces. Clips captured from desktop applications, web sites, operating systems, the then new iPhone, were collected and categorized on two axes: by the trigger for the motion and by the messages sent by the motion. I collected as many examples as I could find and organized them on those criteria. Later, I picked representative examples from the collection and created this movie showing an example of each kind of trigger and each kind of message.
Movement is characterized by four general initiators:
initiated by the user,
initiated by the computer,
initiated by software context,
initiated by data flow.
The messages that motion imparts in this library begin to show the power and importance of motion when it's used to communicate in an interface:
show: inform someone about something visually,
tell: communicate, impart, express thoughts; give an account of;
acquaint: introduce, make familiar;
warn: give notice of danger;
orient: set context.
Video sources in order of appearance:
Arrange application icons jiggle, Apple iPhone Keynote 2008.
Aaron Koblin Flight patterns.
Phun was a physics interactive toy, now replaced by Algodoo.
Adobe Illustrator Direct Selection Tool
Apple Mac OS X interface, Logon new user cube animatin.
Apple Mac OS X interface, Dock warning bounce.
Apple iPhone Swipe Navigation animation, Apple iPhone Keynote 2008.
motion for interface: a taxonomy; catalog of motions used in interface by Elaine Froehlich is licensed under a Creative Commons Attribution-NoDerivs 3.0 Unported License.