by Cesare Rocchi

Gratuitous Animations

by Cesare Rocchi

Tags: animations

Visual flair. Like smoke on the dance floor. Would people enjoy dancing without it? Probably yes. For some type of animations, or for animations in a given context, it’s the same.

The animation that makes you furrow your brow in frustration as it stands between you an your intended goal. As a designer you need to realize that your UI is not entertainment.

Sophie Paxton source

When I perform a particular sequence of tasks I don’t think, I just act in a sort of “cruise control” mode. For example let’s say that I am using Tweetbot or the official Twitter app on iOS. I open a link in a tweet and now I am reading a blog post. It’s interesting and I wanna tweet about it. I usually follow this template: {Title} {link} by {author} {some comment of mine}. If you click the tweet button the new tweet will contain just the link. I still need the title and the author and I don’t wanna type neither of those, because the risk of mistyping is pretty high. So within Tweetbot this is the flow:

  • Tap share button
  • Pick ‘Tweet Link’ from the menu at the bottom
  • Save draft
  • Copy title from the post
  • Go back
  • Open compose
  • Open draft
  • Paste title
  • Save draft
  • Copy author handle
  • Open compose
  • Open draft
  • Tweet

That’s quite a trip! And Tweetbot has the nicest and less-in-the-way animations I am aware of. It’s way worse when the post I wanna share is open in Safari. The following assumes that Safari and the Twitter app are close to each other in the stack of open applications.

  • copy link in Safari
  • home button double tap to show app stack
  • ANIMATION
  • pick Twitter app
  • ANIMATION
  • tap compose
  • paste link
  • save draft
  • home button double tap to show apps
  • ANIMATION
  • select Safari
  • ANIMATION
  • copy title
  • home button double tap to show apps
  • ANIMATION
  • select Twitter
  • ANIMATION
  • paste title
  • (TEMPTATION TO NOT INSERT THE AUTHOR BECAUSE OF BOREDOM)
  • home button double tap to show apps
  • ANIMATION
  • select Safari
  • ANIMATION
  • copy author
  • home button double tap to show apps
  • ANIMATION
  • select Twitter
  • ANIMATION
  • paste author
  • Tweet

That is nuts! And yet I do it sometimes.

Note: You might argue that I could use iOS system wide integration with Twitter. I don’t because I am concerned it might mess up my contacts and I don’t want to. Moreover it doesn’t allow to format the tweet the way I want. Even more, I can’t save a draft. That means I need to have all the data in advance stored somewhere (a side note or the clipboard) before opening the widget.

I didn’t time the sequence above to the microsecond but I feel that switching to another app takes roughly one second. There’s 10 occurrences of ANIMATION in the list above. 10 seconds of overhead for each tweet in the format I like. I have to be really motivated before deciding to tweet :) An extra complication is that sometimes I want to double tap home but I triple tap it. This turns on VoiceOver, which takes a few extra seconds to kick in and then read the first element of the current screen. After that I’d need 2 more seconds to turn off VoiceOver.

On the iPad it’s a bit better because I use the three finger swipe to switch applications and I feel there’s less overhead.

Almost a year ago I started using Buffer. If you start from a page in Safari it grabs both the link and the title of a page and it even shortens the link. It essentially cuts 50% of the actions listed above. Not to mention it allows to schedule a tweet. A godsend.

But the burden of animation is still there, whenever you need grab some data from another app in the background. That second to switch to another app is not an eternity but it can become quite boring if you switch often.

A similar case is when you want to close apps on iOS. I do it probably twice a year, when my iPhone seems laggy. Double tap home and then swipe up all the apps, one by one. Try it, and you’ll see what I mean by “animations are in the way”. You can’t swipe an app before the previous animation has completed.

On iOS animations are usually not laggy. On Yosemite some animations can be quite slow, especially on old hardware. Here is a neat trick to speed them up a bit. Fortunately I never learned how to use Spaces? Why? Because if I switch to a new screen and I see a lag I am tempted to find the cause, instead of doing my job :)

Should Apple cancel all the animations on iOS and Mac OS X? No, but in some heavy switching scenario it might shorten the duration. Instead of using a canned value for the duration of animations, you could calculate how “intense” is the interaction (and specifically app switching) in a given time frame and speed up animations. I have talked about seconds, but when you pile them up they become minutes pretty quickly.

Or, somebody could make an app that builds a tweet by extracting data from a page and inject it in a template :)

Hit me up on Twitter if you agree or disagree.