Claude Design - Everything You Need To Know

By Beau Johnson · · 21 min · 1.3K views

Chapters

  1. 0:00Why Claude Design matters for founders
  2. 1:30What it actually does and how it works
  3. 4:00The design system feature that sets it apart
  4. 6:00Handoff to Claude Code, the closed loop
  5. 8:00Anthropic at $30B revenue and the IPO angle
  6. 10:30What this means for your day-to-day as a builder
  7. 13:00Research preview access and honest caveats
  8. 14:30Join Shipping Skool

About this video

We do 9 live bootcamps every week in Shipping Skool! Full courses on OpenClaw and Claude Code! Join Here ⬇️ https://www.shippingskool.com/ 🔗 GET CONTENT MACHINE: https://www.content-machine.dev/ 🤝1-1 OpenClaw Setup/Integration - https://calendly.com/beaujohnson1/ai-mastermind Anthropic just launched Claude Design, a new tool that turns text prompts into working prototypes, slide decks, mockups, and one-pagers. If youre a non-technical founder who has been paying for designers or spending hours in Canva, this changes the math completely. 00:00 Why Claude Design matters for founders 01:30 What it actually does and how it works 04:00 The design system feature that sets it apart 06:00 Handoff to Claude Code, the closed loop 08:00 Anthropic at $30B revenue and the IPO angle 10:30 What this means for your day-to-day as a builder 13:00 Research preview access and honest caveats 14:30 Join Shipping Skool Source: https://www.anthropic.com/news/claude-design-anthropic-labs Get the weekly AI builder newsletter 📕 https://substack.com/@buildnpublic Follow Me On X - https://x.com/BeauJohnson89

Transcript

Read the full transcript

0:00In this video, we're going to be going over the new Claude design. I'm going to be recreating some of my landing pages from scratch that need a new update. So, let's get right into it. So, what is Claude design? How does this fit into the whole sphere of Claude code and Claude co-work and all the new things that are released in the last week? So, Claude design is basically like the competition for Figma or Canva. You're able to create videos, you're able to recreate slides, landing pages, and mobile app build-outs. So, really cool. This just dropped yesterday, design with Claude. So, the one that powers this on the back end is the newly released Opus 4.7. You could build realistic prototypes, product wireframes and mock-ups, design explorations, pitch

0:45decks, marketing collateral and frontier design. Very similar to what Google Stitch 2.0 released about a month ago, except that doesn't do video. So, how it works is you can upload your brand packaging, things like your logos, your uh dashboard, your color scheme, your headshots, things like that, and it will build based on those assets. So, you can build in your whole brand profile during the onboarding process. You can import from anywhere and then you can refine with fine-grain controls. So, we're going to be playing around with this today. I just wanted to break down what it is exactly and I'm excited because I don't I'm not very good at design personally. So, this is going to help me kind of build out some prototypes and let's see how this all works. So, just

1:32the other day when this first came out, I had to get my hands on it because I wanted to see how basic the prompt can be to recreate something. So, I launched an app called The Magic Hand. It basically transform real estate photos into beautifully edited photos and as well as photos to video. So, that's the whole gist of this app, right? The real estate agent drops in the photos and they click a button and then the photos come out beautifully edited, removing things like garbage, trash, uh hand towels, stickers on the refrigerator, things like that, you know? So, I wanted to give it just a basic prompt and I said, "Just create a video for me based on my app." So, I gave it the link to my website and that's all I did and I just

2:18hit enter with no refinement at all and it created this 32-second video, which I think is pretty good off of just one prompt. I think it's pretty impressive where I gave it no direction on like the specifics. Real quick, before we keep going, if you're watching this and you want to actually build with some of these tools, not just watch videos about them, then you're going to want to check out our community down below, Shipping School. We have a full Claude code course, a full open Claude course, and four live bootcamps every single week where we actually help you get set up from scratch. >> [music] >> Like actually set this thing up, not just watch a tutorial and figure it out by yourself. And we also provide one-on-one coaching, so you could book a call with me, we could share screens, and I can help you get Claude code or

3:04open Claude running on your machine. That's it, no fluff. I built this community because watching YouTube's only gets you so far. We launched it just 3 days ago and we have over 55 members. You need people around you who are actually building, people who hold you accountable, and coaches who can help you when you get stuck. I'll put the link in the description down below. Get in now before the price goes up. Uh drop the photos, grab a coffee, and it has all of the key um features that the Magic Hand offers. So, I thought that was pretty cool showing the power of it. Now, the next thing I want to do is work on landing page for our other app called Easy Flip. Essentially, something similar where people can take photos and then upload them to our app and then that gets distributed to marketplaces like eBay,

