Figmalion logo

Figmalion is a curated newsletter collecting interesting links about Figma.

Issue #12

April 13, 2020

It seems like our industry is slowly adjusting to the new reality — projects are getting shipped, articles published, and plugins released. The team at Figma made a couple of small but impactful improvements to the app, including Styles support in Selection Colors. They even had a delightful April 1st update! Framer X introduced Figma importer, so now it’s easy to start designing in Figma and finish prototyping interactions in Framer X. This issue also includes remote design resources from the community, a collection of resume templates, and guide for note-taking in remote usability testing. Enjoy!

— Eugene

App Updates

Selection Colors has two new tricks

Click the target icon to select a color’s objects and change only them. Hit the styles icon to create a new style with a selected color, or apply an existing one.

New easier to read on-canvas measurement treatments

More visible white-on-red badges replaced old measurements set in red text.

Fantastic Cursors and Where to Find Them

On April Fun Day, Figma surprised all teams collaborating on documents with fun individual cursors. Check out the video demo shared by Emily Lin on Twitter.

What’s New

Remote Design Resources from the Community

Figma Community is coming together to share resources, learnings, and best practices as we learn new ways of working together remotely.

An inside look at how Figma ships product

Yuhki Yamashita, VP of Product at Figma, gives an inside look at how they designed the fastest way to keep an entire company up-to-date on the roadmap using a Coda doc.

Migrating to Figma: the business case, the process, and the libraries

Luis Ouriach from Upgrade Pack explains why and how their team migrated to Figma.

Figma makes note-taking in remote usability testing easy

Using virtual post-it notes in Figma to capture feedback and thoughts in remote usability testing.

Making Design Tokens A Single Source of Truth for Figma

A proposal for Figma to introduce Tokens panel with manually added values that can be reused across properties of objects and then exported to a developer-friendly format.

The UX of Figma plugins

Yuan Qing Lim shares ten heuristics for crafting plugins for Figma, based on his experience of building over a dozen of them.

Videos

Remote Design Sprints

Figma’s online event with Cheechee Lin from Dropbox and Viktoriia Leontieva from Microsoft, discussing how their teams perform remote sprints and share the ins and outs behind their community templates, designed to help teams who are adjusting to remote design.

Figma55

YouTube channel with Figma tutorials, all only 55 seconds long.

Podcasts

Versioning and Handoff in Figma

Design Details podcast shares tips and tricks for staying organized in Figma, simplifying the engineering handoff, and not getting bogged down in pages hell.

Tweets

Figma: A collection of resume templates from the community

So many great templates built with Auto Layout! The replies from the community are worth checking as well.

@zyumbik: Creating a full circular progress bar animation

As always, Gleb comes up with an incredibly creative way to push Figma’s limits.

@itsMeBennyB: Shortcut for cropping images

Good time saver. Alt/Option key only needs to be pressed if image fill isn't set to Crop; otherwise double-click is sufficient.

Plugins

Status Annotations

Status Annotations Quickly annotate your designs to indicate their status, like In Progress, Review, Approved, Develop, or Completed.

Arc

Arc It’s not as powerful as text on a path in Illustrator, but a great way to curve text upward, downward, or into a circle.

Looper

Looper Create incrementally changed copies of layers. Again, not a replacement for a missing Blend tool, but in some cases can produce a similar result.

Confetti

Confetti Generate beautiful confetti patterns.

Resources

Design sprint template for Confluence

Figma’s Confluence template for running a design sprint.

Figma Slack updates

Automatically post updates to a Slack channel each day with the updates from a Figma file's version history. Great for following updates to a design system, but requires some technical know-how.

💰 Cabana Design Kit

New UI design starter kit with a nice collection of components.

Coronicons COVID-19 Icon Pack

Free COVID-19 themed icons.

Feedback Kit

Feedback Kit by Mixpanel helps you ask for the type of feedback you need in a reliable and methodical way, while giving your team the tools to provide feedback in the way you're asking for.

Black Illustrations

Dozens of illustrations of black people, free for use in personal and commercial projects.

From the Headquarters

WFH: Winning From Home

Index Ventures asked experienced leaders from their portfolio companies, including Figma and Slack, to share their expertise and advice on working from home.

Building on our open platform: Design in Figma, prototype with Framer

Thanks to Figma’s commitment to open web, Framer X just introduced Figma importer. This is great news for people interested in interaction design and advanced prototyping.

Keeping that tight-knit feeling, at a distance

After starting working remotely during the pandemic, Figma’s top priority has been finding ways to stay connected while far apart. This article shows how they are making a remote team still feel real.

How Students Who Design set up Figma in their online classroom

Students Who Design is an online platform using Figma to teach product design. In this guest post, they go through students onboarding, organizing files, teaching classes, and providing project feedback all within Figma.

How to run a remote brainstorm

The team at Figma is exploring ways of working remotely. Alia Fite shares some ideas on how to kick off and run a remote brainstorm session.

Archive

Book “Designing in Figma”Designing in FigmaComing this summer