Design a functional prototype in Figma - Lesson 3

This is where we are at. We're over here. This is like kind of if you had to divide it up, this is kind of like the idea. Let's do idea. People talk about idea versus execution or whatever, so we can use that framing. So we're kind of at the end of the idea thing, which is pretty scary because I think if you look at your memo and you're like, my memo cannot tell me exactly what to build. Well, that's what this week is about. So that's what we're going to be talking about. This week. And I also made a nice little title slide which we didn't get to use, unfortunately. But I do want to talk a little bit about the lecture, uh, for more lectury, um, about the memo, do a bit of Q&A, and then we'll get into, uh, the demo, uh, where I'll go through, uh, how I actually designed something from scratch. Um, and then we'll do Q&A and sort of crit and all of that stuff at the end. And I will ask ideally that as I start doing the memo that you kind of try to do it side by side So like as I go, um, in Figma, like it would be cool if you could kind of basically do the same and I'll go slow. Um, and try to kind of just start to build up that muscle memory. Cuz a lot of this just takes, takes cycles. Um, so yeah. Awesome. So yeah, just some, I find like, I don't know, I, I always like, and I think this is true actually, I would say true probably for people taking the course and, and, and just learning in general where Your brain kind of gets better faster than your body does. I don't know if anyone else feels this. I certainly do. Like for example, with painting, if I take a painting class, I find that my eyes improve. I can start to see better, uh, before my body and my hands and my sort of— I'm able to actually do anything with that, which it kind of sucks to be honest, because basically what ends up happening is that you're like, You know, if, if your eyes are improving, right. But like your skills are only improving like that at that rate, then you actually feel like you're getting worse. Right. Isn't, I don't know. That's kind of weird. Like you were getting better, but like the fact that you're getting better in your eyes is actually like, makes you think that you're getting worse. And so there's this like this weird thing that happens that like, as you get better at something, you actually get demotivated because you basically, what you realize is you're not that good. You've never been that good. And you just now know it, you know, there's kind of like the levels of mastery. Mastery, where like you're so bad you don't know you're bad, and then you're bad but you at least know you're bad, and then you're good but you know you're good, and then ultimately you want to be good but not even be aware that you're good, right? It just becomes kind of instinct. That's kind of the 4 levels of mastery. So I just want to say, if people feel like this, then, you know, that might be why. And especially with words, it feels like it should just be easy because we're all using the same like 1,000 English words, but it's not. It's really not. So yeah, so let me just highlight some things that came up over and over again. Specific, I've said. So just like I would highlight these words and like just like run every memo, every idea through this. Is it specific enough? Can you make it more specific? Another way to kind of say the same thing is verticalize, spelled some spelled like that, I guess. And then I really love the Peter Thiel small monopoly. Like, I think that's a really good framing on it, which is every business is kind of a monopoly. It starts out just with a really, really, really small one and it expands over there. So I like this framing just because it feels like a paradox. Like, how do you have a monopoly? Normally doesn't imply small, right? So just keep these things, these things in mind. And then there are a couple notes, I think, from the sort of reading the memos and feeling like, um, like I could actually make them better. And so there are just a couple of things that I would like to highlight that I think really all memos should include. One is the most interesting thing, the most interesting thing about your business. Which I think, you know, basically the hook, right? What is the hook? Every memo needs this. It's kind of like, you know, the, I don't know, like the logline of a movie, right? You need some hook to captivate your reader because we're all busy. We're all looking at a million different things. We all have inertia. And so hook, And then the other thing is like the most inspiring thing. And I know I've said these before, but just framing it this way, I think is helpful to me. Aspiring thing, which this, you know, we, we call the moonshot, but I think this is also really important. Inspiring thing, or sorry, no, why'd I write that again? Moonshot is what I meant to write. So yeah, we call this the moonshot, but really I think the important thing here is A lot of this stuff is kind of very actionable, very much like, what are we going to do in the short term? And I think at least one, just one thing that just gets people excited and inspired, it's really important to have. Yeah.

Can you give an example of that, the moonshot, like what you think of as a great moonshot?

Yeah. So for example, with Flexile, I would say the hook is equity by the hour. I think that's like a pretty interesting novel idea. And then I would say the moonshot is basically EC2 for people, but effectively, I believe that jobs will sort of disappear. Everything will kind of become a gig and it'll just be much more liquid, much more fluid, much more flexible. And so effectively, engineering companies will have— just like they use Amazon, they outsource their kind of servers to, and it kind of auto-scales up and down. Like we'll have an EC2 for people over time, whether it be support, whether it be copywriters, marketers, engineers, and designers eventually too. That's kind of the moonshot. So the simple one that I, you know, EC2 for people is kind of my hook. It's also just a reminder to the reader that like I'm thinking bigger, right? That I have more ideas. I'm not telling you them all right now, but that I've thought about the second order, third order effects of this business. And I've also just thought more deeply than the reader has. The reader may have thought about some of this stuff, but when they get to it, they're like, "Oh, wow." Just because they haven't gone 2 or 3 hops down and they haven't— And it feels good as a reader. It's kind of like the plot twist in a movie or something like that. And you're like, "Ah, you got me. This is what you were— It was all about this the whole time. You foreshadowed it over here, but I didn't pick it up." It feels good. So yeah, so that's a kind of an example of a hook and a moonshot. Moonshot for Gumroad, I don't frankly think Gumroad has one. I mean, I think that's kind of why I'm working on Flexile, you know, is like, it's kind of, it did the thing and we didn't actually think probably, or maybe we did think big enough, I don't know. Yeah. But like, yeah, I would say Gumroad doesn't have one. I didn't really have one, which would be like a— probably if I could go back in time, I would've been like, hey, Sahil, I know you're new at this. You're very excited. You want to get started. You want to raise a bunch of money, but do you want to work this like 20 years? And if so, why? What do you get to do? And maybe I wouldn't have had good answers. Maybe I would've had amazing answers. Who knows? But I think it would've been a good sort of good to have asked. The other thing memos do, and I hope people feel this, is it just shows you How much, you know, right? Because like when you have an idea in your head, what's the idea? What's, what's the representation of an idea? It's like a light bulb, I guess everyone does like a light bulb, right? But you know, I don't know, like this is like this vague thing. No one knows, you can't measure it. You can't say how big it is or how small it is, but the minute it like it's on a piece of paper, then other people can look at it. Then it's not just you. And I don't know, it's kind of scary. It's like, oh, maybe my idea is not that good. Eyeballs, scary stuff. So I find memos are just so helpful with that. And the most important thing is that it gives you something to work on. I think this is the most important thing about a memo and why, for example, when I did the office hours, it's so much better to have something that we're both looking at together than you talking to me about your awesome idea and then me trying to figure basically compile that idea in my head and then try to basically visualize it and then like try to, you know, attack it. But it's like, I'm not even attacking your idea. I'm attacking my idea of your idea. Right. Or like, I'm trying to, like, it's just so difficult. But if you have this thing in front of you, it's just so much easier to kind of get on the same page literally and kind of look at it on the same side, you know, and be like, how do we make this better together? Which I think is just so awesome. The other thing is you can work on it every day. I think it is important that you should, if you believe this is really important and you want to make some big change in your life, you have to make some sort of daily progress, maybe 5 out of 7 days of the week or something like that towards the goal. And I find that with business, business is such an amorphous sort of thing that does that mean reading Twitter? I would say no. But does that mean reading a business book? I would say no. What does that mean? And what I love about going through this process is like, we know, you know, at least my opinion is these are the things. Like if you do the, if you are doing one of these things and ideally one of the last 5, then you are working on your business. And if you're not doing one of these 5 things or 6 things, you are not. And it's like pretty clear. And you know, if I was making like the same sort of thing for like learning how to play soccer, you know, it would be like, I don't know, it'd probably be— there'd be like one red line down the middle, and then this would be like, you know, play soccer over here, you know, ideally competitively, right? Or some sort of game that mimics the actual game. And like, this would be everything else, right? And I'd be like, do this. And like, this is fine and kind of useful, but like kind of marginal. But if you measure like, did you improve at This goal that you have of playing soccer better or whatever, really the only way you're going to really improve on that goal in a measurable objective way is this stuff over here. And so I find that when you have stuff like this, and especially when you have a memo, it just makes it a lot more binary. Am I working on the business or am I not? And if you have a memo, you can be working on this. You can constantly be, you can send it to someone, they'll give you feedback, you can chip it away, you can make it better, you can make it stronger, it can start to crystallize. And so I just find that it just, it just, if it's just in your head, it's just getting better in your head or different in your head. Like, I don't know, to me it's just, it's too soft, it's too hard, it's not satisfying. Um, you can't even observe your progress, you can't show anybody. Um, I find that, you know, it's just so much, so much better. And eventually, by the way, you can do most of the stuff in your head, right? Like, I can come up with an idea that I have and sort of think through how to grow this thing, or what am I going to use to build it, or what's the right go-to-market strategy? And that stuff you can do over time in your head, but the way you do it in your head, the way that a person plays soccer and is able to forecast what can happen on all the different things and then actually make a move in real world with their body is because they've done it before. They've gone through that way and they're able to forecast. Why are they able to forecast? Because they have data. Because they have the data, because they have the experience. And so as you do this more and more, you will be able to skip these kind of steps. You don't have to do every single one. But I do think you will need to do all the steps at least once to be able to do those steps in your head. So just to, I don't know, hopefully inspiring that you will eventually be able to do more of this stuff. So yeah, let's talk about design.

Design. Can I ask you a quick question? Yeah. So how do you know that your memo is good enough to start this part?

