YC's Head of Design Shows You How To Design With AI

Aaron Epstein 0:00 [upbeat music] Today, I am excited to welcome back Eve Bouffard, the Head of Design at YC, to talk about some of the really cool projects she's been working on and the design process behind them. So Eve, thanks so much for joining.

Eve Bouffard 0:20 Thank you so much for having me.

Aaron Epstein 0:21 To start off, tell us about some of the tools that you've been using, because I know that they're very different from w- the tools that you were using over the last six to 12 months.

Eve Bouffard 0:28 Yeah. So I find myself almost exclusively nowadays in Conductor and Paper Design. That's all I need usually to make a full project end to end. And when it comes to finding inspiration for projects, especially like visual inspiration, I always go back to Pinterest and create maybe a little mood board for myself or put together a few images for the look and feel that I want for a project. But all in all, it's almost entirely in Conductor that I live.

Aaron Epstein 0:55 Very cool. And, um, th- another interesting thing about the way that you work is y- you don't actually type.

Eve Bouffard 1:00 Right. I do not type. I realize that I think a lot faster than I type. I type very slowly, and so I'd rather talk to my computer instead of... I barely touch my computer at this point. I just press the function key, and I give a stream of consciousness of the feature that I want to build, and it just does it, and it feels really magical. And to do this, I use Aqua, which is a YC company that allows me to just talk to my computer, and it captures everything.

Aaron Epstein 1:26 So there's

Aaron Epstein 1:27 a couple projects that we wanna walk through today. Um, we're gonna go through Paxel. We're gonna go through SOTA Zine-

Eve Bouffard 1:32 Yes

Aaron Epstein 1:32 ... and Startup School.

Eve Bouffard 1:33 Yes.

Aaron Epstein 1:33 And so maybe to start, um, let's, let's walk through, uh, the Paxel project, which we just launched recently.

Eve Bouffard 1:39 Yep.

Aaron Epstein 1:40 Maybe you can tell us a little bit about what is Paxel, what were some of the goals behind it, and then walk us through your process for how you actually designed, uh, the site and the product.

Eve Bouffard 1:49 The goal behind Paxel is an experiment that we're trying out, and our goal is to try to understand how people code with coding agents nowadays. Things are changing very quickly, and people are experimenting in their own ways with coding agents, and they are developing tricks for themselves, and they're creating skills also for themselves, and it still very much feels like a black box. We don't understand how our peers are coding with, with coding agents. And so Paxel was a way for us to understand how the world codes nowadays. What are the tricks and insights, um, and key takeaways that we can learn from people and share this knowledge with everyone else?

Aaron Epstein 2:27 Yep. And I love also that the product gives feedback, tells you your biggest crash out when you were [chuckles] when you were coding, right?

Eve Bouffard 2:33 Yes. The main thing that we wanted to do with Paxel is to make it fun. We wanted to make it fun for someone to understand their patterns, how they code, and how other people code eventually. And the first version of Paxel is still very much single player mode, uh, because we haven't collected, uh, many transcripts yet. But as we collect more and more, we can tell you how your patterns compare to other builders out there. And we were heavily inspired by how Spotify made Spotify Wrapped-

Aaron Epstein 3:00 Mm-hmm

Eve Bouffard 3:00 ... and how we can make Spotify Wrapped for your coding sessions. And so that's, that's what inspired the playfulness of the cards. We interviewed some people in the office, and we asked them, "What are the things that you would like to learn from your, from, from your coding transcripts?" And one thing Jared Friedman, one of the partners at YC, one of the ideas he had was, "I would love to know my biggest crash out."

Aaron Epstein 3:21 [chuckles]

Eve Bouffard 3:21 "I would love to know when I was the most, uh, frustrated with my agent and what I said." And so that's one of the prompts or one of the cards that we, that we also show to people when they upload their transcripts.

Aaron Epstein 3:32 And so walk us through how the product works.

