Animation in Responsive Design

Val head looks at a few basic items to focus on when ensuring your animations work across every viewport. Start with the Art Direction, when you hit smaller screens your 100px movement is suddenly 30 of the screen size to think about dialling that back a bit. Look at Choreography as well because what could be a horizontal animation on the desktop might need to become a vertical animation on smaller screens. Finally, and most importantly, focus on performance.

Animation and responsive design can sometimes feel like they’re at odds with each other. Animation often needs space to do its thing, but RWD tells us that the amount of space we’ll have available is going to change a lot. Balancing that can lead to some tricky animation situations.

An excerpt from Animation in Responsive Design

View original article

Subscribe to our Newsletter

Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.