Like, because it's Monday on the 25th of February. Oh, okay. I'm kind of, you know, it's one, you know, it's kind of never ready is a kind of the classic answer, right? But like, I really believe in timeboxing. And so, you know, for me, for example, like what I would generally do, let's say I have a weekend project. This is like my weekend project schedule. And you can see this cuz there's one on YouTube project schedule. I have 9 minutes for this. I'm counting. What I would do is basically, okay, so what does a weekend look like? You have 3 days, but really you just have like Friday night is like this block and then you have Saturday. And then you have like Sunday, which you'll run out of steam around here, right? And then maybe you launch like Monday. So I'd say launch Monday. What does a rocket look like? Something like this, right? With a little air window for the dog or something. Um, so you launch Monday. I would really say that you'd basically do all of your ideation, all of that sort of first column. Which is like, I did, you know, maybe you have the idea, you know, over here, right? Maybe you started working on the memo. But here is really when I do the memo plus design, I kind of sleep with the, with the sort of Figma prototype over here. And then I build, I, and then I launch. I mean, like I launch and like, if I, if I, if I'm like, wow, I have 3 hours left and 8 hours of work to do. Guess what? Like I delete features, you know, I just get rid of stuff until I will launch. And so you don't have to stick to my weekend sort of formula or anything like that. Obviously weekends, like everyone has different, different stages of life. Like I certainly can't do this as much as I used to be able to do it, et cetera. But generally the concept of timeboxing is super important because otherwise it's sort of, yeah, it's sort of perfect is the enemy of good. Right? Like you're never going to be happy with what you have. And yeah, so I just think like, you know, this, but, but sooner rather than later. Right. And ultimately, like I'm still working on the Flexile memo. Like, you know, I might make a change in the design or the building or the selling that, you know, kind of propagates backwards. Right. Like I talk to a customer that influences what I build, what I build has to now go influence the design in Figma. And then. I now have to go update the memo. So there's this tree cascading waterfall that happens as well. But yeah, generally something like I would say a week. There's also diminishing marginal returns. We went through that curve of excitement. My guess is quality of memo probably goes like this. Maybe it even goes down after a while where you're just hitting your head against the wall and stuff. And if you— I don't know, if you write a memo and you like, for whatever reason, it doesn't inspire you, you don't want to get to the next step, like, that's great, right? Like, the cool thing is it's not just an idea in your head that no one will ever know. You have a memo, you have proof. It's like a journal entry. Uh, you move on to the next thing. You'll get better. It'll be so much better. Um, I bet you in like, if you spend like 3 hours on the first memo, in the next memo, the first 5 minutes, you'll have a better memo than those 3 hours, right? Because you'll like you have none of the sunk cost fallacy, and you'll be able to apply all your lessons to an even better idea, which is why I kind of mentioned in the course, start with a new idea even if you already have one. It's helpful to kind of get out of your head in a way. Yeah. The other thing— and I'll just use this slide— is— actually, no, I won't. I'll do a different one. The other, the, you know, the, the reason design. So what, what is design? Like why, why even do it? What is the difference between like designing, building? Why don't I go straight to, to that? Why, what is the difference between like design and memo? Isn't a memo kind of saying what the business is? Design is also kind of saying what it is. So the way that I like to think about it is that we're basically making the transition when you get into design. So this is sort of like the design, why design, right? What, what do we get? Right. And if you imagine like the memo is over here on this side, right over there, and then, you know, so what is like, what is this connection to actually building it? Building. And basically, basically I think, and, and, you know, I like to use these words often in the memo itself. Like, what are we building? Why are we building it? I use this for every, every task at Gumroad, you know, even the small ones. Why are we building it? What are we building? Behavior and intention, two different things. And then design is really like how, basically, right? So if you have like your 5 W's or whatever, and one H, how is, is like, basically what is the problem? And like, that's the memo, right? What is the problem is a part of the memo. But what's not part of the memo, what's kind of like pretty clearly missing is, well, how? How does this solution actually look like? And so that's a lot of what we do today, which is actually figure out the how. We take this blurry picture. If the memo was a photo of a face, it's like this. You kind of have some indication. Of like the, you know, the proportions of the face or whatever, right? Something like this. Design is like, well, what is the actual face? Like now you have to make really, this is scary. It's really scary. 'Cause you have to like decide, you have to make a decision. Like what is the gender of this person? What, you know, what do their eyes look like? How far away? You know, all of these sorts of things you have to start to do. And you're like, oh no, I don't like that. 'Cause you will not like, a lot of it, right? But the cool thing is like, you think you don't know how to draw, but because you, you almost can see it as you go, right? You like, it's almost like a guide. It's like you made your own children's coloring book, right? So that's kind of what like I think a memo helps you do is you, if you went straight to design, you'd be like, like draw a dragon. I'm like, I don't know, right? But if I said draw like a cat and then add bat wings, and some fire, it's like, oh, I drew a dragon, you know, without even knowing it, right? So that's kind of the thinking here. Yeah, anyways, I could do this for a long time. Um, yeah, so that's very different from, from last week. That is literally all the lecture notes that I believe I have this week. The rest were— I'm actually going to screen share and go through, go through everything. Um, but before that, yeah, any, any questions, any Comments? Any fears, uncertainties, doubts, questions, concerns? Anything, anything at all.

Is there a cost of choosing a bad design initially? Because there's a lot of this thing about Google not changing their homepage through its life, like the user experience and costs of changing that in the future.

I mean, I would say there is kind of a cost. I mean, so there's like design costs in the sense that like— actually, let me reframe. So there's kind of the way that I think about costs, like basically debt I think is probably a better kind of more precise word, right? Because there's always going to be costs. Not all costs are bad, but debt is kind of, I wish I didn't, sort of thing. But there's like internal debt and external debt, right? Internal debt is kind of like the sunk cost fallacy, which is like, hmm, I wish I hadn't done this. And then what you kind of point out, which is like the Google maybe problem, is like the external debt, which is like just kind of too big. The cat's out of the bag at that point. I mean, I don't think it's a huge problem, to be honest. I think you can always— I mean, Gumroad, we redesigned everything about our brand 10 years in. So I think you're always allowed to kind of do that. And truthfully, I don't think most people care. Like, I think a few people really care. And certainly Twitter gets really mad every time there's like a new logo or something. But that's just Twitter, you know? It's like, I think there's just this sort of this fear that people care maybe more than they actually do. So yeah, I don't, I don't think it matters. And I always think like, let's say you're like, I, I 100% know that whatever I come up with as part of this design week is not good. That's gonna be true for many of you, frankly. And probably what I create too, like just stuff I create all the time that sucks. Totally fine. You know, 'cause the product, the product that we're improving, kind of like what I said in the first class is like this brain, right? Like that's really the thing. Not, we're not trying to produce anything that great because my belief is we're always gonna be making better stuff. If the factory is improving, then the products it's gonna be producing are always going to be improving. Right. And so the more that I can just focus on the brain. And so if I just do 4 hours of design and throw it all away, like that's 4 hours. That's like going for a 4-hour run in my head. Right. Like I didn't have to record it. I didn't have to tell anyone. And, you know, I didn't have to post on Strava, but like, I know, like I am now better, right. For that. So that's kind of how I think about it. And I really believe that like any of these, you know, if you kind of equate, you know, I, you know, I don't know, building a business to a marathon or whatever, like this is kind of the exercise that you have to do. These are kinds of exercises. It's like, do you work on these 6 parts of your body or not, right? I think is maybe another way to think about it. Awesome. Any other questions? I think I might have seen one pop up.

Peter, do you want to ask your question?

