@motiondotdev

The complete animation toolkit for the web. Formerly Framer Motion. Made by @mattgperry.

 Amsterdam
motion.dev
Joined March 2009
  • Tweets1.3K
  • Following7
  • Followers16.3K
231Media
Introducing Motion UI Gallery for React Eight beautiful built-in arrangements - or roll your own! Build custom detail views with automatic high-res asset transitions. 3D shared element transitions between every state, rendered completely in the DOM. Now in Motion+
1
2
1
67
4,152
Motion retweeted
Temi Pinheiro
@ndmhjt21m
Replying to @motiondotdev
@motiondotdev has been my de facto animation library for so long, it just feels great everywhere, and motion+ is honestly such a huge unlock as well with the amount of things they’ve built for you to just use. Great documentation and extremely intuitive too. No notes
Yanis Lebzar
@dev_ya22h
Bulk delete ✨ Drag to select, the files stack into one, undo deals them back out. Built with @motiondotdev
1
1
1
1
85
Motion profile updates: - Profile page redesign - New customisation options - Set profile to "Looking for work" - New Made with Motion feed - Motion+ Pro subscribers appear in new "Supported by" section in docs
2
2
24
1,067
Motion Studio 2.2 introduces support for reduced motion. If an animation *should* have a reduced motion version but doesn't, the button will show a warning color. In reduced motion mode you can make your own alternative or get Ultramotion to come up with one for you.
3
23
1,176
Apologies for the delay. Motion 14.2 introduces long-requested features to stagger(): Random, stagger from edge, and grid support.
3
1
107
2,875
Motion retweeted
Yuri
@MrBye32Oct 19
Meet GPUI Motion A Motion-inspired animation library for native Rust interfaces Springs, layout transitions, drag & snap, and animated text
13
49
6
872
21,377
1
1
46
2,431
Motion retweeted
Yanis Lebzar
@dev_yaOct 19
Delete interaction ✨ The undo grows out of the button you pressed. Confirm on the same spot. Built with @motiondotdev
5
5
81
2,630
Lenis by @darkroomdevs is *the* smooth scroll library. You're wiring it up to Motion wrong. So were we - check our new Motion x Lenis guide for the latest guidance. motion.dev/docs/lenis
2
8
2
66
3,571
Typewriter: Create natural typing animations based on real research into how typing cadence varies based on what's being typed. In Motion UI for React, Vue, and now - vanilla JS too.
1
2
54
2,355
Just published a bunch of Gallery examples and Motion UI sections, ready to drop straight into your project.
2
1
15
1,197
Read the full Gallery announcement: motion.dev/magazine/introduc…

Introducing Motion UI Gallery | Motion Magazine

Meet the Motion UI Gallery for React. Eight 2D and 3D arrangements, detail views and gestures that all transition smoothly into each other.

motion.dev
1
297
When developing Gallery, main goal was to get all the 2D and 3D arrangements animating smoothly between each other. The technical term for the naive approach is "absolutely fucking mental mate" - images flying everywhere. The final component allows grouped movement only.
4
1
18
1,949
Motion retweeted
Motion
@motiondotdevOct 15
Replying to @note_no196973
The problem is all transforms have to be animated together. Even when using translate instead of transform x and y need to start and stop at the same time and use the same transition settings Motion has never had this limitation but when animating x and y it happens on the main thread. But now these animations happen on the compositor - something CSS can’t do.
1
1
4
492
Motion 14.2 automatically hardware accelerates independent transforms. Animate x, y, scaleX, rotateZ etc, all with different transition settings, entirely on the compositor 🚀
5
4
94
2,512
Detail views can essentially be anything, and be anywhere. The shelf is optional. Add custom data and arrange it however you like. Close with headless physical buttons or with esc.
1
1
180
Gallery is available to all Motion+ members now. Initially for React, with a Vue version coming soon. Check out the docs: motion.dev/docs/react-galler…

React 3D gallery component | Motion for React

Build 3D image galleries in React: lists, grids, barrels, coverflow, helixes, rings, spheres and card stacks, with drag, wheel and keyboard, detail views and velocity effects.

motion.dev
162
Load more