Josh Collinsworth

Ten tips for better CSS transitions and animations

https://joshcollinsworth.com/blog/great-transitions#5-multiple-properties-multiple-easings

users may not realize what it is about the transitions or animations on our websites and apps, but they can keenly spot the difference between good and bad. They intuitively know when an app’s movement feels good, and when the impression is instead generic or unpolished—even if they can’t explain how or why.

• older link:
  Accessibility Beyond Code Compliance
• newer link:
  The yaml document from hell

---

Related contents with similar topics

1. 

   Bramus Van Damme

   Synchronize videos, 3D-models, etc. to Scroll-Driven Animations

   • Nicolas Hoizey
   • 24 June 2023
   • CSS, animation, scroll
   • 10 reactions

   With Scroll-Driven Animations it’s really easy to animate elements as they enter/exit/whatever. But what if you want to sync a video to that? Or maybe…

2. • Nicolas Hoizey
   • 7 April 2023
   • animation, CSS
   • 4 reactions
   • permalink

   Chrome 113 beta adds support for @​media (update: slow) (Firefox already has it), great to remove some animations.

   But can we @​supports a @​media to use it only if supported? I don't think so.

   How do you use new @​media features progressively?

3. 

   Stéphanie Walter

   Enhancing User Experience With CSS Animations

   • Nicolas Hoizey
   • 26 August 2020
   • CSS, animation, transition, UX

   Another amazing resource from Stéphanie, a detailed transcript of a talk she gave for Shift Remote. With CSS and JS progress, implementing animations…

4. 

   Cassie Evans

   Creating my logo animation

   • Nicolas Hoizey
   • 30 July 2019
   • CSS, SVG, animation

   Cassie Evans shares the multiple steps involved in the creation of the lovely animated logo of her personal website: There's a few things going on…