Nate Parrott - How a Side Project Became Claude Design

00:00:00Did you know claw design started off asa side project by one person? Cloud codeis just text, right? What if I justpaste a bunch of screenshots from theterminal from cloud code into you sothat you know what the interface lookslike and then I ask you to like mock upstuff by outputting essentially ask. AndI asked Claude to do this and likeClaude actually did an okay job. Like itwasn't perfect. None of the bars linedup, but it was enough to be like whoalike Claude can actually make mockups.So, I built this internal tool that waswhat became client design, which wasjust an agent plus [music] the abilityto output HTML.>> What's it like leading design of aproject like this inside of Enthropic?>> We never would have prototyped it in theprevious era, but we were able to do it.And it actually felt really, really cooland a little too goofy to show. Like,>> there's a whole set of features in theproduct that never would have made itthe light of day without being able tolike be prototyped really, reallyrapidly.>> Welcome to Dive Club. My name is Vid andthis is where designers never stop[music] learning. This week's episode iswith Nate Parrot, who you might remember[clears throat] back when I interviewedhim as the founding designer of thebrowser company. Well, today Nate'sgoing to come on and give the ultimatebehind the scenes of claw design. And

00:01:15tostart, I asked him to put together a fewexamples of how he uses the tool in hisworkflow just so that we can get abetter sense of what claw design makespossible. So this is probably the therealest uh look at the way that Itypically work. So of course I do a lotof design for cloud design within clouddesign. And I try to go prompt firstwhere I just give the model a, you know,rough outline of what I'm looking forand I ask it to give me some options.You know what I found is the models aregetting better and better at design, butthey're still really really far frombeing good and really really far fromhaving good taste. And so typically whatI will do is I will just you know askthem to make up for that in terms ofsheer volume. So I'll ask for like fivedifferent versions of every possibleaspect of a design and then I'll gothrough and I'll sort of try them alland see what they feel like. So in thiscase you know I>> this is trippy. It took me a second tobe like oh wow that's actually changingon the left here. understand theinception is real>> in the in the product right now and wehave this thing where like you know onceyour prompt cache expires we lightlynudge you to make a new conversation sothat you don't uh end up spending abunch of tokens and so I have optionsfor the the layout the color the iconswe use the copy size all that stuff andtypically the way that

00:02:30I'll work is I'llsay you know give me some options forthis and then I'll say okay you know Ilike variant A a little bit and I likevariant B a little bit can you give meyou know six more options in that veinand I'll give it more specific guidanceas well. But typically, this is this ishow I work. I'm like, "Give me a bunchof stuff." I'll treat it as like alittle bit of a junior designer and I'llsay, "Let me give you feedback. Let meuse my taste alongside your ability tomock things really really fast." This isreally cool because it's like theperfect middle ground between how I'musing artifacts or sometimes even justraw HTML and then something like DialKit by Josh Pucket. Whereas the raw HTMLgives me the variance in a way thatmakes sense, but then Josh gives me theparameters and this gives me both, whichis very compelling.>> Exactly. Exactly. And the biggest tip Ihave for people here is like if youaren't sure what something should looklike, you know, first of all, you can gointo our editor and tweak it, but alsoyou can just ask Claude for whatevertweak you want. So if you're not surewhat the color scheme should look likeor you're not quite sure how ananimation should be damped, you can justask Claude. You can be like, "Give mefive different options or give me aslider to pick them or let me likemanually position something and move itaround." And Quad can actually buildwhatever interface it is for whateveryou're trying to do. So, here's anotherexample that's kind of related to this.We

00:03:45were playing around with differentvisuals and color schemes for what theapp might look like. And, you know, youcan just try manually changing all thecolor tokens yourself. But, I said,"Hey, you know, I I'm still at thisphase where I kind of just want toeyeball it." And so, I said, "Hey,Claude, you know what? if this just feltlike Instagram, like give me a bunch ofreally, really highlevel controls overall of the color v variables at once.So, you know, it gave me a coupledifferent themes and then it gave mephoto edit style sliders where I couldtweak things like the hue and the chromaand the lightness and and all that. Andit felt like a really fast way to get tolike something that looked really goodto me before dialing it in and actuallyfiguring out the precise set of colors.>> That's so good. The color theming wouldbe so painstaking a couple years ago andI'm just looking at this likeunbelievable. I would have spent so muchtime creating this type of environmentin Figma. Real quick message and then wecan jump back into it. So Figma addedmotion to their stack, [music] but I'llbe honest, I'm having a hard timeleaving a tool like Jitter. It's just soso simple because it does one thingreally well, but it's also superpowerful compared to Figma, too. [music]Like you can spin up hundreds of onbrandvariants from a single asset or generate[music] a whole CSV's worth of videos ormaybe even design your

00:05:00own custom texteffects. There's so much to it and yetit's one of the most intuitive productsin my entire stack. Hands down. So ifyou haven't used Jitter yet, I cannotrecommend it enough. [music] Just headto dive.club/jitterto get started. So, I got a sneak peekof DES's new private [music] betarelease. And let me tell you, they aretaking the infinite canvas to a wholeother level. It's [music] not justrandom mock-ups or one-off prototypes.You can run real product pages directly[music] on a canvas. I mean, just thinkabout what that unlocks for parallelexploration. You can branch as much asyou want. Get the agent to exploremultiple ideas side by side, which isperfect for aligning the team becauseyou have one space [music] to reviewprototypes, leave comments, and even getthe agent to act on the feedback youreceive. It's a big deal. But here's thething. Destin is only onboarding a fewteams every week. [music] But if you goto dive.club/desen,you can book a chat with theirco-founder, Gav, and tell them RID sentyou to jump the queue. So, head todive.club/desen.[music]That's dsn.Now, on to the episode.>> It's just so fun to like

