“In this last month of 2021, we introduced more ways to make collaboration and creation a breeze, so that nothing gets in the way of your productivity.” A few FigJam updates, a new mobile app for Figma, and partially rolled out new comments.
Admins on the Organization plan now have more ways to see who’s using FigJam and who’s in need of an editor license.
Two new tools in an improved FigJam toolbar: Highlighter (Shift‑M, hold Shift for straight lines) to highlight text and objects and Eraser (Shift-Delete) to delete individual strokes to correct and refine your sketches. See also this tweet from Miggi on how to bring doodles made with Highlighter from FigJam to Figma.
A practical walkthrough by Ridd of how you can use slot components to build a scalable system in Figma that is efficient and flexible.
After discovering a bug affecting how comments appear on the canvas, Figma paused the rollout of the new comments until later in January.
We recently discovered a bug affecting how comments appear on the canvas.
— Figma (@figmadesign) December 11, 2021
To ensure the best experience for our users, we’ve decided to pause the rollout while we look into a fix.
Once we’ve resolved the issue, we'll turn on the new comments experience for everyone in January. https://t.co/cY9K4yiz91
“AWS Amplify announces AWS Amplify Studio, a visual development environment that offers frontend developers new features to accelerate UI development with minimal coding, while integrating Amplify’s powerful backend configuration and management capabilities. Amplify Studio automatically translates designs made in Figma to human-readable React UI component code.”
Major update to the Figma mobile app. Now you can view, browse, and share files and prototypes without being tethered to the desktop app, mirror designs on mobile for selected frames on desktop, and enjoy an intuitive and performant UX on iOS and Android.
“Use link previews to add sources of inspiration and useful context to your FigJam file. Paste links of rich media from other websites — like videos, articles, or documents — and FigJam will turn them into a preview on your board. Figma will even make some link previews interactive, which allow you to pan around Figma design files and city maps, or stream music and videos while you work in FigJam.”
A few good tips on using Auto Layout by Danny Sapio.
Grapic is the iPhone app and a FigJam widget that lets you use a real pen, paper, and whiteboards with your remote colleagues, clients, and friends.
“This month, we introduced capabilities that move you from task to task faster and make it easier to share and act on feedback, so you can take ideas from good to great.”
A FigJam widget to help your group take turns. Keep track of whose turn it is, who’s already gone, and who’s left.
A lightweight plugin that converts high-fidelity mockups to loading or “skeleton” screens.
“Associates colors to styles if it finds matching or very similar ones.”
“We’re bringing our open platform to FigJam so developers can build plugins and widgets to automate workflows and engage the entire team. Widgets are interactive, native-like objects — like polls, games, and notepads — that the entire team can use together. Hear from Figmates and developers from the Community to see how you can build your own!”
While this approach feels backwards, I think it’s an interesting idea to explore for the developer handoff. Auto Layout is quite close to Flexbox, so creating a universal utility wrapper shouldn’t be hard.
Today's whacky idea…
— Joe Bell (@joebell_) November 19, 2021
What if UI Designers and UI Engineers spoke the same language?@Figma Auto Layout === <AutoLayout /> pic.twitter.com/8zFJnNU6WI
Rogie made a new plugin for playing a prototype while editing it. Because the plugin accesses the file id, it has to be installed locally. (I usually just open a prototype in a new app window while working on it.)
Ever wanted to play your prototypes while editing in @figmadesign? I made a little plugin for you! It's called "Prototype Preview", but it has to be installed as a local plugin (as it accesses the file id). Animation by @antimofm
— ˗ˏˋrogieˎˊ (@rogie) November 12, 2021
Here's the code for ya: https://t.co/8hXnuByi0W pic.twitter.com/FQx8F8UXEj
Joey Banks with a tip on indicating component or layer status through naming.
If you're creating components in Figma for others to use, adding emoji to component & layer names can really make a big difference!
— Joey Banks (@joeyabanks) November 18, 2021
✏️ = edit expected (helpful for labels)
🔄 = can instance swap (helpful for icons)
🚫 = component no longer supported
✨ = interactive component
Josh Cusick shares how the Design Systems team at Microsoft built, maintained, and set up for people to contribute the Figma UI kit for Teams Component Libraries (TCL). He covers structuring pages, naming things, aligning with code, design tokens, and version control.
Ridd shares his approach to organizing files in Figma.
I'm constantly asked...
— Ridd 🏛 (@Ridderingand) November 26, 2021
"How do I organize my files?"
So here are my 7 goals for file organization in @figmadesign 👇 pic.twitter.com/NFuhHP3euu