# Meet the Figma Killer (Testing It Live with a Design Expert) Channel: The Next New Thing Video: https://www.youtube.com/watch?v=iCte1U7MKCk Duration: 24 min Language: English Words: 4652 Transcript page: https://viewrankai.com/tools/youtube-transcript/iCte1U7MKCk --- [0:00] Welcome to the new world of agent-based designing with Fable 5. This right here is Cloud Code running Fable 5, and it's fully controlling Figma. Wait, no, [music] not Figma. This is actually the agent native version of Figma called Paper. And in this video, I'm going to show you how I use AI agents to do all of my design work for YouTube thumbnails, landing pages, and other websites, Instagram graphics, and documents and presentations. All by prompting an AI agent, Fable 5, to create designs on this canvas-like app [0:33] that's [music] built for AI agents. Let's dive into the video. All right, we're going to look at the best videos on YouTube of creators who are designing using a new app called Paper plus their AI agent of choice. Then we're going to test it and compare it to Claw Design so you can figure out what's the best way to design using an agent. Joining me is Katherine Labry, the designer who [0:52] created Best Self. Let's get into it. presented by Zapier, the AI automation company. All right, so this right here is Clawed Code running in the Claw desktop app. As and by the way, I do this in VS Code cuz that's what I like to use. It doesn't really matter as long as you've got it on your desktop. What are you using to [1:12] code? I use Ghosty or CMUX. Perfect. It'll work with that. Here I'm running Fable 5. This is the prompt that I just typed in. And Claude Code is going to control this canvas-like board right here. And so here you go. The AI agent is actually starting to create a presentation directly on this board. My prompt was to create a presentation on how to use paper. And because of a skill that I'll show you how to set up later, it can scrape all of the assets from the internet and place it directly in the presentation. Look at this. Fable 5 is literally designing this presentation right here. And look at this. It can [1:52] very easily create really cool graphics. You can create landing pages, presentations, and it will create these graphics. Look at that. So, this is how Cloud Code writes designs to the paper MCP server, which we'll be talking about later. And then Cloud Code reads the context. And here's the next step. Passes it to the paper design file. And [2:14] that's how it works. All right. So, you do need to have the desktop app of paper. I wish it worked on the web, but once you do, Claude Code controls it. You get to go in and mess with it. I kind of like it. What do you think so far? I I mean, I really like it. What I'd be curious about is how token efficient is it to use Fable and then paper or paper just like super token efficient with their designs? Because a lot of times I'm making designs in like clawed artifacts. And so, I'd be curious. One thing I like about this is that you can [2:44] move things which you can't do in clawed. So, I mean, I like it for that because a lot of times like Claw doesn't quite get it right and I like want to mess around with it and, you know, trying to talk to Claw to do one thing, it like does something completely different sometimes. So, I like that part of it. Um, yeah. And I'd be curious, do they have like some sort of harness in their paper system that they just know how to make the design look [3:09] good all the time? They That's a good question actually. Where's the design coming from? Is it coming from cloud or is it coming from paper and claude is just sending it? It's kind of a combination. Let's take a look at how it's set up. See this button that you can press called using agents and you can just hit get started and he and that's just on his desktop app. As soon as he clicks it, they're basically promoting the heck out of it. The fact [3:30] that you can get this. What you can do very easily is you can actually literally just copy this link paper.design/doc/mcp assign /doc/mcp and you are going to go to claude the claude desktop app for those of you who use claude. You can also do this with codecs. You can do this with cursor any AI coding tool where there's an agent running on your computer. You can do this. And what you can do is you can go to a new chat and you can say I want to set up the MCP server to control my [4:04] paper.design. And then you're going to paste in this link and then Claude will set up the connection for you. And so after you've typed that prompt and entered it into Claude Code, what I want you to do is open up paper next to Claude Code and we're going to test the connection. So you're just going to hit new file and [4:21] we're going to name this Riley site. One thing I don't know what this is. This little grid thing at the top. This is something custom he has. I like it. No, it's not. It's actually the clawed code desktop will show when you've used it. It's kind of trying to create the GitHub experience there to get you to [4:40] Oh, interesting. to use it and to keep a streak going. Yeah, he's I don't know why he's using the desktop app, but I found that a lot of creators do largely because it's the one that most people have. I don't know if that's why he's using it. Got it. Okay. I just I guess I haven't [4:53] used it recently. I tend not to use it either. Hello on the board. Remember, this is a very similar process as Figma. If you used before, it'll feel very similar. Hey there, cloud code. I want you to tell me what board do I have open on paper. Tell me the answer to that. And then I want you to create a single simple graphic just so I know that you can control my paper.design. And I'm not going to use high for this because I'm just going to use low. We do not need to waste those fable tokens. And we can run it. And now we're basically just testing [5:25] the connection between claude and paper. And there you go. I did that exact same thing. It's nice. It works pretty quickly for something like this. All right, let's now that we see it, let's look at something a little bit more impressive. Thumbnails. How do I put these highquality thumbnails from other YouTubers inside paper? That's where Claude Code comes in. So, I can go to Claude Code and I can say a guy named Callaway. Many of you may know who this is. He is one of my favorite YouTubers. I want you to find his 10 best thumbnails. uh actually his 12 best thumbnails and import them in a frame inside paper. So I want his [6:06] 12 best performing thumbnails in paper and please import them so the images are in the paper board. Okay, this I think is one of the best parts of it that any tool that you could connect into cloud code can now get the data and then send it into paper. I really like that. Yeah, I like that. I was like, how does he how I'm I'm curious what the engine is that feeds that like picking the best parts. Is it just going from like views or There's so many different ones. He's using a skill and we'll have a link to it below so that you can go and use the [6:38] same skill and the same tool. But um I use Vid IQ and Vid IQ can pull things like that for me and frankly what you could do and this is what I I would this is what I often do. I just tell Claude Code, go use my browser and then see what their top performing videos are and grab the screenshots and it just puts it in. I mean, I I'm I I am so curious how he like takes the 12 and does it say, "Okay, like create something similar with my pictures and these assets." And [7:03] I'm curious. Yes. Okay, there you go. It just created. Now he has the 12. By the way, I should say every time I see a creator do something like this, they like hit the prompt, they hit send, and then they get the results. I'm like, "Why doesn't it happen for me?" It takes a long It takes however long it takes. Right. Does he say at the bottom this took like 12 minutes for I fast forwarded through some of the conversation to get right through it? It depends on what tools you're using to get the data. And no, he didn't say all 12 of his YouTube thumbnails. So now [7:33] I can just copy this photo of me and we're going to bring it up here and place it right next to Callaway's YouTube thumbnails. And now we can select from whatever one we like the most. And by the way, now at this point he's putting away Claude code. He's just editing in the tool itself in paper. Let's go ahead and let's use this one right here. Now, I'm going to just copy this image and we can just place it right here. And now we can actually replace we can select the Callaway [8:02] image. I can select this right here. And he he didn't specifically say it, but now he's using paper's own AI internally, and he does that quite a bit, which is fine, right? What you want to do is get the data using cloud code and then edit here if if you can replace the man the guy holding the phone with this guy. Make the text say addicting apps. And on the phone it should be the same but with an app store icon, right? Kind of making it for my niche. And so we can run this just like that. And there you go. Here they're coming in. It's not bad. I like that it [8:52] changed the background of this one. And look at this. This one might be my favorite one so far. But it gives you just like seven different options to choose from. And this allows you to ideulate around and come up with the right format for your YouTube thumbnail. Okay. Now, let's use more than one image reference. So I just grab [9:08] Okay, that's awesome. What do you think? I think that's great. Right. Yeah. Because I don't know about you, but I mean I'm not doing a lot of thumbnails these days, but when I did, it would just take so much time and minutia to like figure it out and then you just pick something. But if you can come up with 12 good options here, and he's picking thumbnails because as a YouTuber, this is the thing that he's spending the most time on. But let's [9:31] move on to a presentation. Say, hey, so in this frame, I have a bunch of photos of me. What I want you to do is create a six slide high quality pitch deck. Not even a pitch deck. This is a presentation pitching on my creator business, right? I'm a content creator and I educate people. I want to make a deck for sponsors to show that I make really high quality education tutorials, do a ton of research on YouTube is use the scraper skill that we've created. I [10:01] want this brand to look like Perplexity. I think they have a great brand and so I want this deck to kind of match that style. Remember, keep it simple. Don't have footers. I don't like footer text. I don't even like subtitle text, but I I like crisp headers, good design, cool graphics, simple layout, explain things very simply. I like whites space. Create a six uh deck, but each one of the slide should have one of these images of me on [10:29] it and use one per slide. I This is the way that I prompt also. I just don't even correct myself anymore. I just spit it all out. You two? Yeah. I [snorts] thank God for a whisper flow or any voice to text when I have to type I'm like oh my god right and and in the past I would go I would stop myself and then correct my no just send it all over it can figure it out and what he did here was he selected a collection of photos which he which he put all into one frame and then he put the link into cloud code he gave it the [11:02] prompt and here's the result and you see here it pulled the perplexity design same colors same font font and it placed the image on the deck. Deck one. You just did like a look back like out of out of impression. Like you were impressed, right? Yeah, it's pretty good. Here's the cover. What I do. Oh, and here we go. It says, "I teach people how to build with AI tutorials, deep dives, [11:27] and buildalongs." That's exactly true. Very simple deck. I love this. I love decks like these. I do not like it when they make it cluttered. I do hope it creates some cool graphics. Oh, there you go. It put me on this blue background. I dig it. Okay, there it is. And again, we can actually interrupt it. I forgot to give it my personal site is my personal site. You can get info from that. And there you go. So now it got I gave it my personal website and it updated the reach and now it's actually up to date, which is exactly what we want. Hours of research behind every [12:09] video. Love it. And there you go. Research, test every tool, build on camera, teach it simply. And it's just going to finish building this full deck here, which is awesome. Oh, it even moved the image. There you go. I dig it. There you go. It looks like it's doing a different color background for the last slide, which is pretty solid. And there it is. It's that easy to create a little [12:36] slide deck with AI using Cloud Code. Now, what I want to do as a bonus, we're actually going to create a personal site that has this deck in the site and it's going to be optimized for both web and mobile. And we're going to get it on the internet in a single prompt. Hey, I really like this full slide deck. You did a great job. Now, what I want you to do is create a website, a landing page that's optimized for web and mobile that allows people to just see Riley Brown at the top and uh below it, it just says uh it has like one cool line and beneath [13:10] it, it has the slide deck where people can toggle which slide. I want you to create this website and then I want you to deploy it to Verscell and send me the link so that I can see it on the actual internet and I can send it to people. And we are just going to fire off this prompt right here. Okay, here we go. So [13:28] now we have our site that was completed. I can click on this and open it up. And look, we have our slide deck in a website that's deployed on the internet. You could go to the site riley-sponsorsite.cell.app. And [snorts] we have the slide deck right here directly in the website as we created it in paper. I I like it. I like the interaction [13:56] between Claude Code and um and Paper. Yeah. I mean, I think it's great. Well, first of all, I was like, did he have Versel already hooked up to his account? Yes, we all do. I mean, I have Cloudflare because we're friends with Nick Gray, who keeps promoting Cloudflare, but Yeah. Yeah. Also, when I use Versel, I don't tell Nick Gray, but yeah, I mean, I use Claude a ton for design, and you can do this in Claude. And so, the the website is not as interesting to me as the as the thumbnails because that's personally where it's pulling from different things and then you're [14:30] able to edit it. Look at this. Here's uh ads created. This is Nick's Rafa like a hundred ads yesterday. Here's some more examples. Boy, stop doing it manually. Someone built an elephant tracker for an orphanage. Actually happened. Um Reiky, I don't know. It thinks Russell. The point is I don't think Nick is very creative with his ads. I think he could have given it [14:52] better prompts, right? Yeah. I'm like, did they come up with the ads? Uh, yes. 100 bad ads or that don't generate anything are not great. No, the ability to create them is great. The fact that they're not very good is is a problem. But look at how happy he is. And this is the problem that I have. When you create something using Claude, it it's your creation. You feel like this is the best. This is so funny. He's [15:16] cracking up at these ads. [snorts] All right. Uh, let's look at one other. This is This one I like for an example of how you could connect multiple tools together. This is her tool and what she wanted to do was add to her software the ability for users to comment and so why she's going to use [15:33] it. So now I can select copy but I'm not loving how it's defining it here. I want to explore ways. So now she's giving a prompt because she's realizing hey you know what the way that I'm commenting is just not great. can make it clear that the user is copying text and he's editing text. I'm putting a screenshot as a reference of the thing that I want to work on. Can we first use the Mobin MCP to find inspo and then can we take all of the inspo from Mobin and put it into paper using the paper MCP so that I can see next to each other all of the inspo and compare [16:10] them. And Mobin is another MCP. You use it. Why? Yeah. uh just to come up with ideas. It's like, oh, we need a pricing page or because sometimes, you know, if you just ask for a pricing page, it has like one idea, but if you say, I want like this category, the six best pricing [16:33] pages, and let's come up with options. Oh, interesting. Okay. And are you using the MCP? Yeah, you are. Okay. So, I didn't even know about it until I saw uh the design projects video here. Okay. So, that's what she did. She said, "Give me some inspiration. Here's the result." It's officially done. How leading product visually separates references [16:52] and quoted. So, it's saying it's pulling from Medium. Okay. This is how it copies it. Okay. This is great reference. Um, also showing Medium. Okay. Discord. I don't understand. Discord. A reply to bar. Uh, I don't think that makes as much sense. Is it any better to see it here in paper the way that she does than to see it the way that you see it when you get results from Mobin? Uh I I mean I'm just using the terminal a lot of times. So I think it is better to see it in here because otherwise it's like [17:29] sending you a link to look at something. So I think seeing it next to each other is good because otherwise you're kind of flipping between screens. Um Okay. Interesting. Actually, as I'm watching this one, I'll I could talk about at the end like one way that I'll probably start using paper. Yeah, tell me what are you thinking? Well, cuz a lot of times if I ask my agents to design something, like I like starting not with a blank slate, but if they give me something, it's like never right. So, I'll want to like fiddle and tweak it. And so if they did it in paper, I could just go in there and [18:02] like, you know, move around the pixels and like tweak it how I want rather than starting from either like a blank slate or try to give it feedback where it's not completely right. One thing I'd be curious about if you can load other like models and CLI into paper. So if I didn't want to use their image generation, could I use another one and [18:22] then load it in? I wonder if you could do that. Um, I didn't see anyone do that. Let's try right now. I'm going to stop this. I'll share my other screen and let's see what that looks like. I'm going to open up a new file right here. [snorts] And you can see my clawed code right here. What I'm going to do is I'm going [18:40] to ask it to get your Twitter account. And I'll use dictation like everyone else. Okay, here goes. I want Katherine to do my podcast. I want you to create a three-page deck telling her why she should do my podcast. use her photos as you see on the internet. But on the very first one, I want you to use this photo specifically, the one that I'm attaching. And she cares about um entrepreneurship and helping entrepreneurs. So, I want you to emphasize that part of my podcast. And I also want you to find actual tweets from [19:16] her account. That's why I'm linking it. And see what she's interested in and uh gear the slides towards her. Okay. Now, I'm going to grab the image from your Twitter. account and let's see what it does. Oh, and I forgot to say paper. I want you to use paper. In fact, I'm going to do it here. [19:36] I want you to use paper. I've actually seen a few people say, "Don't forget to say do it in paper." All right. And just to see what it would be like if we were to do this in Claw Design, I have the exact same prompt copied and pasted. I'll end with a photo. I'm going to send it. Okay. And we'll leave this up for a [19:58] moment while it works. All right. Let's let's evaluate this. I'm not even going to wait for it to finish. It's just taking a very long time. And I think a big part of it was the research. And we'll have up on the screen how long it took. But having said that, let's look. Overall, I think that it was it was helpful to test it with an image that we gave it. And so the answer [20:17] is yes, we can give it our own image. Um, I like the overall design that it that it used and that the last page has this dark color to it. That's really nice. It even So, all this all this is good. I think there's a research issue here where it pulled information from my previous project like Bootstrap Giants up here. I don't know why. I probably could have prompted Claude better or I could have given it a file. I just assumed that Claude knows me by now and this was unusual. Um, overall I'll actually, you know what, I think it was a long time to wait. I'll give the [20:53] design I'll give it a an 8 out of 10. What would you give it? Give it I'd give it like a 7.2. Your designer, what stands out for you? I think it's interesting how it the last slide on this one is dark and this last slide on Riley's was also dark. So, I wonder if that's like a pattern, which I do think like the pattern interrupt is good. Um, but just curious, [21:16] right? And I do like that it's three different templates instead of the same thing three times. Mhm. Okay. I like it. Um, let's take a look at what it looked like in Claw Design. We did the exact same thing in Claw Design. Uh, I like the text on top. Katherine, come do the next new thing. It got the site name right because it asked me for it. But still, look, it still has bootstrapped all over, which is not what we're aiming for. Look, in claw design, you can now actually edit, [21:47] right? You can move it around. So, that's pretty good. Let's look at the second slide. Also good. It's selling me. This is I'm not even going to judge it based on content. I think that content is about the prompt and the information I gave it. Um, it also has that last slide that looks [22:08] dark. I think paper is much better design. Yeah, agreed. But this one's not bad. I think if I gave it a little more direction, I could end up with a nice design. This one was much faster. And I like how it even has a speaker notes here. It's clearly meant for me to present in here, too. Um, I can edit in here, which is nice. I [22:29] can share it. All right. [snorts] Which one would you reach for be open? Claw design or paper and where? So, for this specific thing, I'd probably use Claw Design, even though the design wasn't as good. We didn't give a lot of direction, but I have like design skills and like custom brand skills, which I'd be curious if you applied that. So, if you had like a the next thing skill, which I'm sure you have like some sort of branding design skill, if you just kind of applied it because this is so much faster. Like the paper, what took like 40 minutes. That's for three slides. I mean, [23:10] they look better, but if I gave Claude a little more information and a little more context, I I think it could be the same or better. Okay, I agree. I think they got problems with paper. It's exciting. It's great. I don't know that it's great enough to replace Claude design for me. I mean, because Claude, it's like all in one price for me to go and actually like spend money on another thing. Um, the only thing I liked was the the thumbnail [23:37] thing. That was cool. Yeah, fair point. I don't think I could come in here and just rightclick and remove the background color and do those kinds of things. So, yeah, for more intricate design changes, I guess paper. Uh, otherwise, I would use this. And you're right, I did have to pay for paper. I think it was like 20 bucks a [23:56] month. All right, Katherine. And now that this is done, you should know that Katherine is super impressive when it comes to agents. And I've got a whole video of her showing us how she sets up her agents. And people love it. Katherine, it was one of the breakout first hits that we had here. And I appreciate you doing it. And I'll see you all in that next --- About this transcript Read from YouTube's own caption track and laid out by ViewRank AI (https://viewrankai.com). ViewRank AI finds the videos already beating a creator's own average on Instagram, TikTok and YouTube Shorts, transcribes them from the audio itself in more than 60 languages, and turns what worked into new ideas and scripts. Free transcript tools, no account needed: https://viewrankai.com/tools How to read any video this way: https://viewrankai.com/llms.txt