A cool and creative way to use a component as a light controller.
Having a light controller for illustration, just because #figma pic.twitter.com/5LJFHbCBR0
— Papa Drag n' Drop (@kennethmahakim) April 21, 2022
Interesting way to organize a large Figma workspace using a department store floor map as a mental model.
FigJam is now available on iPad! Beta testing was announced back in January, and I’m really glad they started with FigJam. While I can’t see myself using the iPad for high-fidelity work, it’s perfect for making low-fidelity sketches with Apple Pencil or laying out flows. See the Twitter thread by Robert Bye, Product Manager of Mobile and Desktop Apps at Figma, on making some of these decisions while building the app.
Always love the events where Figma brings different Figmates for rapid-fire tips! “Whether you’re new to Figma or a pro yourself, tune in to get an inside look on how the teams who build Figma use Figma.”
An older educational video, but really thorough and detailed.
Joey Banks talks about his approach to organizing and naming in Figma.
Bruno Figueiredo talks to Miguel Cardona about his journey to the world of design, work at Figma, and design education.
Recently I’ve shared a few no-code tools for generating code from Figma mockups, but this one is different and works in reverse by generating Figma components and variants from your code and Storybook stories. Nifty idea!
”Product Manager Emily Lin shares the process of bringing FigJam to life, from beta to GA.“
Fons Mans recreated the latest designs from Apple, Instagram, and Shopify in Figma. Great educational resource.
“Push notifications have been around for over 10 years and come in all shapes and sizes on different devices and operating systems. This is your source of truth for the latest and greatest push anatomy.” See also an accompanying blog post, Design and Anatomy of a Push Notification 2022.
Super useful tip from Miguel — use Option‑W/A/S/D shortcuts (which you may know from gaming) to align elements or points in vector networks. The latter is going to be a massive time-saver for me!
Option (alt) + W,A,S,D (⬆️,⬅️,⬇️,➡️) align shortcuts in @figma can be used when editing vector paths / points. https://t.co/YvRDIZNMlB pic.twitter.com/giLDWMj30x
— miggi from figgi (@miggi) February 11, 2022
Really nuanced and detail-oriented recreation of a standard macOS button by Nathan Manousos.
In this tutorial, one of the designers from Noun Project gives a few quick tips on using Figma’s “Smart Animate” tool to animate icons in your UI.
One more service for publishing websites from Figma — love how vibrant that space is! Figment helps you add website effects such as videos, links, and animations to your Figma mockups. When finished, it publishes or exports your website’s code.
Makers is a Figma plugin to help you build and publish sites directly in Figma without writing any code. They even provide a few templates to speed up the process. Make sure to watch an impressive demo video.
The biggest Material You UI kit with more than 1,000 components, built to perfectly replicate the real-world, official Material Design Components library for Android 12.
Yet another great tutorial breaking down the process of creating an artwork by Fons Mans.
📣 Tutorial Thread!
— Fons Mans (@FonsMans) February 5, 2022
As promised, here’s the breakdown of my poster ‘Access Code’ —Learn how to create this visual in @figma
Let’s dive in 👇 pic.twitter.com/a9SWOYlrlP
Jan Six, creator of the powerful Figma Tokens plugin, joined forces with Marc Andrew, creator of a massive Cabana design system, to rebuild the system using tokens. It’s still an early version, but Jan talks about some of the benefits of the new approach in this article.
A collection of tips to help improve your design workflow in Figma.