Rachel Nabors

Rachel is an interaction developer and author

of the animations at work book. She has also

helped develop web animation standards

within Mozilla and Microsoft and has been

invited to be a web animations expert at the

W3C.

rachelnabors.com

Before 2004 there were only two ways to interact with the web: click a link and go to a new page or submit a form so the page refreshes and new content appears. But between 2004 and 2005 everything changed. On April 1, 2004 Google launched Gmail, and one year later it launched Google Maps. These two web apps were probably the first that took full advantage of the new features added by the Internet Explorer browser: the DOM API (the Document Object Model presenting HTML as a tree structure) and AJAX (asynchronous JavaScript, which allows pages to update information without refreshing).

Google Maps allows a user to map a location, scroll around, zoom in and out, and share the URL—all of which requires animation. You have to revise and update the page while people pan around within it, moving it around on the page. The page has to repaint as the viewer moves the map. And the same with Gmail, having an inbox that automatically updates and shows when new mail has arrived. In the past you had to use an entire program to do that or else be constantly refreshing the page.

That’s when the world of interaction on the web became real, although it took people a long time to understand it. Designers and developers soon realized if they used interaction wisely they would build a more competitive product. In the long run this prompted us to evolve from a point-and-click world to a touch-based world, a place where we interface with our fingertips.

Animation is what makes web interactions look and feel beautiful—slide a new modal in and out of view as it is added and removed from the DOM after an AJAX call. Flash provided an interface and library for interaction developers to create pleasing animations and interactions with, and some 10–15 years ago it was really popular. Flash did things with rendering animations on the screen that the web did not have APIs or standards for.