Luis keeps digging into different ways of structuring Figma libraries and styles. In this thread, he thinks through naming conventions on styles and explores the pros and cons of more abstract and specific naming conventions.
Here's another thread about managing Figma styles 🗂
— luis. (@disco_lu) March 16, 2023
It's pretty hard to know how far to push naming conventions on styles, and you can end up in some heavily nested folder structures if you're not careful
So let's take one component and work it out! pic.twitter.com/cO30LFzAd8
Dan Hollick with a fascinating thread on an optimal x‑height size and a visual arc.
Why are some typefaces harder to read than others at the same font-size?
— Dan Hollick 🇿🇦 (@DanHollick) March 16, 2023
Well, it has a lot to do with x-height but of course it's a bit more complicated than that: ↓ pic.twitter.com/QElNG1aq7q
“You can now seamlessly copy-and-paste between your iPad and desktop. Just open a FigJam file on your iPad, and another FigJam or Figma file on your desktop at the same time. Copy something on iPad and an in-app notification on desktop will ask you if you want to paste the selection from the other device. You can copy-and-paste from desktop to iPad, too.”
Such a fun thread by designer Jakub Świadek on how the FigJam team redesigned the sticky note curl. See also another thread by Noah Finer on how it was implemented with CSS and SVG animations.
We're on a roll over here at @figma... we’re launching a redesigned sticky note curl today. Here’s why we’re excited about this tiny little design detail. pic.twitter.com/duFnHshOGc
— Jakub Świadek (@jakub_swiadek) March 16, 2023
“Now you can create tables in FigJam right from the bottom tool bar. Organize information and ideas in custom-sized tables to build project plans, decision matrices, pro/con lists, and more.” Check out a quick demo video and read the blog post on how the product team arrived at the approach, tackled multiplayer bugs, and finessed design details.
The level of customization to virtual spaces that this kit provides is mind-blowing. Make sure to watch the video on the homepage! “LabKit offers a new collaborative way to create digital experiences using Figma and FigJam. Our highly detailed vector components come with loads of easy-to-use variants for customization. Everything you find is designed with joyful multiplayer interactions in mind.”
Figma always supported #RGB
and #RRGGBB
CSS syntaxes in color fills, but now you can also use rgb()
, rgba()
, hsl()
, and hsla()
. Pretty neat!
Paid resources are finally available on Community! The days of dealing with license keys, paying through 3rd-party websites, and importing downloaded files are over. As a customer, you can try most resources before buying, and if something went wrong easily apply for a refund.
While this release makes the whole experience much smoother for end users, it’s a huge change for Community creators — “there’s no dealing with payment integrations, license keys, emailing files, or even managing refunds — just set your price, publish, and start earning”. A few years ago, I was delighted to learn that some creators earn a living from selling Figma plugins and resources. This will become much more common now because of additional exposure and a lower barrier to entry. There has never been a better time to start contributing to the design community.
A demo of a really smart FigJam widget that lets you collect data onto the canvas, fine-tune a model, and keep that tuned model directly on the canvas to generate new images: “With a few simple API endpoints (/train, /status, /imagine), I made a multiplayer-enabled (!) canvas that had live-trained ML models living in it. Many people can come together and try out the model, you can alt-drag trained models to try out explorations without losing your history, you can mark it up with pencil drawings and stickies and do anything else you’ve gotten used to in FigJam and Figma.”
If that game wasn’t enough, check out these spatial 3D animations made using SkewDat plugin. There is a tutorial as well.
Honestly, at this point, I gave up on trying to understand how Double Glitch creates their prototypes. All possible Tic Tac Toe moves were manually tied together in this prototype, which is an incredible amount of work. Make sure to get a copy of the file and look under the hood!
“Hear from Sprig’s Product & Designs teams to learn actionable steps to incorporate user feedback as a core part of your design process in Figma.”
Luis shares a few tips on structuring library files. He recommends optimizing variants for searching and usage rather than maintenance, and suggests this file structure: Page → Section → Variant. Also, check out his other thread on naming and splitting your library files.
We spend a lot of time talking about component structure, but the library files themselves are often ignored
— luis. (@disco_lu) February 27, 2023
So what goes into structuring a good Figma component library?
Here are a few tips, hopefully a good starting point 📈 pic.twitter.com/2zL7xk9eSx
This is my favorite kind of blog post! Software Engineer Dorothy Chen went down the rabbit hole of international keyboards and emerged from the other side in November when Figma shipped keyboard shortcuts support for a set of non-US QWERTY keyboards. Lots of fascinating details, and the story about the new uppercase eszett character is wild!
On the Enterprise plan, organization admins and workspace admins can now enable libraries for all files in a given workspace. On the Organizations plan, organization admins will see an updated layout for the libraries tab in the admin settings.
Minor performance update that makes animations of interactive components in prototypes much smoother and faster.
“This workshop will be a deep dive into the prototyping features in Figma. We will cover many of the basic frame-to-frame navigation prototypes for devices, and touch upon some of the more advanced capabilities that you can unlock with video, interactive components, and sections.”
“We will leverage Figma’s native prototyping capabilities to demonstrate how to collaboratively design slide decks, as well as utilize FigJam’s whiteboards to present ideas while others follow along and give feedback. You can use these techniques to give interactive presentations, engage your audience (or students), and communicate your content clearly and compellingly.”
“In this workshop we will cover how to apply motion and animation when prototyping with Figma. We will cover concepts like transitions, delays, timing, smart animate, and interactive components.”
In this series for educators and students, Miggi introduces Auto Layout features and covers best practices and tips for designing layouts that can change with their content.