Do you do user testing or is there like just pushing it into the world and see what happens your user test? I do do user testing. Uh, and that normally starts out at the end of this sort of session of like design basically. And so once I have the Figma prototype, that's really when I start sending it out to people, getting kind of feedback, uh, on it. Um, it, it sometimes depends on timing though, right? Like, so for example, one of the reasons I often wait until the design is because it takes me like 4 hours, right? So it's like I can— 4 hours to get way better quality feedback, worth it for me. But sometimes building it might take like much longer, right? So it's not worth it. So you kind of have to sometimes do the math. I would say there's sort of like 2 things you should really avoid with user testing. One is doing it way too early. I think many people kind of do it way too early. And I think there's a good book on this called The Mom Test that Rob Fitzpatrick wrote. That's referenced in my book. But basically, the problem with that is basically everyone just tells you your idea is good. There's no cost to being like, don't do that. Or there's no cost of saying you should do that. There is sometimes a high social cost to saying you shouldn't. And so often, there's not really the skin in the game that you need. And there's also often not enough feedback. It's kind of like the feedbacking of the very broad, idea, right? Like Uber for dogs, right? Like it's hard to really— you want really like the more specific you make your kind of idea, the more there is to even feedback on, right? There's more touchpoints. And then the other problem, people just wait forever. Like they just never do it, right? Where they just wait way too long. So I think as long as you're somewhere like sort of from memo to building-ish, you know, like somewhere within there, I think you're in a pretty good spot, I think generally. Yeah, I definitely don't recommend just pushing it out into the world and then like basically saying, I'm waking up, I'm gonna wake up tomorrow and check Google Analytics and see what happens. Right? Because like nothing is, you kind of have to push the boulder up a hill in the beginning before it kind of turns into a snowball and then, you know, or whatever metaphor. So yeah, definitely don't, I would say like the, and that, you know, that's really the kind of the sales part, right? Like the selling. It's really that. It's like the pushing of the boulder, right? This is like building the boulder and then selling is the, is the, is the pushing. So yeah. Awesome. Well, I don't need Procreate anymore, so I can quit this thing if I can figure out how to do it and hopefully not make it echo a million times. Awesome. And start with An example. Let's go to an example. Don't look at my show notes. I want to sound more extemporaneous than I actually am. Awesome. So I'll use Flexile to show you an example of Flexile. Everyone's kind of becoming familiar with it. So I think it's, it's a good example. And we're actually going through building the new prototype, so it might even be broken halfway. But everyone's checked out the memo. Often what I do is, you know, you already have the solution, right? Or you have product, you might have written here. So often what I kind of do is I, you know, kind of like, as I said, like you start from like this blurry view and you kind of make it more specific over time. Sometimes I'll like literally just take this stuff and I will replace it and I, I will like almost use this as my to-do list for the design. And then once I have something, I like swap it out. Like I'll just delete this whole thing and like, I'll just put in like a screenshot right here. Right. Screenshot of Figma or something like that. Or, or, or even like, I think you can embed a prototype in, in Notion. So sometimes I'll, if it's like really small, then I can, you can even embed the entire prototype. So then like your memo all of a sudden is now like all encompassing. It's your text, it's every, your idea, everything, but then it's also your, your Figma prototype, which is pretty Pretty nice, cuz then you only have to like remember one link to send out to everybody. So you saw that. Let me open the design. So this, this is kind of what you'll end up with. And I can show you Gumroad if you want. It's a lot crazier. But you know, Figma is nothing too crazy. You have pages on the left, you have all the stuff that, you know, you've designed. We've created this one as we're scoping down the MVP. We wanna launch hopefully by the, by sometime in, in, or at least go public Sometime in mid-March. But you can kind of see how Caro has broken it up where she's created these pages or these like covers, and then boom, you just have the design. It's nothing too crazy, you know, it's kind of what you would expect. The crazy thing is that you can like go in and like actually manipulate everything, right? And there's all sorts of cool stuff. Like if you change the width of this, In theory, let's see if it's set up the right way. It may not. Oh, it's not. Ooh, it's not set up. It's not set up the right way. Carol hasn't set it up the right way. If it was set up, the Gumroad example would be a lot better. Let me, let me show you the Gumroad example, cuz the Gumroad example is, is pretty crazy. So we redesigned Gumroad, as you're probably familiar with, and if I can find the Or we're doing Gumroad V2. Does anyone wanna see what Gumroad V2 looks like? I don't even know what's here. I just wanna show you an example of components being dope, which probably is this one. Okay. Well, anyway, the, the point, the thing, the, the thing I wanted to show, and I'll just do it live when, when we go through a new, a new example, is that Figma, the core difference between something like Figma and something like where you're just manipulating images, right? Which is kind of where design was like 10 years ago, right? Where you were editing stuff in Illustrator or Photoshop or even Sketch. You're kind of manipulating like a, a static file in which effectively the export is a flat file. It's just, this is what it looks like, right? Um, there's really the only difference between, you know, that and like And this would be like just removing the sidebars, right? And then you have your image. There's nothing, there's no secrets, there's no layers, nothing like that. But because Figma, and this is why I encourage everyone to really mess around with it, Framer is also great, but generally use an in-browser tool because if, if we're building stuff, you know, in the environment in which this stuff is gonna get used, you get all sorts of stuff for free. So for example, the example is this kind of stuff, right? In Photoshop or anything else, you're not gonna get something like this. Where because it's HTML and CSS, you know, it's, it's being rendered in the same way that you would actually be— Figma is a website. So we're really just like designing a website within a website using a— we're like, this is like a website builder basically. You get all of this sorts of stuff for free, which I think is, it really, really, really matters when you're designing stuff. Cuz otherwise it's a huge pain because Photoshop has photo in the name. It was not built for designing websites. Even though every web designer basically used Photoshop for 15+ years, it was for photo editing and it just kind of was the best and we used it for a long time. And now we have like tools built for us. Like how awesome is that? And that's literally like a 5-year— like imagine like humans have been around for hundreds of thousands of years. We've had like native tools to build, you know, web apps for like 4 years, right? Like how lucky are we? So pretty, pretty awesome. So yeah, anyway, the, the way that I start though is not with the design. The, the way I start with, this is the way that I start generally this kind of design session. And I, I've mentioned this before, the first touchpoint that a user has is the name. So the first place I always start is the name. And so I just wanted to go through a couple tricks that I use and a couple websites that I use to find names. Cause it's not easy and many people get stuck here. So the first example is a thesaurus. I love the thesaurus. So when I was Googling, so I was trying to come up with like, for example, Flexile, right? I'm like, okay, I need a name. What is the core? Like, again, now that I have a memo, so much easier. Everything becomes so much easier cuz I can go, I can literally just go to the memo and be like, okay, well, what did I write? Like every single word, you know, what are the words that stick out here? And like, I would read the word. Or sorry, read what I wrote and send it to people, get feedback. And eventually I settled on this word and I don't actually use it too much in this anymore, though I do see it here because I pulled it out and it's in the name. And the cool thing is because it's in the name, I don't even have to say it anymore. It's just everyone knows obviously flexibility or flex, something flex related, right? The operating system for flexible work. And so I basically I'm pretty sure the first thing I did was I just went in here and typed flexible, right? And I don't even know if flex— oh no, flexile came up. So that's the first thing I do is I just, I go in here and I just look for like what connections my brain starts to do. As I mentioned before, like I love two words that come together. So if I see like puns or double meanings or any opportunities like that, I think always really great. Like Elastic, I think Elastic's kind of a taken word in the startup industry. There's a couple startups that are already called that, Elasticsearch, et cetera. But Elastic is a great name. Like there's a lot I, I think you could do there. Malleable, meh, it's kind of weird, right? And it's kind of interesting how much is in a word where like, I, I feel like I, if you told me the word, the name of the company, I'd almost be able to tell you like the kind of people that work there, you know, like Malleable is like, I don't know, like I probably wouldn't wanna work at a company called Malleable. But like putty, I would work at a company called Putty, obviously work at a company called Gumroad. And so I've sort of, everyone has words that they like, words that they don't like, and it kind of starts to narrow down. I start to click through, I start to kind of, you know, find other words that there's synonyms for. Bendy, I kind of like bendy. Spring is a word that I looked for. It's also kind of used 50,000 times. And then I just scroll, I keep looking for stuff. Eventually when I find stuff that I like, there are a couple websites that I use. The obvious one is kind of domains.google, which is like just Google's name registrar, 'cause ultimately And I believe quite strongly in the .com. So I would start typing stuff into here and just to see if the .coms are available. I also may look at something like Sedo.com if you're willing to spend a couple hundred bucks or something like that. You can find really great names. Peter Skew told me about this, and they do these auctions, I think, where you have to go find them somewhere. I'll see if I can find the link. They don't make it super obvious. Um, but you can find like, they, you know, their premium domains, you know, will be out there. And you can kind of, yeah, something like this where you can start to see them. These are terrible. Um, but you can start to see some, some of the names they have that obviously would be stupidly expensive. But again, just starts to get your— you don't have to buy one of these names, but it starts, you know, you can take one of the words that you had before, add it to one of these, and then you might have a really good name. Because there's a reason that these are These are registered and owned by domain brokers who want to resell them. And this is like their business, because they think these are good names. They've kind of done a lot of the work for you in a sense. Like Lab, pretty good name. I think you could take a lot of these words, Bendy, and try to come up with something like Bend Street. There's a startup called Main Street. And come up with something that's kind of interesting. Culture is interesting. And just kind of see what gravitates to you. The other website that I absolutely love, especially for side projects in which I don't care too much about the name in terms of the domain, is Domainr, which I love. So if I go to Domainr, um, Domainr's cool because you can type in something like flexibility or flexible, and instead of just telling you the .com, blah, blah, blah. Oops, I spelled that wrong. And seeing what's available, what's not available, et cetera, it starts to suggest like kind of cool domains that you may not have thought of before by kind of making them part of the word. So for example, what were some of the examples in the chat? There was, oh, like the Mom Test Book, right? Like the Mom Test Book. Oh, did you know that there's a .book that's potentially available? So you like, he could get themontest.book. Like, that's pretty cool. Um, oh, themontestbook.com is available. Probably too long. Probably don't want book in it, right? You probably want to build a brand that's like The Mom Test. Oh, did you know that there was ST? So you could literally get themomtest.

Um, but how does that work with your belief in the .com?

