current page



Lecture on Oct 21, 2010.


  • Required

    • Animated Transitions in Statistical Data Graphics. Heer & Robertson. IEEE InfoVis 2007. (pdf)

    • Animation: Does It Facilitate? Barbara Tversky, Julie Morrison, Mireille Betrancourt, International Journal of Human Computer Studies, v57, p247-262. 2002. (pdf)

  • Optional

    • Smooth and Efficient Zooming and Panning. Jack J. van Wijk and Wim A.A. Nuij, IEEE InfoVis 2003, p. 15-22. (pdf)

    • Effectiveness of Animation in Trend Visualization. Robertson, Fernandez, Fisher, Lee, Stasko. IEEE InfoVis 2008. (pdf)

    • Animated Exploration of Graphs with Radial Layout, Ping Yee, Danyel Fisher, Rachna Dhamija, and Marti Hearst, IEEE InfoVis 2001 (pdf)

    • Principles of Traditional Animation Applied to Computer Animation John Lasseter, Proceedings of SIGGRAPH 87, Computer Graphics, 21(4), pp. 35-44, July 1987. (acm)

    • Animation: From Cartoons to the User Interface. Bay-Wei Chang, David Ungar, UIST 1993. (pdf)


wulabs wrote:

In my previous post (last lecture) I mentioned that I believed animations were not very useful in the infoviz frameworks, and in fact somewhat detrimental (implementation complexity). Based on the two contradicting articles in this lecture, I still stick to what I said, though it really "depends". I agree with the article "Animation, does it facilitate" because animations showing change over time or involving interactivity are "probably" better than without, though scientific studies may show differing results because I believe it really depends on the type of data and how exactly the animations are being presented.

The downside of adding animation is that it can detract from the original static visualization in the same way that a very intuitive and easy to use product should not need a users guide. Furthermore, with animations the programmer/designer has to keep in mind animation effects in whatever they are building.

nchen11 wrote:

I was halfway through the Heer & Robertson paper before I realized that "staged animations" meant animations with stages and not animations that are faked. I kept wondering why the phrase "staged animations" was chosen over "custom animations"; I need to stop reading papers late at night . . .

Also, I was amused that "most subjects laughed upon first viewing the multi-staged stacked bars transition." When I looked at the diagram, my only thought was that it is a very clear way of animating the transition. Perhaps something about the actual animation looks "funnier" than the static frames as displayed in the paper.

On that note, I'm curious to know if there are places that I could view the actual animations that were used in the experiments?

rakasaka wrote:

I remember seeing a video of Hans Rosling demonstrating the GapMinder at TED and seeing how engaged people became (though Hans himself was also very much an engaging speaker). Come to think of it, the topics raised in the Heer & Robertson paper highlight one key component that I think may be the most important part of an animation: the idea that given a fraction of an animation one should be able to predict what will happen next. One might disambiguate between animation predictability and data predictability - we expect a certain thing to happen, but we're caught by surprise when the data shows something new or surprising that we can immediately visualize.

msavva wrote:

