Micro-interactions are small animations that delight our users and they are changing the way we design and build our applications. Micro-interactions have many benefits like enhancing perceived performance, indicating state change, and drawing users’ attention to something on the page. Today we’ll dive into micro-interactions and the animation libraries you can use to build them.

Show Notes

02:25 - What are micro-interactions?

05:48 - Why are they important?

10:55 - How do we build one?

29:07 - Animation libraries

33:16 - Shoutouts

Resources

CSS Animation Libraries

Eli Fitch’s Perceived Performance

UI Movement

Bad UI

Ladybug Performance

Scott Tolinski React Spring Course

Sarah Drasner

Hover.css

Greensock

React Spring

Framer Motion

Anime.js

Velocity

Three.js

Mo.js

Humble PI

Bon Appetit Test Kitchen

Transcript

Here is the transcript for this week's episode.

Podden och tillhörande omslagsbild på den här sidan tillhör Emma Bostian, Sidney Buckner, Kelly Vaughn, and Ali Spittel. Innehållet i podden är skapat av Emma Bostian, Sidney Buckner, Kelly Vaughn, and Ali Spittel och inte av, eller tillsammans med, Poddtoppen.