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?
i've never been faster at figma
— jordan singer (@jsngr) December 19, 2023
what does ✨ do? pic.twitter.com/X5gaeAWUsC
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!
sketch or design anything and turn it into a functional prototype with the ✨ Build it button inside of @figma and FigJam pic.twitter.com/XFQZjZN1oU
— jordan singer (@jsngr) November 17, 2023
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.
Follow up to last week's tweet about @Figma / @diagram automations. Here are 6 I use regularly:
— Greg Huntoon (@GregHuntoon) May 3, 2023
1. Set component property
2. Replace selected text
3. Reverse layer order
4. & 5. Add/remove auto layout to selected frames
6. Count selected objects
Alright, let's break them down... https://t.co/hVWMMNpxdG pic.twitter.com/wWI3eKlol2
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.
as part of @OpenAI’s Converge we’ve been building AI design tools with access to GPT-4 @diagram over the past few months
— jordan singer (@jsngr) March 14, 2023
here’s what we’ve learned and how we’re using it 👇 pic.twitter.com/sSHUympi46
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.”
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.
This Week in Startups interviewed Jordan Singer, founder of Diagram and creator of the Automator plugin.
Fascinating thread showing how countless experiments with Figma plugins and API finally led to the development of Automator. This thread was published in March, and two months later today, Jordan announced a $3M seed round for his company — can’t wait to see what he will build next!
Using Figma as a playground to build design tools on top of an infinitely scaleable, realtime multiplayer canvas has changed everything for me.
— Jordan Singer (@jsngr) March 5, 2022
Here's a thread of my experiments to show you what's possible, to learn from, and plugins to install 👇 pic.twitter.com/ujT6he6Gz4
An official Community resource for the popular Automator plugin. Explore automations made by the community and remix them to work best for you.
A curated list of automations for Jordan Singer’s popular Automator plugin.
Jordan Singer on why he is building Automator, a general purpose tool to automate Figma. Its private beta was all the rage last week — see a few creative ways to use it below.