00:06:15get theselittle one-off editors. Uh, one coolthing you can do here actually is youcould drop in an image and it will pullthe color scheme straight from theimage. So, like if I have I have thisphoto of a tangerine on my desktop andI'll drop it in, it'll give me atangerine theme. that I can tweak, whichis pretty neat. It's like it feels likea toy, but it's it's very useful interms of trying to figure out what vibeI actually want to go for. Another thingin that vein of building your owneditors is when we started the project,we wanted to have a little uh introteaser that showed people what you cando in Claw Design. And for a while, thisplayed when you opened up the product.And I am not a pro at After Effects, andI have no idea how to do this. So, Ijust kind of asked Claude to make thisanimation for me. And then I was goingto like record it in Cleot and downloadit. And what I found is that the modelis is not super great at gettinganimation timing working. And it's notsuper great at positioning the cursor inthe right place. And so I said, "Hey,give me like a full set of tweaks,likeund 173 tweaks, I guess,>> uh, for every single parameter of thisanimation. So I can go in here and I caneyeball it, right? So, I can go and likeif I'm not sure exactly where the cursoris supposed to be here, I can go in hereand I can just drag it around uh andposition it exactly where I want. Andit's like I don't need this editor foranything else

00:07:31besides this oneparticular project, but Claude was ableto call it up for me. Uh, and it workedpretty well. Seeing you drag it aroundkind of breaks my brain a little bit. Iguess it's like everything that you'reshowing it exists in this interestingmiddle ground between mediums that I'mfamiliar with, you know, like thatdoesn't fit in a box for me what youjust did.>> Yes. I mean, this is this is my wholething, right? This is what I I try toexpress to people, especially whenpeople are making stuff that's notinteractive software. They're makingstuff like decks or documents or stuff.I try to like pill people on this ideathat you can exist in the middle ground.Like you can make a deck or you can makea prototype or you can make ananimation, but you can also just makesomething that's right in the middlebetween all of this. So this is, youknow, I was demoing like what it mightlook like to create a deck to pitch anidea. This is my dumb idea of we shouldfill in the East River and uh buildhousing there. Not a real not a realsuggestion, by the way. What's coolabout it is that you can make documentsthat are also interactive in a way thatI think a lot of people don't reallyinternalize that now you can do becauseanybody can can ask the model to codefor them. So if I'm trying to, you know,convince people about like, you know, apolicy suggestion, you know, I don'tjust have to show them a doc, I can showthem uh an interactive thing where theycan tweak the parameters and tweak

00:08:46theassumptions and see how various aspectsof the proposal change. And it's likeyou can do this for anything. You canembed this in a document. You can embedthis in a presentation. You could even,you know, in theory have an interactiveanimation. And so I'm very excited aboutlike, you know, how do we build visualartifacts that live at the intersectionof like the old static forms and newdynamic forms. And you can do this inreally small ways as well. Like I uh dida presentation at Shopify a while backand I wanted to make really neat visualsection slides for each section. And youknow, this is the kind of thing thatwould not make sense to do in any otherworld, but now that it's super easy, Ican make these like nice animated,richly visual section headers and uh andjust show them.>> It's cool. The ceiling for storytellinghas definitely risen.>> Yeah. I mean, so I've been, you know,trying to to raise the ceiling forstorytelling in my own practice, butalso, you know, we've been able to seedthis to the rest of the company as well.So, Anthropic did this survey where weasked a bunch of people what they wantedfrom AI and the creative team ratherthan doing a static thing was actuallyable to do this nice little uh lightlyinteractive visual animated thing whereas you scroll you see you know thedifferent dots change in ways and Idon't know exactly uh how this works andwhat it's

00:10:01showing but it's like you knowit's fun because it's like the kind ofthing that you wouldn't normally do orthat you wouldn't normally makeinteractive like in any other world youwouldn't be able to drag the globe andand change your posture but you can'there because hey it's all interactiveand it's all super super easy. Now theother thing that I love about you knowhaving interactivity at your fingertipsis that you can kind of get it licensedto do sillier dumber things. So we werein a meeting a while back. This ispre-launch and we were we had thisreally silly idea and I just opened upcloud design and I turned on voice modeand I dictated in what I wanted and clalike basically one shoted it. Maybe itwas two or three shots, but it was thisidea that like never would have seen thelight of day before this era. And youknow, we didn't ship it, but at least wewere able to try it. So, here's theidea. Imagine you're in a design and youwant to give feedback and you want to doit in a little bit of a fun way. Uh, youopen this weatherman button and youallow your camera and then it actuallygreen screens you on top of the designand I can point at stuff and givefeedback. Yeah, I loveblue. This is not a good name for thisproduct. And like honestly we we almostdid ship this because you know we neverwould have prototyped it in the previousera but we were able to do it and itactually felt really really cool and alittle too goofy to sh like>> there's a whole set

00:11:16of features in theproduct that never would have made itthe light of day without being able tolike be prototyped really reallyrapidly. So, what I did right beforethis call is I was using the SupercutMCP to like make a video of me talkingthrough my designs and then I servedthat up as my prompt inside of Quad. Butthe whole time I'm like, this is areally interesting baby step, butthere's definitely a medium that's likea little bit better and more opinionatedfor like this specific use case of whereI'm like talking about a very specificelement and and like helping Claudebridge that gap a little bit. And thisis it. This is it. Maybe Weatherman's alittle bit goofy, but it's awesome. Ilove this prototype.>> Well, so what it actually ended upbecoming was a little less fun, butstill pretty useful. This is one of myfavorite underrated features of Claudedesign, but you should try it out ifyou're able to. So, we have this voicemode that worked like you'd expect. Youpress a button and you can dictate toClaude, but you can also point at thingsand Claude will know what you'repointing at. So, for example, I can, youknow, go into this mode and I'm justdictating like normal,but then I can point at things andthey'll be associated with whatever itis I was pointing at when I did that.So, I can do things like, hey, the knobon this slider is a little too small.Let's make it a little larger. Hey

