In my opinion, the the animation space (and the concept of UI being 3Dish) isn't being explored enough. I don't think that designers should limit themselves to animations considered purely functional. There are many delightful and useful (or functional) animations which we don't know about unless we continue to experiment. I think experimentation to be important for animation given that there are a billion different movements that can be found in the nature. Not every app has to be made like a pilot instrument and I think we should have room for delight, though done tastefully.
Just what I wanted to say! Animation are like any other tool we use to make up a UI. It can be done poorly or brilliantly, depending on the designer.
What I see from your article is that you're advocating limiting animations to only essential ones. I disagree with this notion.
The design of interfaces has traditionally stemmed from two design fields, graphic design and Information architecture. While there are many 2D layouts one can make from these, the choice is still practically finite.
Animation stems from our perception of movement in nature. Our perception of movement in nature stems from science and physics. There are probably an infinite amounts of perceptions of movements, most of them having been undiscovered or yet to be proven from science.
I could argue that even Disney's principles of animations is a extremely simplified. It had to be simplified actually, because it was made in a time before sophisticated computer graphics and (computer) physics engines.
There's a whole universe (well quite literally) to explore in animation, but to say that even Disney's principles of animation is too excessive is severely limiting the potential for experimentation on animation in UI.
Pretty good points overall, BUT pretty misguided understanding of animation timing / easing.
Talking about easing as just 'ease-in' and 'ease-out' is naive. Not using an 'ease-in-out' is bogus. You can design eases/cushioning. Timing is the most critical fundamental in animation.
Great article Sophie!
I love this:
It’s almost like we’ve abandoned visual skeuomorphism and replaced it with behavioral skeuomorphism in which our digital objects act as though they are made from jelly, or dangling from invisible rubber bands.
I'd say it's more so superfluous rather than skeumorphic, but I definitely agree with the point.
I also really like the simple principles you outline in the article. I feel like there there aren't many relevant "best practices" for implementing subtle but effective animations within designs. The bar is being set with what's possible rather than what's effective. The Google material design guidelines do a pretty good job of explaining interactions and behavior, but don't really talk about the technical best practices for implementing: https://www.google.com/design/spec/animation/authentic-motion.html
Great article, would love to continue reading your thoughts!
I feel like that title is a very reductive look at what is said in the article and what animation can do to interactions on UI. The thing is: everyone is scared of being back in the days when Flash was the cool kid. When all the agencies fought to see which one had the most animated parts in one single webpage, only to be feature as super duper site of the day.
Our brains are wired to focus on things that move, so we need to learn to talk that language in the best way possible for the users. I myself find Disney's basic principles of animation to be a very useful resources to stat talking to that part of the brain avoiding the uncanny valley.
That was pretty awesome sir, In my opinion; Animation is something which really makes way to the entertainment apart from the movies and tv shows. CotoMovies is the best movie app which has many more animation videos as well.
@swarmapp "escalated quickly."
On the other hand, Tinder is the king of getting in the user's way with over the top and useless animations.
Facebook recently made photo browsing more difficult by introducing a blocking animation when dismissing an image. When you're browsing a photo album, that's new friction on a key action (view, dismiss, wait, view, dismiss, wait…).
The animation is fine. The blocking is not.