今日已更新 412 条资讯 | 累计 19972 条内容
关于我们

MotionKit Figma Motion: import, sync, and push native animation (yes, even baked physics)

Shayan 2026年06月28日 08:19 2 次阅读 来源:Dev.to

Figma shipped native Motion. A real animation timeline, right inside the file. When that landed, a lot of people emailed me some version of the same question: "is MotionKit dead now?" Fair question. My honest first reaction was a quiet "...maybe." But the more I used native Motion, the clearer it got — it's genuinely good, and it's not trying to be everything. No physics. No frame-by-frame. No Lottie export. No morphing. So the move was never to compete with it. The move was to bridge to it — let the two tools hand work back and forth, and let MotionKit be the power layer that does the stuff native Motion can't. So that's what this update is. A two-way bridge between MotionKit and Figma's native Motion. Here's everything it does, and exactly how to use it. The short version Four moves, one little control in the header: Import native Motion into MotionKit as real, editable keyframes Live sync (read-only by default) so changes in Figma Motion flow into MotionKit as you work Link for export so your native Motion renders inside a Lottie without duplicating anything Push MotionKit keyframes back into native Motion — including motion you baked from the physics engine And the headline trick: bake a real physics drop in MotionKit, then push it into Figma Motion as native keyframes. Native Motion has no physics engine. Now it kind of does. First, find the bridge Look at the top-right of the toolbar, next to the Pro star. There's a small badge: the MotionKit diamond, an arrow, and the Figma logo . That little arrow is the status. You don't have to open anything to read it: faint dotted line → not connected arrow pointing into MotionKit → reading from Figma, live, read-only arrows on both ends → two-way, MotionKit also writes back If there's native Motion sitting on the current frame but you haven't connected, you'll see a small purple dot on the Figma side — that's "hey, there's something here to import." Click the badge to open the bridge. That's the whole mental model. Dire

本文内容来源于互联网,版权归原作者所有
查看原文