00:12:31Claude, you're doing the classic thingwhere you have a colorful left border,but no border on the rest of it. Let'slet's please try to avoid that. Andwhat's cool is that it's like it itreally increases the bandwidth withwhich you're able to communicate withClaude. Uh, and is it superdiscoverable? No.>> This is so great. And it's still fun.The little like trailing animation withthe text, that's amazing. I didn't evenknow this was a thing. I I I I literallywas describing an iMessage just, youknow, like a few weeks ago. I was like,"This is the interaction that I want forinteracting with Claude while building."And I didn't actually realize until justnow that you had already>> I mean, this is this is our problem,right? We have to we have to make a lotof these things a little morediscoverable and like [clears throat]walk the line between like>> it's cool and we want you to use it andalso we want to step back and let youdesign and like you know such is the thechallenge of building a design tool butuh hopefully a lot more stuff like thiswill land pretty soon. So I chose somestuff that I that was not made by me butthat was made by a handful of of otherfolks. So there's this artist anddesigner on Twitter named Yanlu who hasbeen posting some of my favorite clawdesign stuff. So here's one example. Shemade this uh beautiful little postagestamp with these ducks moving around andthis like very visceral texture that asyou move your mouse it, you know, theperspective changes and there's ahighlight. And what I love about this islike first

00:13:46of all, it's just beautifuland I think really nice work, but alsoit's the kind of thing that there's notreally a tool that you could use tobuild this today. Maybe you could havedone this in origami or you could havefaked it in After Effects, but besidesthat, you would have had to just code awebsite entirely from scratch to dothis. and uh she talks about like AIlets me build my silly random ideasspeed of thought. Another really coolthing uh comes from Ryan Mather who alsoworks in anthropic and is one of the bigproponents internally of cloud designand he was just like in a in a retromood I think and wanted to build a SusanK inspired icon editor and he just didit right within cloud design. And so webuilt this really rich interface thatlike is just really fun to play aroundwith, but also like a legitimatelyinteresting creative tool, right? We'vegot the traditional pixel editor, butyou've also got this this iteration uhsetup where you can see create newiterations. And I'll be honest, I don'tquite understand how this works, but Ijust find it amazing that like anybodycan build their own little idiosyncraticuh editing tool and use it to creatework. And it's like it almost feels likethe best way to create amazing work inone of these tools is to think reallydeliberately about the environment youwant to set up first. Uh and that'shonestly how this is available to us.You can spend all this time building theperfect environment for creating

00:15:01yourwork. And that's really what's going toset apart the work itself.>> This is getting my brain going in a lotof different directions right now.>> I'm a I'm a big fan of custom editors,as you can probably tell. I want to getinto the origin story and how you madeall of this, but really quickly, can Ijust tap into your perspective as atoolmaker, someone who's working on thefrontier? How do you see the landscapefor design tooling right now? Andthere's a few different angles that youcould take that that I'm kind ofinterested in. Like obviously there's abunch of different types of tools rightnow. And I know a lot of peoplelistening are like, man, a little bit ofoverwhelm. Like when is it actuallyworth reaching for the new thing? Andthen there's another camp of peoplewhere, you know, maybe they're in Figma,maybe they're in paper, and they've likeadded cloud code as this whole otherthing that's kind of blown the roof offof what they can do. And it's a littlebit unclear where claude design sits inthat landscape. How do you think aboutit? The way that I think about it isthat let's focus on people who work at asoftware design job where the finaloutput of the company is softwaredesign. And there's a lot of people whodon't do that, but like let's talk aboutthe folks who do. I think something likeQuad Code has been an enormous unlockfor me and for basically everybody onour team and a

00:16:16lot of other companies.There's no substitute for just gettinginto the actual material that you'reproducing and being able to ship rightto prodand dial in specific interactions,specific visuals and animations andmaking sure that things are like perfectwhen they go out. And so the way that Isee it is that every designer should beusing cloud code if part of your team'send product is coding if only becauseit's so much easier than going back andforth with an engineer and like buggingthem to make changes and hoping theyhave the patience to wait and get itright. But then a tool like cloud designor Figma or any of the other designtools is for everything else. As itbecomes easier and easier to buildsoftware, the question of what you buildbecomes more and more important. designbecomes really really valuable when theengineering becomes compressed and Idon't want to say commoditized but likea little bit of like now everybody has abaseline level of really good softwareengineering available to them and so ofcourse the differentiator is going to beyour design and your ideas and yourpositioning and your creativity and sodesign tools are where you hone that soI do a ton of design work andprototyping and experimentation in youknow real coding tools that produce realoutput that we'd ship to customers. ButI

00:17:31spend a increasing amount of timehonestly in design only tools justplaying around with ideas because youknow if you're a designer sure a lot ofyour work is shipping screens andshipping software but a lot of it isjust getting alignment with other peopleand working through really easy ideas ortrying to take a really complicatedambiguous space and tame it and figureout okay what's actually important here?what experiences do we actually want totake the user's time with? And so Ifound tools like Cloud Design, but alsojust like tools like Figma really,really valuable for that type of stuff.I don't think there's any beall end alldesign tool out there. We're still in aworld where, you know, everything isfairly rough. There's a lot of newpossibilities that you can unlock withtools like clut design or paper, butthey're all pretty early. Reallypolished tools like Figma and AfterEffects and Origami are still supersuper useful. And then I think there'sthe secret third thing which is likebuilding your own tools to do designwhich is the most nent area but also themost exciting where you think about thespecific problem that you have and thinkabout exactly what the right perfecttool for solving that problem is whetherit's figuring out a color scheme or ananimation or designing an icon or tryingto wrap your head around 16 differentvariants of an onboarding flow. Chancesare there's no

00:18:47perfect tool fordesigning that one thing unless you makeit and now you can. So that's the areathat I'm most excited about and you knowfrankly we haven't scratched the surfaceof this with client design but I reallyhope we do.>> Okay let's talk about the origin storyhere. Take us to the moment where thisstarted. What's your involvement? Helpus be a fly on the wall here for thebeginnings.>> The story of this begins in like late2025. I was one of the two designers oncloud code alongside Megan who youtalked to very recently. Megan'samazing. It was me and Megan and a tonof engineers and all of those engineershad just gotten access to Opus 4.5 whichwas this big step change in agentcapability and so they were suddenly soso productive and we were kind of likethe same level of productivity uh and wewere using these tools too when we weregoing in and making PRs and you knowcleaning stuff up in production butincreasingly the bottleneck in ourprocess was how do we do Figma work? Howdo we do early ideation? How do we doexploration of a bunch of differentideas? How do we make decisions andcommunicate decisions? And we were usingthe same old tools that we had alwaysbeen using. And we were really findingourselves struggling to keep up. And soI was like, okay, maybe there's a waythat I can get Claude