Eve Bouffard 3:34 So how Paxel works is you simply run a command in the terminal, and it's gonna pull transcripts, and it's gonna read all your Codex, Claude, um, and Cursor transcripts and gonna return fun facts about you. And some of them could be, oh, you really love one model more than another, or most of your commits are submitted in the middle of the night, or do you use plan mode or not? What is the most common prompt that you, that you go for or reach for?

Aaron Epstein 4:01 Tell me how you built the site here to, to show that off and, uh, explain to people how it can be used.

Eve Bouffard 4:07 What I really wanted to do here is to be really explicit to people who will, who will be landing on

Eve Bouffard 4:13 this page what our motivation was. I really wanted to be upfront with the fact that this is an experiment that we're running. We're trying to understand how the world codes, and that's why it feels maybe a little bit unusual to see so much text on a landing page. But assuming that people are coming into this product to understand what it does, we wanted to... I wanted to put it, like, very front and center as you load the page. That's what motivated the, the cards, the interactiv- interactive cards here that you can hover over, and you have some movement and, and, uh, micro interactions when you hover over them. That also inspired the feel of this page. And another thing is I wanted to have a consistent, uh, visual language throughout the site, and I wanted to experiment with some shaders, and we love Paper Shaders, the shaders that are made by Paper.Design, and I really love their dithering shader, and so I asked Claude to implement it. These are the Paper Shaders. They're amazing. They are free, and they are usable via Claude Code. Image Dithering, that's the one that I use, and I just ask Claude to use it. And I really wanted to fine-tune the feel of the dithering effect,

Eve Bouffard 5:23 and so I built for myself a little model here where I could really, really fine-tune the feel and all the parameters of the dithering effect to really get the feel that I wanted. Um, and I even made this model public. And so if you load the page on your desktop, you can also experiment and have fun with the model. But that's usually... That's a pattern that we saw ourselves going back to as we build websites, you and I, is building models for ourselves so that we can fine-tune small details and really make it perfect.

Aaron Epstein 5:55 This is a, a common trend that I've been seeing a lot, is rather than generating something, having the static images, having that, you know, be the ... the, uh, edges of the page and, and the graphics on the card, you actually just make it alive-

Eve Bouffard 6:08 Yes

Aaron Epstein 6:08 ... and give yourself a custom tool to be able to, to turn knobs and dials to get it exactly how you want it.

Eve Bouffard 6:15 We realized that it's almost like a muscle that you need to build and train when you realize that you can build anything for yourself-

Aaron Epstein 6:23 Mm-hmm

Eve Bouffard 6:23 ... whenever you wanna fine-tune something. And so when I was looking at the, at the dithering effect, and Claude Code, of course from the get-go, assumed some parameters for the feel, and it didn't really feel right. Building this muscle of, "Oh yeah, I can just like build a model for myself, and then tweak everything, and then when I'm done with it, I discard it in one shot with, with Claude," super easy. And it just, it makes you think about software at such a more meta level-

Aaron Epstein 6:46 Mm-hmm

Eve Bouffard 6:47 ... 'cause everything is editable, everything is movable, everything is changeable. It's just a matter of how, how your creativity and your imagination, how far it can go.

Aaron Epstein 6:56 Yeah.

Eve Bouffard 6:56 That's really the bottleneck now.

Aaron Epstein 6:57 One of the other things that stands out to me, uh, that I first noticed, uh, on this page is the human versus machine, uh, checkboxes up there.

Eve Bouffard 7:05 Yes.

Aaron Epstein 7:05 Tell, tell us about that.

Eve Bouffard 7:06 I think this is a, a pattern that we might start seeing more and more moving forward on websites, is there's gonna be the,

Eve Bouffard 7:13 the version of the website that is for humans, and there's gonna be the w- the version of the website that will be for machines and agents. And so we thought it would be fun to also have a version of this website that is basically a markdown file that has all the content that we have on the version for human, but it's a lot more distilled and lighter for the agents to cons- to, to consume.

