Figma Flow. Figmac. Design Lint.
Figma’s first user conference Config is happening this Thursday, and even while after some pondering I decided not to attend, FOMO is high now. Lineup of speakers looks great, so make sure to register for a livestream of morning keynotes. In the meantime, this issue will fill you in on a collaboration model, syncing colors from Figma to GitHub files, what a native macOS app may (or even currently does!) look like, an interview with the CEO of Figma, an introduction of community remixes, and follow-up on recent outages. Enjoy the links and the conference, if you’re going!
— Eugene
Sponsor
Folyo: A Referral Newsletter for Freelancers
Not getting enough leads? No time for marketing? Try Folyo, the referral newsletter with over 8,500+ vetted freelancers & agencies, sharing projects daily.
What’s New
Figma Flow: Developers & Designers Speaking in One language
An interesting model for collaboration in Figma, borrowing the best practices from the software development world. It defines a process where the team is solving one problem at a time by structuring the project in a specific way, applying naming conventions, and using version control.
My Figma Wish List: 10 Features to Build in 2020
All excellent and highly practical ideas. Can’t wait to see what Figma team decides to tackle this year!
Figmac
“A lightweight Figma desktop app that delivers a more natural Mac experience.” Developer shares why and how he built the app in a blog post Making Figma feel more at home on the Mac.
Adobe XD vs Sketch vs Figma vs InVision — 2020 Comparison
Figma wins in this comparison, but I’m most happy about seeing a solid competition from newer contenders.
How to Synchronize Your Style Guide From Figma to CSS in One Click
Detailed step by step guide on how to build a private Figma plugin that will sync colors from your Figma library to a file with CSS variables on GitHub. Nice automation!
Create a Figma Plugin Using TypeScript
A small collection of videos on Egghead about building Figma plugins.
Tweets
Do you know how to select layers in Figma?
Gleb Sabirzyanov shares all known ways to select layers. There are more than you might have expected!
What are your favorite plugins?
Lots of great recommendations on Dann Petty’s Twitter.
What if Figma was a native macOS app?
That dark theme looks damn fine.
A sticker celebrating one team’s switch to Figma
Well, this is a fun way to celebrate a switch!
Where is the line between a PM’s and a product designer’s role?
Director of Product at Figma Sho Kuwamoto asks a fundamental question. There are dozens of responses from the community, but don’t miss Dylan Field’s thread.
Podcasts
Overtime by Dribbble: Figma’s Dylan Field on building design tools that empower collaboration
Great interview with CEO of Figma on the design process, collaboration, company’s mission, and design system.
Videos
Figma Tips & Tricks: 50 Tips in 25 Minutes
A vast collection of tips and tricks at Learn UX channel, definitely worth watching.
Introduction to Design Systems
In this series, Jacob Broadhead demonstrates how to build a basic design system in Figma.
The Experience Show: Figma — A Collaborative Design Tool Like No Other
A new show that explores what it takes to compete on customer experience and build an online company that can last decades. In the 2nd episode, co-hosts talk about Figma.
Plugins
Design Lint
Design Lint checks for missing text, fill, stroke, and effects styles. It also catches incorrect Corner Radius values.
Adjustments
Tweak hue, saturation, and lightness values of multiple selected objects at once. (Also, how could I not mention a plugin with an icon like this?!)
Resources
Remix This
Figma introduced remixes to community projects — now you can duplicate a file and publish your version of it as a remix. (That may sound familiar if you remember Layer Tennis or rebounds at Dribbble.)
Root Wireframe Kit
Good looking wireframe and design starter kit. Supports responsive layouts and Auto Layout.
Ethereum.org Style Guide
Always fun to explore and learn from a well-documented style guide.
Browser / Server History — CERN 2019
Craig Mod — one of the keynote speakers at this week’s Config conference — shares an abbreviated timeline of the history of browsers.
From the Headquarters
Figma on Figma: How We Built Our Website Design system
Figma team shares how they’ve built a unified design system for their marketing site, then implemented it in Contentful CMS.
Test Designs Early and Often With the New Maze integration
Figma announces integration with Maze, a service that provides design teams with UX insights from real users. You can also read the announcement at Maze.
Post-Mortem: Service Disruption on January 21-22, 2020
In case you experienced an outage last week, this is a technical roundup of what happened. The most important part for designers: “We’re kicking off an initiative to ensure you can continue to work on your already open files safely after going offline even if you close your browser before coming back online.”
Work Offline With Figma
Not a new help article, but a good reminder. I’ve seen a lot of panic on Twitter during the outage, but as long as you already have files open in the app and don’t close them, all changes should seamlessly sync when a connection is established again. Still, it’s worth manually saving .fig files from time to time while working offline or during the outage to have a backup.
Figma × Notion: One Knowledge Base Keeps Everyone Informed & Aligned
It’s a marketing video for Notion, but it provides a cool glimpse at Figma’s office and the way they organize their internal documentation. My company just moved to Notion as well, and so far it’s been great!