00:20:02to help me designstuff. And luckily, we were designing acommand line tool. So [snorts] one day Iwas like, hey Claude, you know, cloudcode is just text, right? What if I justpaste a bunch of screenshots from theterminal from cloud code into you sothat you know what the interface lookslike and then I ask you to like mock upstuff by outputting essentially ask andI asked Claude to do this and likeClaude actually did an okay job like itwasn't perfect none of the bars lined upbut it was enough to be like wo likeClaude can actually make lockups andthey're not thought through very wellbut you know at least there's somethingand if I provide the thought and theguidance Claude can probably do a lot ofthe leg work of making stuff that looksreasonable and communicates an idea. SoI became obsessed with this and tryingto make this work and eventually waslike askard is not the way to go bothbecause cloud is not very good at it andbecause most interfaces are not textinterfaces. So, I switched to HTML andbuilt a bunch of skills and plugins andall sorts of stuff to like help peoplefigure out, okay, what what can youactually design using Claude code? And Ibuilt this whole skill where you couldask Claude to, you know, use the app alittle bit and come up with ideas forhow to improve it and mock up featuresand explain its reasoning in HTML. Andit actually was able to do

00:21:17a pretty goodjob of communicating the ideas, but theideas itself were not very good. But Isaid, "Okay, that's fine. I think I havegood ideas. I think I can just providethis. Um, [laughter] and so I built thisinternal tool that was what became clouddesign, which was just an agent plus theability to output HTML. And before this,I had just been using cloud code andhaving it output HTML files. And itworked pretty well. Uh, but it wasmissing two things. It was missing anice interface that let me prompt andsee the output side by side. It wasmissing an easy way for me to share theoutputs. And actually a third thing, itwas missing awareness of what Anthropicsproducts look like, what the contextwas, and then basic things like logosand colors and button styles and stufflike so. I spent a lot of time trying tofigure out how to turn those intoessentially skills and context forClaude to understand. Made an Electronapp with an agent and an output UI thatlet you see the HTML that Claude hadmade and then ported it to the web soyou could share it easily. And that wasbasically it. and we we put it outinternally and it took off prettyquickly initially with the the designteam but then really quickly a biggerand much more excited group came alongwhich were folks who didn't know how touse the old set of tools but had ideasand things they wanted to express and so

00:22:32initially you you saw it with PMs likePMs have a lot of ideas but they don'thave a lot of time and often they don'thave a lot of deep familiarity withdesign tools and so they write docsright and every PM knows like you writea doc and you know it's kind of anuphill battle to get people to read itand the best way to sell people on ideasis to get a designer to mock up orprototype the actual idea. And withcloud design, you could you could getthe next best thing, which was you couldget a really rough mockup of your ideain context in uh something that lookedlike our product. So you could imaginelike, oh, here's what this feature mightlook like on the cloud homepage. Uh andthey could share it out. Uh and it wasimmediately a big hit with the PMs. AndI would constantly hear from peopleinternally like, oh my god, my productmanager sent me like three cloud designfiles yesterday. And I was like, I'm I'msorry that happened to you, but uh[laughter] I'm glad that they feel theyfeel so empowered.>> What kind of time frame are we talkingon here? Like was there a moment in timewhere you switched like this is mything? This is what my role is now cuzoriginally you're you're on cloud code.Were you doing this in free time justexploring and tinkering? Like how didyour own role evolve over what kind oftime frame? So, it started as a sidequest uh at the beginning of last yearand uh I think we had the first versionof what was actually like the right formfactor of cloud

00:23:47design at the end ofJanuary 2026 and it was my side projectfor about a month or so and then I movedover coincidentally to this team calledthe labs team which has a bunch ofdifferent internal bats where we'retrying to spin up new new products allthe time. Uh, and I was staffed on otherprojects, but I continued just kind ofworking on this and, you know, about oneday a week after a while getting so muchfeedback that I was spending two days aweek on it, three days a week on it. Andeventually the the team leadership waslike, "Hey, this should just be a realproject. We're going to like actuallygive you real support and give you areal excuse to spend your time on this."And so, we spent a little bit of timereally finessing the product and seeingwhere we could take it. and then said,"Okay, let's let's try to give this tosome other teams for external feedbackand then let's ship it." And the wholetimeline ended up being like I guess itwas end of January was when we startedand middle of April was when we shippedthree and now>> it's not a long time. [laughter]>> It was not a long time. Uh and you know,I think it shows in the product a littlebit. It's a rough product. It's a betafor sure. I'm proud of it this way. Ithink that, you know, in this in thislike AI era, the tools are changing sorapidly that there's a lot of value inbeing like uncomfortably early to ideas.And

00:25:02there's trade-offs to that, right?The previous generation of tools is issuper mature and super reliable and likethat's wonderful and it's amazing. Wewill get there at some point, but rightnow the the state of the industry kindof forces us to take a little bit of amore, you know, I don't want to say fastand loose, but like we prioritize movingfast over like perfectly polishing anddialing in stuff. That means a lot oftrade-offs every day that I don't lovemaking, but I think at the end of theday, it helps us deliver something thatthat feels really novel.>> Okay. 3 months is no time. A lot ofdifferent decisions, trade-offs thatyou're mentioning. What did you thinkwas most important to nail though whenyou went to market? Like when youthought about like the product strategyand the sequencing and how to positionthe tool, what were the things that youthought were most important that youwanted to really build that V1 featureset around? So the big question for usthat we get asked a lot and we also justthink about a lot is like to what extentis this a coding tool and what is therelationship between this and quad codeand also between this and tools thatmake it really easy to spin up veryvisual web artifacts like something likelovable or bolt or vzero and honestly wehad to explicitly try to figure outwhere to draw the line and the line

