Framer Awards. Supercharging built-in features. Missed investment.
Sponsor
A podcast about product decision-making, brought to you by Maze
Discover how to forge your own path towards product success—and the key decisions to make along the way. Each episode of The Optimal Path uncovers the unique stories, ideas, and approaches adopted by industry experts at Github, Dropbox, Webflow, and more.
What’s New
Framer Awards 2022
Framer published a selection of the best Framer websites made last year. Lots of great designs to get inspired from, but I didn’t expect to see such a heavy dose of personal websites of designers and agencies.
In the File: Scaling from a DesignOps team of 1 to a team of many
“Tune in to hear from Dominique Ward, Head of DesignOps at Atlassian, and Adam Fry-Pierce, Chief of Staff at Google, who will dive in to how to scale your DesignOps team. They will dive into questions such as ‘What frameworks can you use to build out L&D on the design team?’ or ‘How do you build rapport with your cross functional teams?’”
Using Figma
Managing gradients in Figma
Miggi with two great tips on managing gradients. I wish we didn’t need to resolve to a 100 pixels square hack, but often it gets the job done!
Loading indicator
Vijay Verma with a smart workaround for rotating an object reflection with the key object. (And here is another one, if that wasn’t enough!)
Figma Interactive App Navigation – Tab Bar Tutorial
A quick tutorial for creating and prototyping a tab bar menu.
4 Tricks for Flawless Figma to Framer Export
A few tricks for successfully exporting Figma mockups to Framer. In the end, it all comes down to using flexible and consistent structures in Figma that translate to code in Framer really well.
Resources
FigTree
While the community file is super simple, I love how its prototype is used as a quick landing page, with links and animations. Fast and scrappy!
Plugins
SpellCheck
Along with its basic built-in spellchecker, Figma introduced a new API opening the door to more advanced tools. SpellCheck is a commercial plugin offering a bunch of features, like checking an entire project, building a personal dictionary, detecting ”Lorem Ipsum”, auto-correcting typos, and supporting multiple languages.
Similayer
Continuing the theme of supercharging built-in features, this plugin takes Figma’s “Select all with…” command to the next level by offering a whole range of properties to choose from.
Magic Marker
Alex Einarsson made a great FigJam plugin that recognizes shapes you draw and converts them to native shapes with editable text. Perfect for wireframing on both tablets and desktops.
WebP Generator
If you’re still relying on JPGs and PNGs, it may be time to give WebP format a try with this plugin!
Backstage
Notes from Figma investment opportunity
Founder of Reddit Alexis Ohanian shared his notes from a missed investment opportunity in Figma back in 2016. Hard to believe that it was still in private beta and they didn’t even charge for it only 6 years ago!