Transcription
As a product designer at the fast-growing digital bank, believe me when I tell you that I feel the pressure to keep up with AI more than most people will. It used to be so overwhelming because there are just too many tools out there and there's not enough time to learn anything new. After 18 months of trying different tools, building my own ideas, and even teaching my colleagues at Monzo what I've learned, I no longer feel overwhelmed. And I can confidently tell you this.
The problem is not that you don't know where to begin. The problem is that nobody has shown you a clear and actionable road map to navigate all of this. And if you watch this channel regularly, you know I love a road map. So in this video, I'll walk you through a road map to become an AI-native designer in one weekend. This road map is specifically focused on guiding you to design, build, and ship working products using AI tools without writing a single line of code. The entire road map takes about 12 to 15 hours, so you can stretch it out to finish it in a week if one weekend isn't enough time.
A section of this video is brought to you by Gamma, the AI app that takes you from idea to polish to presentation slides in minutes. Before we get into day one, there's one core principle that I want you to carry through the entire road map. Without this principle, it will be difficult for you to make it through. The principle is this: Whenever you get stuck, just ask. The answer to every problem you would encounter in this road map is just one question away. Whenever you get stuck, just ask. Ask Claude, ask Gemini, and keep that in mind. Let's go.
On day one, our goal is to build something fun and understand what it feels like to create with AI for the first time. You're probably wondering, why are we jumping straight into building? How about understanding the fundamentals of using AI tools first or understanding how AI works? Well, my strategy for learning anything is to learn by doing. I'd rather jump in, get stuck, and then figure out why I got stuck than to keep learning and learning without ever applying what I've learned.
Now, back to building something fun. I want you to think about using AI tools like molding clay, while designing in Figma is like working with wood or plastic glass. The thing with clay is that clay is forgiving. It allows you to explore as many possibilities as you want and it does not confine you into a specific form as long as it is wet. With clay, you can mold a pot, turn it into a cup, and then turn it into something else entirely before you fire it, then polish it. Tools like Figma have component libraries and design systems that can feel limiting, which makes you carefully piece things together within the boundaries of what already exists. And that is what it feels like to create with glass or wood. And this sometimes sucks the fun out of the art of designing. With AI, the possibilities are endless, and I want you to approach day one with that energy. You need to be open and curious and do not be precious about the outcomes of whatever you're building at this stage.
The tools you can use for day one are either Lovable, V0, or Figma M. These tools let you describe what you want to build in plain English, and they generate a working prototype for you. You don't need any coding or hosting environment setup at this stage. Just sign up to any of the tools. If you're a new user, they will give you a few credits to try it out. Describe what you want to build, and it builds it for you. Here are some examples of what to build on day one: One, you can build a fun calculator with sound effects when you tap the buttons. You can build a stopwatch with some satisfying animations. You can build a fun color palette generator for your designs. For example, here's the calculator I built using V0 in less than 15 minutes.
Whatever you build should feel fun to you, and it should be something you can finish in 30 minutes to 1 hour. This is you making your first clay pot. It is not going to be perfect. It might be a bit wonky, but when you hold it in your hands and realize that you made this, that is when the shift happens. You stop asking, "Can I build things?" and you start asking, "What do I want to build next?"
Speaking about asking, one question I had in mind while I was designing this road map was, how do I give you some non-video material that can guide you so you don't have to keep coming back to this video while going through the road map? And I figured that the best way I could do that is to give you a presentation of everything that you need to do at every step of the road map. But creating presentation slides is so time-consuming, especially when you want to make them polished as a designer. This is where Gamma and Claude come in. With Gamma, I can create visually appealing slide decks right inside Claude, where I already brainstorm ideas for my videos. All I had to do was add Gamma as a connector in Claude, paste the full content that I designed for this road map, and describe what I wanted the presentation to look like and who I was creating it for. Claude even asked me some follow-up questions to get it right the first time. What's even more beautiful is I can refine the content by chatting in Claude, or I can go into Gamma to make any visual changes. Now I have a well-designed presentation that can guide you through this entire road map, and it took me about 15 to 20 minutes to create. It is linked in the description of this video.
Aside from building and shipping ideas without writing a single line of code, using tools like Gamma and Claude in interesting ways to rethink how slides are created is exactly what it means to be AI-native. If you want to give Gamma a try, follow the link in my pinned comments below.
The first half of day two is where you learn how to think and plan with AI, instead of letting AI do the thinking for you. This step is very important because it lays the foundation for how you interact with AI tools, so that whatever you create with AI reflects your taste, your judgment, and your unique point of view. As we move into the AI era, our roles as designers will evolve from executors to orchestrators. Think of an executor as the handyman on the building site, fixing the screws, sawing the wood, and the orchestrator is the site manager, giving the instructions like a creative director. This is the shift that is happening right now.
What I have noticed is that most people are still stuck in the "chat-ivity" era of asking questions, of treating AI like a search engine, the same way they use Google. These tools can do so much more than that. What separates an AI-native designer from a traditional designer is that whatever they create with AI still reflects their unique point of view. AI should amplify your ideas and intention, and not replace it. To understand how you can think with AI, you need to have clear answers to these four questions: Question one: What should I build? Question two: Why should I build this? Then, question three: What should I do by myself? And then, question four: What should AI do for me?
Imagine that you've just hired a new employee. You know that they are talented because you interviewed them, of course, but they do not understand your business the way you do yet. So, you take them through an onboarding program. You get them up to speed. Then, in their first few weeks, you give them a task to assess their baseline. If you skip the onboarding process, you'll be disappointed in the outcome, no matter how talented they are, except in a few rare cases. This is exactly how to treat AI tools. The onboarding process is just 100 times faster. Thinking with AI means that you are treating it like someone that you've just hired, someone talented but new. If you do not describe what you want clearly, the outcomes, the steps, the constraints that you're already aware of, you will get generic results and you'll be disappointed. And you must also be comfortable with the reality that right now, AI will get you to about 70 to 80% of what you want. Your job is to close the remaining 30% gap with your own judgment. That 30% is your point of view, and I don't want you to outsource it.
Here's what the first half of day two looks like practically. Start by picking an idea, and I want to give you a very specific filter for the idea. It needs to be something you wish existed, something that solves a personal problem for you, something you will go back to and use every single day because there's nothing quite like using something you built yourself and knowing exactly how to make it better. Also, keep the idea simple for now. Don't try to build your own Netflix or Stripe yet. And here's some examples for you: You can build a personal journaling app built exactly for your personality type. You can build a workout planner that fits your actual routine. You can build a Chrome extension that helps you to do something you've always wanted to do in your browser. If you would not use it yourself, then don't build it.
After you've picked your idea, the next step is to break it down into its core features or functionalities. This is where you do some of the thinking on your own, and then some thinking with AI. What you want to get out of this exercise is a clear product specification, a written document that describes exactly what your product does and how it works. So, you can start with a rough sketch of the key screens and interactions. You can sketch it on paper, on FigJam, Figma, or any other whiteboarding tool, and you can write out a few of the core functionalities of your idea. What is important is getting the idea out of your head into a visual format and a few bullet points of how you believe it should work. So you are giving AI something tangible to understand your idea, not just a sentence in a chat box. For example, when I was building a Chrome extension to help me manage my tabs, I did a quick design in Figma to express the idea visually first. This took me about 30 minutes, but it clearly described what I was trying to achieve.
Next, you take that sketch to Claude or ChatGPT and write a product specification document together. This is what I describe as thinking with AI. You've already done the first leg of the thinking by sketching and articulating your idea. Now, you ask ChatGPT or Claude to break it down into the core features and functionality and ask it to challenge your assumptions. Ask it what you might be missing. By the end of this conversation, you should have a clear written product specification document, which is also known as a PRD. It should contain what you're building, why you're building it, who it is for, and what the core functionality is. And here's an example prompt that you can use: "I have an idea for a product I want to build. Help me turn this rough idea into a clear product specification that I can use to start building. My idea is..." You can describe your idea in two to three sentences. The rest of this prompt is going to be linked in the description of this video.
Now, I know some of you will be tempted to skip the sketching and addition phase and go straight into building. Please resist that temptation. If you skip it, you're going to have a much harder time in the second half of day two.
On day one, we used prototyping tools like Lovable and Figma and Figma Make to build something fun. These tools are brilliant for quick prototypes with simple functionalities. You describe something, it builds it, and then you can share the link and people can play with it. But when you want to build something more complex, something with real logic, something you can customize deeply and iterate on over time, you need to move to a more robust AI coding tool, and you need to get familiar with coding agents using tools like Cursor or Claude Code.
A quick difference between Cursor and Claude Code: I think both of them are the most popular ones right now. Cursor is a code editor with AI built into it. Think of it like the tool a developer uses to write code, but with coding models like Claude, ChatGPT, and Gemini sitting right next to you. So you do not have to write any code at all. You describe what you need in plain English, and the tool generates the code for you. Claude Code, on the other hand, is Claude's standalone coding model. Unlike Cursor, you cannot use other AI tools within it. You can only use Claude. It used to be quite technical to use Claude Code because you could only access it through the terminal. But recently, Claude released a desktop app called Claude Co, which has been amazing. It now has a code tab that makes it more easier to use as a non-technical person. I am more familiar with Cursor because the interface is much more approachable and less technical. So I recommend downloading Cursor for this phase. So visit the Cursor website and download the app. It is free to download, and you will get a few credits to start. But you will need a subscription to get the most value out of it. Just subscribe for one month and consider it an investment in your career. In fact, I would say have like two to three AI subscriptions that are like investments into your career.
Now, here's the mindset I want you to carry into this phase. You are the designer, and Cursor is your developer. Your job is to describe what you want to build in detail, clearly, just like you did when you wrote the product spec. Cursor writes the code. You review it. You direct it, and keep it aligned to your vision. You do not need to know how to code to start. But the more this workflow becomes part of you, the more you will start to understand code, which is actually a good thing. You will find that the Cursor interface is quite intimidating when you first open it, and that's okay. Remember the one principle from the beginning of this video: Whenever you get stuck, just ask. You can ask Gemini, or GPT, or switch to Ask Mode inside Cursor to ask questions about anything that is getting you stuck.
Once you download Cursor and create a new project, go to the prompt box and enter this prompt before you do anything else: "I'm a product designer with no coding experience. I want to build..." Describe the product you want to build in two to three sentences. The rest of the prompt is linked in the description of this video as well. And if you find the initial setup challenging, I've added a link to a separate YouTube video that will walk you through getting started with Cursor, and you'll find it in the description as well. Your setup may take a while because you may need to go back and forth with Cursor. Be patient. Everyone gets frustrated at this phase, and do not let that discourage you.
Once you are done with your setup, it's time to build. When building with coding agents, there are two things you must do to avoid any complexity down the line. The first thing is to break down your product specification into smaller, buildable parts. The second thing is to plan each part before you build it. So avoid dumping the entire product specification into Cursor and asking it to build everything in one go. Remember that you're not building a toy like you did on day one. Now you're building something real, so I want you to treat it that way.
The prompt box in your Cursor has four modes: It has the Ask Mode, the Plan Mode, the Agent Mode, and the Debug Mode. When you have a question, you can use the Ask Mode. When you want to plan what you need to build, you use the Plan Mode. And when you want to build the plan, you can use the Agent Mode. Sometimes the agent will also ask you to switch from Plan Mode to Agent Mode so that it can execute. And you can use Debug Mode to find bugs. I barely use Debug Mode, but I know that as I build more robust tools and get more into complex tools, I'm going to need to use it. In any of these modes, you can switch between the different coding models like Claude Opus and its models, ChatGPT, and Gemini models. The model I often use is Claude Opus 4.6 because it usually gets the UI design right the first step, especially if I show it an example. It is also the most expensive model. I noticed it burns through most credits than other models, so that's just something to be aware of.
So, to get started, switch to Plan Mode in Cursor. Upload the product specification you created on day two and ask it to break it down into four major, buildable parts. You can also do this step inside ChatGPT if you prefer, but I think you should do it in Cursor because it's great to use the Plan Mode for this. The goal is to have four individual parts of your product that you can develop, that you can build and test end-to-end one at a time before moving on to the next one. Once you have your four parts, ask Cursor to create a plan for the first one. Once it has created a plan, it will ask you if you should go ahead and build. And an example of one core part that you could build in part might be onboarding. So, every app is going to have like an onboarding, except maybe if it's a Google Chrome extension. So you can build the entire onboarding flow as one part before you move on to the next part.
Now, there's something that may frustrate a lot of people during the build phase, and I want to address it head-on. It is setting up a local environment. This is where you run your project on your own computer so you can see it in a browser before it is live anywhere. It may sound technical. Sometimes it is slightly technical, but the setup prompt I gave you earlier already covers this. Cursor will walk you through it step by step, and I'm mentioning it again because this is how you actually see what Cursor is building for you.
There are two core pieces of advice for this entire building phase. The first one is to scope aggressively downward. Focus only on the core functionality that makes your product worth using. Everything else is a distraction right now. So you can always add more things later after you've shipped. The second one is don't be intimidated by code. You can see the code, you can see the terminal, and it can be intimidating. You're going to see files, you see syntax errors that you don't recognize. Just resist the urge to understand everything immediately. Your job is not to become a developer. Your job is to stay in the role of a designer and an orchestrator and direct the AI towards the outcome that you want. Remember, the most powerful thing that you can do in this phase is asking.
Once you're done with the first buildable part, all you just need to do is rinse and repeat until you've built all four parts. You may be tempted to start making things look visually appealing while you're building. That is your designer brain taking over, and it's completely understandable. Try to resist that temptation and build something that works first, and then make it appealing after you've shipped.
You've built your idea. It is working on your computer, but you do not want to stop there. You need to get it out of your local environment into the real world. That might mean deploying it as a web app you can open on your phone. It might mean packaging it as a Chrome extension you use every day. It might also mean sharing it with a few people and watching them use it. Shipping does not mean perfect. Shipping means that it's working well enough that you can use it and well enough that you can learn from using it. The gap between "it's working on my computer" and "it's working in the real world" is where most people's first projects die, and I don't want yours to die there.
So here's a prompt that will help you get your first project shipped, whether it's a web app that works on any device or a Chrome extension, which is actually the easiest to get live. The best place to enter this prompt is inside Cursor because Cursor already has all the full context of your project. So here's an example of a prompt that you can use: You can say, "I want to ship this product so that I can use it on..." and then you insert wherever you want to be able to use your product. And then the rest of this prompt is also linked in the description of this video.
Now, this is actually where things get quite interesting because once you're using something that you've built every day, you start seeing it differently. You notice what isn't working. You notice what is cranky. You notice the interaction that doesn't quite work. Um, and now, for the first time, you have the ability to fix it. You don't need to create a ticket or wait for an engineer. You fix it by yourself. And that feeling is what this entire road map is all about. This is what it means to be AI-native. It is not using every tool that drops. It is not jumping on every new trend. And it is understanding where AI removes the ceiling of what you can do, and then building above where that ceiling used to be.
I really, really enjoyed making this video. YouTube thinks you would enjoy this one next, and let's see if they know you that well. I'll see you in the video.