Screencast: UI Animation Reviews – Animation In Responsive Design

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:

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.

To learn more about web animation and using it in your own work, check out my course on CSS Animation and my UI animation resource page.

  • SamuliAlajarvela

    the WHYY link is broken, it’s missing a h from http

  • valhead

    Ah, good catch. Thanks! Fixed now :)

  • The bubble navigation demo link doesn’t work :<

  • J.Cox

    Funny responsive animation:

  • valhead

    Looks like there’s a problem with the pen itself, not the link. :( Hopefully it’s up and running again soon.

  • cool