Yeah. I mean, it kind of is like what Peter was saying about the— oh no, sorry. Who was saying about the design? Was it Ana Robert? But basically, do you need the— how fleshed out do you need the design to be, right? Or is it bad to have it too fleshed out or whatnot? Like sunk cost. I would say domain's kind of similar in which I say the most important thing is to make progress, to get started, to get moving, to get to the next step. But it, you know, but like, so yeah, I don't know. I don't think it matters too much, especially nowadays. Like what I optimize for is like, how does it look in my Twitter bio? You know, something like that. Like it is important to say like, how are people going to see the name? For example, like the mom T.st is probably not something you'd want to say on the radio. Like it's gonna be tough to communicate that, right? That the radio test. But in a Twitter bio, it would be great and it would make a lot of sense. And I, you know, so it really kind of depends on, on a bunch of things. I prefer the .com. I do think the .com is still the best domain. Like certainly anyone who could get their company .com should. But in the case that's not available, these are kind of like hacks. And especially for side projects, I like these fun names. Like I think they're kind of cool and fun and And then if they work, I can always double down on a proper, quote unquote, proper domain and reward myself with a better domain or something like that. If I can get to product-market fit, the domain will get better. Yeah, like Delicious. How do you even say that to somebody? I don't even know. Different time. Though I do think they own delicious.com. I do believe they got that eventually. Even Pinterest, when I was at Pinterest, we thought about changing our name from Pinterest. This is like years in the company, from pinterest.com to pinned.com. And we got scared because we didn't find that, at least Ben's reasoning is there was no company that had succeeded that had a past tense name. And we didn't want to risk being the first or, you know, fail because of it. So, um, so yeah, cool. So that's the name. Um, so that's how I always start. The, the, the next thing I do is colors. I love colors. So the next thing I do is I go to colorlovers.com. This is, I actually might redirect. Yeah, it redirects to the British spelling for some reason. Um, I would say that's, they should not do that. Just again, shorter. It's weird cuz they say color here. But anyway, I would go here and then I would find a color palette. This is like, this is really fun. This is like the fun part. Like this is like kind of like, you know, I don't know, the stuff that gets me amped and builds my energy. But I just go through here and I just literally, this is literally what I do. I don't know, maybe people expected something cooler, sexier, but I just literally just go through here. Sometimes I search for words. You can search for like flexible. I don't know what the hell color flexible is, but someone has used it. And, and often it doesn't matter. Like we're just trying to like serendipity, right? Like just trying to generate ideas and see stuff and with the domains, with the name, with every, like, just try to like have as many serendipitous moments where you kind of might stumble upon something. Might happen today, might happen tomorrow, might never happen. But the more chances you give it, the more likely it'll happen. I like this one. Like, this is pretty interesting to me. Flexible thinking. I could see it. I feel like flexible, you know, like if I think, you know, I'm not gonna think red, yellow, blue, flexible, right? Like that doesn't seem flexible. That seems static. That seems like the core default primary colors. So I can see purple and yellow kind of being, I like, and you know, I like this too. Like it kind of hints at this like gradient. It's like flexible work is like non-binary work. It's not a zero and a one. You can work a little bit. Block, take it, you know, so having this kind of gradient in between, I think is kind of an interesting idea. And so you might be surprised, like I'm able to, I don't know, pull out some ideas and concepts from colors, you know, and these things really matter. Like they really do add up. And this is what brand is. I mean, you know, when Nike sells a shoe, like it's kind of like what I talked about, like about like a painting is everything that's wrong with it. Otherwise it would be a photo. It's kind of similar. Like, brand is all the stuff that is like— it's like the, the thing that makes Nike valuable is everything that isn't the actual shoe itself, because if it was just the shoe, then you could buy it from somewhere else. It's all the weird stuff that they do that's like very, you know, very like colors and design and branding. So I would basically just mess around with here, and then eventually I would pick a color palette that I liked. And I kind of like— this is, this is gonna be tough, purple and yellow and stuff, but let's, let's Let's go with it. And if, if it sucks, oh, by the way, it orders by most loved. So you're not gonna see the like total crap. You could sort by that if you wanted to, but generally you're gonna, you know, these aren't just random colors. These, this is somebody who loves colors, you know, is coming up with these, you know, coming up with these, this is some community of color lovers, literally. But often what I would do is I would just like take a screenshot of it. And the way I do that on Mac is like Control Command Shift 4. Which will copy it into my clipboard. I copied it into my clipboard and then I go to Figma, which I don't have open here. So I'll open Figma and I have an ideas column, which I don't think I even pay for this. So I can't even create a new Figma file. So what I do is I just like delete old stuff and start from scratch. So I had an idea called Accredited XYZ that I thought I would talk about. Though we could certainly do other stuff as part of the Q&A and crit. Yeah, basically I would take the color. Oh, sorry. I don't know what happened here. And then boom, I have my, my, my colors and then I would start designing and boom, this is all I need. This is all I need to start designing in Figma. Right? So if you're working alongside as you go, name, domain, color scheme, and that's kind of, that's it. I mean, that's really all you need. Everything else is like actually the product that you're going to build, right? Everything else is kind of like points to it. It's the stuff that goes on your Twitter, it's the URL, it's the bio, it's the thing you say in person. That's all like kind of ephemeral, all this stuff you kind of need, but then really it's, it's, it's, you know, getting into, getting into actually designing the product. You really kind of have everything that you, that you need. So yeah, so let me tell you about an idea that I, I thought it would be, I'll riff on and then we can come up with a design for it. And I can just walk through, it's not gonna be great, but I'll walk through kind of how I would go about it. And then, and then we can move on to like actually working on like your designs on, on the memos that people have submitted so that we can actually like help people make progress. Awesome. So the idea I had is called accrediting, which is basically, I built this site that people may be familiar with called verificationletters.com, which is like a super, super simple thing that I built for my mom actually. So, oh, I need to update the copyright in the footer. That basically, you know, people can fill out a form, say that they're an accredited investor, provide some proof, And then pay $50 and then get a letter from a sort of a licensed CPA, certified public accountant, like my mom is in the state of New York. And yeah, just built it, has some customers, has some revenues coming in every week or so. So yeah, it's kind of like a fun little business. And I thought it would be cool, like basically like a month ago I started thinking about What more could I do with this idea? Because there's definitely, there's something here. For some reason, I couldn't get it out of my head. And I had this problem. Well, the reason I built this is I had this problem is because you need to be verified, accredited to invest in a fund like I have, and it just became a pain. So I thought I'd build a service to make it easier for people. And then I started thinking about verification accreditation status, and obviously as everyone's been, I've obsessed with Web3 stuff. And I was like, how do these things work together? How do you— and over time, I basically came to this conclusion that what would be really cool is if you could have this verification status on-chain. So instead of a PDF letter that my mom sends you in the mail, then it's an actual on-chain asset that you own, and that asset basically represents the fact that you are an accredited investor. And then having that thing on-chain allows you to do certain stuff with that thing. But I couldn't really figure out, I couldn't figure out, well, what's the problem that I actually have? What's the MVP here? And so fast forward, really, this is maybe a week ago, and I actually have some designs for it. So if I run out of time, I'll just show you what I ended up designing. But about a week ago, I was thinking about, okay, I'm raising additional money for Gumroad, and part of what I want to do as part of that is sell some secondary stock, which basically means the company is not issuing new shares to give it to people. It's me and other holders of existing stock that are going to sell it as part of this transaction or soon after for liquidity. And over time, I want to make that extrapolating the future, you have a public company, people can buy and sell however they want, but before that, you have restrictions and there's no easy way to do that. And then I had this epiphany moment, which was, what if I took all those 3 ideas and said, well, what if I built a service that, one, allows people to get verified on-chain, two, allows people like me to list stock effectively on a marketplace platform. And again, remember what I said, multiplayer, single player, so we'll revisit that in a second. And then people can effectively, just like any marketplace, OpenSea, whatever, they can only participate if they have an accredited NFT that states that because the SEC mandates that. But if they are, then they can effectively participate in this marketplace and buy sell, quote unquote, this sort of common stock in Gumroad and potentially other companies in the future. I have no idea if that's actually possible, but I'm going to build it. Probably, I would say I'm pretty busy until June or so with stuff, but maybe in June or so, I would love to spend a month or so and build it out. But yeah, anyway, that was my idea. I was like, what if I built a marketplace, but oh, marketplace is bad. So screw marketplace, just one company, just Gumroad, just build a portal or some page. We know at least that there's a URL. So some website that allows people to list these shares and buy them. And because I'm the one listing them and it's only Gumroad, I don't even have to build any of the listing functionality. So all I really have to do It's figure out the sort of the buying sort of UX basically. And the accreditation stuff, I already have this thing. So I'm pretty confident I can kind of figure that out. So that's what I did. I started thinking about that and I came up with this memo, which is not really even a memo. It's like even less than that. I did design a brief thing, so I'll redesign something new. I'm going to delete this so I don't remember what it looked like. Then this is basically just a list of things. I thought, okay, what are you going to have to do? Well, you're going to have to list an NFT. Let's not worry about that for now, because again, this can be totally manual. I can just hack the first version of that. But what I can focus on is just these two parts. Right. Which is literally just like, that's really the functionality that I want to design today. And as I say in the book, there's sort of two things that, you know, websites are, right? There's forms and lists, right? This is like the form, right? This is, this is the form, all of this stuff. And then this is the, like the actual listing, right? And so really all we're going to be designing is a pretty simple thing, which is just list of, of things that you can buy, right? Like nothing too crazy. And actually people should fork this and can totally customize it for whatever their needs are. So anyway, that's the kind of context of what I, what I plan to design with this color scheme that I've chosen for some reason, just to make it tough for myself. Awesome. So hopefully everyone has this. I'm gonna take a 1-minute break and just hope that everyone is opening up Figma, has it open. You can either download the app, you can go to figma.com and use the web, web app, but you can create a file and have a file open. Julie, do you have a file open?

I do have a file open.

Oh, sweet. Nice. Yes. Awesome. Well, if you do, that means everyone does.

Well, if you wanna give everyone like 2 minutes to use the bathroom, open Figma.

Okay. Yeah.

We can pretend that they had it open all this time. They have their account already set up. We're gonna just let everyone save face. Awesome. So 2 minutes, we'll be back at like 10:15 or whatever 15.

Oh, I forgot one thing, which is my secret for coming up with cool logo designs.

And you didn't mention fonts either.

Oh, fonts, fonts. All right, we'll do that now. We'll design a logo. We gotta have a logo anyway. Um, all right, we got 1 minute. I don't want to get ahead of myself.

It's the biggest challenge, you— it's 1 minute to design this font, this logo. 60-second logos.

All right, I'll assume people are headed back, and I'll say Ignore the fact that I have the Pirate Bay in my history. I never torrent anything ever. I love this website, thenounproject.com. This is literally, if I'm designing a new product, any product, I go here. So highly recommend thenounproject.com. And what I do is I basically, it's kind of like the thesaurus, to be honest. It's like a, almost like a visual thesaurus. I would literally do the same thing I did. You know, I've kind of searched words and terms that relate, you know, flexible. I'm certain I've done that. I mean, that probably even autofilled it. Yeah. So you can see that I've proof I've done it. Literally like, and this, this sometimes I'll do super early, even before writing the memo sometimes, because like maybe they've thought about it in a different way. You know, they helps me clarify some sort of thinking. So I love doing this. Be careful. This can get addicting. You can do this forever. There's 800 icons that represent sort of flexible, right? But you know, I would do the same thing here. I'd be like, okay, well clearly, you know, verification letters, like this is a pretty obvious one. It's kind of what I ended up using was one of these. I think it was this one. But you know, you can just go through and, and you can even kind of like learn stuff like, oh, shield. That's like a kind of an interesting metaphor for verify that, you know, I wouldn't use on Twitter, but like I can see a shield making sense for like a different kind of use case, right? Like obviously virus. Verified virus-free, right? You probably want a shield, right? And I would just go through here and I literally just pick one. So let's pick one. What's a cool one? Verified. I want to build kind of like a marketplace. So if there's anything related to stock purchasing, I probably don't want to do this up into the right one, cuz that's a bit too not financial advice. Oh, you know, another thing I like to do is find like hidden messages. Like this is kind of like a check mark almost embedded, like a verified check mark. So that's kind of interesting. Also, I think about the first letter of the company name. In this case would be Accredited. V is kind of a V. If it was verification letters, this might work pretty well. So sometimes it works, sometimes it doesn't. But basically I would just keep doing this. And this, obviously, if I was not here talking to you, I might do this for like 30 minutes or an hour. I might just do this until something is interesting to me.

There was a checklist in the one in the group before this one. No, the before you typed in stock, the— if you could, yeah, go back. Let's see this one.

Exactly. This one. Yeah, awesome. Let's do it. And what happens is you— what, one, you can copy it. Oh, I need— why don't I have an account? I'm sure I have an account.

Weird.