00:26:17thatI the way that I've drawn the line is bysaying that designers should codedesigners should ship and claw design isfor everything else. Cloud design is forwhen you want to communicate an idea.Claw design is for when you want toshape an idea really early. Cloud designis for when you want to do a bunch ofnapkin sketches and play around withthem and send them out to your team toget feedback. And so we explicitly drewthe line and said, "We don't want to bea website builder. We don't want to be atool for creating production software.We don't want to have a way to deploy.We just want this to be a tool forreally quick almost throwaway visualartifacts and communication. And that'sbeen the big thing that's been tough forus to draw the line on is like we say noto a lot of like people who are reallyexcited about like oh it'd be amazing ifI could have a real website that waslike hosted in client design and we haveto say no. Like that's kind of what quadcode is for and that's what vzero andlovable are for and we're for likereally quick rapid iteration. And so howthat shakes out in practice is we make alot of trade-offs to say we're going tomake the platform a little bit lesscapable in the interest of making itreally really fast. So for examplerecently we turn down the default effortlevels for everybody because we realizethat the effort levels that we use formodels

00:27:32like sonnet and opus are tailoredtowards building production softwarethat has to be bug-free and reallyrobust. And actually in cloud design,what's much more valuable is a reallyfast iteration loop with a human whereyou can look at something, see if itlooks good, ask for feedback, and soactually it's okay for the model towrite sloppy code that isn't so scalablebecause you're doing the equivalent ofnapkin sketches.>> Communicating an idea. That's the phrasethat definitely jumps out to me becauseI do think that that has gotten a lotmore difficult as I've moved so much ofmy whole world from Figma to this hodgepodge that mostly revolves around cloudcode, but also I'm like alwaysexperimenting and tinkering and it'sit's difficult actually to especiallywhen there are variations. It's like I'mnow getting kind of good at creating myown variations to like pick and choosefrom and give feedback on, but I haven'tnailed the part where it's like, okay, Ithink there are three good things here,but I really want to have everybodyweigh in and and and capture thosethoughts. And like you were talkingabout the PM example, and I guess nowwhat I find so interesting is it doesn'thave to necessarily be a doc. And it'snot even necessarily some kind of like aprototype with a meta navigation, whichis kind of what I've been hacking alittle bit. like you can blend the twoand find these really interesting

00:28:48middlegrounds where there's a bit ofstorytelling, there's a bit of contextaround maybe each concept, but theconcepts themselves feel fullyinteractive and real, you know,[laughter]um yeah, and there's such a hazy middleground that I I feel like I'm activelyexploring. That is what I think is mostinteresting right now in terms of wherethis tool fits in, but also justgenerally where I think the opportunityfor my own practice exists to kind oflevel up.>> Yes. I mean, I think the thing that thething that I love about this era we'rein of AI is that the models are reallyreally good at doing the sort of busywork of moving things around and piecingthings together and turning ideas intodifferent formats, but they're not sogood at the actual ideas and the designthinking. And so what I can do as adesigner is I found that I spend a lotmore of my time just like going on longwalks and like recording voice notes andlike thinking to myself because the goodideas are the currency these days. And Ican spend a lot of time just kind oflike wandering and and sitting with myideas because I know that it no longertakes a ton of time to take those ideasand turn them into a presentable form. Idon't have to like worry about like, oh,I'm going to need like 3 hours afterthis brainstorming session to figure outhow to present this idea becausefrankly, it's pretty

00:30:03easy to do. Andonce you've taken that idea and you haveit in one format, whether that's an anApple note, which I use a lot, or avoice note or a document or a memo, youcan drop it into cloud design. You canget a doc, but you can also get a deckuh and you can also get a prototype andeven like an animation, and you canconvey that idea in as many differentformats as you want. And all that reallymatters at the end of the day is theidea. And I found that to be veryliberating. This era will probably end.I think the models will probably getbetter at having these good ideas. ButI'm really savoring this particularmoment where we as humans still have amonopoly on good design thinking.There's one question that I can't stopasking myself. [music] What if companiesapply to talk to you rather than theother way around? And that question isthe foundation for the all-new DiveTalent [music] Network. And it'sworking. Like right now, I'm helpingmany of the most exciting startups thatI know to hire the designers andbuilders who listen to this show. So, ifyou're curious what might be out there,and maybe you want to get on my list, ormaybe you're even looking for your nextdesign hire, [music] head todive.club/talentto join today. Can we talk about yourpractice just for a second here? Youtalked about making more

00:31:18space for maybegoing on walks, [music] thinking ofideas. You showed a little bit about howyou're using cloud design to help you goa little bit deeper on what those couldlook like, giving yourself parameters.I'm assuming at some point you'recommunicating those ideas to likestakeholders, different people on theteam, like how much does that path kindof vary and like what what are the mainvariables that dictate what your processlooks like when you're working on athing? And then I'm specificallyinterested in how much are you jumpinginto cloud code and contributing eitherin higher fidelity prototypes or even toproduction like how does the state ofyour tooling and process look right now?>> I would say the biggest variable thebiggest thing that changes the way Iwork is who the stakeholders are andlike who the humans are that need tohave an idea communicated and need tobuy in. For example, I'm spending mostof my time these days on cloud designwhere I am one of the key decisionmakers. And so there's a lot of stuffthat I kind of just do unilaterally atthis point, which is the nice part ofhaving your own thing. For a lot ofthose, I will just do mockups just formyself to see what things look like. Iwill ask Claude design. I'll dump in abunch of context from documents or I'll,you know, ask Claude to pull breakdownsof metrics or bug reports or stuff likethat, user feedback. I'll dump thoseinto Claude. I'll look at them. I'll

