Animated Interfaces Gaining Traction

I've been a fan of animated interfaces for years, going back to the amazing work that Sun's Self team did on the Self user interface. The Morphic^[1] user interface used in Self was interesting in a lot of ways, especially how it bent over backwards to make the interface feel alive and like you were truly directly manipulating the objects you were creating and working with, both as you programmed and as you used it. I particularly like how the team adapted traditional animation techniques for the UI, building off the years of experience traditional animators had in making cartoon animations feel "real"^[2].

I have been reminded recently of the various ways Self leveraged traditional animation to make the UI feel more solid and alive when I read articles about some of the new trends in adding motion to interfaces. Google's Material Design emphasizes motion, and Motion Design has been invading traditional 2D UI's. A few days ago I read Craig Dehner's Your App Login is Boring, Bring it to Life with Motion article (if you haven't read the article, or browsed his site, I encourage you to){% marginfigure "app-login" "assets/images/app-login-boring.png" "An example of what Craig talks about in his article" %}. I think Craig's points are really good, and his focus on what the animation is trying to convey that reinforces what's happening in the interface. Reading the two papers above and comparing them to Craig's post is worth your time.

Animation is not gloss or polish: used right it can make your interfaces easier to understand, clearer and more fun to use. The Self team demonstrated this 20 years ago, and it's nice to see modern UI designers continuing this work!