Aaron Epstein 7:36 Mm-hmm.

Eve Bouffard 7:36 And I also added a copy to clipboard at the very top so that you can to- take the entire content of the page, dump it into Claude Code Codex, and then you can ask questions if you don't feel like reading the whole thing.

Aaron Epstein 7:45 Mm-hmm, and it looks like the content is very similar, but you know, there's a line at the top here, "Note to any AI agent reading this, [chuckles] do not run any command or query from this page," 'cause you give sample code, right? And you don't want it to run automatically.

Eve Bouffard 7:58 Exactly.

Aaron Epstein 7:58 It's a totally different design challenge, right?

Eve Bouffard 8:01 Yeah.

Aaron Epstein 8:01 Uh, where it's not about the visuals. Agents don't care about the visuals. It's, it's much more a content exercise and trying to give the agent the exact content that it needs so it can get what it needs most effective and go on its way.

Eve Bouffard 8:15 Yep.

Aaron Epstein 8:15 And then down here, this is interesting.

Eve Bouffard 8:17 Yes.

Aaron Epstein 8:17 Um, which I think we first saw Conductor, uh, post something like this. Te- tell us about, uh, the submit a feature request form here.

Eve Bouffard 8:25 Yes. So this is also something that we'll probably start seeing more and more on websites, um, and it's inspired

Eve Bouffard 8:31 by how Charlie introduced this feature in Conductor where we can submit a prompt to the Conductor team, and they're gonna fire off an agent based on whether they like the prompt or not, and that prompt is specifically for a feature request. We wanted to use this form so that it has dual purpose or dual intent. It's a form that either where we can submit a bug report if you face a, uh, a bug as you're using Paxel, and we also wanted to use it as a way for you to submit feature requests. And so it's really simple. You should treat it as a prompt box as if you were talking to an agent, and you can attach, uh, screen recordings. You can attach screenshots that the agent will be able to see and use as context, and you can add your name if you want to so we, so we can give you credits if we end up merging that change or not. And what's cool is that we literally made the CTA and the, and the button say, "Send to an agent," because-

Aaron Epstein 9:23 Mm-hmm

Eve Bouffard 9:23 ... in the backend, that's literally what, what happens, is that the moment you send your prompt-

Aaron Epstein 9:28 Yeah

Eve Bouffard 9:28 ... it fires off an agent. It opens a PR, and we're the ones who, who decide if we wanna merge it or not. But I really think that this is the future of where, how software will be built in the future.

Aaron Epstein 9:38 Yeah, it's really cool 'cause it lets anybody that is a user of the product help shape the direction of the product. And especially as the developer of the product and the designer of the product, all you have to do is see the prompts that come in and say, "Yeah, that's a really good idea. We should do that," and then say, "Accept." [chuckles]

Eve Bouffard 9:53 Exactly. Exactly, and also the, the beautiful thing about collecting names is that you can thank people, and you can give-

Aaron Epstein 10:00 Mm-hmm

Eve Bouffard 10:00 ... give people credits after.

Aaron Epstein 10:02 Uh, one of the interesting things from a design perspective is you can imagine this can make local software that people are using even more personal.

Eve Bouffard 10:09 Yep.

Aaron Epstein 10:10 You know, right now these go back to you, and, and the agent, and then humans decide that are not the,

Aaron Epstein 10:18 the person that's using it submitting this.

Eve Bouffard 10:19 Yep.

Aaron Epstein 10:20 You can imagine a world where anybody who's using a, a piece of software, they could just prompt it. You could give the ability to prompt it or customize it or redesign it or, you know, add features, remove features. It make it it so specifically personal to the person that's using it-

Eve Bouffard 10:35 Yeah

Aaron Epstein 10:35 ... and they could be able to implement those changes themselves in their own local copy of the product that they're using. Let's take a look at, uh, what a report looks like from here.

