Curators
Submit
Wall of ❤︎
X
LinkedIn
Instagram
Resources for Motion
60 resources
Figma
Animate It – Create animated smart components from preset quickly
Framer
Crazy Galaxy Button Hover Animation in Framer
Figma
inima – Generate animated UI motion prototype to GIF/APNG/Keyframes
Learning
Loading Spinner UI Design Tips and Tricks
Learning
Courses – Motion for React (Prev Framer Motion)
UI Design
Unicorn studio — No-code WebGL Tool
Learning
Great Animations
Figma
Animate on Path
Inspiration
The Essential Design – Digital archive of contemporary design
Learning
Designing Depth- Techniques to add depth in visual and digital design
Framer
MotionNumber for Framer Motion
Framer
Easing Graphs – Apply CSS easing for smooth animations
Learning
Transition animations: a practical guide
Inspiration
Interactions by Nitish Khagwal
Learning
Animation on the web
Learning
FreeFrontend – CSS Examples
Tutorials
Create Responsive Website Designs | Figma Tutorial
Tutorials
Figma Tutorial: 3D Carousel Slider (+ free files)
Tutorials
Spinning Carousel Animation in Figma – Full Tutorial + Free Files
Tutorials
Figma Parallax Effect – Full Tutorial + Free Figma Files
Learning
Including Animation In Your Design System
Learning
Lightning Design System – Animation Style Guidelines
Learning
Readymag Design Almanac – Animation
Learning
Animation in Design Systems
Learning
The Role of Animation and Motion in UX
UI Design
Cubic Bezier
Learning
Designing Interface Animation
Learning
IBM Design Language – Animation
Learning
Motion in UX Design: 6 Effective Types of Web Animation
Learning
UI Animation—How to Apply Disney’s 12 Principles of Animation to UI Design
1
2
→
