§ 01 · The Hook
The bait, then the rug-pull.
Anthropic just shipped a tool that broke the internet — and a creator on YouTube is already pitching the open-source replacement. The architecture twist is the lesson: OpenDesign doesn't compete with Claude. It rides on top of it.
What the video promised.
stated at 01:53“Let me show you exactly how to set it up, and then I will build you some example websites just to show you how it actually works.”delivered at 06:36
Where the time goes.
00:00 – 00:32
01 · Cold open · Anthropic's catch
Hook on Claude Design's launch, then pivot to its limitations: cloud-only, model-locked, subscription-gated.
00:32 – 01:10
02 · Meet OpenDesign
Open source, local-first, 29.5K GitHub stars, Apache 2.0 license. Brain-break: it doesn't replace Claude — it uses Claude.
01:10 – 01:50
03 · What's in the box
The numbers card: 15 coding agent CLIs auto-detected, 19 composable skills, 71 brand design systems (Apple/Stripe/Linear/Tesla/Spotify), 6 export formats.
01:50 – 02:02
04 · Same output, zero restrictions
Side-by-side framing: 'It's not even close.' Anthropic vs OpenDesign on portability, ownership, exports.
02:02 – 03:16
05 · Setup · five commands
Prereqs (VS Code, Node.js, git, Claude Code) → git clone → cd into folder → install pnpm → run command. End-to-end install in under two minutes.
03:16 – 04:40
06 · Setup wizard walkthrough
Pet selection, model picker (Claude Code chosen, but Codex/Cursor/Gemini/Hermes/OpenCode all listed), design-system picker, brand-context flow.
04:40 – 06:20
07 · Demo · FocusFlow landing page
Live build of a fictitious AI productivity tool's landing page using Apple as the design-system inspiration, linear/Vercel color direction, modern-minimal tone. Brief takes ~30 seconds.
06:20 – 06:52
08 · Reveal · the output
Five-minute build, $1.20 cost. Working landing page in the picked color direction, exportable to six formats including direct Vercel deploy.
06:52 – 07:26
09 · Closing · subscribe-and-tease
More competition = better/cheaper tools for users. Teases head-to-head Claude Design vs OpenDesign comparison video next; asks for build ideas in comments.
Visual structure at a glance.
Named ideas worth stealing.
00:11list
The Five Closed Doors
- Self-host on your own machine
- Pick your own model (no GPT, no Gemini)
- Add your own brand design systems
- Export to PowerPoint, video, or PDF
- Keep using it after your subscription ends
- Run anything offline or commercially
Six-pack laid out on a single editorial slide as 'Five doors that stay closed' — the slide title undercounts on purpose, the slide overdelivers. Riko enumerates Anthropic's closed-product friction points before pivoting to the open-source answer.
Steal forAny tool/SaaS comparison video. Stack the rented tool's limits as 'closed doors' before showing your alternative — frames every constraint as something the audience already feels.
01:20model
What's in the Box (numbers card)
- 15 coding agent CLIs (auto-detected)
- 19 composable skills (mix and match)
- 71 brand design systems (Apple, Stripe, Linear, Tesla, Spotify…)
- 6 export formats (HTML, PDF, PPTX, MP4, ZIP, MD)
Single-slide credibility builder. Four big numbers in serif type, no chart, no graph — just stats positioned to feel 'too big to ignore'.
Steal forAny product launch / review. Reduce 'features' to four numbers on one slide. Numbers do the heavy lifting; copy is just naming what's being counted.
01:00concept
Doesn't replace, uses
The architecture insight: OpenDesign isn't another LLM tool — it's a layer that turns the agent CLIs you're already paying for into a design engine. 'Layer 1: Your CLI agents → Layer 2: Open Design → Layer 3: Real artifacts.' Three-card slide.
Steal forPositioning. When competing against an established tool, don't oppose it — ride it. 'We don't replace X, we use X' is a less defensive frame and aligns the audience's existing investment with your product.
Lines you could clip.
01:00
“OpenDesign doesn't replace Claude. It actually uses Claude.”
00:15
“And the second your subscription ends — poof, it's gone.”
06:50
“More competition, more pressure for Anthropic, for OpenAI, makes the product better and also cheaper for users.”
06:20
“It costs, like, $1.20, which I think is pretty low for this output.”
How they spent the runtime.
Hook length32s
Info densityhigh
Filler8%
Things they pointed at.
00:00productClaude Design (Anthropic)
01:00toolClaude Code
01:00toolCodex
01:00toolCursor
01:00toolGemini CLI
02:10toolVS Code
02:10toolNode.js
02:10toolgit
03:08toolpnpm (package manager)
How they asked for the click.
06:50subscribe
“I plan to do a head to head comparison of Cloud Design and also OpenDesign… subscribe for that video. And in the comments, please tell me what should I build next.”
Soft sub-CTA layered with two engagement plays — (1) tease a future comparison video to bait subscriptions, (2) ask for build ideas to bait comments. Both are aligned to the algorithm without feeling like begging.
Word for word.
00:00Two weeks ago, Anthropic dropped Cloud Design, and it broke the Internet. People started shipping pitch decks, landing pages, and full prototypes in seconds just by typing what they wanted. But there's a catch. It's closed. It's cloud only, and it's locked on Tropics models, on Tropics rules, and the worst part, on Tropics prices. And here's a list of things you cannot do with Cloud Design right now. You cannot self host it. You cannot pick your own model. No GBT. No Gemini. You cannot export to PowerPoint or video formats.
00:32And the second your subscription ends, poof, it's gone. Basically, it's a really powerful tool, but with lots of different closed doors. This is where open design comes in. It's open source, local first. It has 29,000 stars on GitHub at the moment of filming, and also has Apache. I hope I'm saying it right. Two point o license, meaning you can use it commercially with zero restrictions, which is a big one. And here's the part which broke my brain when I first saw it. OpenDesign doesn't replace Clot. It actually uses Clot. It takes the coding agents already on your laptop, like ClothCode,
01:08Codex, Cursor, Gemini CLI, and turns them into design engine. Your existing setup does the work. OpenDesign just adds design layer on top. This is the key part. And out of the box, you are getting 15 coding agent CLIs auto detected, 19 composable skills you can mix and match, 71 brand grade design systems, which is really impressive. We have systems like Apple, Stripe, Linear, Tesla, Spotify,
01:35all baked in. I'm not sure about how the copyright goes with these, but it's only for the imagination. And it exports to six formats, HTML, PDF, PowerPoint,
01:46m p four video, ZIP, and also markdown formats. So if we put Clot Design and Open Design side by side, it's not even close. Let me show you exactly how to set it up, and then I will build you some example websites just to show you how it actually works. So first of all, you need three things working. You need Versus Code or whatever platform you're using. For my example, I will use Versus Code, and then need to check three things. So first of all, do we have Node. Js installed?
02:14Do we have git and also ClotCode installed on our systems? And to double check, you can run three of these commands. Each of them will show you if you have all the necessary software and all the necessary stuff installed in your computer. Next step, you have to navigate to desktop, and we have to clone the repost right from the GitHub. Just type in git clone and also the link of the git repository.
02:36Also, you can find all the commands and all the links in description. Don't forget to subscribe. This downloads the entire project or machine and takes around thirty, forty seconds. Once it's done, we can actually jump into open design folder. So run command c d open design. This is where all the files exist. You'll see a full project structure, apps, packages,
02:55skills, design systems I mentioned. We have, like, again, Apple, Bugatti, and all the different brand systems, and read me a file if you actually want to dig deeper. After that, we have to install PNPMs. OpenDesign uses a package manager called PNPM,
03:10and you have to run two commands. You can see both of these commands on the screen. Again, you can copy the commands from the description. And lastly, once everything is done, run this command you see on the screen, and this will open OpenDesign. I hope it all makes sense. It's really simple setup, just few commands, and we are ready to roll. So once it opens, you get this setting window where you can actually set few different things. So first of all, you can get a pet. So for this, let's select this. Just quick setup. After you have your pet, the most important thing is selecting the model. So right here, can see all the different local CLIs you have connected. So for my example, I only have ClothCode, but you can also select Codex,
03:48OpenCode, Gemini, Hermes, uh, Cursor. So, yeah, lots of different options. But as I mentioned for this video, we are using ClothCode. So let's select it. Also, what's cool if you scroll down, we also have skills and design systems right here, but let's talk about it a bit later. So let's save it. And if you used ClothCode in the past, it looks almost the same. And for this video, I decided to do something really simple to actually show off how it all looks. Let's call the prototype
04:13demo. Let's select the design system. As I mentioned, you can select from all the different brands. For this one, let's use Apple as inspiration. So let's click on Apple. Uh, we are creating high fidelity website. You can also use wireframes. Again, it's the same workflow we had with the Clot Design. Let's click create. And on the left, we have the window where we can input the prompt, also add some additional information. For example, you can drop and paste images for visual references or type at to attach file from the project or try one of these starters.
04:44So we have three options. Actually, you can do annual report long scroll, SaaS analytics dashboard, and editorial page dev. I would say pretty interesting options for default. I don't know if people are building these that much. And for this example, I have a prompt ready. Let's make it bigger. I just saw you can actually make this window bigger. Let's paste it in. So build me a landing page for an AI productivity tool called FocusFlow,
05:06and I actually input more information. But, again, we are just doing it as a demo. Let's send it. Okay. We have quick brief for thirty seconds, so let's fill it out. So primary surface, desktop web, responsive all sizes, visual tone, modern minimal. Next up, brand context. Pick direction for me. Yeah. Let's go for the pick.
05:26Color mode, let's go for Apple style, and copy and content. Right. Realistic copy for me. So, yeah, I think for example, it's more than enough. Send an answer. Again, this is pretty similar to clot code, but you get a bit different questions, different information. But so far, actually, this is way easier if you're starting from scratch. Okay. Again, we can select the colors. So let's see what kind of options we have.
05:50I think let's go for the linear Vercel. Okay. Send an answer. So while we wait, I just wanna tease my next videos on this channel. So I plan to do a head to head comparison of Clot Design and also OpenDesign, really hard names. So I plan to build, like, three or four different platforms, like dashboards, uh, landing pages with the same prompts and same instructions,
06:13and see which platform performs better and also how much cheaper is to use OpenDesign. So subscribe for that video, and you can see we are actually cooking with OpenDesign. Stuff is happening. Interesting to see how long does it actually take. So it already took two minutes. So let's cut to the fin And we have our website. It took almost five minutes, which is pretty quick. And you can see right here, I think it calculates the price. So it costs, like, $1.20,
06:38which I think is pretty low for this output because, again, it's so quick. And, actually, yeah, it looks pretty good. You can see how the website looks. It kinda tried to emulate some of the colors we picked. We have the buttons, the features. Again, pretty standard website, pretty clean look. And if you want to share, click right here. And we have these additional formats. So, again, PDF, PPTX,
07:01ZIP, HTML, uh, markdown, and you can also deploy to Vercel. So so far, I'm really loving these platforms because more pressure, more competition for Entropic, for OpenAI makes the product better and also cheaper for users. So in the comments, please tell me what should I build next in my future videos where I'll be comparing Cloud Code with OpenDesign. So leave some ideas in the comments, and, of course, subscribe for more videos like this. See you next time.
§ · For Joe
The architecture is the format.
Slide-driven tutorial · steal-this playbook
The reason this video reads as 'premium' isn't the production budget — it's that every claim has a slide, and every slide has one big idea. That's a format you can ship every week.
- Build a reusable editorial slide template (serif display face, cream/off-white background, single-color accent, big-number stat layout). One designer pass, infinite videos.
- Open every tutorial with a 'doors that stay closed' slide enumerating what the rented/closed alternative CAN'T do. Pain inventory before pitch.
- Keep the host in a corner-PIP throughout slide segments — don't cut to 'host' / 'slide' / 'host' / 'slide'. The persistent face keeps trust high while the slide does the data work.
- When positioning against an incumbent, lead with 'we don't replace X, we use X.' Aligns audience's existing investment with your product instead of asking them to switch.
- Reduce features to a single 'numbers card': 4 big numbers on one slide. Stripped of charts/copy, it reads as 'too big to ignore.'
- Stack a setup walkthrough between hook and demo — the prereq+command list buys credibility. Watchers think 'I could actually do this.'
- End with a tease (next-video subscribe-bait) AND an open question (build-idea comment-bait). One CTA picks up subs, the other picks up engagement signal — they don't fight.
