# Claude Design: 5 Live Demos (Videos, Decks, Apps, Design Systems)
**Source:** https://www.youtube.com/watch?v=WMnk1LFBMqA

## Summary

A hands-on review by a creator testing Anthropic's Claude Design tool across five use cases: animated videos, pitch decks, landing pages, mobile apps, and design systems. The core thesis is that Anthropic is assembling an AI-native knowledge worker stack where code is the universal medium, positioning it as a direct competitor to Figma, Google Workspace, and Microsoft Office. Key insights cover workflow tips, current limitations, and the product's surprising capability to produce professional-quality animated outputs in minutes.

- Anthropic is building an AI-native knowledge worker stack: Claude Code (development), Claude Design (design), Claude Co-work (documents) — directly competing with Figma, Google Workspace, and Microsoft Office
- Code is the universal medium: videos, slides, websites, apps, and animations are all just HTML/CSS/JavaScript under the hood, making them cheap to generate
- Claude Design generates animated videos from text content in 4-5 minutes, a task that would take a professional video editor hours or days
- Claude Design asks clarifying questions before generating (tone, duration, visual direction, audience) — same pattern as Claude Code's spec clarification
- Pro tip: generate a video first, then convert it to an animated slide deck for far more engaging presentations than static decks
- Current limitation: no native video export — users must use screen recording to save generated videos
- The tool supports five use cases: animated videos, pitch decks, landing pages, mobile apps, and design systems
- A 'tweak module' allows manual adjustments (e.g., color palette) after generation without re-prompting
- Workflow insight: use regular Claude first to iterate on copy, then paste finalized text into Claude Design for visual generation
- The duplicate project feature enables non-destructive iteration — convert and fork outputs without losing originals

## Transcript

[[0:00]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=0s) Hey everyone, today I want to share a hands-on review of Claude Design, Anthropic's brand new AI design tool. I'm going to run through five real demos live using Claude Design to create videos, slides, websites, apps, and even a design system. Now, before we get started, I just want to recognize that Anthropic is building an AI-native version of basically the entire knowledge worker stack. Think about it. They already have Claude Code for development, Claude Design for design, Claude Co-work for documents, and more. The common thread across all three products is that code is now the universal medium for knowledge work. Videos, slides, websites, apps, and animations, they're all just code under the hood, and code is now free, or at least very cheap. So, I don't think it is a stretch to say that Anthropic is now competing directly with tools like Figma, Google Workspace, Microsoft Office, and more. But, how good is Claude Design? Let's run through five use cases, including animated videos, pitch decks, landing pages, mobile apps, and design systems.

[[1:12]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=72s) Okay, so let's start with animated videos. So, this is the Claude Design interface, and let's make a new project. Let's say video demo, and create. And all I'm going to do is I'm going to find Anthropic's Claude Design announcement post, which is right here, and I'm going to copy this whole thing over here, and let's go back to your project. So, let's just say, "Make an animated video for Claude Design featuring this content." And let's paste the content in right here. You can see paste the text 40 lines, and let's hit send. All right. So, if this works, Claude should now ask some clarifying questions as you see here, right? So, how long should the video be? Let's say 30 seconds. What tone? Let's say playful and warm. What should the video cover? Probably a hero. You know what? Why don't we say decide for me?

[[2:13]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=133s) Visual direction, I don't know, maybe this one right here. And what is it for? Let's say it's for social media. And the motion, you know, I'm not a video designer. So, why don't we say subtle typographic elegant transitions. And should we show a mock product UI? Why don't you decide for me? And how should it end? Let's just say decide for me, too. All right. So, I really love how it actually asked you a bunch of clarifying questions. It's kind of like in Claude Code when you ask to do something, it also asked you a questions to clarify the spec. And clearly Anthropic has copied that over to here. All right. So, now let's hit continue. And it's going to go off and actually generate the video. And by the way, the video is basically just code, right? It's HTML, it's CSS, maybe a little bit of JavaScript. So, let's see what kind of video it comes up with. I'm going to skip ahead. Okay, so we're back. So, that took about 4 or 5 minutes to make. So, let's take presentation mode and do in this tab. And let's hit play for the video.

[[3:15]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=195s) All right. So, introducing Claude design at the speed of thought. That's a great value prop. And it's going to highlight the six use cases here. And let's see what comes next. All right, it's got the three value props and really impressive how it's made the illustrations in each value prop animated. And finally, there is a call to action to go and play with Claude design, right? This is pretty incredible stuff. You know, it would have taken hours or days to do manually for a professional video editor, but Claude did it in just a few minutes. And because the video here that you're seeing is just code, you can also manually tweak stuff. So, just turn on this tweak module and for example, I can tweak the color palette and I can also add other stuff. So, the only flaw right now is that you cannot actually export this as a video as far as I can see. So, you kind of have to use for example, screen recording to actually save the video, right? But overall, this is pretty incredible. All right. So, now let's move on to our next use case, which is using Claude to make a slide deck.

