Articles

After being at Figma from 2019 to early 2024 and seeing the company grow from less than 100 to over 1,500 employees, Software Engineer Andrew Chan wrote down some notes on what brought him to Figma and why he thinks it succeeded. He highlights two factors that created Figma’s ultimate moat — browser-first link sharing brought non-designers into the product, and their multiplayer technology was hard to copy for existing products like Adobe XD and Sketch: ​“I would guess that this was less of a ​“collaborative algorithms are really hard to implement” and more of a ​“existing products are really hard to make collaborative” problem: Framer moved to browser-based collaboration pretty successfully, but it did so by completely ditching its old product, while Figma-like design collaborative design tools created from scratch are pretty common these days.”

Another great point is on forming strong product opinions early on and crunching on them until they’re right: ​“One clear thing to me is that Figma’s astounding success in design was due in large part to the company identifying a gap in the design space and working on it essentially in secret for years. Folks like Rasmus and Sho formed strong opinions on nearly every aspect of the product-to-be, which we would spend the next few years realizing in fairly recognizable form. I will make this claim mostly without evidence, but suffice to say that many features like auto-layout and component variants had their bones laid out years in advance (although most newer features like variables were designed later AFAIK).”

First Round’s deep dive into how Figma Slides founding PM Mihika Kapoor transformed a hackathon project into one of Figma’s most anticipated launches.

Jake Albaugh talks about how modern browsers have evolved beyond what most design tools can do: ​“While many designers and developers have been working within familiar constraints, browsers have undergone a quiet revolution. The web now supports features like container queries, advanced scoping and inheritance, and responsiveness to user preference. It’s gotten much more sophisticated in terms of color, typography, dynamic units, layouts, and animation. Yet so many young designers and developers I talk to as a Developer Advocate at Figma aren’t aware of these possibilities. We’re still operating within old paradigms instead of pushing the boundaries of what the browser can do.”

Did you know that Figma’s cofounder Evan Wallace created a custom programming language Skew for their mobile rendering architecture? This story slipped my attention, but Andrew Chan wrote a fascinating look at some of its interesting features.

Jacob Miller from Figma ran a poll and discovered that ¹⁄₃ of designers misunderstand DPI. In this post, he explains the relationship between pixel count, DPI, and physical size.

Carly Ayres on the value of combining skills: ​“A design engineer can not only take an idea to a working prototype with little lost in translation, but can spot opportunities and constraints that might otherwise be missed. The emergence of roles like ​“design engineer” illustrates how intentional (or unintentional) skill-building can create rare resumes for roles that might not exist yet. Few design engineers likely trod that path because they saw a lucrative career opportunity on the horizon—rather, chasing curiosity and a desire to see their ideas to fruition, they gradually skilled up in the areas missing from their stack. Those gaps in their abilities mirrored the needs in the industry at large.”

Moty Weiss shares his experience capturing and preserving brand consistency with AI illustrations. The idea of analyzing existing brand illustrations with ChatGPT to create a foundational prompt for Midjourney really stood out to me. The resulting illustrations adhere to the brand style and have a unique voice, looking very different from the AI-generated images flooding the internet. While they still need some work, the new tools are truly empowering: ​“While Midjourney’s results may still require final touches — such as vector conversion, line refinement, detail enhancement, and final polish from a professional illustrator — it represents a significant step toward independence for designers who struggle with illustration.”

Yann-Edern Gillet reflects on his first year designing at Linear: ​“Experiencing imposter syndrome has taught me to accept feedback—both positive and constructive—with openness and to lean on my teammates for perspective and support. It’s uncomfortable, but it’s also a reminder that the work you’re doing matters. Over time, I’ve learned to reframe it as a driver for growth, reflection, and improvement, and that’s been one of the most rewarding parts of this journey.”

Molly Hellmuth had Brad Frost, author of Atomic Design, as a special guest at one of the recent cohorts of her Design System Bootcamp course. Molly’s students asked him so many great questions that after the Q&A, he recorded a video answering them again for a wider audience. Topics include design systems, workflow, atomic design, the future of design systems, buy-in, designer-developer collaboration, personal development, and global design system stuff. 

The next cohort of Molly’s 5‑week course starts on January 13th, which is the last scheduled cohort for now. Molly generously offers Figmalion readers $100 off with the coupon code FIGMALION100.

The official announcement and walkthrough of changes.

Justin Jay Wang experimented with different methods for generating random gradient images, including those used by OpenAI visual identity. He explains the difference between heightmaps, layered radials, and AI-generated gradients. Loved this part: ​“In early 2019, OpenAI’s home page displayed a vibrant, full-screen gradient. The implementation was simple: a tiny, 2×3 pixel image of six color stops, which produced a smooth gradient when scaled up by web browsers. It weighed just 85 bytes (about the size of a brief text snippet) and loaded virtually instantly.”

An overview of everything shipped this year. It’s a long list!

Luis measures and compares the performance of a complex component built as a single mega-variant vs. nested and bubbled instances. While the nested instance approach is faster and more maintainable, he shares a few alternatives that are worth considering.

Designer Advocate Ana Boyer: ​“UI3 prompted us to rebuild our own design system from the ground up. Here’s how designers and engineers came together to create a new foundation for building consistent, accessible products.”

Erez Reznikov argues that in the next generation of design tools, designing and building digital products will have to abide by the constraints of the platform in which they are coded and tested. ​“The right tool will have to be built for a collaboration. A true collaboration, not a handoff. With developers, because complex products (which will be the vast majority) need them. There’s no avoiding that with dreams of magic AI fairy dust and no-code, no-dev narrow builders, empowering as they may seem.”

Nick Villapiano, the Director of Front End Development at One North: ​“Dev Mode recognizes that developers don’t just implement design—we’re active participants who need our own set of tools. Carving out a dedicated space within Figma allows developers to contribute meaningfully to the design process from concept to launch. By utilizing recognizable patterns and tried-and-true engineering practices as inspiration, we can do so in ways that feel natural to existing workflows.”

Dev Mode now suggests variables when the value matches a style, color, or size, even if it wasn’t specified in the design. The new color picker also moved in this direction, and now I want this principle to be applied whenever my values overlap with a style or variable. It should be easier both for designers and developers to use the right primitives.

Selecting a variable in Dev Mode now opens a pop-up panel that includes values, properties, aliases, collection information, and more. There is also a new view for all the variable collections used in the file. Watch a demo of all the new features.

Figma is opening an office in Sydney, its first in Australia: ​“The​opening of Figma’s Sydney office builds on​Figma’s​impact in Australia and will help deepen relationships​with its growing local community and key​customers​, such as Telstra​and Atlassian, who is also a Figma integration partner and investor. ”

A story of how Figma’s brand team audited and refreshed their website design system: ​“Our latest brand refresh proved the perfect impetus: From our new Figma Sans typeface to our revamped illustration style, we wanted to create a cohesive look that represents who we are now, and that meant bringing it to life across our website, too. This story is about our journey—but we hope that it can also serve as a catalyst for other design systems teams looking to improve their own systems. Whether you’re dealing with component sprawl, struggling with color management, or figuring out how to organize your type styles, we hope that you’ll find actionable approaches here that you can apply to your own work.”

Joey Banks on creating responsive and robust components within Figma: ​“Creating a component in Figma is relatively easy. However, building a component that works well in various situations and for different screen widths and heights using tools like constraints and auto layout can be more challenging and intimidating. Let’s first talk about those tools and how they work within Figma, and I’ll share the techniques and practices that have helped me ensure I’m building reliable components for those depending on the system.”