April Fools’ Day. Remote design resources.
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
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
Quickly annotate your designs to indicate their status, like In Progress, Review, Approved, Develop, or Completed.
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
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
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.