#Features

Lo-fi Wireframe Kit for Figma

A robust library of over a hundred wireframing components to faster explore more ideas.

Overflow

A service for creating interactive user flow diagrams and design presentations from Figma, Sketch, or Adobe XD mockups.

GIF

A plugin by Rogie to play GIF animations in the editor (!), make memes, and export animated GIFs straight from Figma.

Figma Low Code – A New Way to Tackle Design Hand-Offs

β€œFigma-Low-Code is an open-source project that enables the direct inclusion of Figma designs in Vue applications. By ensuring that the Figma design stays the single source of truth, this approach reduces the need for design hand-offs and front-end code significantly.”

New Instance Swap Menu and Inspect Tab

Two features announced on the Config Europe are already live! New Instance Swap menu and updated Inspect tab help both designers and developers navigate large, complex libraries in Figma.

Figma now uses up to 2,000% less memory

Huge performance improvement.

On pitching and presenting

β€œSince presenting is a large part of both client-facing work and startup-building, Abigail spent the first three years of college refining her presentation skills in front of a variety of audiences: toy designers, vehicle inventors, entertainment executives, and more. Below, she shares her tips for developing and delivering a presentation that lands.”

TinyImage Compressor

I rarely write about plugin updates, but this one is exciting β€” TinyImage Compressor added support for AVIF image format. If you haven’t heard about it before, check out the blog post β€‹β€œAVIF has landed” from a developer advocate for Google Chrome.

A vector stroke marker pack for Figma

Cool-looking collection of vector strokes.

Keyboard Stickers with Figma Shortcuts

Great help if you’ve been trying to memorize the shortcuts.

An easier way to manage tabular data

A smart combination of using components and Auto Layout.

Getting Started with Figma Webhooks

This is a great addition to the previous article. β€‹β€œWebhooks offer a first-class way to react to changes in Figma. In this article, we’ll build a small service in Node to listen for these events.”

How to Automate Design Tokens in a Design System

Somehow I missed this article earlier this year, but it’s a good resource for creating an automated process to keep design tokens of the design tool in sync with the code behind it. They achieve this by setting up a Node.js server that generates Sass and Tailwind files with all the variables from the Figma API.

Updated Fonts

β€œAll Google Fonts, Inter, Noto, Font Awesome 5 Free, and Font Awesome 5 Brands have been updated.”

Design like you code with Auto Layout

β€œElements can fill their containers in both directions; you can set independent padding values; and items can be set to space between.” (Coming in November.)

Drag and drop Interactive Components into prototypes

β€œAdd interactions between component variations in your design system and reuse them in your prototypes with no extra work.” (Launching in January 2021.)

Excited about creating variants?

Luis shows how converting the whole GitHub Primer buttons library to variants took less than a minute.

Bridging code and design components with Variants

β€œCombine variations of the same component for different interactive states, colors, and sizes to mirror your front-end code and simplify your asset library.” (Coming in November.)

Embracing the tension between code and design

Announcements from the above keynote, presented as a blog post. β€‹β€œWe believe in embracing concepts from engineering and design, adopting the rigor and reusability of code while preserving the rapid iteration and uninhibited exploration that makes visual design so powerful. […] When code and design components mirror each other, teams can move much more efficiently. Today, we announced Variants, Interactive Components, and improvements to Auto Layout that will allow teams to do just that.”

A new experience for Figma Organization admins

Figma redesigned admin settings for Figma Organizations. To introduce the changes, they recorded the whole playlist of demo videos.

Features

Topics

Design Tools

Figmalion

Issues:
207
Links:
3,743