All right, let's create one. It's weird that it doesn't autofill. Maybe they got a new domain or something. I agree to the term. Oh my gosh. Yes, I'm great at being human. Awesome. And you hit get this icon. Oh yeah, they really did change this. For, for the premise of this, we'll just do a download and then you can download a PNG or an SVG. Download the SVG. Uh, and the reason is an SVG is vector, so it's not pixels like dot by dot. Uh, instead It is an SVG, which means if you open it in like a browser, effectively it's like infinitely big, right? Because it's math. And what you can do is you can go to Figma and take that SVG and just drop it in and boom, now you have your logo. And if you paid attention, you notice I did the free one. So there's There's some stuff you gotta do here, but you can do stuff like that. And you can pay for it and then it comes with some rights that you get if you pay for it, et cetera. And it's super cheap, $3, right? So that is the logo. Is it the best logo on planet Earth? No, no offense, Julie, but it is good enough. Like, and you know, if I want to just take this part, I could just go in here and delete, you know, double-click and then just delete it. So I can just keep the part that I like, or right, or whatever. Or, you know, you could go in here and you can like reverse it or make it upside down or whatever. So that's often what I do to make it more unique is I kind of like start with their, you know, great artist steal, and then you can like, you know, or you want to do like two, you know, it's like a face. Right. This can be your— there you go. Boom. It's my logo, right? This is like a Web3 logo. They always have these like weird, weird looking things. So yeah, anyway, that's, that's, that's what I do. And then we wanna talk about fonts. I don't know why this started at 4%, so everything is distorted. Let me find my original stuff. All right, super big, not a problem. Let me just take it all and make it— actually, let me just I don't know why that happened. Why did it get so damn big? There you go. That's more reasonable. And then let me just start again with these massive things. Put this here, delete this guy, delete this, delete these random little thingies. And then boom, you got your logo. Cool. And fonts, obviously we need a name. So in this case, it's called accredited.xyz. This is a good sort of thing to point out. If you have the .com, you don't really need to do that. If you don't, you kind of do. You know, when you have a, when you have a domain that isn't a .com, it's like, that is your name, you know, you just kind of have to say it all the time. So that's just something to keep in mind. Um, so yeah, what I do is I literally do— I always do kind of like 64 or 100, and then boom, that's my logo. I now have a logo. So normally in a domain, you could probably like, you know, you could say like, you know, this is like saying my name is You know, the company name is accredited.xyz. This is like, this is like saying the company's accredited, but just so you know, it's .xyz, right? So there's a lot you can kind of play with in terms of sort of information hierarchy, right? In terms of size, color, boldness, where you put it on the page. This is kind of like painting. It's not, it's not too different. Maybe that's why I like it. And then fonts, the really, there's a kind of two kinds of fonts. There's like sans-serif and serif. Serifs refer to like things at the end of fonts, end of letters, right? So like these little things are serif and sans means not or without. So, you know, Helvetica, for example, is sans-serif, right? Or even better, Helvetica New. You know, has this kind of New York subway style, right? And I probably don't need to explain to everybody, but there's just like the name, just like everything else we've been talking about, the amount of things that are connoted is immense, right? Like if you pitch a new modern startup, you kind of know that you're probably gonna use a font that's closer to like what's on gumroad.com. Right. Mayberry is the name of the font. And if you're building like, I don't know, vanguard.com, like you're probably gonna make a bunch of different decisions, right? It's actually funny cuz what I've noticed is like they've started to make more modern decisions cuz mod sort of this like modern aesthetic has kind of pervaded everything. But if you wanted a more kind of old school look, like the New York Times, let's say, you know, you end up with sort of this serif looking thing. There are other things to consider, like I would say old versus new, or like who you're targeting, your demographic or whatever. But the simple thing is I always try to pick, like, you know, generally what I build, it's sans serif. And what I almost always do is Helvetica Neue Bold. For something like if I'm building a new thing in Web3 or something, I literally would just go here. This is another thing I like to do for hours and just do this. And you can almost see the businesses like emerge. I, at least I feel like I can. It's like, I don't know why these aren't showing up. Oh yeah, I kind of like this. That's kind of cool. Also, sometimes depending on the letters, you know, some things will look more interesting. Like for example, we have this double C. Which might look weird in certain fonts. This kind of works. It's kind of like a stamp, you know? So it kind of connotes that. And yeah, you could literally do this forever, but let's go with this stamp one just for fun. Also, you can do lowercase, or I guess in this case there's not lowercase. It's just the stamp. So I'm not going to use it. It's too aggressive for me. I like rounded too sometimes. I like this one. I'll go with this one. That, that, that, that to me sparks the right balance between professional and playful or irreverent. So let's go with that. We picked this terrible color scheme, so we're stuck with that. So the next thing you wanna do is you want to create the, you actually want to design the thing. You basically, I mean, you basically have your logo, so let's, let's put that in a frame. So frames are kind of like sections on Figma. Create a frame that'll show up on the left, and we can just call this logo. We'll take this, and the way you select multiple, you just hold Command, you click the ones. I think this is it. Those are— that's the logo that we're stuck with now. Let's just group them and create a logo. That means when you move, they move together. Put that in logo. It's going to be hidden because it's no longer in that frame. Why would you do this? Just because, you know, Sometimes weird things happen where things will copy their parent. So you have to like go in here and lock it. And that should work. Nope. Weird. Lock. Let's see if this works. What the hell? Sometimes I even can't figure out Figma. Actually, sometimes what I'll do is I'll just shrink This is one thing about working in the browser this way is it does sometimes does weird stuff like this. All right, nevermind. I don't know why this is not working. Now what I do is I just delete it and then I paste it back in. Whatever worked. Um, again, doesn't matter if you did it the right way. If it works, it works. Normally there's not a video recording all your mistakes. Uh, awesome. Now you have the logo and the other cool thing you can do with Figma, uh, is you can create components. Um, So I, what I would do is create a component, which, you know, right-click the, the, the specifically this one, the, the actual box, you know, the dotted box. So not this whole frame, just the logo in the frame, and then do create component. That'll make this purple and do this like 3 or sorry, 4 diamond dot thing. And basically what it means is if you copy it, Let's say you create another frame, right? You put it next to the logo frame. You say this is like the homepage, right? Which this is literally like what we're designing, right? We ideally, it's like one page. Almost everything we design should be one, maybe two pages. Because you have your list, as I mentioned, and then you might have your like list item, right? So this is like many, and this is like your focus, like focus on one, right? So this is like your tweet view. And this is really like all you need to design in my mind is like the list and the list item. And then that's enough to kind of, to, to do, uh, to kind of showcase what you're trying to build. And the reason to do this is because then when you take your logo and you paste in here and let's say you have, so let me do this, right? So this is your homepage and let me say this is your like focus or something like that. Um, and we wanna put this in the corner of both. Put that in the corner. Put that in the corner. Let's say I wanted to change this logo. Let's say I wanted to make it purple. When I make it purple, it'll make it purple everywhere. Awesome. Right? So that's like components. That's like the first cool thing about Figma that makes your life awesome. The next thing I do is I make a list of all the things that need to be on this page. Obviously, I always start with the logo because you kind of always need a logo. But if you go back to, to, to thing, I kind of made a list. This is kind of, and often this is what I would do, by the way, is I'd literally take the memo and I just paste it. Into Figma. So I'd literally just take this and I say, okay, every NFT or every like item of stock needs these, you know, roughly these. Let's assume all of them, even though we don't need all of them probably. So I'll just put, put 'em here as like my reminder. I'll shrink it so it doesn't take up my whole life. And then boom. Actually, you know what? I'm not even gonna do this. This is gonna be like Gumroad, Gumroad listing. So this won't even be like the homepage. This will look again, that doesn't even exist, right? I'm just building like what Gumroad's interpretation would be. So let's take this, move it over here so I can see it. Let's make the background something. An easy way to add some personality is to take risks. With the background. Oh, that's so ugly. Ooh, that's like egg that's been boiled for too long. Oh, I kind of like that. Oh no, I don't know. Ooh, I think I like this light purple. That's pretty aggressive. What's this middle one? That's the egg. Yeah, let's do this. That's pretty aggressive, but We'll go with it. And then, you know, you might need to revisit this. Let's change this to this color. Yeah, it looks kind of nice. I don't know. I feel like, I feel like if someone saw this like on a New York subway ad or something, they'd be like, they had a professional team work on this. Maybe I'm thinking too highly of myself, but we probably did because we like, we didn't design the font. A professional font designer designed the font and we didn't come up with a color scheme. A professional color scheme person probably came up with it, right? We've kind of outsourced this, uh, and the icon, I mean, like literally, uh, this is kind of like open source code. It's like, you know, you almost don't have to do anything. You're just gluing the work of other people together. Um, you could think about, uh, you know, changing this to lowercase if you wanted to or something like that to make it like more friendly. Um, but I like, I think this is, should be professional. Um, And yeah, so anyway, cool. And now we need to design the actual ListView. And I know I'm running outta time as I always do. So, you know what I would do, and let me show you some quick things. This is my favorite thing in the world. You can, you can, they invented this cool way of, of making things bigger. You can go off the screen and keep going. It's like a fun little thing they built. But you know, I always pick like, you know, boring Like this is kind of like the serif, right? It's like the classic, oh, it's like a block, right? This is like unfriendly. It's like serious, like businessman. 10 pixels is kind of like rounded, cool, like hip, hip uncle. You know, if you're building something like really fun for kids, you want like 50, right? Like super like easy to kind of start to narrow down on the demographic. Like we talked about like the number one user, who is your first user? Why does that matter? Here you are communicating who your first user is. You cannot not do that. You will do it because most people look at this, they're like, what the hell are you designing? It looks like a taxi cab. But a few people might be like, wow, this is exactly what I want. So you will do this as you go from memo to building. You will start to, you know, this is the scary part because you go from that foggy image to like what this actually is. But you will start to make these decisions and it's so awesome because it feels so much more real cuz every hard decision you make to, you know, clarify the vision, the more real it gets. So I'm gonna go like, it's kind of fun, but you know, it's still serious. You're still, you know, doing stock. I like white backgrounds cuz of the contrast. And I like, I always do this, this is like a signature of mine, but I like box shadows. The way you add a box shadow is effects. You hit the plus, drop shadow, you hit this little sun. You can change the X position, which I normally keep at zero. The Y, which is, you know, how far away it is, right? Which is usually like, let's say 10, the blur, which you can kind of see there as well. Generally you want something realistic, right? Generally if something is hovering, then you know, the shadow is coming below and there's some, some blur. But this is kind of, honestly, this is kind of like where the eyeball comes in, where it just starts to look good and certain things just look good. And then you can mess around with the color, like if you want it to be white. In this case, it's a drop shadow, so you want it to be dark. And then this is the opacity, right? So something like 10% is probably enough to communicate that this thing is kind of off the background. And the reason I always kind of do stuff like this is just because it's like, where do you want the person to look? Well, you want to— if you imagine like a painting, like what's in the foreground? What's closest to the to the reader. Uh, and boom, we already have this list. So what I will do is I will take this, I will make this a group, I will call it listing. And then what I will do is I will turn it into a component even before I really need one, and I will duplicate it. The way I duplicate it is I hit Apple D, then I select both of them and I hit Apple G, which puts it in a group. So there's two on top of each other right now. And then I will move this second one down. So I have a group with these two, and then I go to the group, and this is the last really, really cool— and I also, I also wanna show prototyping. Um, and I'll show you my final design. Oh no, I deleted it. Crap. I'll try to get it back. Um, but basically, uh, auto layout. So go to the right and you'll see auto layout. You hit the plus and it just knows, oh, you have a, uh, I don't know how, but it knows that you have a a folder, a group full of 2 images or 2, you know, other groups, uh, that are vertical, vertically aligned, and they have a 78-pixel difference. And so it just knows that and it says, okay, cool. And then now if I— let's say I had one more of these, boom, I just duplicate it and it automatically does that. Boom. I can just keep doing it just like a real website, just like HTML. Amazing, amazing stuff. Uh, and if I wanted to change the, the widths between them, boom, I can do that here too. Super useful because if you're— once you go to code, you want this because you want to say padding margin 50, boom, right? Uh, so pretty, pretty cool stuff in my opinion. Um, awesome. So there's that. And then I'll go to the first one, I will take this and I will move it inside, and boom, it's going to get duplicated to all of them. And so now I can design one And it kind of designs all of them, right? So you probably want something like total value or number of shares, value company, seller, let's say, right? And then you want— and this is kind of a table. So these will be less bold over time. I'm going to do that and say Well, the number of shares is 10,000. The value of the company is $100 million. The seller is Sahil Lavingia. Probably want my full name there. And then because these are less important, these are like labels. Ooh, I'm going to take one of these ugly colors and I'll just use that for now. I'll unbold it. Oh, this doesn't even have an unbold version. So maybe I'll switch to Helvetica Neue and I'll make it go medium. Or often what I like to do is I like to use like different fonts. So if I did a serif, I might use a sans serif to kind of make it more interesting. I like Courier, kind of communicates the kind of like, you know, stock back in the day was like on paper, printed out sheets, whatever. And then I have the labels and then I have number of shares, or I wanna move these all at the same time. And then I can probably move this over here. And then again, if I resize the height of these, it'll all update nicely, right? So it starts to get pretty darn cool. Uh, and then finally, let's do the focus area, right? So the focus area, the fill is going to be this color over here. Now, for some reason, the colors didn't propagate, so I would have to take this. I basically just replace I don't know why this is— this didn't properly inherit for some reason. So I'll just change this manually and fix that later. Take this, put it here. The focus element is basically just going to be this except big and just maybe to have a big button in there that like to confer buy or something like that, let's just say. Or make bid or something like that. So just a really ugly example. Boom. It won't be as ugly as I say. Actually, one nice thing is once you get good, it doesn't— time is not really what makes things ugly or beautiful. But I'll make bid, right? Something like that. This is not what I will ship.. But again, this is the vomit draft of design. Once you have, you can always make things better. Okay, cool. So now we have that. We have like a super, super rough MVP design. We can always, uh, add stuff, make it better. If you wanted to add a new thing, you just duplicate this. You know, you can have like, I don't know, uh, history or something like that under it. You could go forever, right? Um, you know, Bid history or something like that. Right. And then you could have like a list of, of a bar, you know, blah, blah, blah. Right. Forever. And then finally, the thing that I really think is really cool and important is to make it interactive. And this is like, again, like this is like the moonshot of Figma, right? This is their moonshot, which is what happens when you build everything out in the browser. Well, it's all interactive. And so building interactivity into this thing turning it into just an image, from just an image to an interactable prototype, uh, much easier than you think. Uh, and so let's do that. The way you do that is you hit Prototype over here, you hit plus in the interactions, and then boom, you have Click None. So what I do is I'm going to select this one, right, which you can just to double check. Actually, this is kind of fun because, because it's using auto layout, it's kind of confusing because even if you're hiding the ones, they auto rearrange so you don't notice. Um, but anyway, you hit plus, right? Make sure you're on the one you hit. Okay, it's auto-selected to click, but you could change this to like on drag or while hovering or whatever, but generally click is kind of the primary interaction. And then you just say navigate to, and then, you know, I guess I created two focuses, but this one, right? And you'll get like a nice handy-dandy arrow that will go away if you go back to design, but you'll see it here, right? Which basically says, um, You know, uh, on click of this, show this, right? Um, and let's say I had, you know, another button here that said like, you know, uh, view bit history or something like that. And I made it smaller. Uh, you know, you could do the same thing. You could basically just take this rectangle, you go to Prototype, you hit this, you go click and you say navigate to, uh, whatever the— oh yeah, because this is now focus, because this should be listing page. Uh, no, bid history, right? Boom. And now you just hit the play button and it'll just work. Uh, just kidding, it won't work because I want to select this one by default. Now I hit play. Boom. This is too big for some reason, so let's fit it to the screen. But you can mess around with all that stuff. Boom. You have this. If you don't know what to do, you send this to someone, you're like, or someone sends this to you and you're like, I don't know, just click anywhere and it'll tell you what you can click. But effectively it's just an image, right? Just like a, just like an image would be. But now you can click this and boom, it does the thing. It redirects you to that other page. It shows you what you can do here. You click that, boom, takes you to the bid history. Click that, takes you back here, right? You can hook it up so that the logo, you know, always— and because it's a component, you can kind of get clever. It should be a component anyway. I don't know why these aren't honoring that, but you could— I think what you could do is you could say this takes me to the Gumroad listing page. And ideally, because these are all components, And let's test this and make sure this is happening. If not, I have to bug to debug. Okay. Yeah, these aren't clicking. So yeah, I don't know why that's not working, but anyways, what you could do is you should, you can always just do this manually, not the end of the world, but just do that. Boom. And you have very quickly, you know, effectively like a real, I mean, for all intents and purposes, like the data's fake. Um, but it can feel very, very, very real. Um, to a point where like many people will think that you built the thing when you send it to them. Uh, I know this because people tell me this all the time. Um, but it's not built. It's just that I've taken it and making it interactive and it's pretty awesome in my opinion. So that is all you really need. Obviously there's like so much more you can go and you can spend all your time like deep diving into all this kind of stuff. But let me show you like what an example, like Figma prototype, like to its extreme may look like, or not even to its extreme, cuz I'm sure people get even crazier. But if you go to, I believe this one, let's see if this works and hit play. If, yeah, boom. So this is Flexile, right? So I could share a memo and I would, Plan to do that, but I find that it would be so much better if I'm showing, let's say I found a friend of mine. I'm like, okay, look, this is how it's gonna look like if you used Flexile. Uh, your contractor, your new contractor gets an email. They get this, uh, they have this button, right? They click the button, they get taken to this page. You can tell my designer has a bigger screen than I do. Um, they get taken to this page. They can fill this out. They can say they're a business or they can say they're an individual. They can continue, they can fill out all this stuff, they can continue that, it generates the contract, they can sign, add their signature, they can insert their signature, it shows them, they can review all this stuff, they can agree and sign, download the stuff, set up the bank details, save, start doing invoice tracking, generate an invoice, et cetera. That is pretty, in my mind, pretty cool. Like to go from, hey, I have an idea, like flexible, you know, the operating system for flexible work to like, look at it. This is, this is it. I think it's pretty awesome. So anyway, that was everything that I know basically about design. I know it was a little different than the last two weeks, but hopefully it was helpful to people. I would be curious what people think. Julie, what do you think? What do others think? Do people have questions? Can you now— do you now believe you could do anything you want in Figma? The truth is, and this is kind of crazy, uh, you can basically like, that's it. I mean, like anything else that's more complicated than that is just what I'm doing, but more of it, right? Like more components. You can do clever things. Like you can say, oh, if this component is, you know, has this text, make it automatically red or something like that. Right. You can do more stuff. But the cool thing is once you have the base, You just Google that. I mean, just Google like make, you know, Figma make button red if text, whatever. Right. And like, you'll start one once you know where things are and you start to see how things come together. But really like that Flexile thing is just that, just more stuff, right? Just more screens, more back and forths, you know, more, you can do stuff like, you know, on hover, show this state, right? Like you can get more clever. And honestly, what I, what I imagine Like 10 years from now, that will be flexible. Like I will not have to take the design prototype and then build it. Like Figma will basically allow me to do things like, I get, I'm guessing, I don't actually know, but I hope, I hope I should say, I hope that when you hit this button, go hit this function with the text that's in the thing and boom, like you can have like Figma start, you can start to kind of like build real apps in Figma, which is going to be like, It's mind-boggling.