[[4:22]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=262s) Now, when using AI to make a deck, I had to use regular Claude first to iterate on the copy for each slide. So, for example, to make a slide decks for this tutorial that I'm sharing right now, I first asked it to write a tutorial style post and here's kind of the brief outline. And and then we went back and forth on the copy a lot and finally ended up with something like this down here, which is a clean version of each slide and the copy that appears on each slide, right? All I did was I copied all the copy here and I pasted into Claude Design, if I scroll all the way up here, saying, "Hey, can you make a slide deck based on this copy?" And this is the slide deck that it came up with, okay? So, Claude Design, here's a new AI designer and here's the five use cases and then there's like a takeaway slide. Now, this is okay, but I think this is kind of boring and static compared to the videos that we just made. So, my pro tip here is that you can actually ask Claude Design to make a video first and then turn that into a deck and you can make much more engaging and animated slide decks that way. So, here's another project where I pasted the exact same slide copy and I asked it to make an animated video instead, right? And this is the video that it made.

[[5:39]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=339s) So, you can see that this slide deck is actually way more engaging and way more interesting than uh the static slide deck that we had So, the next step is I just hit share here and I hit duplicate project to make a new version of this. And basically in this project, all I did was I just asked it to convert this video into an animated slide deck that I can manually toggle through. That's literally the only prompt that I put and it was able to change the video that you just saw into the slide deck that I'm sharing, right? So, yeah, this is a much better result than just getting it to create a static deck, right? So, that's my pro tip. By the way, I think with these artifacts, you can use AI to generate the first 90% but the last 10% still requires manual updates, right? So, let's kind of make some manual updates right now. So, for example, over here, it says behind the craft episode 47. I I don't really like this, so I'm going to go into edit mode here and I'm just going to delete this text right here and then I'll turn off edit mode and it should be gone.

[[6:42]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=402s) And you can see here that I've also prompted AI to make some up updates. So, for example, I prompted it to swap video into the first slot and slides into second slot. And finally, uh as you saw before, you can turn on this tweaks panel right here and you can tweak the palette or you can ask it to add other things to edit and update. So, for example, instead of the warm palette here, we can make it ink or clay palette. Uh I think that's like a MVP for AI design tools these days. You can get AI to generate the first 90% but you have to let the user make manual tweaks afterwards because AI is never going to get it right in one shot. All right. Now, let's have some fun. Let's go open the slide again and now let's look at landing page examples. Okay. So, right here I have the claw co-work marketing page. And it looks pretty good, right? So, let's just ask Claw Design to recreate this marketing page and see what it comes up with. So, I have a project here and all I did here is just say recreate the Claude Cowork marketing page, right? Pretty lazy prompt. I didn't even link the website, uh and but it managed to find the link and recreate it.

[[7:53]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=473s) And you can see here that it's not quite perfect. It doesn't really have the video here. And let's scroll down. And there's some other things that don't look quite right. But, this is probably like 80% there, right? It generates some pretty good illustrations here, and there is some other stuff down here that looks pretty good. So, now for fun, why don't we ask it to update this website to a tongue-in-cheek version of Anthropic taking over all knowledge work? And let's go ahead and submit. And let's see what it comes up with using the same style. Okay, we're back. And it looks like uh Claude updated copy for this Cowork website gives something that's way funnier. So, first of all, it says it acquired the concept of work. Anthropic's pleased to assume responsibility for all knowledge tasks. Please remain seated. And the tagline is we'll take it from here. Uh we took all of it. You don't have to do anything anymore. Just go relax somewhere. We have it all handled.

[[8:53]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=533s) Locate the nearest hammock. And uh hand off your career to us. You know what? I I think it's only a matter of time before they actually really do take over most of knowledge work. Again, maybe AI will do the first 90% and then us humans would do the remaining 10%. So, yes, maybe I'll publish this website and share a link with Anthropic to see what they think. Maybe they'll get here in like a year from now. Huh. All right. But, let's keep going. Let me show you some more things that it can generate, right? So, in Anthropic's marketing video for Claude design, it showed that you can generate a 3D globe, right? So, I basically put the prompt into my own thing. Design interactive dark theme graphic showing how culture flows between cities, and then make a rotating globe. And this is what it came up with. Putting present animation. The continents don't look quite right. Uh it looks like everything merge into one big continent. But there's a bunch of toggles here. I don't know exactly what they do. I can turn stuff off and on, I guess. You can make the arc glow more. And yeah, it looks pretty fun. And I can always prompt it to make the continents look better.

[[9:57]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=597s) All right. So now here's another fun one you can make. So this is a prompt to create a very large editable text box. And for certain words like fire, smoke, metal, and wind, render visual and particle effects that match the word, right? And here's the words I came up with. So let's just type the words. Let's say I'm on fire. And you can see there's fire here. Need water. Seeing a lot of smoke. Right? Hope for some wind. Electricity. I love the lightning on electricity, ice, and stars. All right. Oh, it's actually not electricity. It's electric. So let me fix that to bring the lightning back. There we go. All right. So that's pretty fun, right? And you can make that yourself. You can play with it with your kids. And you guys come up with all kinds of creative ideas because design and code is now so much easier with Cloud Design and these other tools. All right. So now let's move back here and let's finish off with mobile app and design system.

