✳flâneur — a map of the web's best reading
On UI Animations - Shu Ding
shud.in · 559 words · saved by 1 readers
Some unpolished quick notes on when and how we should design and use UI animations in a web application.
On UI Animations Thanks Paco for bringing up this great topic, and creating the outline of this article while we brainstorming the animation part of our design system . Here're some personal notes that I think worth writing down. # Common Transition Values as Design Tokens Using CSS variables for animations will be very helpful for most of our use cases. I personally prefer ease with a small duration (~200ms) as the CSS transition setup, but we can define our own easing function too as design tokens. # Transitions in Contexts There are two types of transitions: A. Styles (opacity, color, backg
Explore this link on the map →related reading
- Details That Make Interfaces Feel Betterjakub.kr
- Mediumuxdesign.cc
- An Interactive Guide to CSS Transitions • Josh W. Comeaujoshwcomeau.com
- Say precisely what you mean.index.how
- 7 Practical Animation Tipsemilkowal.ski
- Details That Make Interfaces Feel Betterinterfaces.dev
- Motion Graphic Design & Animation Principles Website - Zajno Digital Studiomotion.zajno.com
- The Easing Blueprintanimations.dev
- Transitionsanimations.dev
- Invisible Details of Interaction Designrauno.me
- You Don't Need Animationsemilkowal.ski
- Web Interface Guidelinesvercel.com