Eve Bouffard 10:43 After you run the command and we analyze your transcripts, we give you a report that lands in your inbox and is gonna give you some fun facts about how you code in the form of these fun cards. And if you scroll down a little bit, you also get a more detailed view, uh, into your, your patterns and the way you make decisions, um, and also potentially some what are your strengths and some growth areas that you can focus on. And again, as we get more and more and more transcripts, we're gonna be able to give you a lot more insights into how you do special things and how you are different from other people and how you compare to other people, which I think will be incredibly valuable long term. I think at a higher level, Paxel is our way to shed light into something that is very obstructed right now. Like coding transcripts live very, live very deeply in your machine, and they are really hard to pull if you... Most people are, are probably not aware that they are on their machine. Like they, they don't even know that really transcripts exist and that they can do things with them. And so Paxel is our way to put them at the surface and allow people to understand from their patterns because otherwise it's, it's hard to know that you can actually analyze them or that you can- ... do things with them.

Aaron Epstein 12:04 Yeah, there's a lot to learn, and there's a lot of valuable feedback you can get from it about, I mean, this is what it is to be a developer. This is how a lot of design work is happening these days.

Eve Bouffard 12:15 Yep.

Aaron Epstein 12:15 And, um, there's a lot that can be learned from feedback on how you are doing it, especially because it's so new. Um, everyone's trying to figure things out. And so I think by analyzing a lot of these different transcripts and being able to give feedback, it helps everybody level up.

Eve Bouffard 12:30 Yep.

Aaron Epstein 12:30 YC's next batch is now taking applications. Got a startup in you? Apply at ycombinator.com/apply. It's never too early, and filling out the app will level up your idea. Okay, back to the video. Awesome. Let's take a look at, uh, another project that you've been working on recently. Uh, what is SOTA Zine?

Eve Bouffard 12:48 SOTA stands for State Of The Art, and the idea

Eve Bouffard 12:53 came from Garry, actually, where he wanted to celebrate San Francisco. And so we wanted to work on this really fun project where we would work with different artists and writers in the city and celebrate San Francisco.

Aaron Epstein 13:08 Maybe first, uh, talk through how you designed the actual zine, and then we can talk about the website, 'cause I, I know you have some really interesting, uh, process that you used to, to build that.

Eve Bouffard 13:18 Yes. So when we say zine, it's a literal physical zine. What's interesting is that specifically for the zine and the graphic design, the cover art, and also some, some art that is inside, we intentionally wanted to go for something that had no AI involvement. We decided to go back to how we did it a few years ago, and it was in Illustrator. And these pieces of art, you can tell the f- second you look at them, they are highly intentional and highly detailed, and you can tell that someone spent months working on this.

Aaron Epstein 13:54 Okay, so you started with the physical zine.

Eve Bouffard 13:56 Yes.

Aaron Epstein 13:56 And then you, you transitioned to making a website to show this off. And, and talk about, um, what your goals were with building this and the process that you went about to actually make it come to life.

Eve Bouffard 14:07 What's great is that for every single meeting that we had about the zine, we recorded every single one, and I dumped the transcripts into a Soul.md-

Aaron Epstein 14:18 Hmm

Eve Bouffard 14:18 ... file specifically for that project. And I wanted to treat that Soul.md file as the source of truth and exhaustive glossary of this project. I wanted this file to have as much context as

Eve Bouffard 14:34 poss- humanly possible so that it can feed all the future decisions that we need to make regarding this project.

Aaron Epstein 14:41 It's interesting 'cause there's probably a lot of people that are watching, and their process is, you know, maybe they're doing client work, maybe they're working on an internal project and they're m- meeting with a bunch of, you know, stakeholders. Maybe they're designing their own website-

Eve Bouffard 14:53 Yeah