[[10:57]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=657s) So first let's do a mobile app. So here I've just asked it to create a beautiful mobile fitness app. And as usual, it's asking me for some clarifying questions, right? So let's fill them out together. So I want to use it for strength training. I'm definitely not a serious athlete. So let's say busy professional. Visual style, um why don't we say energy? And let's ask it design home workout in progress. And um how many visual variations? Let's do single variation. How interactive? Why don't we do clickable nav? Or you know what? I'm going to just decide for me. And let's do decide for me for all of this. And uh let's hit continue. Let's see what it comes up with. All right. So, I'm going to skip ahead and see how good Claude's designs mobile designs are. Okay, we're back. That took about 4 minutes. And Claude has made a beautiful mobile app design for us. And you can see here it is actually taking screenshots of it and verifying it to make sure that it looks good. Let's take a look ourselves, right? So, first of all, we have a pretty warm-looking app.

[[12:02]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=722s) Uh our next workout is push day. And there's a bunch of stats down here. And let's hit begin session. All right. So, now we're working on our bench press. And we can adjust the weights. And how much effort. I don't really know what effort means. And we can lock the set and keep going. So, yeah. This looks pretty good. I think there are some issues here. Text overlapping issues. But you can see here that Claude is still uh reviewing everything and fixing issues. So, it looks like Anthropic has actually built playtesting into Claude's design. So, that it is actually taking screenshots of what it's making and making fixes afterwards without you having to tell it to, right? Which is pretty great. All right. So, now let's move on to our very last use case, which is creating a design system. Now, I am a PM. I am a wannabe designer. I really don't know that much about design systems, all right? But nevertheless, I still asked Claude to make a design system for Apple Liquid Glass. And all I did was I uploaded a Figma UI kit of Apple Liquid Glass. And I just asked Claude to create the Apple Liquid Glass design system.

[[13:09]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=789s) All right. And this is what it came up with. And by the way, if you want to try this, it's pretty much going to use up all of your tokens to create a design system. It took about 10 minutes to do it. So, I only recommend doing this if you really want to have a design system and you already have yours in place already. But now, let's take a look at this. So, it's created uh type color spacing. And there's actually a bunch of stuff that I need to review, right? So, it created the iconography. Let's say it looks good. It created the motion easing curves. Looks good. Readme file looks good. Even radii. I mean, you know, as a PM, I I really don't know if this looks good or not. Shadows, spacing. Let's just hit looks good for everything. All right. Yeah. This definitely looks glassmorphic. Looks good. Looks good. Looks good. All right. So, we just hit looks good for everything. And our design system is now ready to go. And now, I created the same fitness app but with this design system attached. So, now let's take a look. All right. This is what I came up with. So, it definitely looks like liquid glass, but there's definitely a lot of issues, overlapping stuff, and other issues. And it's probably because I didn't give it a proper design system, to be honest. But overall, this app definitely looks a lot worse than this app right here. So, we can obviously continue to prompt it to make edits.

[[14:26]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=866s) But for the sake of this video, I am just going to move on. So, we just took a tour of using Claude design to create videos, slides, landing pages, mobile apps, and even a design system. And if you want the exact prompts to create what I just shared, please check out the link in the description to read my written guide with the prompts. Now, I want to close with a few takeaways. Number one, it's pretty clear to me that Anthropic is going after the full knowledge stack. They have Claude Code for coding, Claude Design for design, and Co-work for docs, and more. And Claude, of course, can also read your emails and manage your calendar for you if you let it. So, what this means is that any knowledge work company is now a competitor to Anthropic. I'm talking about incumbents like Figma, Google Workspace, and Microsoft Office, along with AI startups like Replit, Lovable, and Gamma. Traditional tools like Figma and Office, they were designed for humans to handcraft designs and slides one by one.

[[15:27]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=927s) But the default path now is to work with AI to get 90% there and handcraft the last 10%. And AI-native tools like Rep and lovable and Gamma, they can create beautiful videos and slides, but they do pretty much very similar things as Claude design and Claude code and some of these other tools, right? So at this point, I can't tell if Anthropic is in the business of building a platform for other developers or potentially just competing with every single AI startup out there. But finally, the last point I want to make and that's more positive is what a great time is it to be a solo builder. AI is now good enough to be an entry-level designer and engineer. And as someone who's training product, I can now create whatever I want with AI's help. I just wish I had more time in the day to tinker and make these products. So, overall, Claude design is still early and pretty buggy. And it's also not clear to me how design, co-work, and code all fit together in Anthropic's product suite.

[[16:30]](https://www.youtube.com/watch?v=WMnk1LFBMqA&t=990s) But I think it's a pretty amazing product. I definitely recommend giving it a try because it's just so fun to play with as you see in this video. And if you enjoyed this practical tutorial, please be sure to like and subscribe to my channel for more like this. Thanks so much and I'll see you next time.


---
*Transcribed with [Tacit](https://www.trytacit.app)*