14
PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface. In Proceedings of the 6th annual ACM symposium on User interface software and technology (UIST '93). ACM, New York, NY, USA, 45-55. http://doi.acm.org/10.1145/168642.168647

PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

Embed Size (px)

Citation preview

Page 1: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

PRESENTED BY: AMY SHANNON

Animation: From Cartoons to the User Interface

Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface. In Proceedings of the 6th annual ACM symposium on User interface software and technology (UIST '93). ACM, New York, NY, USA, 45-55. http://doi.acm.org/10.1145/168642.168647

Page 2: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

About the Authors

Bay-Wei Chang has worked at Stanford, Palo Alto Research Center, and Google. His most recent publication (2005) related to query-free news searches.

David Ungar has worked at UC Berkely, Stanford, Sun Microsystems, and IBM Research. His most recent publication (2014) related to context-oriented programming.

Page 3: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

The Problem

UI events are startling and confusing to users

Difficulty connecting screen states

Objects act in unrealistic ways

Page 4: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

The Solution

Page 6: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

Solidity

Motion Blur

Arrivals & Departures

Dissolves

Page 7: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

Road Runner Self UI

Motion Blur

Page 9: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

Exaggeration

Anticipation Lean back before they start running

Follow Through Vibrate after they stop running

When objects move on their own in the UI, they follow these same principles

Page 10: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

Reinforcement

Movie Clip: https://www.youtube.com/watch?v=HI0x0KYChq4

Page 11: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

Reinforcement

Slow In & Out

Arcs

Follow Through

Page 12: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

Why Cartoons?

Theatrical

Engaging

Similar medium

Animators have achieved successes of “communication, vibrancy, and illusion”

Page 13: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

Why Not Cartoons?

Users don’t interact with cartoons

UIs are for work, not play

Page 14: PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface

Discussion Questions

1. Which of these animation techniques are still present in modern-day UIs? Which are not? Why were some of these techniques beneficial at that time but not now?

2. Are there modern animation techniques that could be applied to UIs? Or, are there animation techniques that were applied after this paper was written?

3. The authors justify their use of cartoon animation by saying cartoons are theatrical and engaging, and that these qualities are beneficial to a UI. Do you agree? When/how are current UIs "theatrical"?