Issue #29 • December 14th, 2020

Figma’s 5th Birthday. Maker Week.

Figma celebrated five years since its public launch! Before that, a small team been working on it for over three years. Dylan Field wrote an excellent essay, “Meet us in the browser”, on their choice of the platform, the initial negative reactions, and a cultural change it delivered. Figma also ran its biannual Maker Week, and while the event is internal, I collected a few publicly shared projects and experiments.

I’m taking some time off during the holidays, so the next issue will be sent on January 4th, 2021. Happy holidays! 🎄

— Eugene

P.S. Readwise is one of my new favorite apps, and they’re currently looking for a Principal Product Designer. Passion for Figma is one of the requirements! They didn’t pay me to share this, but as a user I have skin in the game and want them to find someone great 😎

App Updates

See what you’re typing

Text color now defaults to white when typed on a dark canvas.

New prototype action: Scroll to

Scroll to selected objects or layers within the same top-level frame.

Figma Scroll to Playground

Use scroll interactions to create fast navigation of your designs. This playground will walk you through everything you need to know to help users explore landing pages, carousels, and more.

#Prototyping

Figma Tutorial: Horizontal & Vertical Scrolling

Sebastiaan Schillebeeckx quickly recorded a tutorial on using Scroll To in prototyping. BTW, great choice of the book on his desk! 😉

#Prototyping

Using ScrollTo Interactions to traverse spaces

As soon as Figma releases something new, Miguel Cardona comes up with a great use case.

Using Figma

How to make tables in Figma 2020 — finally well (AutoLayout 3.0 update)

Using the power of AutoLayout 3 to build a table with reorderable and resizable columns and rows.

#Auto Layout

The only Figma plugins you need for your workflow

A comprehensive list of Figma plugins for an overall design process.

#Plugins

Our Favorite Figma Plugins

A few plugin recommendations for working with content and data from the team at Simple Thread.

#Plugins

Creating and Using Variants in Figma

A new video by MDS.

Figma’s Auto Layout

Pablo Stanley released the first chapter of his Figma Crash course with five videos on Auto Layout.

Figma in 5: Auto Layout

A new video in Rogie’s short video series.

Figma For Beginners

New introductory videos from Figma, with four parts focused on exploring ideas, creating designs, building prototypes, and preparing files for handoff.

#Tutorials

Hiding only Layers panel

Miguel Cardona with a good tip: use Cmd-Shift-\ to hide the Layers panel, and Cmd-\ to hide both panels when sharing a screen.

Animate Angular gradient strokes

And another tip from Miguel for making simple animated spinners.

Change Starting Frame in a prototype

Nifty little time-saver.

#Prototyping

Change text block to Auto Width

It’s not clear from the video, but all it takes is a double-click anywhere on a text frame.

#Text & Typography

Hack to create a zero width/height frame

A smart hack that can be useful with Auto Layout. (In the last issue, I included a different solution.)

#Auto Layout

Community

Dark Figma

I haven’t tried it myself, but know that many people desperately want it. It’s a side project made by Giel, so the app is different from the official client.

Synth Circuitry

Justin Mezzell with a complex circuity illustration with lots of neon glow.

#Made in Figma

The Child / Baby Yoda

Another incredible illustration by Joey Lamelas.

Cup Icon

What a fun application of Variants!

3D shapes

This Community template by Vic includes 9 different 3D shapes, each in 10 color variations, that could be used in your designs.

FontBot

FontBot automatically generates your very own font from a single shape, line, or object.

Holiday Cards

Beautiful holiday-themed cards made in Figma.

#Made in Figma

Plugins

Chikin Icons For Everything

Bureau Gorbunov is one of my all-time favorite design companies. Its designer Sergey Chikin has been drawing a new icon every day for over three years, and now this set is available as a plugin. 266 icons are completely free, and the commercial license includes over 1,200 icons.

#Icons

Maker Week

Four competing “houses”

Dylan Field introduces four “houses” on Day 1 of Figma’s biannual Maker Week.

Making a house mascot

Seems like the Haus of Jorts has won this competition!

#Maker Week

One Hundred Patterns

Toni Gemayel runs an open design experiment to collaboratively create 100 patterns.

Variants Pal plugin concept

Alex built a plugin concept to automatically generate missing variants and add labels.

Gameboy emulator

Sawyer Hood made a plugin that runs a Gameboy emulator inside of Figma and renders the output as vectors to the canvas. Not available in the community yet, but the source is already on GitHub.

Play Asteroids in Figma

Another Maker Week project — a plugin to play Asteroids with friends.

Virtual Office

A fun team exercise to express themselves.

#Maker Week

Backstage

Meet us in the browser

Great essay by Dylan Field on their decision to build Figma in the browser. “Initially I didn’t understand the negative reactions to Figma’s closed beta launch. I only saw the obvious benefits: a single source of truth for files, cross platform support, and multiplayer editing. Now I understand that the power of the browser lies in the broader cultural change it delivers — and this change can be scary. The browser is natively multiplayer. It forces a mindset shift on access. It strips away the need for expensive hardware. And it pushes us to embrace working together, especially when we are blocked and our default might be to hide.”

#Dylan Field

Adding it all up: the math behind designing your career

In this guest post Kylie Poppen, Design Lead at Google, shares a framework for thinking about the 90,000 hours that make up your career — whether you’re looking for a new role, hiring for your team, or just evaluating your next step.

#Google

App Updates

Using Figma

Community

Plugins

Maker Week

Backstage

Subscribe

Subscribe to a weekly roundup of news and resources in Figma and the design tools community

Features

Topics

Products

Design Tools

Figmalion