What I really think is that I'll have a hard time ever seeing Accredited as anything other than yellow and purple now.

Yeah.

Even though that's— even though, I mean, I think it's interesting that sort of the initial, this is the vomit draft, it's not gonna last. And now I'm like, well, yellow and purple.

Well, you know, there's the Bob Ross happy accidents thing, right? Which I really believe, like one reason I love the idea of vomit is because most of your ideas are are like, most of the stuff you vomit out is going to be not great. You're gonna delete it. You're gonna change it over time. But every once in a while, it's like something is just, you never would have like presented is really interesting, you know? And it's like, hmm, I kind of wanna explore that much more than I would have otherwise. Even sometimes like when I'm going through those fonts, right? It's like, oh, what? Like, and like, it's kind of jarring sometimes. And it's like, oh, that's kind of interesting. Or even like sometimes I'll just see a weird shape and I'll like screenshot it and then I'll like, turn into a logo or something like that. And so creating opportunities for that surface area of serendipity, I think, is just so important.

There are tons of questions. Anurag, you want to start with your question and then we can jump from there?

Yeah, I was just saying that, you know, maybe it's probably— is it a good idea to start with templates? Do you usually do that? Like, while you've been doing it, like, you know, I've been making something with email and I've actually found a an email template already there, like an email inbox template already there. So do you, do you, do you use those? Do you recommend that or like start from scratch?

I normally start from scratch. I, and I think if you're like learning and stuff, like I do think it might be good to build something from scratch and like at least the skeleton and then populate it with templates and other things. I do think, for example, if you're building like an iOS app, right? And I'm sure Julie is like an expert on all of this stuff. So feel free to chime in if you want, Julie. But yeah, there's like, there's tons and tons of stuff in the community and infinite amount of components that you can use. And like, if you're designing an iPhone app, like you probably don't wanna design like all the, you know, all the stuff Apple has effectively designed already. Right. And one of the fun things about kind of where we're going, you know, on, on the, on mobile is like You don't have to design. You just have to like take all the components that Apple and Google have agreed upon and just like organize them. Obviously there's a little bit more to design than that. But you do get a lot of that stuff for free. I think in that case, that components can be really, really helpful in templates. But I think you don't wanna— the danger is like, you wanna understand what's Figma and what's the temp, you know, like what are you getting for free? What's— cuz otherwise, like the problem I have with the magic stuff is like, let's say something breaks. Like for example, when I was like resizing that thing, I was like, what the— I don't know what Like, I don't know, like I just have to kind of start from scratch. And so sometimes it's kind of nice to know like what, you know, the lower level, even though you might not use it all the time. But yeah, I honestly personally don't use templates. Just like I don't use CSS frameworks. Like I just start from scratch. Like I just think it's faster and easier just to kind of start from scratch. Like, you know, like that accredit, like the stuff I build is so simple in the beginning that it just like, it's like not even worth it.

