Weeks after leaving Figma, Jordan Singer introduced Mainframe, ​“a future operating system with AI as the default”.

(Made me think of Playbit, started by Rasmus Andersson a few years ago. What’s up with ex-Figma designers starting operating systems?!)

Last June, Figma acquired Diagram — one of the most promising startups building at the intersection of design and AI. Their small team of five joined Figma to build the AI features announced at this year’s Config.

During the last few weeks, 3 out of 5 ex-Diagram teammates left Figma. Founding Engineer Sidd announced his departure first and soon joined Vercel to work on v0. Founder & CEO Jordan Singer and Founding Product Designer Marco Cornacchia announced their resignations on the same day. I’ll be keeping an eye on Design Engineer Vincent van der Meulen and ML Engineer Andrew Pouliot.

Jordan Singer shared the original pitch deck and a video recording for Diagram (acquired by Figma last year).

A very timely episode of Dive, where Ridd interviews Jordan Singer live at Config about his journey from the Diagram acquisition to Figma’s 2024 AI release. In the middle, they discuss how Figma’s generative features work and why they needed to create a UI kit. (A funny inception moment — at 45:22, I’m coming into view to take this picture.)

Jordan Singer shares a few things he learned while designing and building AI at Figma.

I fully expected all big product announcements to be saved for Config, but we have an unexpected treat! Jokes aside, this is a very elegant solution based on how people already organize their files. Reminds me of how Twitter came up with retweets and the book The Best Interface is No Interface.

“When you name a page in Figma using only hyphens, en/​em dashes, asterisks or spaces, that page will now automatically convert into a page divider.”

Michael Mignano talks to Jordan Singer, AI lead at Figma and former Founder & CEO of Diagram. They covered the role of human designers in AI, what it’s like building AI features for the world’s leading product design platform, Jordan’s path from coder to designer to product builder to founder, and much more.

A large profile of FigJam AI in Fast Company. ​“Figma’s AI ambitions are clear. Singer noted that ​‘we really do think of AI as playing a central role across the entirety of the platform.’ In theory, that could mean not just better meetings, but more capable coworkers. ​‘In a collaborative environment where you’re working with many people on a project,’ Singer says, ​‘AI really up-levels everyone.’”

I wonder what that button on Jordan’s micro keyboard does?

Congrats to Jordan Singer on making it to the Forbes’ 30 Under 30 list: ​“Product designer-turned-entrepreneur Jorgan Singer founded Diagram, a startup that created web-based design tools dubbed ​“Magician” and ​“Genius” that used AI and text-based prompts to generate design ideas and suggest design recommendations. Diagram quickly gained steam among its 100,000 users before being acquired by $20 billion design company Figma in 2023.” For more of his story, listen to the ​“Building Design Tools” episode of the Design is for Everyone Podcast and a long list of ideas that he has built since 2015.

Jordan Singer came up with another wild AI experiment — sketch or design anything in Figma or FigJam and turn it into a functional prototype with one click of a button. This demo is a great example — it built all the functionality correctly based just on a few text labels!

The first segment of the opening talk of the second day, with Noah Levin and Diagram team discussing how AI will shape our future and work. Continue by watching Generative AI and Creative Arms Race by Ovetta Patrice Sampson from Google, AI and empowering creative careers by Scott Belsky and Brooke Hopper from Adobe, and wrap up with The crescendo of AI in our collective future by Kanjun Qiu and Reid Hoffman.

Noah Levin, VP of Design, unveils Figma’s vision for AI and shares that Figma has acquired Diagram. (It’s fun to look back at all Jordan’s experiments I shared in this newsletter, starting from 2020.) ​“In short, AI can help us do more — across every part of the product development process — faster. It’s not a feature, but a core capability; more than a product, it’s a platform that can up-level our work to the plane of problem solving — arguably the core pursuit of our craft, and the reason many of us got into design and product building in the first place.”

Great examples of automating grunt work with the Automator plugin.

Jordan Singer shares what Diagram learned from participating in OpenAI Converge with early access to GPT‑4 and how they’re using it in Magician and Genius plugins.

Jordan Singer and the Diagram team share the preview of Genius, their new tool for generating user interfaces with AI. ​“It understands what you’re designing and makes suggestions that autocomplete your design using components from your design system. It’s important to explore lots of ideas and iterate in the design process, and Genius ideates and iterates alongside you as you design.”

A new plugin made for Figma developers by Diagram. Debugger is a Figma node inspector that lets you inspect and debug your layers. Support for all node types, watching and editing values, filtering, and some more.

An interview with Jordan Singer from Diagram, who built Magician and participated in the text review API beta, exploring what this API enables and sharing tips on navigating the ​“untapped intersection of product design and AI.”

I shared Magician before, but in Jordan’s own words it’s ​“a design tool for Figma made by Diagram that introduces AI into designer workflows to expand your creativity and imagination as you design. It’s a magical utility that works alongside you to help ideate and inspire you with new ideas, whether it’s generating never-before-seen icons, imagery to use in your designs, or help with writer’s block.”

A new product by Jordan Singer and Diagram, who you might remember from Automator and Prototyper. Magician is a Figma plugin that lets you design with the power of AI to do everything from copywriting to generating unique icons from the text. Currently in beta with three available ​“magic spells” for creating icons, writing copy, and generating images.

Prototyper is a new plugin from the team behind Automator, offering powerful prototyping with JavaScript right in Figma, similar to the old days of Framer Classic. A really powerful combo for exploring ideas and building prototypes in higher fidelity.