#1 The Supporting Actor

The Lens of the Supporting Actor

Untitled (by db*photography)

A supporting actor/actress must use restraint not to upstage the main actor/actress in a theatrical performance.

In the same way supporting interactions must remain secondary to the overall experience.

To use this lens consider a specific interaction in light of the whole experience. Ask yourself these questions:

  • What goal of the user does this support?
  • What would this experience look like without it?
  • Is it creating a distraction or enhancing the experience?
  • Are there are alternate techniques that could be used that are less distracting but just as effective?
  • Does the effect/interaction feel real? Does it obey the laws of physics?
  • Have you tried cutting any special effects in half? Half again?

Thelma Ritter was one of the most popular supporting actresses in the history of motion pictures. She was nominated for an Oscar for Best Supporting Actress 6 times but never won. Besides her many roles, you may recall her as Stella, the cynical nurse in Rear Window cast against the main man Jimmy Stewart. Ritter’s performance never upstaged Stewart’s wheelchair bound character L.B. Jeffries — but instead enhanced the character’s likability. There is a lot to be learned from Thelma. One of the most common places that I see supporting interactions try to upstage the overall experience is when animations are used.

An especially egregious example is from Borders (thankfully this is no longer the experience):

From Borders.com; an example of Needless Fanfare

When adding effects into an experience, it is easy to over-focus on the effect itself and forget the overall context. In this example somebody got enamored with fading and zooming! Let’s see how the lens questions could have been used to catch this problem.

  • What is the goal of the user? To get a peek at more details quickly. The effects get in the way of the goal.
  • What would this experience look like without it? Without animated transitions the experience would arguably b better. The current version of Borders no longer has these effects. However they may have taken it too far — they no longer have a popup at all.
  • Is the effect creating a distraction or enhancing the experience? This is maximum distraction.
  • Are there are alternate effects that could be used which would be less distracting? Well most likely no. Just make the popup appear instantly. A good example of this with the Netflix hover effect
  • Does the effect feel real? Does it obey the laws of physics? No. Nothing in the real world that is not otherwise broken behaves this way.
  • Have you tried cutting the effect in half? Half again? In this case this would not be enough to resolve the problem.

In the past I have written about animations that try to take center stage. I refer to this anti-pattern as Needless Fanfare.

Fortunately animation can be done correctly. The analytics tool crazyegg.com does a great job with it’s “confetti” view which visualizes where certain types users of end up clicking. For example you could turn off the plotting of users that arrived from technology related blogs. When you flip criteria on & off each dot corresponding to a click location blooms up in size just before it either appears or disappears. This effect takes a back seat to the visualization while momentarily stepping forward to create a visual connection for the user between state changes.

From CrazyEgg.com; an example of animation supporting an interaction.

700 years ago by the Franciscan friar William of Ockham said it best:

What can be done with less is done in vain with more.

5 Comments »

  1. drasparagus Said,

    April 22, 2010 @ 2:11 pm

    Great article and examples.

  2. Marielle Said,

    April 23, 2010 @ 9:16 am

    Needless fanfare is also a fancy but difficult to read font for a website…

  3. admin Said,

    May 20, 2010 @ 3:25 pm

    Yes. Very good point. With Typekit and now Google Fonts it is possible to have really wonky fonts. Thanks for mentioning.

  4. Emily Said,

    June 3, 2010 @ 8:20 am

    Needless fanfare is also a fancy but difficult to read font for a website…

  5. Amy Said,

    June 6, 2010 @ 4:48 am

    Great article and examples.

Leave a Comment

Trackback URL