So yeah, I think it feels simple to you. I think as a non-designer, I will say it doesn't always feel simple to non-designers. On the other hand, one of the things I, one of the things I really like about the weekend project is how many times per hour you stopped to, to Google, how do I do XYZ?

Oh yeah.

And I think that that's hugely—

yeah, it's like one of those things where it's like I don't know if it's good for people to know that, like, you know what Kanye West does all day? He answers email and Google stuff. Like every person at the top of the game, Elon Musk answers emails and Google stuff. Like that's it. Like that's life. And it's like the more successful you get because I mean, otherwise, like it's either you're Googling or the answer's in your head, which is like, cannot be in your head. I mean, unless you're willing to memorize just like in, you know, a ton of stuff. Right. I'm constantly— I was actually surprised that I didn't Google as much as I needed to as part of that. Definitely with code, I will be Googling a lot more.

Tushar, you have your hand up.

It's kind of a meta question. What percentage of entrepreneurship is like just doing stuff over and over and then connecting from nothing to selling something and just repeating that, like each part of the process multiple times and then the whole process? And just using patterns that like keep repeating in some ways.

I mean, I think ultimately entrepreneurship is just, oh, did my camera just disappear? Oh no, I just changed positions. I mean, ultimately it's just building a product, selling that product and then paying taxes, right? That's like all the business, a business really does. So beyond that, like, you know, whatever process, like, It's, it's why I said earlier that like mental models, I'm, I'm a little like worried about mental models sometimes because like they don't, they kind of almost like oversimplify, but also at the same time overcomplicate, you know, like it's just kind of like any hack to get you to do the, the, the stuff is, is helpful because ultimately it's just building something and then, you know, the act of selling it. The other, yeah. The other, the other thing that I think would be critical as part of the design phase is sending whatever you come up with, put it in the Slack, of course. Um, but then also like send it to people. Like, you know, if, if you've built a prototype, like it should be sendable, right? Like you are building this to send to other people. It's not just purely for yourself. Um, and so you will get feedback and like, if you've ever seen anything that I've designed, uh, whether that's gumroad.com or anything else that I've designed, I think it's decent. Like I would say I'm a decent designer. I could probably get a job as a designer at a startup or something. But like, it's the same. I mean, like, I don't know. I look at a credit XYZ, I think it's like terrible. Right. But like, what makes, what's the difference? The difference is like, one, I probably spend a little bit more time, but then two, I send it to people. They give me feedback. I implement all their feedback and I don't give them any credit. You know, like it's the beauty of it. You know, like you just send it to people that give you awesome customer feedback. You improve it and then you just, just like the memo, right? It's like not that different. Like, just like when you, when you read a memo, that's really, really darn good. Like from some, I don't know, some famous person or whatever. You're not reading their first draft, right? Like they're not just like, like Bezos isn't just like, this year Amazon just killed it. Right? No. Like he has a team of people. He probably wrote it 3 months ago, sends it to people, feedback, send feedback. You know, like there's like tons and tons of of stuff. Same thing with design, right? Like, you'll start off with something pretty weak, but it'll have— as long, you know, that's why that list is so important. You should get everything there, even if it's ugly. Get every feature on there, uh, and then you can always delete, you, you know, you can always improve, you can always make things better. But I think it is important to, like, get something, you know, get something there.

Uh, Sid, I think, is next, and then Julie.

Yeah, thanks for the lecture. So is one way to— I'm trying to understand your thinking behind the process. So, uh, I mean, you've just made all these decisions on font, color, and all really in a split of a second, uh, in like half an hour. Um, so my question is, I guess, how much does the design really affect Is it— is your thinking that it's not about getting extremely good design but avoiding bad design? Because a very badly designed thing will probably put off the user, but something which is— you don't need— there's no difference between a reasonably decent design and an extremely good design at this stage, at least because you're just trying to validate things and it doesn't make— it's not worth it to satisfy— satisfying is enough. You shouldn't try to max optimize design at this stage. And then, um, so you should— you're trying to avoid bad design rather than go for extremely good design. Is that, uh, can I say— is that fair to say?

Or— yeah, I would, I would say so. Yeah. I mean, ultimately, like, imagine like the first draft of a novel. Your goal is to just like avoid plot holes or like avoid obviously broken things, right? Like, there will be things where you're like Don't ignore that. Or like, yeah, it's a little weird. This doesn't make sense, but it's not core. But at least the core blocks of the plot or the story or whatever are there. And so yeah, I would say basically, and it's law of diminishing marginal returns where you want to get it. The issue that— and you'll learn because the feedback you'll get will make it pretty clear, I think. But basically what you don't want to— imagine you send someone a draft of an essay with typos. In it, you're never going to get any useful feedback on the essay, right? Unless that you're sending it to someone who like knows and writes their own essays and knows what you really, really want. Most people see that and they're like, hey, you misspelled this thing, right? And you're like, no, that's not what I want, ignore that, I don't— I can fix that later. No, you should fix that now because otherwise every single person, that's all they see. Like, that's, that's all the feedback you're gonna get. So really, it's the way that I like to think about it is just like, you just, you want, you just want the quality of feedback to be good good enough that you can improve at a certain rate. And so as long as you're getting rid of the obvious stuff, I think that's enough. I think as long as you're getting feedback on the idea, they're almost able to see through the design and through the memo to the idea. And it's like this weird— you don't want them to get stuck on like, it's too blue or it's too— Great. Like you wanna avoid that kind of stuff. And then that's often why I kind of go with like Helvetica and like black and white sometimes and like simple fonts is cuz, and you know, like less is more, right? There's just less for them to get, you know, like to your point, avoiding bad design, right? Well, how do you avoid bad design? You just have less design, less opportunities for bad, right? And so yeah, I often start there, right? Or if I was designing like a blog, I'd be like, okay, what are the 4 things a blog post blog page needs is like text, header, timestamp, author image, right? There's like 5, it's kind of crazy. Like the, it's like pretty simple. Like the stuff that generally you're building is like not too crazy where you can kind of design a lot of it in like a couple hours. Even Twitter, like you go to twitter.com, you probably just, and by the way, if you, if you want practice with Figma and you don't have your own idea and you, or, or you just really want to practice Figma, Like take a screenshot of twitter.com and then like rebuild it in Figma, you know, right next to it. Like, you know, try to make it pixel perfect. And you'll be forced to learn like all sorts of stuff. Right. And also not only will you be forced to learn, you'll actually learn, you'll start to understand why they made certain decisions, which is super key. Right. Like, just like to your point, you're like, why did you pick this font? You're like making all these split-second decisions. And definitely maybe go back and like slow down and like, there may be hints of, but like Ultimately, like as you copy, you're like, oh, I didn't realize like the reason he went from using the gray for XYZ to like the green in the color palette is because of like, you know, one, to honor the color palette, but two, to like make sure that every color is saturated. Cuz life is full of saturation. Like there is almost no unsaturated color. Even the shadows are like purple. You just don't notice it cuz you don't stare at it long enough. You know, and try to paint it and realize what the hell, why does it look dead? Right.

But, so if I'm trying to, if I'm trying to do the assignment for this week and trying to make my own prototype, would you advise people to copy, maybe not use templates, but copy, like choose something you like and yeah.

I mean, just, just like, just like we went from, you know, kind of like the kind of like, this is an existing business. Can you build it for a different vertical? Draw the arrow to right or left or whatever. I think so many people worry, oh, it's like plagiarism, right? It's drilled into your head as a kid, don't plagiarize, don't plagiarize, don't plagiarize. One, you can plagiarize. Plagiarism is not actually illegal. It's like a school concept. You can't go to jail for that, right? There's patent infringement, there's copyright, there's other things, but there are words for those that aren't plagiarism. And design is obviously much harder to plagiarize. There's not words that you can copy paste as clearly. But yeah, definitely copy and you will be unique. Like even if you try to copy perfectly, you will be unique because you will, again, like you will be wrong and your wrongness is gonna, is what's gonna make your thing interesting. Like you'll use the wrong roundedness or like whatever. And like the subtle things will lead to a totally different kind of design aesthetic. So yeah, what I would do kind of for this week is to take your memo and basically try to design the core. Just to answer Gary's question quickly also before we get to Julie as well, like he said, you know, do you focus on the homepage first or the product internal pages? Generally I would start, and this gets like, I would, if this trips you up, ignore my, ignore what I'm about to say, but Start with the noun and work outward. So start at the core concept, the noun meaning, if you're building Twitter, the tweet, if you're building Pinterest, the pin, right? What is the core noun object of your thing? And then work outward from that. The reason is that's really, as I mentioned, everything else is a form or a list, right? So the only unique, if you look at accredited.xyz, the only unique thing really about that is going to be the design of the card of the listing stock, right? Everything else is going to be like buy button, this, that, whatever, login settings. That's all easy. That's all— once you have product-market fit, you can hire a designer and they can make it all amazing. But what's really core and unique to you is the now, right? When I worked on Turntable.fm, it was the room. When I worked at Pinterest, it was the pin board actually. The offset grid pinboard. And you know, Airbnb might be the listing, right? Like figure out what that thing is for you. But you probably have like a single thing that generally is the, you know, 80% of the design, right? Like almost, you know, like for Twitter, right? It's like the tweet, right? Basically. That's most of it. Yeah. Julie.

Yeah, my question is, what do you think about just using an open source design system like Ant or Material for the MVP and just reskinning the color palette for the components versus doing what you did and just creating your components through scratch serendipitously, which may have their own kind of style?