3:50Poshmark, and Mercari. Um so, this is the first app that I built out. It needs a complete redesign, 100%. So, I wanted to redesign it completely just from scratch. So, I'm going to copy the link and we're going to give it to um Claude design and we're going to build out a wireframe and let's see, we're going to do a prototype. We're going to name it Easy Flip, Easy Flip 2. Uh let's do high fidelity. All right, create. Okay. I want you to recreate my landing page. Make it modern, use modern assets and elements, use a lot of motion. And let's just see what it does from there. And we can give it examples as we go. Okay, great. So, it says quick questions about Easy Flip landing page. In two sentences, what does Easy Flip

4:36do? So, my app allows people to take photos, upload them to our app, and then get listings created automatically with AI. They can list those to places like eBay. Primary audience is resellers. The tone and voice, we want it techy and bold. Visual direction, bold colors and gradients. I want it futuristic, dark mode, glowy, futuristic. Let's actually let's do glassmorphism. That sounds cool. Motion intensity, we want it insane, 10 out of 10. I want it all. Uh which sections do you want? Hero section and call to action, yep. eBay. Primary call to action, I think the um primary call to action is just fine.

5:22Okay, one tweakable variations of the landing page. Decide for me. Okay, do you have product screenshots? App UI feature? Yes, I'll attach and then we'll hit continue. It's building it out. In the meantime, I'm going to go and grab some screenshots. Okay, after about a few minutes, here's what we have in the hero section. I think it did a great job. Like here's the original right here, very basic, and here's what we built out here. Very good for just 2 minutes worth of work. Now, I want you to recreate the entire landing page with all the product features. I think it did a great job. I mean, for the first shot. So, here we go. Okay, I shouldn't have to fill this out, honestly. I should just be able to give it my website.

6:07Here's the link to my website. You figure it out. I mean, come on, right? Yeah, so product features are AI virtual staging, auto pricing, automated listings, and bulk upload. I do have a live demo on my site. Pricing, pricing is 39 a month, 79 a month, and 199 a month. All right, it's just been 2 minutes and it finished the whole landing page. Let's walk through it here. So, I just I like the hero section and you saw how much effort we put into it, not very much. So, you could really take advantage of spending an actual half a day really being specific and tweaking

6:52things if you're looking to build a landing page. This also excels in video generation as well as slideshows and mobile design. So, I for me wanted to redo my landing page anyways and I'm so glad this came out because this literally took 5 minutes to do. So, you can see here every step of flipping automated from raw photo to live listing. AI handles the grunt work so you can focus on sourcing more inventory. Very cool and I'm guessing I would just plug in some of these photos here. Um I can pull this into Claude code and finish it off as well. Three steps, 30 seconds from photo to publish listing. Nice. I love it. Awesome. Ooh, that's cool. I like that feature. Flat lays don't sell, staged shots do. So, I'd plug in my my photos here. I just I love it. The motion looks good. Maybe

7:39the maybe the coloring is something I would change, but pretty cool for just like one-off couple prompts and there you go. I will say this does use a good bit of usage. If you go into your settings and your account, you have Claude design now and it is in a research preview with its own weekly limit, but you can see here 24% used and we just used it to build that landing page and then yesterday I had built that um video for The Magic Hand. So, just to keep that in mind, you know, obviously it's using 4.7 Opus as the LLM to run all this, but I think for, you know, a quick spin-up of a landing page, I think it's really nice and really easy to use. Now, I want to get into some of the specifics, the details, the features,

8:25and the future of what Anthropic just released, how it could possibly kill the future of design teams, Canva. Figma dropped 10% yesterday. You know, I believe Anthropic just made every designer nervous because I have no design background and look what we just built in less than 5 minutes. I really think because it got a real design tool. Now, AI with that design element using Opus 4.7, we're seeing it may not be perfect now. I think we're seeing just the power of the capability of this technology. And if you're a founder who has been paying someone else to make your stuff look good, that just changed everything for you. I'm going to explain what happened and why it actually matters. This just came out yesterday. Obviously, it's still very new. So,