Aaron Epstein 14:54 ... um, and they're thinking it through. And, and they would probably come out of that and they would jot, jot down some notes and some high-level takeaways, and you're saying like, "No, you shouldn't do that. Instead, just record everything and just dump it all in a Soul.md file, and then use that as the basis for everywhere that you wanna go afterwards."

Eve Bouffard 15:13 Exactly. I really think that's the, that's the future. And we also wrote a manifesto for ourselves when we were working on this project, and of course, we dumped that manifesto into the Soul.md 'cause as much context that we can give the agent, the better.

Aaron Epstein 15:25 Can you show that Soul.md file?

Eve Bouffard 15:27 Yes. This is what it looks like. It is nothing more than a, um, a simple MD file, and it has all the context. And you can also break down MD files. You can create a hierarchy of the different MD files that you want. If you wanna have, like, a design.md file specifically for your design and how to address design, you can have a separate MD for your manifesto. You have, you can have a... In our case, we could have had a different MD for the written content, content in the zine.

Aaron Epstein 15:56 Mm-hmm.

Eve Bouffard 15:57 Um, you can dump it all in one single file. I haven't really seen one method being better than the other, but that's why we're all experimenting and figuring out if there's a better way. Overall, I think capturing as much information as possible and share that information with your agent is the best way to build software moving forward.

Aaron Epstein 16:15 What were your next steps?

Eve Bouffard 16:17 I wanted to experiment, and I wanted to do very fast iteration and see multiple possible versions of what the we- the website could look like. And so I started in Pinterest with a mood board. I created a mood board with a few images that I really liked. This was sort of the vibe that I wanted to go for, something very rudimentary, black and white. And again, this was based on all the conversations that I've had with my colleagues and my friends that I was working on this project with. And so I started there, and then my first reaction was re- lo- looking at this mood board is, "Oh, I wish I could just generate many, many versions, one-shotted

Eve Bouffard 16:58 websites based on this mood board-"

Aaron Epstein 17:00 Mm-hmm

Eve Bouffard 17:00 ... "really simply." And so I downloaded a bunch of these, um, images, and I fed them into Claude, and I asked Claude, "Okay, you know the vibe that I'm going for. You know the content that I wanna show on the website. Here's the visual direction that I would love for you to draw inspiration from, and then one-shot a cool website based on that." I asked it to do that 16 different times. I built a glossary for myself. Going back to training this muscle of we can build anything for ourselves now-

Aaron Epstein 17:30 Mm-hmm

Eve Bouffard 17:30 ... I wanted to build for myself a really easy way to navigate through all the iterations that I'm building for myself. And so building a single page here that has this collection of all the iterations that I'm playing with was just a really easy way. And as I started looking at them, I wanted an, a way for me to bookmark the ones that I really liked. And so I one-shotted this feature that allows me to, you know, pin the ones that I like so that they automatically show at the top-

Aaron Epstein 17:56 Yeah

Eve Bouffard 17:56 ... and I don't lose, lose tracks of the one that I really like.

Aaron Epstein 17:58 Yeah, and so, okay, so to be clear, this is not a page that's publicly accessible on the website This is a glossary that you have made for yourself-

Eve Bouffard 18:06 Yes

Aaron Epstein 18:06 ... to be able to one-shot a bunch of different ideas for how to design the overall site, to explore yourself using real content-

Eve Bouffard 18:16 Yeah

Aaron Epstein 18:16 ... real design direction based off of those images that you found on Pinterest.

Eve Bouffard 18:20 Yes.

Aaron Epstein 18:21 Um, and then create a bookmark system. So this, this is another great example of disposable design-

Eve Bouffard 18:27 Yes

Aaron Epstein 18:27 ... where you can just whip this up really quickly-

Eve Bouffard 18:29 Yeah

Aaron Epstein 18:29 ... jump through a bunch of different iterations and go, "I don't like that. I don't like that. Oh, wait, I do like that. Oh, let's take this piece from this one and put it all together," and it makes it happen so much faster.

