June 19th, 2015
I’m back with another UI animation review episode for All The Right Moves! This time we’re looking at animation in responsive design.
Animations often need some space to move in, and with responsive design we know the space we have available is going to change. Balancing those two factors can lead to some tricky design problems. In this episode I look at how five different sites adjust their animation design decisions for different screen sizes.
In this episode I review:
- Rally Interactive’s 3D folding navigation.
- WHYY’s Pension Stories and their stacking data illustration SVG animations.
- Si Digital’s full page scrolling animated illustration.
- Legomushroom’s Bubble navigation demo.
- The motion on Stripe’s Dashboard for iPhone page.
I cover all of these examples from a design and art direction perspective. There are other factors to consider when it comes to animation and responsive design, of course. Things like performance and screen resolution also play a part. I’m saving those for future episodes though!
Don’t forget to check out the past episodes of All The Right Moves.