Animation

Another collection of front-end docs, guides, and other learning resources for various technologies in front-end development.

In this first article of a series on dynamic DOM animation, Maria Antonietta Perna explores Anime.js, a new library to make the web come to life. 

Simon Codrington looks at how to animate individual characters using CSS animations and some simple jQuery.

Artem Tabalin shows you how to improve the performance of your CSS animations by taking advantage of hardware acceleration.

Last week Tiffany Brown, author of CSS Master, joined us on the forums for a Q&A session discussing CSS Animations. Read the highlights of her conversation.

With the help of some audio software, Mihaela Jurkovic demonstrates how to sync CSS animations with HTML5 audio for some potentially useful effects.

In this screencast I'm going to show you how to refactor your CSS to improve and smoothen your animations.

In 2015 it's no longer enough for interface elements to instantly switch between two static states. Petras has 7 tips for making your interactions sing!

In this video we'll look at CSS animations, frame rates, and why some CSS properties are better to animate than others.

George uses the checkbox hack and demonstrates how to create a show more/less component with CSS and no JavaScript.

Browser repaints and reflows are expensive and affect your application's performance. Craig provides ten tips to help improve responsiveness.

It's 2015 and mobile browser numbers have officially surpassed their desktop cousins. Gabrielle looks at 5 mobile design trends that are shaping the market.

Simon Codrington looks at techniques and advice on how to create menus in your website project that are optimized for usage on mobile devices.

Tom Bennet uses his love for video games to show us how to create responsive CSS sprites using ImageMagick and the GreenSock JavaScript animation library.

You've probably created CSS3 animations. But have you used the animation-fill-mode property and all its possible values? Louis takes a look, with visuals.

It's almost a year since Google launched 'Google Web Designer'. Zack takes it for a workout to see how it stacks up with a real-world project.

We rely on JavaScript for almost everything that involves dynamic elements and interactions. Tim Evko explores how to build such elements with just CSS.

Paul Wilkins is back with a summary of the best in web development news from the week that was.

Paul Wilkins shares the best from the web over the last week, including animation, hyperlapse and the question of whether JavaScript sucks.

Think you're pretty handy with CSS? Welcome to the Challenge #1: Recreate this GIF in code -- most elegant solution wins.

Scott O'Hara shows us some neat things you can do with CSS, creating stuff you would normally need lots of JavaScript to produce.

Firefox OS allows you to create apps with HTML and JavaScript and the same applies to games, lets create one with Ionic!

Getting your head around CSS animation can be tricky but Elio has a great tool to get you started. Bounce.js is free, funky and functional.

This article shows how CSS animations can be incorporated into common AngularJS directives.

Read On Our Radar: Android's Material, Better Design, and Refactoring and learn with SitePoint. Our web development and design tutorials, courses, and books will teach you HTML, CSS, JavaScript, PHP, Python, and more.

Your production CSS should always be minified, right? However, beware of optimization behavior that could affect your lovely animations.

Stencyl is a platform for creating games without writing a line of code, providing a simple drag and drop interface that will get you creating ideas faster.

Jay Raj introduces the AniJS library walking through a simple tutorial to demonstrate how to add animations to a login/register page.

This article covers the Move.js library which is used to create CSS animations in JavaScript.

Animator and CSS sorcerer Rachel Nabors spent some time with us talking about the future of animation on the web before her FOWD workshop in April.