00:32:33spend a bunch of time thinking andwalking around and like being like whatare like five things I think we shouldtry here and then I'll drop those intoclaw design. Typically my process lookslike I'll record a voice note and pastein the transcript or I will just use thebuilt-in dictation feature in clouddesign. I'll ask for a quick mockup. Iwill typically go away and do somethingelse and get kind of distracted becausethe models are are slow enough that youstill kind of have to sit there andwait. And I'm for better or worse notvery good at sitting there and waiting.Uh but then I'll come back. I'll seewhat the models have created. I'll givea ton of rapid fire feedback. We havethis button in the interface in clouddesign where you can called commentwhere you can click on a particularelement and leave a comment on it. Andso you don't have to like prompt themodel and tell it exactly what you'rethinking about what you're talkingabout. You can just point it at a thingand be like remove this uh you know makethis a little larger or give me a tweakthat gives me four different variationsfor how this might look and let'sactually try a look that's a little bitmore inspired by this instead ofinspired by that. I'll typically attachthe codebase when I'm prompting clouddesign. So Claude can actually, youknow, pull from our GitHub. It can pullfrom our source of truth, which is justour code, recreate whatever uh interfaceneeds to be recreated, and then go anddo designs from there. If I need tocommunicate those ideas out to

00:33:48people, Iwill I will typically just, you know,because I'm already communicating thereasoning and the ideas to Claude whenit's mocking up, I I basically just goto Claude and I'm like, you know, takeeverything that I've told you and writeit up and annotate it. And so like we'llmake mockups or we'll make decks uh orwe'll make documents that explain theideas that I've already communicated toClaude so that I can really easily sendthose out and get feedback fromdifferent stakeholders. And then for alot of stuff, I just go straight tocode, right? If it's something whereit's a pretty straightforwardapplication of our design system or it'sa behavioral change that isn't supervisual or that doesn't feel like itneeds to be felt out, I will just go toCloud Code and I'll have Cloud Codeimplement it and I'll try it out andwe'll ship it. You know, we're stillvery much optimizing for being able toship really, really fast. And so we do alot of just like coming up with an ideain the morning and shipping it by theafternoon. Very inspired by the CloudCode team. How often are you going fromcloud code back into cloud design?Sometimes I start off on something thatI feel like is pretty straightforwardand I get it there and I'm like I don'tlove that and I'm like I need to take astep back and just see this more ways.Like right now I've been doing thateither in paper or HTML and I'mwondering like do you ever do that incloud design?>> I do. I do. I think I've gotten prettygood at knowing what upfront I want to

00:35:03mock first and so I I don't typicallystart in code and then go back todesign. But>> did you just really politely say skillissue?>> No, no, no, no. Absolutely not. I dosometimes. I do sometimes go back andforth, but what I what I think I seemuch more often is we'll just shipsomething into into production. Like thesource of truth will live in code and wewill have cloud design pull from what'scurrently committed. Not a lot of likegoing straight from cloud code to clouddesign. Okay. Something else I want todig into is your design process for thatvery first like new user onboarding flowwhen you first put the research previewout cuz you had like kind of thelandscape shape in your mind whereyou're like okay you have the visualbuilders the vzeros the lovables overhere you have claude code over hereFigma over here I would imagine that youwere trying to communicate some of thenovelty in that flow and like helppeople understand what this could dobecause it can do a lot of things thatwe're not used to you know so talk to mea little bit about that design process.What were some of the things that youwere wrestling with? What are some ofthe things that you explored? How didyou land where you ultimately did?>> To be honest, I don't think we've gottenclose to nailing this. Um, I don't thinkwe've gotten close to getting people tounderstand this idea that like when youcreate visual artifacts with HTML,

00:36:18youcan do all sorts of stuff and create allsorts of novel document types that youcouldn't have otherwise. I'll give you acouple things we tried. So we had alittle section on the homepage calledexamples where you could see a handfulof examples that were handpicked to sortof show you like here are someinteresting novel dynamic things thatyou can do in this platform that youcan't in others like making animationslike using particle systems like doing3D stuff. One of the big things we didis just like you know it wasn't evenclear initially when people tried thetool that they could use it to createthings like slide decks uh or documents.And so, you know, you could just promptthe model, you know, hey, create me aslide deck or create me an animation,but people didn't discover this. And so,the first version of the product justhad like a nice little box that was forchoosing what you wanted to create. Andthere were tabs. You know, you you couldsay, I want to make a prototype or I canmake I want to make a slide deck or Iwant to make a document or an animationor whatever. And internally, it was alljust a trick. Like they they just mappedto prompts. Like when you picked the theslides tab, all we did was we justinserted a little thing into the promptthe first time we sent a message sayingthe user clicked the slides button. Solike if they don't tell you what theywant, they probably want slides. Uh butit was mostly for the user, right? Itwas to show people like hey there issomething in

00:37:34the interface to likeremind you can make slides here becauseotherwise like how are people going tofigure this out? And this is a constantthing we run into of like there's a lotof people making really creative stuffin this tool. And for everybody whomakes a creative thing, there are like athousand people who have no idea thatyou can make like social media assets orlike animations or interactive chatbotexperiences. And so we just have tofigure out how to merchandise those topeople and we haven't quite figured itout. One area that I'm I'm very excitedabout that we haven't actually done yet,but that I really want to do andactually maybe I will just take thetranscript of this podcast and feed itinto cloud design and see if it can do afirst pass after we're done with thiscuz I haven't had the time to like talkabout what it is.>> Two birds with one stone>> exactly. I want to give people avocabulary for talking about differentvisual effects because one thing that Irealize is I have this kind of uniquebackground of being an engineer by tradeand I know all the engineering terms forall this stuff, right? So when I'mtalking to cloud design, I'll often uselike very engineering terms. I'll belike, you know, put these things in aZstack or I'll like put in some CSS orI'll be like, you know, I want you to doa staggered animation with like theseparameters for like the spring dampingor I want you to use 3JS