I found the "Animation: can it facilitate?" paper to be a fascinating read. At times, it seemed rather harsh, but was a well constructed criticism of previous research (and to some degree popular belief about animated graphics) in that they fail to separate animation from related concepts such as interaction, when trying to appraise if the comprehension of graphics is facilitated. One very interesting point the paper made was that spatial proximity is the basic metaphor underlying the use of space to express abstract relations (which certainly supports the ranking of position visual encodings at the top of Mackinlay's effectiveness hierarchy). Though I did agree with the emphasis of the paper on the need for a more careful analysis of what exactly it is that makes animations work or not work, I felt that the argument was indeed a bit strong-handed since by definition static graphics are incapable of directly showing temporal changes in the represented system, at least when taken in isolation (and this distinction constitutes a natural application and strength of animations).

gneokleo wrote:

I liked how the two articles try to prove whether or not animation is helpful in graphs and each have their own opinion. I think that the Heer and Robertson paper is doing a good job in trying to say that animations are not just cool they're also helpful. It was apparent from their user study that a lot of their test subjects found the animation to be engaging and pleasing which was expected. What was more interesting was that their experiment showed that animation does in fact help readers understand what the graph is trying to portray better. However, I'm not sure if this is true for just a small subset of users and for visualization under specific environments/settings. For example they mention business analysts but I'm not entirely convinced that animations is something that a business analyst would be interested in because of his need to quickly transition between graphs. On the other hand the authors make a good point when they say that people who are not very familiar with the data or even people who see the data for the first time can benefit much more from animation. I think that animations are helpful under certain conditions and that animations should not include complicated transitions just to look cool.

emrosenf wrote:

Gapminder for those who haven't seen the video

abhatta1 wrote:

The congruence principle and the apprehension principle for animated visualizations laid down in "Animation Does it Facilitate" paper can be easily extended to static visualizations and vice versa. Also by the principle of annotation it seems clarity is more important than graphic richness. However I have often come across powerful animations where graphic richness was one of the reasons I was attracted to it in the first place. For me, this generally holds true for animated datas depicting biological or astrological processes.

yanzhudu wrote:

Just like evaluating anything, we need to design the evaluation criteria to fit the intended purpose.

Animation may not always help in terms of data comprehension. However, in some situation, as demonstrated in Gapminder video, data visualization is created to impress. In this situation animation draws people's attention, and hopefully giving audience something to cool to talk about. Consider how much people like animation, there is hardly any reason not to use it. How much people learn from the animation is a minor issue in these situations.

"Animation: Does It Facilitate?" Answer to this question really comes down to what do you want animation to facilitate. For impression? Yes. animation is almost a must. For other purposes? Use it wisely.

selassid wrote:

I was impressed seeing how many subtle tweaks had to go into the animations of the radial layout graph in order to make it as easy to follow as it was. It's interesting to think about how many not-mathematically-straightforward equations have to go into producing a transition that is natural feeling; what's easy to express mathematically is not natural to comprehend by the mind, it seems.

Even though it seemed people were reticent to accept the use of cartoon-style motion cues in such a high minded field such as data visualization, I think the unspoken familiarity people have viewing and comprehending the cartoon world is another visual vocabulary that can be tapped into for quicker understanding.

acravens wrote:

The lecture today inspired me to look more closely at the animation of a mindmapping program that I've been using for a number of years, PersonalBrain (you can see the animation in their demo video at I think the fact that I've never thought about how the animation works before is a sign that the motion is not jarring or distracting. Watching it more closely in light of the lecture, I notice how important it is that sibling nodes always stay on the left side. Only nodes that have to move do so. And perhaps most importantly, the animation serves as a way to adjust views and zoom in/out or move around what can be a large set of nodes arranged with parents/children/siblings in a not-strict hierarchy. It seems to me the dynamism of the animation is intrinsic to the functioning of the program.

trcarden wrote:

I wonder how useful the radial graph layout mechanisms are in general. After a certain point regardless of how smoothly or how the neighbors were arranged i was getting lost in the translations just because of the mass of data that was moving. Animation combined with some kind of focusing agent (shadow) etc might provide a better way to maintain context between movements.

mariasan wrote:

When Professor Heer was talking about how speed and other factors impact how we perceive animations, it made me think of the Jónsi show I went to on Tuesday evening. It was one of the more spectacular music shows I've ever been to. The back of the stage was one big screen, more or less and they had a pretty advanced setup with projectors that ran throughout the show. It's difficult to describe, but the animations were clearly made for the music, and it was so well done it felt magical. More than anything, the animators did a phenomenal job with communicating an organic feeling. At one point a tree was displayed dropping all its leaves, over a few minutes - and though it must have been a randomness to it, it was the correct randomness to make it feel real. There were certainly no constant speeds used there!

I tried to find a good recording of his live show but most of it looks pretty crappy. I found a great interview with the company behind the animations though, which gives at least a hint of the "organic" feel to the animations I was mentioning above.

hyatt4 wrote:

I found it interesting how analysts, after learning that there performance was decreased, still preferred animations. This makes it a bit tricky as a designer I think. If the goal is to make money selling your product, then by all means include lots of pretty animations so that the analysts will tell their supervisor that they need your product. If you are the supervisor though, you'd better take a closer look at productivity levels. It reminds me of being a parent, where my daughter would love to eat cookies all day long, and I'm sure that's exactly what Nabisco would love for me to go along with (aided by the help of Dora the Explorer of course). Personally, I think animations have their place. To highlight a transition from one thing to the next, perhaps where you have made a change from one option to the next, and you want to see place marks of where the changes occurred it would be very helpful. However, they can be very distracting (as we notice from web based advertising agencies, or that horrible paper clip that used to pop up with Windows) and I think there could be a real danger from focusing a person's attention incorrectly or just taking up there time because they can't help but stare at the animation.

hyatt4 wrote:

Does anybody know where I can find that movie that was shown today with the big bad triangle that was going after the little triangle and the circle? I don't have any plans for Friday night ...

jorgeh wrote:

@emrosenf Thanks for the link! I haven't seen that talk before, but it was super interesting, both in the content, the presentation and the speaker. Lots of things to learn from there.

@hyatt4 You can see the animation at . Is not the same video, but is definitively the same animation.

sholbert wrote:

There are so many variables to think about in animation. I was amazed at the subtle things that are used in cartoons to exaggerate actions. Applying this to the data viz context is a fascinating kind of translation.

I also would have never anticipated that rotation would be such a cognitive impediment. Good to know for this current project!

emrosenf wrote:

Question to all of you: has your anticipated use of animation in assn 3 changed as a result of thsi lecture? how?

amirg wrote:

In the Tversky paper, the authors debunk many studies that had supposedly found animation to facilitate learning, claiming that the comparisons used in these studies were unfair because the animations actually conveyed more information than the static graphics. This got me to thinking: there's got to be some reason that a) all of these authors seemed to think they were making a fair comparison (at the time at least) and b) all of these authors created animations that unintentionally provided more information than comparable static graphics. And I think there is. In some cases, animation seems to be a natural way to add information to a graphic. In this sense, I think that animation was actually shown to be successful in these studies, but not as something that facilitates in itself. Instead, I think that what these studies really showed is that animation can be successful in some cases as an additional visual encoding of information.

Of course, animation also has a number of other double-edge sword type use cases as we discussed in class yesterday. For example, it definitely draws one's attention to a particular aspect of a visualization, whether that is a good thing or a bad thing. I actually hadn't thought much about how to incorporate it into assignment 3, but I like the use case of facilitating transitions between graphics and the Heer & Robertson paper seems to show it can be useful for that, so maybe we will incorporate if we find some of the interactive transitions could be cognitively aided in that way.

amaeda10 wrote:

I introduce and comment on several animated visualizations here. I think these will be helpful to polish your eyes to judge what's good animations and what's not.

1. Fedex "hub and spoke" logistics

I thought this animation is helpful to understand the flow of logistics (e.g. from where to where, where is the key place, when is the busy time, etc). However, what I dislike about this animation are:

- I cannot control the animation speed.

  • I got bored and even irritated after watching this a minute. I would like to quickly skim through the flow.

- There is no time display.

  • I can tell there is a busy time in a day, but when? No clue from this animation.

2. code_swarm - Eclipse

I think this is a nice art work, but not very functional. Many letters are occluded, moving restlessly (thus hard to read), and there are many unnecessary visual effects. I don't understand why people's response in the comment area are so positive on this.

3. An Animated Visualization of The Crisis of Credit

This is not really a "data" visualization, but more like a story-telling. I think this animation is very nicely done. Pacing is carefully considered, viewers can easily tell what information they should focus on, there are no obviously unnecessary objects/animations, and animation conjures up emotion effectively. This is a very good way to use animation, I believe. Do you find any flaws in this animation? How would you improve this better?

iofir wrote:

The article "Animation: Does It Facilitate?" followed the same arguments we considered in class about the benefits of animation. (or rather, the discussion was based on the article) But during both arguments I was wondering if there has been any research to quantize the benefits of animated highlighting. with the exception of flow like visualizations, the benefits of animated highlighting/emphasizing is not apparent. does anyone know if there has been study to measure the effect of animation in that sense. for example, my original project idea was to use animation to highlight the spread on information through a directed graph of a social network. while at first it seemed the most logical approach, I later realized the flow will be more easily understood using color to show degrees of distance. using the animation requires that the user absorb and understand the information in the duration of the animation. that only leaves enough time for a general idea, and not for a deeper analysis.

adh15 wrote:

I do not recall reading about any studies in the Tversky review that compared two interactive visualizations: one with animation and one without animation. I think this might be a possible area in which animation could be helpful since we're used to the way our actions on the physical environment result in continuous rather than abrupt changes.

On the other hand, the actions we perform on our physical environment are continuous in nature, unlike the discrete click of a mouse button or tap of a touch screen. This observation suggests to me that for best results, there should be a natural mapping and continuity between the action a person performs to trigger an animation and the characteristics of the animation that follows.

andreaz wrote:

Yesterday's lecture and readings did a great job at helping me clarify my opinion of the role of animation in HCI. In each of their papers, Heer and Chang approach animation from slightly different perspectives of HCI--Chang from UI design and Heer from data graphics--but it seems that they both agree that animation can be helpful when used sparingly during transitions. Tversky's paper did a great job at providing convincing evidence to show how animation can be detrimental in cases where the graphic's role is to teach a complex system. The Palmiter studies she cited were really interesting because they tested people's ability to retain information from a graphic not only immediately, but also after a period of time had passed. The results of those studies--that people tend to retain less after viewing an animation--make sense to me because of the inherent passivity of the medium; the preattentive, automatic way in which we are wired to process animation paradoxically leads us to put in less conscious effort into perceiving the graphic. It seemed that a lot of the animation examples used in the studies she cited failed because people couldn't extract from the animation the series of steps crucial to the understanding of the complex system being tested. The Tversky paper really illustrated the importance of separating into discrete steps what you hope your viewer will retain from your graphic. My thoughts on the role of animation in data graphics are now to use it prominently when illustrating a temporal change in the data, or subtly when illustrating transitions.

felixror wrote:

Thanks for sharing the nice animated visualizations amaeda10! I totally agree about your take on the Fedex "hub and spoke" logistics visualization. Although the motivation is good, I find it boring after watching it for a while. The concept can as well be shown in a static graphic just listing the "paths" on the maps. I guess interactivity would help a lot in this animation. As the paper "Animation: can it facilitate" points out, Interactivity may be the key to overcoming the drawbacks of animation and can enhancing its advantages. So for the Fedex animation maybe its better to let the user have the control over the speed of the animation. That would help tremendously.

For the second animated visualization you mentioned about the visualization of the Eclipse project. I do think its more of a piece of artwork rather then anything else. On the surface it kind of trying to encode the "time" factor using animation, but the animation moves so fast and information are so densely packed that I personally do not get anything out of it. But nevertheless its very aesthetically pleasing.

The third animated visualization about the Credit Crisis differs from the ones we looked at in the sense that there is a narrative complementing the visualization, and the bulk of the information, in my opinion, are conveyed through the narrative. So I think in this sense its hard/unfair to compare this animation to the others directly, aside from the fact that we have to acknowledge that combination of narrative and animation can be very effectively at conveying information.

Here is another great animation that I found amazing:

But I would classify it as an art work that motivates viewers without much practical purposes. Enjoy!

esegel wrote:

Thursday's lecture was my favorite so far. Very neat observations about the human visual system in regards to motion.

More demos related to the number of objects we can track in a scene. These are a *lot* of fun. Animated Presentation:

Interesting example of animation used to direct attention to the right place:

And another:

Aside: I thought the radial graph layout visualization was phenomenal (apart from the animation). It provides both the structure of the graph AND an easy way to quickly perceive connection-distance. How come this isn't used more often?

jsnation wrote:

In Tversky's paper it was very interesting to read about the ineffectiveness of certain animation that I had already been thinking about from the lectures. I was surprised that so many of the papers Tversky discussed finding benefits of animation were not fair comparisons in some way, because the static and animated graphics were not comparable. Also, the differences between animation and interactivity were stressed as many papers would compare static graphics to animation + interactivity, which is not a fair comparison either. It was interesting to see that animation did not provide the benefits that are suggested by the congruence principle - that animations should be well suited for representing temporally changing models. I think this just speaks to how difficult it is to balance all the variables in an animation to make it effective. An animation can easily become less understandable than the static graphic, or even worse can become misleading or distracting if careful consideration is not given to all its elements. As seen in Heer and Chang's paper, animation is well suited to helping maintain object constancy with changing object models or axes. But even that form of animation is tied in with interactivity in the toolkits we learned about like Flare / Prefuse, since the animations are used pretty much to allow interactive changing of graph types or axis scaling, etc.

asindhu wrote:

@emrosenf I actually completely changed my mind after the animation lecture. Before, I had my heart set on Flash/Flare because of the great animation tools. However, one of the most important things I got out of the animation lecture was that comparison of the various elements or effects of animation and how they can be used either to help or to hurt. Even in watching the Gapminder video that was posted above, I found many of the animated transitions in the slides to be overdone and superfluous. Given a rich set of tools for making cool-looking animations, I think it's normal for a developer to have the tendency to over-use them just because they are available, without thinking enough about whether the animation contributes something substantial. So, I think I may actually go with Protovis instead just to resist the temptation to over-animate.

That being said, it was great to also see some examples in lecture of very specific and concrete things that animation can actually help with in the presentation of a visualization. I was especially interested by the idea that animations are very powerful in expressing agency or action (as expressed by the dot/triangle flatland sequence). The amount of context and implied understanding you can impart on the viewer using animation in this way seems like a very effective way to shift some of the "cognitive load" away from conscious thought.

jbastien wrote:

One interesting use of animation is in the TED demo of Microsoft's Photosynth:

Big data and seamless exploration of that data merged together.

Pivot is another interesting one:

saahmad wrote:

I think the biggest think I took away from the "Animated Transition" paper is the novelty of adding animations. Sure, you can actually encode another dimension in the animation or guide a user's understanding of the data but I think one of the biggest things is that it just grabs people's attention. Typically if I just saw a bar or pie chart, I would not think twice about it. Generally I would think - okay, there is some information there, if I cannot guess what it says by reading the text I will actually look at the image. However, by having additional animations I get curious and look at it more carefully. I notice myself doing this elsewhere as well. is a awesome example. They have graphs that animate to show you things like your monthly spending activity, etc. Whenever I load it up I actually send time to skim over it because of the animation. I have used financial software in the past and they gave me the same (in fact more data with better visualizations) but because they were static I did not feel the need to explore it further. Ultimately, I feel that animations add a sense of playfulness that is grabs your user's attention.

ankitak wrote:

I would imagine that in data visualizations, using sound as an encoding medium is similar to using animation in some ways and yet the consequences might be different. Though I am not sure if sound encoding of data is technically within the scope of data "visualization", I find the comparison interesting:

1. Heer and Robertson mention that animation has been generally used since it is effective in (a) attracting attention, (b) conveying transformations, ( c ) communicating cause-and-effect and (d) engaging the user. Sound can be effectively used for (a), (b) and (d).

2. Consequently, sound can also cause distraction just like animation. However, I would think that while viewing a data visualization, a person's sense of sound is highly peripheral, thus preventing it from being a major distracting force.

It might be interesting to understand how other drawbacks of animation compare with sound encoding; and to see how using animation or sound or animation + sound compare with each other.

I have been unable to find much work in this area. Any thoughts on this?

arievans wrote:

The most interesting and insightful part of the Tversky paper on animation was the discussion of how to evaluate the effectiveness of animation. Specifically, in one approach they take a very simple view on things, asking the question "well, how would this visualization appear without the animation?" Though this might seem like a very obvious question to ask, it never would have occurred to me to consider. In general I think we have adopted so firmly the mentality that animation is better than no animation that we sort of try to evaluate one animation by comparing it against an alternative animation. I can recall numerous occasions on PowerPoint where I have done exactly that--"hmm, this animation doesn't look good, let's try another." Taking a step back and really considering what it is you are trying to convey and carefully analyzing what the static image(s) lack seems to be a much more compelling frame through which to add animation successfully to visualizations. This same approach must also be useful in interaction design. If we try to map out the various states of the interaction with still images, then perhaps we will be in a stronger position to determine how animation can be used to add value in transitioning between those states or emphasizing certain information in a way that is notably better in some way than the static representation.

In general what I like most about the paper is its bluntness. Animation is somewhat easy to add to visualizations. We have lots of options available to us and again, for whatever reason, our assumption is that animation is better than no animation. The Tversky paper stops us in our tracks and reminds us about why we use animation in the first place, and provides us with a variety of useful examples to make us think more critically about how we use animation and strongly suggest to us to make sure we are adding value by employing them. Excellent, truly excellent.

msewak wrote:

Some of the points made by the Tversky are very interesting :   Across all participants, diagrams that animated paths were no better than their static counterparts. Animations fail because often there Is no correlation between the concept that is being demonstrated and the animation. I like the apprehension principle that structure  and content should be readily perceivable. Animations can also be hard to perceive, or comprehended discretely.  I agree with what Tufte would say though, that many times it is distracting and adds to chart junk       It is always good to ask, what does this pixel of ink/animation add to my visualization!

nikil wrote:

I really enjoyed learning how the small cues to animation really make a big difference in human perception. For example, the bee moving back and preparing for a fast takeoff give a cue of speed and also how when accelerating in and out slowly the animation has a perception of smoothness. I started noticing these effects in products that I use in my daily life after this lecture (and actually after many lectures in this class usually!). Specifically talking just about the acceleration used to provide a smoothing visualization I just realized that is why I think the chrome tabs are much more appealing and natural (fluid) than the tabs in firefox (even the 4 beta which has tab animations, but they are at a constant velocity without smoothing) very subconsciously.

Leave a comment