Double Glitch made the Space Invaders game and turned Figma into a game engine.

Vijay is building a game using variables with new advanced prototyping features and explains how it works along the way.

Realistic typing is finally possible in Figma prototypes using variables.

Anthony DiSpezio shares a community file and a quick tutorial for creating a cute blooming flower effect.

While Will was working on Figma-OS, Willy Wu from Figma was also building his own version with a Figma plugin to help compile small C programs using ELVM. Don’t miss a thread on his journey.

A deep dive into variables by Thalion.

Occasionally someone builds something in Figma that just melts my brain: ​“Figma-OS is the first Turing-complete 8‑bit computer built using Figma prototyping tools. Figma-OS has state-of-the-art specs with 512 bits of RAM, 16 bytes program memory, 10 Hz clock speed, and a MISC instruction set of 16 OPCODEs.” See the thread from Will DePue on how it works.

Vijay Verma won’t miss a chance to build something fun with a new Figma feature. Here, he made a fun personalized avatars constructor using different combinations of components and variables.

Good thread by W3C’s Design Tokens Community Group on Figma variables, and how they differ from the spec. Great to see that Figma is actively collaborating with the community group on adding modes to the specification, and already built sample plugins for importing and exporting DTCG-compliant JSON files. (BTW, if you ever wondered what the variables icon was based on — now you know.)

Luis shares good tips and thoughts on using, naming, and organizing color variables, as well as setting up modes for themes. Additionally, he summed up all of the above into a Variable starter kit on the Figma Community.

Find Variables plugin by Daniel Destefanis helps you find what variables are being used in your file and easily select the layers using them.

Great video from Chad on a conversion technique I described above. Recommend watching this video before you embark on a journey to update your color system.

A few new plugins for converting styles to variables came out last week, and I’m still trying to pick a favorite. The best part of Styles to Variables Converter is that after creating variables it updates existing styles to use them, so if you delete or detach styles objects will fall back to variables. A slightly more popular Styles to Variables plugin doesn’t seem to do this yet. I also wish these plugins let me map styles to existing variables, or at least specify a target collection.

Small improvement, but I know it will make many people excited!

A refresh to the file browser, so you can spend less time searching, and more time creating. New shared projects and files tabs help you easily find files that others have shared with you. Search, Recents, and notifications now include content across your entire account.

Lauren Budorick explains how the new text truncation works: ​“Now, whenever we can, we figure out at line layout time whether the next line will fit. If it won’t, we’ll override our line breaking engine to say that, if this is the last line before truncation, every glyph pair is breakable.” She also points to where the new ​“Max lines” truncation feature can be found.

Oh my, this one was long in the making! Font previews were first announced at Config 2020, but now they’re finally live along with other improvements to the font picker. See this feature tour from KC Oh.

The first-ever demo of a new plugin by Diagram. Can’t wait for it to become a part of the editor!

With the latest round of auto layout updates, learn how you can wrap objects to a new line, set minimum and maximum widths and heights, and truncate text based on a set number of lines.

And here is a fully functional stopwatch demo as well.