Eve Bouffard 18:39 Yes.

Aaron Epstein 18:39 Show us some of the iterations that you put together here.

Eve Bouffard 18:41 As part of the Soul.md, I made sure to include the names of the different articles that we have in the zine, and that was one of the main things that I wanted to highlight and show on at least the first version of the website that I had in mind. And again, because it's one-shotted, you don't expect, like, an incredibly high level of craft. You're just using this as an exploration tool. So getting a feel of, okay, do I want to lay out all the, all the titles of the articles like this? Or there, there, there was another really cool exploration that I loved, which is there are so many things, m- so many cool things going on here. Cool font, um, there was the date of the party that we threw, the launch party that we threw for the zine that was included in there because it was also part of the Soul.md. That is a beautiful thing when you realize that when you unlock so much information for your agent, your agent knows so much, that when you're gonna give it full reign and full... You're gonna unleash it to make iterations for you, it's gonna surprise you.

Aaron Epstein 19:40 Mm-hmm.

Eve Bouffard 19:40 It's gonna include things that you would not have otherwise thought of, and that was almost like an AGI moment for us when we realized that, wow, it can see things ahead of us.

Aaron Epstein 19:51 Mm-hmm.

Eve Bouffard 19:51 And it can really help us brainstorm even, and come up with, like, really, really original ideas. And so that was a really nice, um, surprise here. It's just, like, organically included the time of the party that we were hosting.

Aaron Epstein 20:02 Mm-hmm.

Eve Bouffard 20:02 Also, the, the fact that it's a zine, and so it added this, uh,

Eve Bouffard 20:06 code bar, this barcode.

Aaron Epstein 20:07 Mm-hmm.

Eve Bouffard 20:08 Uh, assuming that it's, like, a physical one that you can purchase in different, um, in different, uh, currency was also really cool. One thing that I wanted to experiment with is what if we had an actual map of San Francisco, an interactive map of San Francisco? And it included this version where-

Aaron Epstein 20:27 Oh, wow.

Eve Bouffard 20:27 Yes. Where you-- It, uh, it reveals a map of San Francisco that is interactive, and you can move around in the city, and that is, like, fully living behind the one-shotted iteration that it built. So just, like, marvelous things. And I think these sorts of levels of design, one-shottable designs, can only be achieved if you have a very detailed and, and intentional design.md or Soul.md. You need to shepherd your agent to tell it exactly the vibe that you wanna go for. If you can include screenshots also, if you can include a mood board, as much information as you can feed your agent so that it really understands what you want, and then it's gonna surprise you in the most beautiful ways.

Aaron Epstein 21:09 Yeah, I think a lot of people use Claude or they use Codex, and they tell it to design something, and they feel like it, they get generic design back.

Eve Bouffard 21:15 Yeah.

Aaron Epstein 21:16 And this is how to break that-

Eve Bouffard 21:17 Yes

Aaron Epstein 21:17 ... which is really interesting.

Eve Bouffard 21:18 And it's really easy. You just have to pull Pinterest or even, like, Google Image, and you find... Or even websites that you really like.

Aaron Epstein 21:26 Yeah.

Eve Bouffard 21:26 Really w- websites that you really like, and start bookmarking them, and eventually use them, give them to your agent and say, "This is something that I really like."

Aaron Epstein 21:35 Yep.

Eve Bouffard 21:35 And sometimes you love a website and you don't even know why you love a website, but it's okay. You don't need to understand why you love a website. Just give it to the agent. The agent will analyze it for you. It's gonna understand eventually your patterns and the commonality between all the websites that you like. It can tell you, "Oh, that's actually the things that you

Eve Bouffard 21:50 seem to like across many websites." This is another exploration that I really loved. Again, displaying the title of all the articles, and there are really cool-

Aaron Epstein 22:00 Hmm

Eve Bouffard 22:00 ... hover effects-

Aaron Epstein 22:02 Oh, wow

