**Claire Vo** (0:04)
Welcome back to How I AI. I'm Claire Vo, Product Leader and AI Obsessive, here on a mission to help you build better with these new tools. This week, there has been so much released in the AI for design space. Whether you're looking at Claude Design, trying to decide if it's really going to replace Figma, or want to know if the new GPT Image 2 model is actually that good, I've got you covered with a mini app where I'm going to show you what I really think about these new design tools and how they'll work for your business and a couple fun use cases. Let's get to it. This episode is brought to you by Work OS. AI has already changed how we work. Tools are helping teams write better code, analyze customer data, and even handle support tickets automatically. But there's a catch. These tools only work well when they have deep access to company systems. Your copilot needs to see your entire codebase. Your chat bot needs to search across internal docs. And for enterprise buyers, that raises serious security concerns. That's why these apps face intense IT scrutiny from day one. To pass, they need secure authentication, access controls, audit logs, the whole suite of enterprise features.
Building all that from scratch, it's a massive lift. That's where Work OS comes in.
Work OS gives you drop-in APIs for enterprise features, so your app can become enterprise ready and scale up market faster. Think of it like Stripe for enterprise features. OpenAI, Perplexity and Cursor are already using Work OS to move faster and meet enterprise demands.
Join them and hundreds of other industry leaders at workos.com. Start building today.
I have to start today's mini episode with a little bit on Claude Design. In case you missed it, last week, Anthropic released Claude Design, and it's their web-based design tool, really focused on a couple areas. Prototypes, including wireframes and high-fidelity prototypes. People are asking, is this going to replace Figma in the design flow? Spoiler alert, I think it might actually replace some of these prototyping tools that everybody's using before they go to engineering, and also is taking a swing at slides and videos, which I think is kind of interesting and also has templates for animations and videos, which we can also show a little bit of on this episode. But what I think makes Claude Design really interesting is they're making the design system a first-class citizen of this design tool. So the first thing I did was actually go in and just import my design system. And I think this is really smart because the number one complaint I know people have about using prototyping in the product development lifecycle is it never matches my brand. It never matches our design system. And these prototyping tools, well, I think great. You know, the lovable, the V0s, the bolts, etc.
also have this concept of design system import. I really haven't found they get perfect at replicating my existing design in my code base. And so I really wanted to test this use case for Claude Design and see if it actually works. So the first thing I did was really import my design system. Importing a design system is pretty easy. I'm actually going to show you how to do it by importing Lenny's Newsletter design system. So if you see here, this is what I filled out to import Lenny's design system. Sorry, pal, we'll see how this looks. I really just went to his home page. I clicked save on the HTML. I saved the logo. I saved our little campfire here. I saved this nice little graphic. And I just put it in here in the Claude code, create your design system form. So I said, it's Lenny's Newsletter. I don't have access to his GitHub. If you want to give me access, friend, I can make this even better. I uploaded just a saved HTML and some images and then added those fonts, logos and assets. I didn't even put in additional notes here. I just left it blank.
And then as you can see, Claude Design goes ahead and starts exploring the provided materials and wants to understand the newsletter and then build out your design system in the format that they need. And what's really interesting here is they warn you. They say, this is going to take about five minutes. And it did. It took about five minutes. And you look along the side on the reasoning, it's pretty interesting to see how it extracts the design system. It's looking at the HTML and key images. It has a visual picture now. It has a sense of what core colors and other things it's going to work. And then it's going to build out this structure of a design system sort of in a skills and documentation mode that then Claude Design is going to use. And looking here, I think it looks pretty good. If you look at this, it looks pretty comparable to this. I would say the only difference is Lenny uses Sans Serif fonts for his headers, so what I might say is, you know, we typically use Sans Serif fonts for the main headers other than top level.
19 more minutes of transcript below
Try it now — copy, paste, done:
curl -H "x-api-key: pt_demo" \
https://spoken.md/transcripts/1000763049445
Works with Claude, ChatGPT, Cursor, and any agent that makes HTTP calls.
From $0.10 per transcript. No subscription. Credits never expire.
Using your own key:
curl -H "x-api-key: YOUR_KEY" \
https://spoken.md/transcripts/1000763049445