00:38:50and useparticle effects that emit over acertain period. I have all this stuffthat's like I know the language for itbecause I learned how to code it. And soI'm able to express those ideas reallycleanly. But most people are not becausethey just have no idea what those termsare and they shouldn't really have tolearn them. So, one thing I want to tryis building a little vocabulary centerin the app that just shows you like hereare some words that you can use in yourprompts or in your feedback to the modeland here's what they like look like. So,here's what a staggered animation lookslike. Here's what a perspectivetransform looks like. And some of thoseare like fairly familiar to design folksand there's a lot that are not. but justlike giving people the words to like dodesign with words because more and morewe are just essentially doing designwith words as our primary input and it'svery different and it's very weird and Ithink there's probably a lot ofeducation we can do to help people givethe give people the words they need. Ilike that a lot actually. It reminds meof two things. One is you see this in afew different UIs. Jitters is the onethat comes to mind right now where theyhave like the right panel of thepre-built animations and you can hoverover them and it does the animations.You kind of get a sense. And then thesecond thing is my own experience likewhen I was using

00:40:05dial kit, this ismonths ago. I was trying to tweak ashader,>> but I don't have the language forshaders. I have no idea what the namesof the parameters are. So my prompt toClaude was basically like give me allthe parameters that I might need. Idon't know what they're called. just doit. And it did it did a good job. Butthen I'm going through and I'm tweakingthings and it kind of felt like some ofthem weren't really doing anything. Ididn't recognize any of the names. Likehow cool would it have been if I couldhave somehow generated a littlelightweight visual preview of what eachthing may where I could like hover andlike see what that could be, you know?Otherwise, I have no idea. It's justwords. There's a lot of interestingstrands to pull on down that route.>> Exactly. Exactly. And I have no idea howwe'll solve it, but but certainlysomething we'll explore. I know a funlittle uh follow-up segment in a futureepisode maybe. All right, here's aquestion for you. So, you didn't reallyknow what this would become. You startoff and you're really just trying tolike prototype Cloud Code itself betteris what it sounds like. And then at somepoint you start to develop this visionfor like, hey, I think there's a thingthat maybe at one point you even werelike, maybe this is going to be calledcloud design. How cool would that be?Right? So now we're whatever 7 monthslater, where has the current shape ofclaw design deviated most from what wasthat

00:41:20original nugget of an idea in yourbrain?>> So it very much started as a tool forprofessional software designers to makeprototypes and maybe mockups and theninternally we started seeing like alittle bit of heat around this idea ofslide decks. about a a month or so ago,we just added a a documents template toour homepage and which like was a totalafterthought, but it was one of thosethings where like we had a hunch that ifpeople knew you could do this kind ofthing in the tool, they would uh and weadded it and it turned out to be thecase. A lot of people wanted to createthis type of stuff. And so the metrics,you know, a lot of people ended up usingthat. And so now I'm kind of in thismode of like let's think about design asexpansively as we can and let's thinkabout like the the broader idea of likevisual communication and creation ofinteractive visual artifacts and thinkabout all of the different walks of lifein which that could be useful. Um, sonot just creating software designs, notjust creating prototypes, but like youknow creating flyers or brochures ormaybe doing your resume in this tool.Uh, or maybe creating 3D objects orsocial media assets or some other secretthing that I can't imagine right now. Soit's we're very much in this this phasewhere it's like how can we expand what

00:42:35we're doing to be even more generic andbroad so that we can help find those usecases that like I don't have day-to-dayand folks on our team don't haveday-to-day but that people actuallyreally want to do with claude andhaven't quite figured out how to do withAI. A lot of what you're talking aboutis responding to you said heat, youknow, user demand maybe specific. Idon't even know if I would say problems,but it's like there's something there'sa user research element. It's like, hey,this is informing the road map kind ofthing. And I'll put that up here. Andthen on the other side, it reminds me ofsomething that Joel Leuenstein, the headof product design, said when he was onthe podcast, I don't even know, like 18months ago, and he talked about how abig part of designing at Enthropic wasthis idea of solutions in search ofproblems. And I'm curious, howrepresentative do you feel that thatstatement is today when it comes tobeing a designer at Enthropic?>> A little bit. I go back and forth onthis honestly. I think that there are alot of people out there who are reallycreative about using AI and who arereally good at like figuring likelooking at a really generic tool andbeing like, "Wo, I have this problem.Maybe it can solve what I'm trying todo." And then there's like a huge set ofpeople who just don't have that sense,right? Because of course they're notlooking at every problem

00:43:51they have andsaying, "How can I utilize AI to, youknow, speed up my business processes,right?" And so it's like it's kind ofour job to figure out like okay what'sat the intersection of like what earlyadopters are doing with it and seeingvalue with and what we think is broadlyapplicable to the types of folks who arenot early adopters and then also whatare the roadblocks whereas like theearly adopters are really sufferingbecause they you know they really wantto do something in this tool but they'rejust like not quite able to right likeyou've been able to do everything youcan do in cloud design you can do incloud code and like a lot more and youknow my initial proto prototypes forclaude design were in cloud code andthey were cla skills and I would usethem pretty effectively but found thatit wasn't it didn't actually take offinternally at the company like nobodywanted to use my little design skillbefore I built an interface around itbecause it turns out that like there's aton of value in packaging these productsup in ways that make sense to people andgiving them all of the nice bells andwhistles that make it really feel likeit's the perfect place to do whatever itis that they're doing. So we all alwaysfeel this tension honestly where it'slike the core claude product is thissuper generic thing that can do all thisstuff and then claude design is thislittle offshoot of it where it's like alittle less generic and it's a littlebit more targeted

00:45:06towards like let'screate visual artifacts for people andthere's a lot of value in that and thenwe always get pulled to be like okaywhat if we did like a slides tool thatwas just for slides there's all sorts ofreally nice things we could do if wesaid we're only going to focus on slidesWe're not going to try to make an editorthat also works for these 16 otherthings. Like we're not going to worryabout interactivity and animations oranything like that. We could probably doa much better job of doing slides. Andso the tension for us is always like howon Rails do you make it? How specific doyou make it towards a particular usecase versus how much do you lean intothe kind of amazing generality of thesetools where they can do any everythinguh but maybe they can't do everythingreally well.>> Okay. So, I would imagine a lot ofpeople listening like me are prettyinspired. You've kind of broke the boxof where I had cloud design in my brainand what it's capable of and how itcould fit into my workflow. So, assumingthat somebody's listening and they'regoing to take this for a test drive likelater today, do you have any quickhitting tips, suggestions, tricks thatpeople should try?>> I mean, number one is you get out whatyou put in, right? So don't just askClaude to like make you a design withoutgiving it any context. Give it as muchcontext as you

