Book announcement. Figma raises $50M in Series D.
Folks, it’s a big day around here! For the last few months, I’ve been working on a book about Figma and finally ready to talk about it publicly. “Designing in Figma” is a complete guide to using the app and designing with reusable components and styles. It dives deep into every topic and filled with tricks that I collected while writing this newsletter. The book is coming later this summer, and it would mean a lot to me if you help spread the word and subscribe to updates.
— Eugene
P.S. I’m trying a new format in this issue. Instead of grouping links by source, I organized them by topic. Let me know what you think on Twitter or by replying to this email.
App Updates
What’s New in Figma
Figma’s VP of Product Yuhki Yamashita and special guests recap recent releases and give a few sneak peeks for what’s coming soon.
Figma Desktop App Beta
A beta channel for the desktop app is now available — you can run it side-by-side with the existing stable desktop app.
Hide Figma Toolbar & Footer in Presentation View
You can now turn off the Figma toolbar and footer in Presentation View without going full screen.
Preview All Pages in Figma Community Files
Nice update. Duplicating files just to see what’s inside was quite annoying.
Figma Raises $50M in Series D
Figma’s Series D Round
Dylan Field: “Today, I’m excited to share that Figma has raised a $50M Series D round of funding, led by Peter Levine and Marc Andreessen at a16z.”
Investing in Figma: The Decade of Design
Andreessen Horowitz: “Figma puts all the pieces together, and into more than the sum of those parts. What used to take four or five discrete tools can now be done end-to-end in Figma, the single source of “truth” for product design and design systems. […] Their community has taken off with a product-led virality that I haven’t seen since GitHub — extending beyond product designers and into product managers, marketers, and engineers.”
Figma Eyes Acquisitions, New Tools With $50 Million in Fresh Funding at $2 Billion Valuation
Forbes: “But Figma also plans to use the money to consider acquisitions and “acquihires,” in which a company will purchase a startup not for its intellectual property, but for its talent, as part of Figma’s next phase of expansion.”
Figma Raises $50 Million Series D Led by Andreessen Horowitz
“A spokesperson told TechCrunch that this deal was “opportunistic,” and that the company was in a strong cash position pre-financing. The new funding expands Figma’s runway during these uncertain times, with coronavirus halting a lot of enterprise purchasing and ultimately slowing growth of some rising enterprise players. “ Also interesting: “Field also added that he has not met other investors in this round in person, and the vast majority of the deal was done over Zoom.”
Using Figma
Tips and Tricks for Prototyping in Figma
Good tips on creating custom transitions, handling and organizing multiple flows in a prototype, and communicating during developer handoff.
In the File: How to Use Auto Layout and Other Features to Make Life Better
Ramy Majouji, Product Designer at Glossier, and Joey Banks, Designer Advocate at Figma, show how they use Auto Layout and other features to speed workflows up.
In the File: Get Closer With Your Developer in Figma
Helena Jaramillo from Coda and Silvia Tueros-Cossio from Stash share how they convinced their developers to join them in Figma and what that collaboration looks like.
Build It in Figma: Designing a Cocktail Recipe Mobile App, Part 2
Figma’s Designer Advocate Rogie King continues streaming the process of designing a cocktail recipe app. This part focuses on typography, colors, and style, while Part 3 brings at all together with additional views, prototypes, and transitions.
@Rogie: What are your best Figma tricks?
Great collection of tips and tricks from the community.
@NotChristos: Library Analytics
An interesting thread on how Analytics can help make informed decisions when changing the design system. Too bad it’s available only on the Organization plan.
9 Smart Animate Examples
Great demos of the most popular animations.
Switching to Figma
10 Designers Share 10 Reasons Why Figma Is an Essential Tool for Design Collaboration
Because of COVID-19, the design team at YML had to adjust quickly to a new reality of remote work. They switched from Sketch to Figma as so much of their work relies on collaboration, and now their team shares why.
COVID-19 Forced Airbnb to Rethink Its Product Offerings; Here’s Some of What It Came up With
Airbnb’s chief design officer Alex Schleifer talked to TechCrunch. An interesting insight into how Figma helped them ship new features while working remotely: “We like to use as few tools as possible, but Figma is a game changer because people can see decisions being made live.”
Building Tools for Figma
Building a Figma Plugin
Cory Etzkorn shares his experience with building Faker plugin. Overall it’s a good summary of work involved in shipping Figma plugin.
How Did I Challenge the Imposter Syndrome to Design (Yet Another) Figma Kit?
Alessio Calvo talks about fears and motivation for building his first side project, Artisan Kit for Figma.
How to Build a Design Starter Kit in Figma (Part Two)
Part 1 covered color palettes, typography styles, and shadows. In this part, Marc talks about icon sets.
Plugins
Fix Your Mess
Finds detached component instances in your document, so you can decide what to do with them.
Office Hours: Figma Plugin Showcase, Part 2
Designer Advocates Tom Lowry and Rogie King talk about their favorite Figma plugins. Here is a list of all discussed plugins.
Syncing Live Spreadsheet Data With Google Sync
Short tutorial on syncing live spreadsheet data using Google Sheets Sync plugin. Part 2 covers ordering data, hiding cells, and swapping components.
Integrations
How to Turn a Figma Project Into a Framer Prototype
Framer Web team shows how to move from visual design to interactive prototyping in minutes, thanks to their recently announced Figma importer.
Bridge Design and Development With the New Zeplin Integration
Zeplin redesigned their Figma plugin, improving export experience and solving some of the performance issues.
Community Projects
Microsoft Fluent
The Microsoft team just published four files of icons and components for their open design system, Fluent, on Android, iOS, and web.
Brainstorming Table Design System
A collection of components for designing tables.
The Unigrid by Massimo Vignelli
Project showcasing and explaining The Unigrid System, created by Massimo Vignelli for U.S. National Park Service.
Figma Internals
@DannPetty: Vector brush strokes in Figma
No idea how that will work, but seems really interesting.
How Figma Uses Font Metrics
A description of how Figma calculates font metrics, for font foundries and type designers.
From the Headquarters
Inside Figma: The Product Design Team’s Process
Noah Levin, Design Director at Figma, dives deep into their day-to-day operations — meeting cadences, rituals, and anything else that helps the design team stay connected and efficient.