Breakdown of using Figma to illustrate and animate Vijay’s first NFT.
Making Magic Potions in @figmadesign. Here is a sneak peek of my first NFT collection @magikpotions, which I'm working on. illustrated and animated purely in Figma. Yes, we can create animation in Figma as well. Breakdown below 🧵 pic.twitter.com/LRHF7SChC4
— vijay vΞrma (@realvjy) November 6, 2021
Miggi created a single-point infinity sign, then Vijay came up with a cool animation. Team work 🙌
Beautiful effect! See also the source file at the Community.
“In this video, we will guide you on how to select a single frame from a Lottie animation from the LottieFiles Library and export it to Figma. Then, we will use this new SVG and place it as part of our UI and animate it in Figma using the prototype feature.”
Smart and delightful use of animation in the UI. See also the original file at Figma.
u/TheJMoore has been posting a lot of useful content on the r/FigmaDesign subreddit lately. This one compares animation easing styles side-by-side.
Import your Figma projects to Jitter, add animations easily, and export as a video or GIF. Check out this quick demo to see how it works.
til in @figmadesign: @miggi and I discovered that you can use gifs as MASKS in Figma. Like what?! 🤯 #figmatip
— Crystal T (@itscrystaltee) May 14, 2021
Here's a dancing gif (with transparent bg) masking a gradient gif: pic.twitter.com/x2gSryrw16
Hi everyone! Wanted to share something I'm excited for w/ interactive components in @figmadesign, overlapping animation!
— miggi from figgi (@miggi) February 26, 2021
Here I have three different interactive components using delay interactions to make bouncing circles with different timings. Let me know what you think! pic.twitter.com/xg6Dy3zmCP
Noah Jacobus pushes Figma’s capabilities beyond normal product design and uses it to draw, style, and animate the logo.
It’s no secret that I like @figmadesign a lot—it’s basically replaced my entire illustration & iconography pipeline. Even D&D maps! But I also try to push its capabilities beyond normal product design stuff and my own comfort zone.
— Noah Jacobus (@Jabronus) January 28, 2021
Drawn, styled, and animated in the Big Fig™ pic.twitter.com/2uFgiiB47T
Pavel Babkin shows examples of creating UI interactions, adding special effects, and even animating basic game characters with the Figma Motion plugin.
Figma @figmadesign protip: You can animate Angular gradients strokes. Make a simple loading animation by rotating the angle of the Angular gradient on a shape's stroke.
— miggi from figgi (@miggi) December 10, 2020
s/o to @annehelliott for the question & @BenMendelsohn for the rectangle. pic.twitter.com/aXe1y2DAak