00:46:21can. And ideally bepretty prescriptive about what you wantto get out and let Claude do the hardwork of mocking it up and coding it. Butlike don't trust Claude to be an amazingdesigner and do all the work for you.Uh, bring in your assets, bring in yourbrand color scheme, bring in your fonts,bring in screenshots of the product thatyou have [snorts] right now and maybe,you know, mood boards of of what youmight want it to feel like in thefuture. Bring all that in because whatyou don't want is like slop that lookslike what everyone else has. Everybodywill recognize it. You won't feel goodcreating it. Won't be a good use of yourmoney. Put in a lot of really valuablestuff. And if you let Claude work fromthere, you'll get really good stuff out.Ask for tons of options is my number twobiggest suggestion. Claude makes up forits lack of taste and its lack oftechnical execution sometimes in itsability to make a ton of differentthings. Ask for tweaks, especially inareas where you see Claude is not verygood at figuring it out right off thebat. So, for example, if you're tryingto make animations or you're trying tomake really dialed in visualinteractions, Claude is not very greatat doing things like timing or figuringout things like spring parameters oranimations because it can't see

00:47:36video.It can only see screenshots. So,instead, if you're finding that Claudeis having a lot of trouble at that, say,"Hey, Claude, make me a tool so that Ican dial this in myself." And that tendsto work really, really nicely. Usevoice. I'm a huge voice fan. Uh, thissort of goes along with the rule thatyou get out what you put in. If you giveyourself the self the tools to giveClaude much more context faster andvoice is the best way to do that. Ifound you will get much better resultsand you'll just have a better time. It'sreally cool to just like have a designand enter voice mode and point out athing and be like, "Hey, Claude, youknow, make this different, make thisdifferent, make this different," anddescribe exactly what you want. You feela bit like a big evil boss. Um, but it'slike you can get an enormous amount doneand it feels very productive. I mean,embrace the fuzzy space betweendifferent types of things you cancreate, right? If you if somebody asksyou to make a presentation, think aboutlike how can you make it interactive? Ifsomebody asks you to create a document,think about like, hey, what if I madethis a little micro site HTML experienceinstead? One of my favorite examples ofthis is is I made a presentation oncejust like teaching folks about how touse cloud design and I got kind of tiredof presenting it and then I realizedthat I could actually like ask clouddesign to present it itself. So when you

00:48:51entered the meeting and I wish I couldshare this I like don't have it but whenyou entered the document it looked likea Google meet and you clicked join andyou typed in your name and then quadlike real claude model output would saylike hello blank you know welcome to mypresentation and then it would take youthrough the presation. app it usingvoice um using speech recognitionbecause every browser has speechrecognition right now. You can you couldlike ask it questions and it wouldanswer based on the content of the andit was a kind of stupid example but it'slike the point is anything that you seeany website do you can make cloud designdo and it lets you create some reallyreally wacky stuff.>> That's what I'm talking about in termsof raising the ceiling for storytelling.Like that's so cool to me because itfeels like we've just had this box ofLegos where there were only like fivedifferent Legos and you just pick whichLego that you want to use to presentyour idea and now it's like create anyLego that you can think of and use that.It's exciting. It's also scary, youknow? It's like>> it's a whole other skill set. It's awhole other skill set. It's amazing.>> 100%. I mean, another good tip then islike if you don't know what to ask for,you can also just chat with Claude aboutit because remember Claude like knowsway more about the web platform thanmost people do. And so you could like

00:50:06ifyou have an animation, if you have a athing you're creating and you're notquite sure how to make it stand out, youcould just ask Clot like, "Hey, what aresome ways I could make this stand outgiven that it's just HTML?" And it willgive you a bunch of like pretty decentideas. Uh, and you bring the taste,right? You bring the like here's whatactually makes sense in this context.Don't just ask Claude to make it cool.Um, but just remember it's a resource.Claude knows how to use the tool and itcan explain how to use the tool to youand it can fix stuff if it's broken,which is pretty neat and takes a littlebit of getting used to, but once you do,it's really, really amazing.>> That's cool. Yeah, it's like a wholeparallel design process in itself. Likeonce you get to the point where you havean idea, you know, I'm sure everybodylistening to this has been in thatmoment where you have a concept andyou're like, "This is pretty sick." youknow, like I have a prototype or maybe acouple prototypes that I feel goodabout. I think we should build this. Igot to get people excited as I am aboutthis so that we actually do it andcommit resources to it. And then drawinga line right there and now thinkingabout that as a separate design processwith Glad. It's like, okay, what shouldwe build? Like what should we make tohelp me get people as excited as I amabout this idea? And then figure outwhere that rabbit trail leads you.That's really, really interesting. Youtalk about an untapped opportunity. Idon't see a lot of people

00:51:21playing inthat space and it feels like thereliterally are endless opportunities downthat path.>> Yeah. I mean, you can just do so much.This is why I'm like I'm obsessed withHTML and I think HTML is the onlydocument type that matters because youcan just do so much amazing creativestuff with it, right? Like you can bringyour voice into it, you can bring yourcamera into it, you can bring audio intoit, you can bring any sort of JavaScriptlibrary that you can find, you can pullin. You can do 3D. You can do 2D. Youcan do 1D if you wanted to. You could doanimations. You can do all sorts of likeamazing stuff. And like we haven't evenfigured out the vocabulary for half ofthis stuff. Even if you're tech, there'sjust so much waiting to be discovered.>> Well, Nate, I appreciate you coming overand just sharing a little bit of what'son your brain. You have definitely gotmy mind racing. I'm now imagining all ofthe different things that I could dobased off of this. Super inspiring.Really excited about what you're doing.And also just now having a chance, youknow, we we've interacted a few timesover the years and I'm just so glad tosee you in a place where you get to runfull steam at this type of idea setbecause it is just innate shaped problemand I'm so excited to see what you dowith it moving forward.>> Well, thank you. Thank you so much forhaving me.