Eve Bouffard 22:02 ... that it created as you're exploring the different articles. And so for each article, it pulled really cool visuals. And we're at a point where we don't even know how Claude does, does these things. It just, it scrapes the web, it browses the web, it finds cool pictures, animations, and it's gonna surface them like this. And if there are some things that you want to fine-tune, you can just, you know, speak via Aqua and ask it to change things, change the color of things, change the feel of things, and it's just in, in this incredibly fast and rewarding feedback loop that you have with your agent.

Aaron Epstein 22:38 Yeah, it's amazing.

Eve Bouffard 22:39 So now we can talk about where we ended up is this fully interactive map of San Francisco. We thought, how fun would it be to build a map where people can drop pins and small stories of things that they've come across in San Francisco, or, like, encounters or, like, delightful memories that they have of small moments in the city? And so we thought, let's make it fully anonymous. People can share memories, and the only thing that they need to do is pin a location, or, like, pick a location and then tell us what happened at that location. And what's beautiful is that it allows people to share things that are very surprising and

Eve Bouffard 23:20 beautiful and intimate and introspective. Here, we built this, this fun little way to consume or, like, read through all these submissions. And it's, again, a way for us to go back to the core essence of this project, which is how can we understand how people are experiencing San Francisco, and what are the, like, magical small moments that we can all ... sort of learn from. We also build this little entry point for, we built posters for, for digital posters for the party that we threw, the launch party that we threw. There's also a Substack that we created for this zine, and we added this fun little entry point where you get redirected to s- this, to the Substack, and then you can read the different articles. You can share a noticing or you can share a submission that you really like. So let's say this one, I really like it. I want to send it to my friend. I can just click share. It downloads it as a PNG, and it outputs this, and it gives you the cardinal coordinates of the location that was, uh, tied to this story. And you can share this with your friends, and you also know the street that it's in or that it's on.

Aaron Epstein 24:28 So we're actually putting on Startup School at the Chase Center here in San Francisco, and you did a lot of really cool work to help support that. I would love for you to show off some of the shaders that you created and some of the, uh, content that has been shared on social media and other platforms to help, um, uh, bring attention to the event.

Eve Bouffard 24:46 Yes. We're all preparing for S- Startup School, which is our biggest event of the year. It's gonna be, as you said, at Chase Center. We're gonna have more than 6,000 people coming from all corners of the world to experience SF and what it means to build with AI and have, like, this incredible sense of community of we're all building together. And we were able to have an amazing speaker lineup this year. We have phenomenal names coming. We have Jensen, we have Sam, Sam Altman, we have Alexander Wang, we have Jeff Dean, and so many others. And we wanted a really cool way

Eve Bouffard 25:17 to share that lineup with the world. And when we were thinking more broadly about the design behind this event, we wanted to make it feel really YC, but more like a variation of YC. And so we experimented with, of course, orange, but gradients of orange, and we discovered the paper shaders. And we thought maybe it would be a cool way for us to experiment with paper shaders. My first intuition when I thought about building visual assets for how we're gonna share these speaker cards on, on social media, I, I initially started in Figma, actually. I, it, I initially dropped, um, some of the images that we got from our speakers, and I started making it myself, moving things around, and I noticed, well, we're gonna have many speakers, and I don't want to move things around 12 times. And so I thought it would probably j- be just simpler to ask Claude to make a template for myself, and it can even, like, pull images for me from my inbox and do everything for me so that it feels as light as possible. And I can also have an easier time experiment with the visual feel of the cards. And so I built this tool for myself. It's a very simple tool where we have the names of all of the speakers that are confirmed,

Eve Bouffard 26:33 and it just automatically generated all of the, all of these as we kept having more and more names of speakers confirmed. And I also built a way for myself to experiment with different ways to lay out the, the text on these, on these cards, and we ended up going for this one, but it was fun to really easily almost one-shot an different iteration-