Yeah, I mean, I think— I think it's kind of personal preference. I think using those sort of frameworks and tools are great. I just have not. I think it is something that basically, I think it's kind of a, you have to kind of be committed to it, right? Because like, I think it's kind of a bundled thing you're signing up for, which is you're signing up for not only the the visual look, but then also potentially like the HTML and the CSS and the structure. And you're also signing up for not only the way the button looks, but what happens when the button is loading and like part of a form. And so as long as you're okay saying like, I'm basically, you know, I'm basically designing like the layout, but then anything within the layout is going to be designed by Google or whatever, then I think it's fine. And of course you, you can reskin kind of like the overall colors and stuff. And that's kind of where that, where the web, a lot of the web seems to be headed anyway, where like things will kind of get standardized and commodified anyway. Like Vanguard looks like a freaking startup website now. But yeah, my preference mostly is it's just, it's just kind of like what I was saying to Anurag was just like, you wanna know what, what is Figma and what is the template, right? Like you wanna just, I think it's helpful to kind of Have the confidence to know that you could do everything from scratch and then choose to do stuff, you know, like choose to say, oh, for the buttons, I'm gonna use this library, or I'm gonna copy paste the CSS. And I do that all the time, right? I'm like, for example, for Web3, I needed like a pulsing icon or whatever, a pulsing button. And so I just Googled like pulsing CSS and then, you know, I literally copy pasted it. I was like, ah, that's kind of weird. Copy paste another one. It's kind of weird. Copy paste another one. Oh, kind of like that. Tweak, tweak the numbers and then was done, you know? But I think if I was using a system, I might not even be able to do that because there's all these things that are competing and overriding. And that's the other thing is like when you are Googling, which is most of what I do, I feel like then you sometimes using a framework really hurts because then you Google and it's like, just change this line from this to that. And you're like, I don't There's no line because I'm using, you know, it's like 5 layers of abstraction at this point cuz Google needs this crazy thing and like, I don't, right? So that's the downside to it. Like the magic is magic, but when it breaks, you're like, you need to call a magician, you know? And yeah, they're expensive. Yeah.

11:03. For me.

Oh, wow.

Amazing. Yeah. But tell, like, what's the, what's, what do you hope everyone will come to class with next week?

Yeah. So in the memo, we talked a little bit about, you know, kind of like the first user, like the aha moment, like a lot of stuff we covered. I would say kind of think through your customer journey from when they hit The, let's say the homepage, even if your homepage is literally just like enter button, right? Like, but whatever, what, you know, for, for Lexile was like kind of the email, but like whatever, however they first encounter your product, uh, all the way through to their aha moment, which could be as little as 2 screens, ideally at least 2. So you have the prototype thing. Um, but it could be like 5 or 6 or whatever, but I would guess probably 2 to 4. Um, and just design it. As much as you can. Start with like, you know, even if it's just like wireframing, like box with like Helvetica text, right? Just like start there. I would like lay everything out first. Like I wouldn't worry about components. I would kind of do that once you realize what the components even are. Cuz you, again, it's kind of like the visualization thing. Like once you know and you've done it before, you're like, oh, I'm gonna turn these all into components later. Then you can do it right as you go. But normally you don't know that and you kind of have to like do it all and be like, oh crap, I did this like 4 times. So just be okay with that. And then, you know, like I would just try to get everything down, you know, and then design everything as ugly as possible. Black and white, totally fine. Wireframes, totally fine. Lines, arrows, all fine. And then like make it better and better and better. And then basically just like whatever you end up with, whenever you feel comfortable sharing it, let's say like before office hours on Friday, that's the best thing you have. Right. And the cool thing is you can just keep making it better. Just like every day you can just like chip away at it. And it's really fun. Like that's kind of what I do. Like when I'm, you know, when like, I don't know when I'm not actively working on something, I basically just go into, you know, Flexile Memo and just like try to improve things. That's like how I interface actually, like the design and engineering team, it basically interfaces with me through that Notion document. Like everything, like they don't talk to me. I haven't talked to somebody about it. In months. They just talk, they, you know, and so that's kind of unique to Gumroad because so much of how I run things, but it really forces me to like make that memo like really freaking good, you know? And make the design really good because sometimes they're like, hey, like I designed, you know, the engineer will be like, hey, Carol didn't design this thing that is important. And then it's like, why not? I'm just like, well, oops, I forgot to put it in my thing, right? So like, yeah, it just forces like a, a nice fidelity. And then that link that I shared, that Notion link that you shared out to everybody just gets better. You know, one of the, one thing I love about Notion is I just send out a link to somebody and I'm like, oh crap, I have a typo. I can fix the typo before they click the link. Right. And I can constantly make it better and better and better. It's almost like eventually you just have your website, right? Which is that it's the thing that you improve all the time on feedback. But until you have that, your memo acts as kind of like Almost like your website or your prototype kind of acts like your website.

So should people do what you've done and add a link to their Figma prototypes?

Yeah. Let me show people how to do that really quickly, actually.

Yeah. And then they can just repost their updated memos to Memo.

Yes, exactly. Yeah. You can just use— yeah. Let's keep using the Memo.

Channel. Okay, great.

But yeah, basically if you go invite, you know, if I wanted to share this with somebody manually, or you can just copy the link. And if you go to Notion, I believe that you should be able to, let's say, just go to, you know, anywhere and just hit embed Figma. And if you do that, like magic, it'll just embed. The prototype. And so you'll just have the prototype in line and you can resize it so you can make it bigger. And then, you know, if you imagine you could have like, you know, problem, things are bad, you know, solution, and then boom, you have your like Figma prototype. And I didn't, I didn't link it the right way. I guess I should have done present to load up the prototype and then sh— you know, taken the share link. And copy this. And I believe that that will actually do the proper prototype. Yeah, it looks, looks better already. The spinner in the middle looks more presentational. Yeah. So you can see this, obviously it's not great. Um, but you know, it, it, it works. It's good enough. Um, You can literally do the whole thing in here. And if you wanna see how all of this is done, let me see.

Oh yeah.

And then the other thing, if people can click original, if they wanna get to the original. So yeah. What if you wanna do this, by the way, I think, let me share this crappy file, whatever this, there's not even a memo, but I'll, I'll put this in memos so people can at least go through all this stuff. And if they want, they can, you can, you can figure out how this stuff was actually built. Cuz to be honest, like the secret power that I have at Gumroad is that I basically have an excuse to hire amazing engineers and designers, and then I can just like see how they do stuff and then be like, oh cool, that's how you do it. It's pretty awesome. So now you can do the same thing. So yeah, if you just go to that, it should allow you to go to the file and then mess around with, with all that stuff. And there's stuff in there that I don't even know. I'm sure there's, there's lots of stuff that is pretty crazy and complicated.. But at least it'll give you a sense of like all the crazy stuff that you could potentially do.

And then you can do yours in black and white and not worry about it if you need to.

Exactly. Yeah. There's, there's so much cra— I mean, like, look, let me, let me show, I, I know we're outta time. If anyone wants to bounce, that's totally fine. But like, for example, it's, I'm always like, you know, we have this like status column or whatever, and you can, you know, this is a component called tag. Uh, and then if you're like, I want the color to be this, it just, and the size to be default. Boom. Right? Like, it's just crazy. I mean, like the amount of time it would've taken me to do that, like in Photoshop and like all of them differently would be just crazy. But it's now it's just one thing. And if I wanted to like change all the tags, I just go to the main component, which is a different file called, you know, in the, the design system. Boom. These are all the things. And I could just, you know, I could say this is now red. And every time I, sometimes when I do this, I'm not gonna do this cuz sometimes my design team is like, what the hell were you doing, dude? You messed something up. They're, they're nicer than that. But that's like the pro level because then basically what you do is you have a design system with, and then which designers work on, and then you could even have like, in theory, engineers can basically build new things in Figma. Super easily just using the design system components. Cuz they don't have to think I need to design a button, right? All they have to say is I need a tag that's big and then boom, they have it just like code, right? Like you don't have to say I need a, you know, I'm designing a new page from scratch. You're just like, this is a new page and it has a header because that's all what all pages have, et cetera. So Figma, Figma and Git, like code are like slowly, slowly gonna, you know, one day, one day combine and it's gonna be like, it's gonna be pretty crazy, probably in like 3 years. Um, so yeah, but start now so you can know all these things because honestly, what the, the scary thing is, what I found is like, as these tools get crazier and crazier, it's like actually harder and harder to learn because the magic just becomes so default to the experience of using it that I'm like, I don't even know how to pick this thing up anymore. Cuz like, I don't know, it's like downloading something and you're just like everything there. So like if you learn now, Then you get to learn as Figma adds features, you can be like, oh, that's how you do that. That's how you do that. That's, you know, like actually not even that's how you do that. They're like, oh, they built that. Now I can do that. And then you look, you add it to your own toolkit as you go. And that's one nice thing about using the cutting edge is like they're, they're shipping stuff all the time. Right. Components was like a feature they didn't have 3 years ago. Right. So like now they do, or whenever it was 3 or 4 years ago. And recently they had like auto layout, that feature, which is amazing. I think is only like a couple years old. So like 2 years ago didn't even exist. Right. So if you wanna be a veteran at Figma, learn Figma and then wait like a year and you will be a veteran just inherently. Like you will be probably, you know, you will have been using Figma longer than 50% of the people who are using Figma 3 or 4 years from now. Because if you just calculate the rate of growth, if it's growing 50% a year, that's only 1 year until Boom, you know, or actually 2 years, I guess, until more than the majority of people, you know, who use Figma learn, just started using in the last couple years. And that will always be true for exponentially growing, you know, stuff. So yeah, that like going back to the trend stuff we were talking about, right? Like Figma is a trend just on its own. Right. So just betting on, betting on Figma, betting on Notion. Like I think those are generally pretty Pretty solid, solid bets. Even, even like if you just take— I, I've thought about this and I'm only saying this because we went over, because I'll say that's kind of at the end of the course, but like the simplest thing that you could possibly ever do is take a business in your area and just literally just do it again, but with all the great tools that we now know, you know, like if you just take it and you say, oh, instead of the way that they do stuff with like pen and paper and Photoshop and printing and email and we just do it with Zapier and no-code and Notion and Figma, you literally just go every single business in your— there's 10,000 businesses in Portland, Oregon, 2,000 of them you could do this for and build a better version that's 3 times more efficient. I had a contractor come by my house this morning. To fix some stuff. And the way I found him was I was driving in my car and I saw him with his son, like putting a sign into the ground with his phone number on it, you know, at the intersection near my house. And so I called him and, you know, I'm like, that's, that's happening in 2022. And it worked. Like, that was like the best. It worked. Like I found it and he made, you know, has a new customer, you know, basically for life. Off, like, I mean, that's crazy to me that is still the way that, you know, we have a long way to go. Right. Anyway, well, that was Design Week or Design 2 Hours. You have Design Week to design and hopefully everyone knows what to do. And next week, or there'll be office hours. Let me share the link now. This is like the Maybe the benefit of staying in early or late is that this should work. So I'll paste the link in now.

And if you run into trouble, show up at the alumni mentor groups before office hours. Ask Louis, Nick, and Marissa for help, or other people who come.

Yes. And, and then on Monday we will be building stuff. So we will be taking, we'll see how far we get, but we will try to say, okay, if we wanted to ship this, what would that actually entail?