Interesting talk by Zeplin’s co-founder and Head of Product Berk Cebi on the evolution of design systems over the last 10 years, the role that design tools play in this process, and the unfortunate disconnect between our design components, code, and documentation. He suggests design tokens may be one of the potential solutions and shows how they can be used to connect the parts of the design system.
I’m not a big fan of Sketch’s “Sketch vs Figma” page, but I had a big laugh over this. Highly resourceful.
Figma vs Sketch vs 🥊 Sketch vs Figma pic.twitter.com/pmIY68uOqT
— Valentin Chrétien 🇺🇦 (@valentinchrt) July 5, 2022
The team at LottieFiles explains how to recreate an animation from Apple’s iPad mini website.
Cool update to a LottieFiles plugin: “Instantly change the colors of your animation. Apply your own custom colors, or try out our carefully curated preset color palettes.”
“In this tutorial, we redesigned SVBs banking dashboard using Anima’s open source Component Library for Figma, then connected our data using Strapi’s headless CMS. Now you can launch fullstack React apps at lightning speed using the same approach.”
Join to hear from the team at Coda and learn about their regular “design jams.” In this talk, Helena, Alicia, and Steve will share stories of using jams for everything from team building, to brainstorming without restraints, and even gathering input from the full company.
Great set of FigJam templates that the Figma team uses for roadmap reviews, brainstorms, team retrospectives, and product roadmap timelines.
Cool widget recommendations by Zander Whitehurst: Voice Memo, Storymapper, and FigJenda.
🎁 3 wicked Figjam widgets in @figma pic.twitter.com/3VldjuzczV
— Zander Whitehurst (@zander_supafast) June 8, 2022
SystemFlow is a lightweight landing page UI kit with hundreds of components and sections that are easy to use and customize. I wrote about it back in issue 28 almost two years ago, but they’ve just released a major new version and added support for the latest Figma features. If that wasn’t enough, it also has a matching Webflow kit for building your designs.
Charli Marie helps get started with using FigJam by introducing the tools for creating user flows, sitemaps, wireframes, and brainstorming activities.
“I’m thrilled to announce that Storybook Connect for Figma is now in beta. It’s a Figma plugin which brings your stories into the design workspace. That streamlines design handoff and UI review because teams can reference code components alongside their designs.”
Charlie Marie explains why she values and uses both Figma and Webflow in her process.
Nice trick on using “after delay” animation in combination with a Lottie file to avoid an infinite animation loop and play it only once.
Ready for a @figma prototyping pro tip?
— Ridd 🏛 (@Ridderingand) February 21, 2022
Use interactive components w/ @LottieFiles
It's the best way to add animations to your design system
Here's how it works 👇 pic.twitter.com/A4oxSfefJW
Three new features in FigJam: washi tape (which was first introduced as an April Fools’ joke!), fun chat, and new stickers.
More ways for teams to customize their workspace and freely express themselves: organize documents into Sections, more colors (including adding your own!), sticky note resizing, and more.
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.
Manually update widgets that are already placed on a board.
Several updates to make brainstorming and diagraming even easier in FigJam: a simplified toolbar, text resizing, sticky stamps and highlights, image borders, and more.
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.“