The UI Animation Newsletter
vol 19.22 • June 7, 2019 • Twitter / Subscribe / Archives 

Happy Friday! I’m writing this from San Francisco where I'm spending a couple of days after the very wonderful Layers Conf earlier this week. I had a great time talking UI animation with everyone there! 

This week’s issues covers a couple of different ways to animate in React, David DeSandro’s new Zdog library for faking 3D in SVG, and some handy CSS animation tricks as well.

Until next week,

- Val

p.s. Replies go straight to my email, and I read them all. Tell me about what you’re working on.





The rendering of Panic’s game console on this site is very fluid and convincing. You can almost feel what it would be like to hold it in your hand. Scroll down for an animated version of it too.

A heart-filled self portrait

Self portrait (interactive)
A fun self portrait avatar by Dusty Button, drawn and animated in CSS.

brightly coloured planet with lines

Zdog Space Scene
A colourful spinning planet by Jack Rugile built with the Zdog library linked below.

Sun and earth in space

Sun and earth
A very impressive rendition of the Sun and the Earth with SVG filters and canvas by Jesper Lauridsen.



Simple animations in React
A look at a set of React components designed to make animation in React just a bit simpler.


Creating animations using React Spring
Animating with springs is fun, and you can use them in React with React Spring. Kingsley Silas shows you how in this CSS Tricks article.

A designer friendly pseudo-3D library for SVG and canvas from David DeSandro.

CSS animation loops
A helpful Pen for automating a way to add a delay between infinitely loops of animations from Carrie Scono.


CSS text cutting hover effect
A neat CSS hover effect that splits your text in half as you hover.



I’ll be at these events in the next few months. If you’re there too, come say hi!

An Event Apart DC
July 29-31

San Francisco, Aug 20-21

An Event Apart Chicago
Aug 26-28

Smashing Conf
Freiburg, Sept 9-10

Support the UI Animation Newsletter: 
Submit a link for a future issue  or  Share it with a friend

Copyright © 2019

You can update your preferences or unsubscribe from this list here.