9:10Claude design, you know, it's basically part of Anthropic Labs. You know, they have co-work, they have personal computer, they have Claude code. They have a lot going on. And what it does is very simple. I mean, you saw it from the demo. But the implications of it are huge. You know, you describe what you want and then Claude builds it. A prototype at that, right? A slide deck, a one-pager, or a landing page that we just saw. It can create very, very good interactive demos as well. Whatever you need to look like a real company, right? And you can make it yourself in just a few minutes. No design background required. No Figma subscription, no waiting on a contractor to finish your brief. I know what you're thinking here. You know, we've heard this before. Figma has AI features and Canva also has AI features, too. They're They're good, but

9:56I think Claude just took the cake here. That was so easy to use. You know, even Adobe has AI features. Every design tool has been slapping AI into their product for the last few years. And most of it is pretty bad. You know, you type something in and you get a generic template that still needs hours of manual work to look like anything you actually want. So, I'm going to tell you why Claude design is different because Claude design isn't just a design tool with an AI bolted on. It's an AI that learned how to design from the ground up. And there's a big difference between the two. The thing was built backwards from the AI out, not forward from the software in. That matters more than people even realize. Here's how it actually works. You know, you're going to go into Claude.ai and there's a new

10:41palette icon on the left nav. You know, you click it and then you just talk. You describe what you want. I mean, you saw the interface. You say you need a landing page for your new SaaS product or you need a pitch deck for a service that you want to sell or just a clean one pager you can send to a potential partner who wants to understand what you do. Claude builds a first version right there in front of you. Not a template it pulled from a library and not a drag and drop grid you have to fill out. An actual design artifact built from scratch based on exactly what you had described. Then you refine it. It's not going to pump out the best first version on one prompt. You know, you can chat with it back and forth and ask for changes in plain language. You can click inline and leave comments on specific elements. You can edit text directly inside the design. And here's the part

11:26that generally impressed me the most. Claude generates custom sliders on the fly based on your specific project. So, if you're working on a landing page, it might create a slider for how bold you want the headline treatment to feel or how minimal versus rich the overall layout should be. It reads your project, decides what variables actually matter for that thing, and then builds the controls for you. No other tool does this right now, not that I know of. It's not a feature they copied from somewhere else. It's something that they just put in. It does something very smart during the initial setup too. You connect it to your existing code base and your design files when you first get started. Claude reads everything, builds a design system from what it finds in your actual files,

12:12your fonts, your color palette, your spacing rhythms, and then it applies that system automatically to everything it builds for you going forward. Consistent brand without you having to maintain a style guide or remind it every session. It learned It learned you once and it keeps that. Which I love because I'm going to take that landing page we just built and then plug it into Claude code and have it use that as a template to update our whole landing page for Easy Flip. Another thing too is like you can start from just a text prompt or you can just upload images or brand assets or any documents that you want to reference or you can point it to a live website like we did earlier and say build me something like this but for my product. When you're done, you export it as a PDF and as a shareable URL or as a PowerPoint file or you push it

12:57straight to Canva if that's already in your workflow or just connect it to Claude code if it need further refinement. Everything you need to actually use the output is covered. But the thing is that matters most here for most builders is who are also trying to ship real products. If you're struggling to keep up with content, well, I'm about to save you about 40 days worth of work. [music] I built something called content machine. It's 10 AI agents that run on the open Claude orchestration and they handle everything. Scripts, [music] thumbnails, X posts, blogs, outreach, clips, newsletters, all of it. So, I went from 1,000 subscribers to 4,000 subscribers on YouTube in 7 days using this exact system. Every single morning I wake up [music] and the content's

13:42already done. I spend maybe 15, 20 minutes reviewing and approving them and I move on with my day. It works for any niche, fitness, finance, real estate, marketing, whatever you're building and it is 100% completely customizable to your [music] use case. So, you get the mission control dashboard, all of the cron jobs, everything I've built over the last 40 days helping me gain more and more people to subscribe and join the community. So, you plug in your own thing and it molds it to you. It learns how you talk and it writes [music] so it doesn't sound like AI slop. $97 one time, it's not a subscription. I'll put the link down below and you'll thank me later. The handoff to Claude code. That's the big one. You can design your prototype in Claude design. You like

14:27what it looks like, one click and it hands it off right to Claude code which converts the design into an actual production ready code. That's a closed loop for that's, you know, never existed before. Concept to prototype to shipping code without leaving a single ecosystem. That's pretty awesome. Without hiring a designer, without hiring a developer, just you describing what you want and then watching it it turn into something real. I'm going to back up a little bit and give you some context on why this launch matters just beyond the feature itself. Anthropic was at $9 billion in annualized revenue at the end of 2025. But by early 2026 in April, they hit 30 billion. That jump happened in just a few months. That's not a company that is surviving in a competitive market.