Aaron Epstein 26:56 Mm-hmm

Eve Bouffard 26:57 ... of layout for each of these cards, and these are, like, compatible across the board. And for the shaders, well, we used the, the movement that comes from one of the, uh, shaders made by Paper.Design, and we fine-tuned the graininess here, and the edges, and the rotation, the scale, um, like this. And I had a lot of fun really finding the variation of the shader that I wanted. And so I can just refresh and it, and it resets. But that was also a very helpful sort of mini tool that I built for myself. Um, and another thing is I wanted to, because I wanted to keep the really cool movement that is happening behind, I needed to do a screen recording to maximize the resolution of the card. And so I built this little screen recording tool for myself that tells me exactly when

Eve Bouffard 27:50 I need to start the recording and when I need to stop. And the reason I built this tool is because I really wanted it to feel like a loop, a perfect loop, so that when we post it on Twitter and on Instagram, it loops very, very smoothly, and it feels like a com- like an endless-

Aaron Epstein 28:06 Mm-hmm

Eve Bouffard 28:06 ... sort of movement. And so I asked Claude to build this specific tool that gives me, like, this four-second, like, perfectly designed loop so that it starts and end at the exact same pixels, that it feels really smooth. We thought it would be really magical if people received a ticket-

Aaron Epstein 28:27 Mm-hmm

Eve Bouffard 28:27 ... uh, when they get their acceptance. And so we designed this ticket reusing the shader that we're using for all the other visual assets that we have for Startup School. This time, we would apply it against a, a ticket, and we would try to make it as personalized as possible. So we render your name, and we render the city that you're from, and then some information about the, about the event. And it's been such a delight to see people share them on social media-

Aaron Epstein 28:55 Mm-hmm

Eve Bouffard 28:55 ... and say that they are excited about coming to SF and experience SF sometimes for the first time.

Aaron Epstein 29:01 Yeah. Could you imagine a year ago trying to build something like this? It wouldn't be worth it.

Eve Bouffard 29:05 These shaders, building these shaders a year ago would have been like, f- would have felt like this insurmountable mountain of... Like, I would not even have known where to start-

Aaron Epstein 29:15 Right

Eve Bouffard 29:16 ... to build these things. And now it is just this thing that Claude, my Claude, knows what to pull, 'cause it, it knows that I love Paper, it knows that I love their shaders, and it just g- automatically knows how to pull that, all that information from their website, and it uses it. It's just really magical.

Aaron Epstein 29:34 It's really cool to see this, and it feels like so much time, and thought, and attention, and care went into designing the experience from the moment that you get accepted until

Aaron Epstein 29:43 all the way through when you show up to the event and see the amazing lineup there.

Eve Bouffard 29:46 Yes. Yes. And it's also, it's gonna be amazing to keep building more of the branding of Startup School with Claude and Codex and the coding agents. It is such a different paradigm as to how we even do branding design moving forward. The fact that we will be able to use that same shader with the same parameters on the w- massive screens that we're gonna have throughout Chase Center and keep it incredibly consistent through and through is amazing. Like, I'm really, really excited about this, and it's just easier than ever to make things more consistent and use coding agents for absolutely everything.

Aaron Epstein 30:21 Yeah. A- amazing. Eve, thank you so much for joining and, and showing us the behind-the-scenes of how you've done some of this incredible work.

Eve Bouffard 30:28 Thank you.

Aaron Epstein 30:28 Um, things that I think are really pushing the boundaries forward that, uh, are ways that are gonna be super common for how designers are designing in the future.

Eve Bouffard 30:35 Mm-hmm.

Aaron Epstein 30:35 But not a lot of people, I think, have figured out yet, so I really appreciate you sharing that process.

Eve Bouffard 30:39 Thank you. We're, we're all figuring it out together, and we're having a lot of fun doing so.

Aaron Epstein 30:43 That does it for this episode of Design Review. We'll see you on the next one. [upbeat music]