15:13That's a company that's running at full speed and pulling away. You're seeing it. And now they are in early IPO talks with Goldman Sachs, JP Morgan, and Morgan Stanley. A possible October 2026 IPO is on the books. VCs were so eager to get in that they offered a pre-emptive funding round at $800 valuation. Anthropic turned it down. They don't need the money. So, think about that. I mean, that's kind of crazy. This is not a startup trying to figure out what it is anymore. Anthropic is becoming a full product company. They started by building the foundation model, the core AI. Now they're building a full product suite on top of it. Claude design is not a side experiment. It's a loud signal that they are coming

15:58directly for every creative software tool on the market. Figma, Adobe, Canva, these are direct competitors now. Not AI adjacent competitors, not in a different category, direct head-to-head competitors fighting for the same users in the same workflows. So, that matters to you for a simple reason here. Like when a company with this much capital and this much momentum enters a category, competition gets real fast. You know, prices drop, quality goes up everywhere. Every other tool has to respond or get left behind. But if you're a founder and especially a non-technical one, this changes your actual day-to-day situation in a concrete way right now. I really believe that AI vibe coded landing pages are easy to spot nowadays. So, with this

16:44Claude design tool, this is going to make our just straight up first version of our landing pages so much better. They're going to look more detailed and we can actually now start to stick out than blend in. You know, if you back up and think about what it cost you like six months ago to ship something that looked like a very professional landing page. You know, option one is you basically hired a designer and that runs from anywhere, you know, from a just like a few hundred bucks for a small freelancer to, you know, a couple thousand dollars for anything with complexity. The second option is like you spend hours in Canva or tried to figure out Figma and ended up with something that felt pretty generic as well no matter how much you tweaked it. The third option is you just ship something that looked rough and hoped your product was strong enough to carry it across the finish line. None of these

17:30options were great, but all of them had real costs attached, time, money, or credibility. That tax is gone. Like you describe it, you get a first version in minutes, you refine it in a conversation with the way you would build with an actual designer, and then you ship it yourself. The whole thing might take an hour including the time you spend second-guessing on your own decisions, but that's a real change in math of running a small operation. I mean, you saw it took literally five minutes to build out just the first version of our landing page. I then would take that into Claude code and upload my actual brand assets to it and ship it. I would probably change the color scheme a bit, but that took five minutes. I mean, come on. I've been saying this for a while now in a few different ways, but the skill that matters most this year is not

18:16learning how to use a specific tool at all. It's developing the ability to describe what you want clearly enough that AI can build it for you. Prompt quality over tool mastery. Clarity of thinking over technical skill every time. And every time something like Claude design ships, that gap between founders who have built that skill and founders who haven't gets a little wider and a little harder to close in on. So, if you can describe your business clearly, basically, if you can understand your audience, and if you know what you want a piece of collateral to accomplish, you can now build it yourself. Landing pages, pitch decks, mockups for investor conversations, prototypes you can put in front of customers next week. And if you want actual production code out of the other end, Claude code is one click away. The

19:01full path from idea to something you can show real people to, something running on a real server is now genuinely accessible to founders who have no design training and no engineering background. And that's new. Um, that's not like something we haven't seen before. That's a new thing right now. The one thing I will tell you, this is in research preview right now. It rolls out to pro and max team enterprises on Claude.ai. So, if you're on the free plan, you won't see it yet. And like any early stage feature, it will have rough edges. I mean, straight up. It It will produce things you don't like sometimes and it will misread what you wanted. That's expected. But the loop of describe, review, and refine is still real work. You know, it is faster work and it is work you can do yourself without coordinating with anyone else waiting on anyone else's schedule. This

19:47is exactly the kind of thing we dig inside inside the community. Not just what the tools are, but how to actually use them to build faster and ship more. The people that are in the community are moving quicker than almost anyone I know because they have put in the time to understand how to go from idea to deliverable using AI. Claude design is going to be something we talk about a lot in the next coming weeks. We have a coaching call here in 2 hours on how to get your first customers, and we're going to be talking all about Claude design and how we can use it to grow our business and get our first paying customers. So, we have 215 members. I launched the community 29 days ago. I'll put the link to it down below. We do nine boot camp calls a week. And if you haven't subscribed to the channel already, then what are you waiting for? I cover all things AI, open Claude, Claude code. Hit the subscribe button and we'll see you in the next video. Be

20:32blessed.

Build this with us, live

Shipping Skool is a free community with 4 live build sessions a week. Bring your idea.

Join Shipping Skool — Free