← The Growth Podcast
The Growth Podcast
How to AI Prototype Well | Masterclass from $5.5B Founder, Nadav Abrahami (Wix)
01:16:35
Loading summary
Transcript118 lines
- [00:00]
Nadav Nobrami
If you can't build a production app without AI, it's going to be really hard to build a production app.
- [00:05]
Akash
Is there a point where AI starts to replace developers or replace product managers?
- [00:10]
Nadav Nobrami
I think what PMs really need to do is level up the skill of understanding what they're building.
- [00:15]
Akash
Nadav Nobrami is one of the co founders of Wix, the $5.5 billion online website building giant whose stock has 5xed since its IPO in 2013.
- [00:26]
Nadav Nobrami
What happened for PM is that they were just gotten a huge get out of no developers J card. Now with AI, it's not a huge investment. It's the cheapest option time wise.
- [00:37]
Akash
Why should they be using an AI prototyping tool or when should they be using an AI prototyping tool?
- [00:42]
Nadav Nobrami
You get an experience that is something that's more functional, that you can play around with, that you can put users in front of and they can actually get the real experience.
- [00:51]
Akash
How should PMs be preparing themselves for whatever's happening in the next three to five years with AI?
- [00:57]
Nadav Nobrami
Foreign.
- [01:01]
Akash
Before we go any further, do me a favor and check that you are subscribed on YouTube and following on Apple and Spotify podcasts. And if you want to get access to amazing AI tools, check out my bundle where if you become an anal subscriber to my newsletter, you get a full year free of the paid plans of Mobin, Arise, Relay App, Dovetail, Linear Magic Patterns, Deep Sky, Reforge, Build, Descript and Speechify. So be sure to check that out@buildle.akashg.com and now into today's episode. Nadav, welcome to the podcast.
- [01:35]
Nadav Nobrami
Hi Akash, happy to be here.
- [01:37]
Akash
I want to jump right into this. Everyone thinks AI will replace developers, but you have a different perspective. What's your take?
- [01:46]
Nadav Nobrami
I think AI is a tool and it's a tool that lets you do do a lot of things, but you can create in it only so much more than you can understand or that you do understand. So it depends on who's exactly are you and what exactly is your skill set. But it's not anybody can build anything tool. It is an amazing tool for some things. It's an amazing tool for PMs that build prototypes all the time. It's an amazing tool if I want to just build a small app that I can use for something that's not my main business or just an enabling tool as part of my business. So there's so many use cases but I think the most amazing ones are for product managers.
- [02:32]
Akash
So you can't really build a production app with AI today.
- [02:35]
Nadav Nobrami
You would say it really depends on who you are. If you can build a production app without AI, then definitely can build a production app with AI. If you can't build a production app without AI, it's going to be really hard to use AI correctly to build a production app. And, and it's a gap of knowledge, a lot of it. It's not a gap that's going to stay there.
- [02:57]
Akash
That makes sense. So you need to be able to understand the code behind it. And we will live demo that for you guys in a second. So when should people be using AI prototyping tools?
- [03:07]
Nadav Nobrami
All the time. They're amazing, they're magical. I've heard of so many use cases that you would not imagine. It's from closet companies, like small family businesses building an editor to design their closets just so they don't do it in paper anymore and printing that to my kids, a small platformer, where they need to escape the farts of sheep, it really is endless. And those are just like the cases where you say I want something small and I can do it myself and I couldn't before and nobody would build it before. But I think again, the people that are going to use it daily that it's going to become their main tool of work, RPMs, because they keep getting to the point where they want to create something and experiment with it more than anybody else. And also they really know how to talk to developers and explain what they want. And basically what they got now is a virtual developer.
- [04:04]
Akash
So when a PM is using it, why should they be using an AI prototyping tool? Or when should they be using an AI prototypling tool versus Figma or Cursor's new visual editor.
- [04:15]
Nadav Nobrami
You get something else from Figma and from Vibe coding tools you get an experience that is something that's more functional, that you can play around with, that you can put users in front of and, and they can actually get the real experience. And it's not like functional prototypes are something totally new. We built them, we used to build them a lot in wix for big features, for stuff that we really want to test out with users. We used to build them, but it was just a huge investment. Now with AI it's not a huge investment. It's the cheapest option time wise. It's the fastest way to get to something I can play with that's something I can even look at. So it really changed it. If it's something that used to Be very rare for really complex features. Now, there's no feature that goes through the ideation stage without at least a few functional prototypes. So every feature goes through this step, but it's really a matter of where to use it in the process, because you want it to come at the initiation step. You want to try out a number of new ideas. Sometimes you really don't want to give a spec, you just want to give an idea and see what the AI does and maybe run that a few times and see what the AI does differently. Because first of all it'll open your mind. It's super interesting and it really lets you not just imagine it on a piece of paper and imagine how it is to play with. It lets you play with all of these variations. And the second place is really after choosing. Sometimes after Figma, you want to get it to feel production ready. It doesn't need to be production ready, but you really want to get the prototype. If you really want validation for the feature and you really want to play with it with users, there's another step there where you take the idea you chose and the design you chose and you want to get it in front of users as fast as you can. And it's always faster to do a prototype than to get it to production.
- [06:06]
Akash
One criticism I've heard of these tools, and this has come from people even as famous as Itamar Galad, who is one of the most well known PM influencers. He said that if when we jump into prototyping for ideation, for instance, we sometimes are going too fast into the solution space, we're not spending enough time on the problem space. How do PMs think about the life cycle of product development and what they should be doing in the problem problem space and when they should move to the solution space and start looking at a prototype?
- [06:37]
Nadav Nobrami
That's a really interesting question. First of all, Vibe coding tools and basically also Figma. Every prototyping tool, every tool where you give the output of what's there, what you want there means that you want know what's there. And I totally agree. I think research is super important in NPM's job. Both research on the web and using AI tools for research just to research how this feature looks like, what user stories you have. There's a lot to do before you even get to prototyping and I would never give up that step. I think it's, it's all about research and communicating with users. The visual aspect of the feature you're building is usually not the big Thing, it is a big part of the job, obviously, but it's. By the time you got to it, you already know what the feature is that you want. Exactly. And that's really the big decision.
- [07:25]
Akash
So really you need to understand what problem you're solving, what user story and the rough shape of the feature. Right. So these three elements, if you guys truly want to master AI prototyping, you can't just jump in to the solution space. That's why we wanted to start here, you guys, to give you the context of what we're about to show you. This is when to use it. Don't overuse a tool. Whenever a new tool comes out, we just want to use a hammer on everything. AI prototyping has its place, and now we're going to show you exactly what its place is. So let's get into it. Can you show us how to build something from scratch in Dazzle?
- [08:05]
Nadav Nobrami
Okay, so I'll start by opening Dazzle and let's try to go through a flow, really the flow that RPMs go through, the flow that I really believe for PMs in using such products. So, as you said, we could choose what we wanted and we were talking to you on LinkedIn. So we chose to add a feature to LinkedIn. And we're going to simulate like we're a product manager working in LinkedIn. We have a great idea for new feature, but even before we start, the first thing we really want is we want to build on something. We want to start by having something that looks like our product that we can start from. So let's start from there. I'm going to already took a screenshot of Linden, so I'm just going to drop it here and tell it a small prompt to recreate the page. And we're sending it to go. So it's going to take it minute or so, and it's important to understand what it does. In the meantime, Dazzle ramps up really a server for you. I know I'm diving into technicals here, but I think it's important to understand. I always think it's important to understand as a pm, some of the technical decisions behind your product. In this case, it means that it's very much open. You actually have a server. It can talk to wherever you want, bring data from wherever you want, and pretty much to anything you can imagine on the web. It does take a bit more time and it just finished erasing the server and it's starting to write the code now. The reason I said that it's I always start with this. I start with copying the product. I want to add a feature to at the very least the visual aspects of it. So I'm not starting from a blank page and I can basically see where I want to fit the new feature inside. Also, it's super important because I can save that, I can reuse that, I can then build a lot of features from that, which is really, it's going to save me a lot of time in the flow later.
- [10:12]
Akash
Today's podcast is brought to you by Pendo, the leading software experience management platform. McKinsey found that 78% of companies are using Genai, but just as many have reported no bottom line improvements. So how do you know if your AI agents are actually working? Are they giving users the wrong answers? Creating more work instead of less, improving retention or hurting it? When your software data and AI data are disconnected, you can't answer these questions. But when you bring all your usage data together in one place, you can see what users do before, during and after they use AI, showing you when agents work, how they help you grow, and when to prioritize on your roadmap. Pendo Agent analytics is the only solution built to do this for product teams. Start measuring your AI's performance with agent analytics at pendo.IO Akash that's P E n d o IO a a k a s h AI is writing code faster than ever, but can your testing keep up? Testcube is the Kubernetes native platform that scales testing at the pace of AI accelerated development. One dashboard, all your tools, full oversight, run functional and load tests in minutes, not hours across any framework, any environment. No vendor lock in, no bottlenecks, just confidence that your AI driven releases are tested, reliable and ready to ship. Testcube Skill testing for the AI era See more at testcube IO Akash that's T E S T K U B e I O/ A A K A S H so it sounds like as a product leader, if you're introducing Dazzle or an air prototyping tool to your team, you might want to do this first step for people where it brings in the design system. It starts to look like their existing product so that they can just pick it up and start using it from
- [11:58]
Nadav Nobrami
that totally you want to do that and you want to save it with a template. That feature is coming really soon to Dazzle and you want to save it as a template and reuse it across your organization. You want to then start building all the features from this and you want to probably keep maintaining that project, as your project evolves, keep it tight and very close visually. Not just visually, even almost functionally to your product. So you can open the same screen so you can see the same experiences, and then everybody can just copy that and mutate from that.
- [12:29]
Akash
It seems like if you want visual fidelity, it might even make sense to bring in a designer just to get those details right for the template that everyone's using for sure.
- [12:37]
Nadav Nobrami
And this is one of the places where really, Dazzle shines, because you can really tweak it visually and get it to where you want. Okay, I think it's about almost done. It's probably going to take it a few more seconds.
- [12:51]
Akash
One of the things you've mentioned and you've emphasized whenever we work together is it's important to understand what's going on in the back end. So maybe can you just read through and explain some of those green check marks, what exactly it's done so far?
- [13:03]
Nadav Nobrami
Sure. So what's happening behind the basically under the hood is that Dazzle is starting to write code for your project. Now, the first thing that's done here, it's wrote the theme css. It's basically the design system of this project. We're going to take a deep dive, dive into it later and maybe tweak it a bit. And then it basically started writing the data and the styles and the components for this homepage that we requested. When it finishes to do that, it's going to go for a validating step. Basically, there's a lot of tools developers use to validate their code. If it's type checking and build errors and a lot of things that you can see just to check that the code is working well and just finished writing the code and now it's going to basically validate it. So, as I said, it's going to type check, it's going to check that there are no broken images, it's going to check that there are no errors. Then that basically you can continue from this point.
- [14:00]
Akash
And you said css, those are cascading style sheets. This is used in basically every single website out there. Is Dazzle going to be building on top of Tailwind?
- [14:08]
Nadav Nobrami
Well, we're thinking of adding Tailwind, but I have to say my feeling about the matter is that Tailwind is great. If you want to create stuff that looks like it was built exactly in that design system, you can tweak it a bit. But if you really want to get out of the box, you see people, even like influencers that are really pushing tailwind. You see them using tailwind and something, and it's because it's really nice for getting the fast, simple design, but you're getting the same design system. It really. It's a technical thing in a way, and maybe technical for designers, more than technical for developers, but there's a lot to be said to having your own design system and tweaking your own design system, not just building on that. So first of all, you can see that Dazzle built a page looks pretty much like screenshot I took. I do feel that some of the colors are a bit off. So let's start visually editing before we do something else.
- [15:07]
Akash
Yeah, that was what stood out to me as well. The colors.
- [15:09]
Nadav Nobrami
Yeah, right. This one is totally off. So you know what, what I'm going to do is I want the reference. So I'm just going to click add here and I'm going to add the image here. And basically, let's put the LinkedIn image here just so it's easy to compare. One second. I'm going to drag it here into upload and let's select it. And now I can see the image here and you can see that the colors are really off. So let's go back here. And I want a custom color and I want this one much better.
- [15:44]
Akash
Nice. So you can just use an eyedropper tool to match your colors.
- [15:48]
Nadav Nobrami
Oh, yeah, yeah, for sure. You can drag images inside. There's a lot of visual editing that you're gonna see here. And I'm gonna mention some of it, what I'm doing. But a lot of the things you're gonna see here is not something you're gonna see somewhere else. So that's it. And now I'm gonna click backspace and delete this image because it was just there for reference, easy to remove.
- [16:12]
Akash
It didn't mess up anything.
- [16:13]
Nadav Nobrami
Oh, no. You can really. Let's say I want this button to the right, most of the fins, I can really do pretty simply in a way that you're not going to see in any other visual editor of code or any other Vibe coding tool. This is what we do. This is like. I co founded wix. I love visual editors. So that's one tweak. Another thing is let's obviously this is not the Dazzle image. Let's choose Product Media and choose this thing. Much better. And now what do you think? Anything else you want to tweak before we continue to add a new feature?
- [16:48]
Akash
Maybe we also update the Dazzle image on the page. Posts down a little bit further yeah.
- [16:53]
Nadav Nobrami
This one?
- [16:54]
Akash
Yeah.
- [16:55]
Nadav Nobrami
Oh, for sure. Excellent. All right.
- [17:04]
Akash
I would say it's like a nine and a half out of ten. It's basically there.
- [17:10]
Nadav Nobrami
It can always be better. And I think it's really, as you said, Akash, it's putting a bit more prompts into it or putting a bit more visual tweaks into it. If you're working with the designer, maybe get him to contribute some to the project and get it to look right to him. Because I'm not a designer. I'm sure all the designers looking at this right now are saying, no, it doesn't look good enough and I don't even see it. Which is okay. I'm more a PM and technical person than a designer and it's not my job to see it just to be held at and then fix it. So let's build a feature. So what I was thinking about is let's add sentiment analysis. Basically something that just says about the comments of each feature of each post, sorry, whether it's the sentiments are positive, negative, and so on. So I made a pre made prompt here and let's just send it in. It's not a big prompt, as you can see. And it's not a big feature. And it's a lot of times it's not about the big features. It's. It's been unlocked. I feel like what happened for PMs that they were just gotten a huge get out of no developers jail card. Well, before that they were blocked whenever they wanted to do something small. And now it's just magic.
- [18:33]
Akash
Yeah, I'm actually coaching somebody who she got hired before they hired the engineering team. So they hired the PM first. Just happened that way. And for the first couple weeks it was like, what is she gonna do? Then the first thing we did is we said, okay, let's get access to an AI prototyping tool so that we can at least come up with some good specs, validate those specs before the engineers come on board, so that when they come on board they can hit the ground running. And so it happened like they hired some Google engineer on day one. He was one of those guys who was just hitting the ground running. And because she had four or five AI prototypes, he found, okay, this one is really easy one. And he got to work and in the first week he was able to ship something. So this can really accelerate your ability to work with a small or no engineering team.
- [19:19]
Nadav Nobrami
And the fact that you can actually, you have a server, you have an entire application. It is something you could start a production app for if you are technical enough or want to invest enough, you could get to a production app. I do feel like the main use case though is playing around in prototyping for that this technology is super exciting and super amazing. So okay, I can see where. Let's go to preview so I can play around with it. So we have a sentiment here and I see there's some rollover of it. What do you say Akash? What do you want to change about it?
- [19:53]
Akash
Well, I think the most powerful thing about these air prototyping tools is that you can actually create very quickly divergent solution. So we have one implementation here. Maybe what we can do, is there a way for us to maybe branch this or try out a second implementation that looks visually different?
- [20:11]
Nadav Nobrami
Well, what we can do is ask the AI to add a toggle at the top and have these two behaviors. So what do you want the second behavior or the sentiment to be?
- [20:20]
Akash
Maybe right now we have like sentiment. It's attached to the page posts. What if we had sentiment as its separate bucket on the page below the page posts? That was like sentiment analysis of your page posts and maybe it just showed a quick summary of your last few and then you could click in to get more details.
- [20:43]
Nadav Nobrami
Okay, so let's add it as a different section and then decide if to hide the section thing. Add a section to the page where we see the sentiments of page posts. What do you want exactly? Like let's do a summary of this. Like summary of positive versus negative posts and so on.
- [21:08]
Akash
Yeah, maybe it's like it shows a summary of the last four posts and it kind of shows your overall sentiment.
- [21:15]
Nadav Nobrami
Overall sentiment as a graph by cohorts.
- [21:23]
Akash
Nice. So pretty simple natural language prompt. Not super special.
- [21:29]
Nadav Nobrami
No, I don't think it's about the super technical prompts. It's really not about it unless it's something super specifically and you're super technical and you know exactly what you want. It's better to let the AI choose the technology for you. It's amazing to understand what it did, but I think it's separate things. One thing is directing it and second thing is understanding it and then directing yourself in a way directing both of you. But I don't go into any technical specs when I'm prompting. The main thing I want to do is to get experience right. And it's really complex by the way, because words so many times have more than one meaning and most of the mistakes that happen that I saw is miscommunication. A lot of times it's just about. And it's the same miscommunication you have with a developer. But then the developer says, are you sure you mean that it doesn't make sense? And you talk again. And the AI is really not good at telling you this does not make sense.
- [22:29]
Akash
So what's interesting about these prompts, right? Then the takeaway for PMs is you don't need to build a system prompt level prompt engineering, you don't need to say act as and here's a few closed shot examples and here's the frameworks to use and don't do this and do that. Instead it's really about the clarity of what the feature is because you don't have that back and forth with developers. Is that right?
- [22:53]
Nadav Nobrami
That's totally right. I think developers would tell you when something you're saying is not correct and AI will take your choice, correct or not. So it really, if you're super technical and you do know what you're saying, maybe tell it what to do, but otherwise it's really better to explain very coherently what you want. And it's really important because anything that can be misinterpreted will statistically be misinterpreted. It's not every time it's like talking to a genie and 99% of the time it will do what you want, or 95% of the times. But if 5% of the time the GENIE will find everything you said that is flawed and will do the exact opposite of what you wanted. And we find that we do a lot of prompt engineering for our own prompts, obviously running them many, many times and doing the dissection and the statistics and seeing what works and what doesn't. And a lot of times, by the way, after we've seen that something statistically doesn't pass well enough, asking AI why? And a lot of the times you just see a contradiction. There's something that we miss, something that can be understood in two ways and sometimes it'll understand it in a different way and you make it a bit more clear, that issue goes away. So obviously it's not going to hit you every time we see it statistically, when we're looking at hundreds, thousands of iterations, if you're doing it 95% of the time, even if you don't say exactly what you want, it's going to understand you, even if you're not totally clear. But those 5% of the times can be so time consuming that it's really, that's the Main thing, if you do want to do anything with your prompt beforehand, take it to LLM and just ask it, what are the contradictions? What's unclear? Because again, it's not about going technical, it's about going clear.
- [24:42]
Akash
Clarity is the key here and use LLMs if you need to to clarify your prompts. Now, while this is working, what's happening differently here in Dazzle versus Bolt or
- [24:53]
Nadav Nobrami
Lovable or Cloud Artifacts, there's a number of things. First thing is that I'll go back to the server and say that what Dazzle builds is a full fledged server side application, server side and client side. That means a few things. It means that if you bring it to developers in your team, it'll just look like any other web applications that they saw. Nothing special, nothing proprietary. It also means that you can run it anywhere and you can take it to your computer and it'll run the same way or just host it yourself if you want, somewhere. Second thing is obviously the inspection and the visual edits. Now it's happening also while the AI is generating, it's not just for the user. All of the information that we know how to expose of the styles and the properties and the state of the HTML and so on, all of the hidden state of the application, it's exposed to the AI. And I think that makes the AI so much smarter. There's so many things that just looking at the code and trying to understand why it fails, that's super hard. And if you look at the application with debugging tools, super easy. So basically the same debugging tools, the same inspection tools, the same overview tools that we give to users, they're all exposed to the AI as well. And it makes for just, just makes it so much smarter.
- [26:16]
Akash
And one thing I would say that I personally noticed is that you're bringing a lot of that WIX expertise around, having a really world class visual editor into here as well. We saw that a little bit and I think we'll go into that a little bit more. So let's take a look at what the AI built here. This is our second variation of the sentiment analysis. How do we think it did?
- [26:36]
Nadav Nobrami
I kind of like it. Obviously it only gave us positive reviews because it's AI, but all in all, I pretty much like it. What do you say? What would you change?
- [26:47]
Akash
I like it. Like what I want to emphasize and triple click on for people is that what this tool unlocks is your ability to do these different solution explorations. We just did two for you guys, but you should Think about along the two that you did, do a couple more iterations so you could iterate this. You could say, hey, put in some negative data. You could say, hey, I currently think that this sentiment analysis, it's a little too big. Or maybe I think it should go below the page post so you can do those little iterations. But then don't even stop there. We have two iterations. Why not come up with a third or a fourth? I think the magic of this tool is that it allows you to come up with three or four so quickly so that then you can really play with it and understand, okay, after playing with it, which one of these is the best one?
- [27:34]
Nadav Nobrami
I totally. I think you want to first play around, make a few variations. Then the one that you really like, that one you want to get perfect. But it's never the first step.
- [27:47]
Akash
Awesome. So maybe you can showcase for us now like the next level. Let's say we're sticking with one of these. You choose which one you like better. How are we going to go ahead and edit this further? With natural language, with code, with component level changes.
- [28:00]
Nadav Nobrami
So. So Dazzle offers you a number of ways already in its army. So let's look at this sentimental analysis element. So this is the entirety of the sentimental analysis. First of all, once it's selected, you can see that it's represented in the chat and the agent is obviously aware that this is the selected element. Now here as well as in many other places, this connection is really, really strong. It's something that we are very proud of it. It knows the exact place of the code, it knows the properties. One thing that you can see, it's something that's I think important. As I said, there's some level in app to do. I think that PMs are going to need to do some understanding of the complexity. This is a part of this complexity. You can see here that this element basically in the HTML is both the sentimental analysis, but it's also a card. And in the end this card is a dividend. Now it's something that you won't see in other tools and it's something that is important because editing this div means editing all the cards. Editing this card means this card instance. And editing this sentiment analysis means editing only this instance of sentiments analysis in your application. So this is one thing that you can see that is very different. Second thing that is interesting that whenever something has properties that are interesting, you can see them here. In this case you can see basically that it has data that is bound it's not something that's here, it's not something that's simple to edit, but I can also basically see what the value is. So if I look at company posts, it got four company posts here and if I really want to understand what's going on, see this is basically the data the component got. Now it's not something that I open all the time, it's something that I open when I want to understand the data flow in the application. Usually it's part of debugging, it's part of playing around and understanding that my cart or in this case I didn't expect to see a different number of items, but in some cases you've seen four items and you expect to see 10. This basically shows you at what level is broken. You can go down the component tree and see where the data doesn't pass
- [30:30]
Akash
as you expected, today's episode is brought to you by Jira Product Discovery. If you're like most product managers, you're probably in Jira tracking tickets and managing the backlog. But what about everything that happens before before delivery? Jira Product Discovery helps you move your discovery, prioritization and even road mapping work out of spreadsheets and into a purpose built tool designed for product teams, capture insights, prioritize what matters and create roadmaps you can easily tailor for any audience. And because it's built to work with Jira, everything stays connected from idea to delivery. Used by product teams at Canva, Deliveroo and even the Economist. Check out why and try it for free today at atlassian.com product-discovery that's a T L-A S S I a n.com product-discovery Jira product discovery Build the Right Thing I hope you're enjoying today's episode. Are you interested in becoming an AI Product Manager? Making hundreds of thousands of dollars more joining OpenAI and Anthropic then you might want to do a course that I've taken myself, the AIPM Certificate ran by OpenAI product leader Mikdad Jaffer. If you use my code and my link, you get a special discount on this course. It is a course that I highly recommend. We have done a lot of collaborations together on things like AI product strategy, so check out our newsletter articles if you want to see the quality of the type of thinking you'll get. One of my frequent collaborators, Pavel Hearn is the Build Labs leader. So you're going to live build an AI product with Pavel's feedback if you take this AIPM certificate, so be sure to check that out. Be sure to use my code and my link in order to get a special discount. And now back into today's episode. Before we dive deeper, let's talk about something every PM faces. Getting alignment on product decisions. You know that feeling when you're trying to explain a user flow to engineering or justify a design choice to leadership and you're just describing it with your hands? That's where Maubin comes in. Maubin is the world's largest library of real world mobile and web app designs from industry leading apps like Airbnb, Uber and Pinterest. Instead of spending hours taking screenshots or hunting for inspiration, you can instantly find exactly how successful products handle onboarding, paywalls, checkout flows, whatever you're facing. Over 1.7 million product builders use Mauvin to benchmark against best in class products and show their teams proven solutions. Whether you need to convince stakeholders there's a better way to handle user activation or research how Topapps approach future discovery, Mobin gives you the visual proof to back up your product decisions. Check out mobin.comakash that's M O B B I n.com a k-a s h and get 20% off your first year.
- [33:17]
Nadav Nobrami
Now I opened this and I opened it in the Elements panel. The Elements panel is something that is going to be familiar to a lot of, not just developer, I think also product managers and designer. It's basically much like any the dev tools that you see in any browser these days, but it is much more connected to the code and much more connected to the application itself. So one thing you're gonna see here that you're not gonna see in the DevTools is again this separation between the component and the instance because it is aware of the components. Second thing is that everything I do here, if I edit it, it's not a change that is transient, it's something that is immediately saved to my code and you can immediately see it appearing in the left side. I chose something that I have no idea what I'm changing right now. I'm sure it's changing the color there somewhere, but maybe not a good idea. Let's take something like this. You can see that the background right now is a natural color. I can tweak it, but it's not just tweaking it like in the devtools and then I refresh and it's not there. You can see the second that I'm doing it there is a change to the CSS file and this CSS file in this case I'm going to discard it. We did something very ugly here, but it's immediate changes. Now it's important to understand most of the things I want to do that are simple editing I'm going to do from here, from this bar, but just understanding the structure and when I want to change it and where I want to change it, I'm going to need the tree because the HTML is a tree and most of the things it's really easy to select on stage, but some of the times there's elements that have the same size that elements that are hiding each other. There's a lot of stuff that you want. If I want to actually even select just as context to the AI, I'm going to need this tool. Second thing is, as I said, it's multi level. So we already saw some chat edits. I think we saw a number of visual edits from the top bar and a number of visual edits from here. The third option that we have, or fourth, what is it, is basically just to go to code wherever you want. So again, if I want to look at this div, I can inspect it like we did before, but I can also view its code and it'll take me immediately to the code of the element. And it's important to understand if I change it here, I see change immediately on stage.
- [35:59]
Akash
Maybe for people who are kind of like they're not able to read this code. Can you just walk us through how to read this here in the bottom?
- [36:06]
Nadav Nobrami
Right, sure. So basically this is a react code. It describes HTML, it describes the structure that we see on stage, but it is not the structure. It can run many times. A lot of times it's going to be repeated, it's going to run with different properties and show different data. So it is a representation of the dynamic HTML of your application. Some of the things you see here are going to look very similar to the elements tree because again, it's HTML, it's the same div. The main thing that's going to change is that you're going to see a lot of these squiggly lines here. The curly braces mean it's an expression, it's something that is going to be dynamic. So this thing is a dynamic text in the middle of the div. And what I did is basically went after the curly braces and said I just want to add some text here. So say positive assessment. Now I can do it from here, but it's definitely not my go to to do it from here. Also, as a developer Usually I'll do it from here. It makes a lot more sense. It makes it. And you can see the. It immediately does the same thing, immediately changes it in the code. It's exactly the same behavior as editing it in the code. And you talked before about cursor a bit. I think this is like the major difference, cursor visual editing, which I think it's an amazing feature. I'm not dissing it at all, but I think it's important to understand how it works. It's basically a way of more than visually editing, visually prompting, because everything you do is then passed as a. This is what the user changed to the AI to then write it to your code. There's positive things to be said for it and negative things to be said for it. But I think the main thing it's lacking is the immediacy. It's the fact that I changed something and this is how it's going to look. There's no second guessing, there's no going to add the LLM to try to implement it. And many times It'll get to 99% of what I wanted, but many times it won't. And I already did the work. So it feels like kind of, I don't know, it feels kind of annoying to be able to do this. I added the icon I wanted, I added the text I wanted, but then the LLM needs to do it again.
- [38:34]
Akash
I didn't know that about cursor. That's really interesting.
- [38:37]
Nadav Nobrami
It is really interesting and it really changes what you can do in it. I'm just going to space it a
- [38:42]
Akash
bit here and we used a couple technical definitions for the people who got lost when we said those. Can you just clearly define for us what is a div, what is a card, what is a component?
- [38:55]
Nadav Nobrami
Sure. So the way the browser works is something called DomTry. It's basically the browser gets a document and text document, an HTML document, and then it creates live nodes from it. These live nodes are what you see on stage. And the browser offers a number of native nodes, a lot of them. Basically it offers an input and offers an image and it offers a video, a lot of native elements and for the mode stuff, that's what you want to use. It's the platform, it's what's going to work best in it. But sometimes it's just not enough. It doesn't give you, for instance, a tag input, a gradient picker, just something else that you repeat a lot in your application. The main thing, it doesn't give you out of the box is repeatability and the ability to create dynamic stuff. Now, it doesn't give it you out of the box, but they added a layer for that, and that's called JavaScript, which basically lets you play around with the same document model we discussed before, the same structure of HTML, the live one on stage, not the text that you loaded. But the second it's visually on stage, JavaScript can play around with it, it can add element, it can remove elements, it can do a lot of these things. And that gave rise to a lot of frameworks like React that basically handle this, the dynamic data for you. And what they let you do is write something that looks a lot like HTML but is code and is dynamic renders. Again, which is really important because an HTML page, it renders once on the server and then it shows the static stuff, it shows what rendered. And with JavaScript and React applications and other frameworks, you get something that's living and you get something else. You get the fact that you start rendering on the client side and not on the server side, you start changing the HTML while it's in the browser. And that means that on the client side as well, you don't want to rewrite this HTML all the time, you want to keep it componentized. And I think that's something that's really important. It's not just important because of the dynamic data, it's also really important just because you don't want to recreate the same visuals again and again and again. So components are basically taking a substructure of HTML divs and images and videos and whatnot, and grouping all of that into something you can reuse that gets properties which are basically its data, and you can reuse across the page many, many times without reloading this HTML many times, without repeating the HTML in your application many times. So it's also a matter of performance sometimes. Now, the core HTML, for some reason they decided to call it a div, for dividing stuff. It's basically a box. In any design tool you're going to meet, it's going to be called a box. There's some strange behavior for a box. By default it's a vertical stack, but basically it's just the most native box you have in HTML. Card is basically saying, my box, I want it to always have the same borders, I want it to always have the same background, and I want to reuse that. So Card is basically also a box, but it's my box.
- [42:50]
Akash
So the reason I asked that question is I want all of you Guys listening to be fluent with the code, open up the code editor. Now, when should PMs be editing in code versus editing via prompting versus editing visually?
- [43:05]
Nadav Nobrami
I don't think PMs should be ever editing in code. When PMs get to the point where they have to edit in code, it's not their ideal flow. It means something did not work as expected. I think basically I do a lot of visual edits. I think a lot of visual edits edits to make sense. It's a more clear way of editing the code. It's something that saves time. I don't need to understand where I am in the project. I can see it immediately on stage. I can experiment much faster. Obviously I do write code, but it's because I'm used to writing code and I find myself writing less and less and less code. I think the most important thing that you get from all the visual tools and the code tools and everything else that is not LLM based is the immediacy. It's the fact that I can go here and I can ask the AI to make this. I want a blue background or a green background for this section, the card header. It's gonna take. If it's a fast AI, it's gonna take a few seconds and then I'm gonna see the color that it shows. It does not make sense. This is something I want to do like this and see it immediately on stage. And also when I'm done, I want to know that it's done. That's it. It's not gonna change. There's no other code writing gonna go on before this. And I think this is a. This is a big advantage, lets me play faster. And basically what we all want is to play faster. Now the AI gives us an amazing run with this for the initial generation for the big fins. It does it so much faster than I can do visually in code, in whatever other way I could imagine. But for changing stuff later, it's not the fastest option, it's not the most fluent option, it's not the option that I can get faster at. Also, if you look at how designers work in, in Figma or in people working the software where they're really, really proficient, they're lightning fast, they use all of the keyboard shortcuts. They do things so much faster than the 20 seconds, 10 seconds it takes you to first prompt it and then wait for the AI to do it. It makes sense for a lot of things, don't get me wrong, but for some things, it just doesn't so stick
- [45:34]
Akash
to visual editing for the most part.
- [45:36]
Nadav Nobrami
I don't know if for the most part it is taking maybe most more of my time because when I'm sending the AI to do something, I usually do something else. But I don't think most of the, definitely not most of the code being written by me is done visually. Most of it is done by AI.
- [45:57]
Akash
Got it. What are the biggest mistakes PMs make when editing?
- [46:01]
Nadav Nobrami
I think the. There's a number of things I'll start by answering because it's a multiple. I think it's. There's many places I can take this question. I'll take it to prompted first because I think editing through the AI has so much complexities in itself and so many places to be better at or you can go wrong at and you should really be careful about it. And I think the first thing is something we already hinted on. It's that basically you write in a prompt, maybe it understood you, maybe it didn't. And then it's going to run and do it and it's going to run so fast and it's going to be so eager to do exactly what it understood wrong from what you said. And I think that's like the one big thing that I see, and this is by the way, why. See, it's really important to go to plan mode, go to discuss mode, tell the AI I'm going to do this. What do you think? How do you understand me like you would with the developer? Sometimes it's not for anything. I wouldn't do it if I ask it to add something small to an existing page or something like that. If I'm changing something that's major, I'm going to have discussing. I'm going to discuss it with it first and only when the answer I get back makes real sense. And I'm going to make my questions such that it's not, not clear what it needs to answer to please me, right? If I say something like, do you think I can do this? Yeah, sure you can do this. I'd ask what do you think? Should I do this? And it's a totally different question. You're going to get a different answer and it's really, really important. Now another thing that I see is that people take the time to do research and then they create huge, huge, huge prompts and they pass it to the AI as one step. And there's tools to go around it in all kinds of a. We all build around this and build around the problem of context, which is like the major problem when building AI tools. I think a lot of the times what we do is not going to be as good as what you do when you build your prompt beforehand. So this is like an example of this is that I could say in this example that we did now, I could put everything, including the image in one prompt and say just add a feature and it's probably going to do a less not as good job on any one of the parts. AI has context switches just like people. It's more problematic with AI because when we have a context switch we usually stop and we think and it doesn't. It just works with the wrong data. So I think those are like the three main things that I would say when prompting.
- [48:47]
Akash
So we've built pretty good prototype. How do we make this the next level? How do we make this more complex? Whether it's multiple pages or hooking up into APIs, where do we go from here to make this a real world PM prototype?
- [49:01]
Nadav Nobrami
It's a really good question. Everything is possible. So I think the real question is what do we want to show? Because again, it's a server with very smart AI that really can connect anything we would want here. I don't know. Do you have any idea of what you would want to connect to this?
- [49:19]
Akash
I think multi page application is the next step, right, because most your prototypes are not just going to exist on one page. In fact, I think think one of the peak powers of prototyping is we used to build a prd, then the designers and developers would go build it and they would learn all these edge cases, they would have all these questions. So one of the most powerful things to do in prototype is to actually build out the end to end flow, actually look at everything. So one edge case we already know right here is what if you have less than three or four posts, that's one edge case that came in our mind. And then a flow that comes is, well, we have these post boxes, these cards essentially. Post 1, post 2, post 3, post 4, perhaps a user might want to click into them. So then we should probably design the experience. And so maybe that's the next step we can do is what happens if somebody clicks on post one box or post two box?
- [50:13]
Nadav Nobrami
Okay, let's do it. Let's add. What do you think it should open the sentiment page or the post page?
- [50:20]
Akash
I guess it should really open the post, but below it the post, instead of just showing the comments, it should show the comments along with how it coded the sentiment.
- [50:31]
Nadav Nobrami
Okay, so let's give it a Prompt. Basically when a scorecard. Is clicked, go to a new dynamic page, join that post. And have an explanation. Of all the sentiment. Was collected for it. Something like that. Perfect.
- [51:25]
Akash
As we said before, the clarity in this prompt is really important. So if we say how this sentiment was collected for it, it's going to deliver one thing versus if we said show me the coding of the comments. So be really careful with the prompt. But I like this prompt so let's go with the that.
- [51:40]
Nadav Nobrami
Okay. And maybe like and a way of seeing the comments according to sentiment. Okay.
- [52:00]
Akash
So while it's working here, we are building essentially a high fidelity prototype. Now it's even clickable. You can even go see other pages. When should PMs be building a high fidelity prototype?
- [52:12]
Nadav Nobrami
Well, it's really a matter of what you're trying to achieve. And I'm not just talking about the feature, it's what you personally are trying to achieve. A lot of cases a feature doesn't have the buy in of the organization yet. And high fidelity is a tool for selling. It's a way of showing everybody in the organization or the people that are the decision makers, the people that affect the decision maker how amazing this feature is going to be. And it's so works so much better with high fidelity. It has to look nice for that. If I added something ugly here, it'll be really hard to look at the functionality and not think about it. So I think high fidelity is first of all it's a tool for selling the idea. And this is also important for solo entrepreneurs. A lot of times you actually use that to get an investment. But also for PMs it's the same. The bigger the organization, it's going to be harder to sometimes convince people that the feature is necessary, that it's important, that it's something that needs to happen now. And this is a great tool for this cell. Second thing is that after you finish the ideation phase and you want to put it in front of users, usabilities work a lot less with low fidelity. And you have to have the entirety of the product in a way in low fidelity. If something is low fidelity in the middle of something that's high fidelity, that is one second, I'll just tell it. Okay, do it. So as I said, there's basically one thing is about selling it. Second thing is about usability and the fact that usability does not work well on low fidelity products and definitely not on Frankenstein products where you have something that's high fidelity and you patched on something that's Low fidelity fidelity. That works even less so in my experience and in what we're doing here. It's basically we do a lot of low fidelity ideation step prototypes. It's usually us that play around with them, just the team. And then when we choose one, it goes to high fidelity. It goes to high fidelity. Usually in vibe coding tools. The idea behind it is exactly to put it in front of users as fast as we can. And both talking to users that we already have and getting them on calls and try this in usability, especially if they asked for the feature, it's a godsend. It's really, if you have somebody that knows what he wants, he knows exactly how he wants the feature and you can let him play around with it and say, yeah, okay, that's what I meant. It does two things. It both keeps the user super motivated and it really gives you the strongest validation of the feature that you can get.
- [55:04]
Akash
Are there any cool workflows? I think like people these days, they're like taking some of these prototypes onto a site like usertesting.com just to get like 10 people to use it or something. Are there any of those types of workflows you would recommend PM's pick up?
- [55:18]
Nadav Nobrami
Definitely anything you can do to get people to play around with the product. But again, ideally it's not just some people, it's your users. So there's really no way of going around and, and there shouldn't be a way of going around having a personal contact to the most advanced users you have to the most engaged users you have to those that are willing to talk to you basically and getting them to try it makes so much more sense. And you really, you don't need anything but to jump on a video call with them and to have something published that they can play with a prototype, as simple as that. So again, maybe you in the start, maybe you need user testing for something like that. Maybe. But ideally it's your users and you're the one bringing them on for this.
- [56:12]
Akash
Yeah, you're going to get much better feedback from them. So I think a key takeaway for all the product leaders listening is if you aren't giving your PM as an AI prototyping tool and the ability to go talk to customers like that, have a few customers on speed dial, you are really handicapping them in this era. And if you are a PM who doesn't have that capability, go make the case, send them this video. But on top of that, try to build this into your normal workflow that before I build A feature. I'm going to go get a high fidelity prototype. Some of the users that I have on speed dial or who specifically requested this feature, I'm going to go put this in their hands. That's when you get the real benefits of this workflow. So I think it's completed. Can we see how the multi page application is looking?
- [56:55]
Nadav Nobrami
Okay, it's just validating the pages. I think we can already see the new page. Yeah. Okay, so
- [57:03]
Akash
because it's validating maybe.
- [57:05]
Nadav Nobrami
Yeah, yeah. It is fixing stuff. Yeah. Still it's almost done.
- [57:09]
Akash
So to summarize what we just covered for people, what we've done is we've built a high fidelity multi page prototype and we're going to see the result in a second. In order to reduce usability risk, in order to sell a feature, in order to explore an idea in to order. And these skills, what they're allowing you to do is a lot of the classic stuff we've talked about as a PM before AR prototyping tools, but just much better at a much higher fidelity.
- [57:34]
Nadav Nobrami
We used to have all department for this like we still have. It's not, but it used to be three developers doing all of the prototypes for so many features in weeks. A lot of them starting out in low fidelity, even before AI as functional prototypes. Okay, so one second, I'll go to preview.
- [57:59]
Akash
And there we go. That's what we requested. So most people watching, they might say, oh, I have some visual edits or I have some ideas on the layout to change. That's the point really is by doing this first prompt, simple prompt, you can go ahead and visually edit and then you can really build this up. So let's say they did all the visual edits. How do you hand this off to engineers after prototyping?
- [58:25]
Nadav Nobrami
There's a number of things I can do here and I think the main thing is that it's just standard code, but it's not even about the code because most of the time what really a developer wants is clarity of how you want it to behave. And just sending the prototype over does really 90% of the work. Second thing is that something is more specific, more complex, more it can save him a lot of time, a lot of the job, a lot of the work, to basically just download this project, put it next to the project he's currently building and tell cursor to just copy the experience from there. So a lot of the end of now it's basically in a way a code to agent the developer is using his own AI based Tools and they can basically, especially if you're using like the flow before we said that, we said before where you starting out from a template and then you have some changes to it. Having the template and the changes just tells the AI basically, okay, this is what the user edited. And basically if you start from a template, it's going to get that. It's basically the history of this project. It already has that once you download the project as git information. So just doing that, and that's basically what we do. We download the project, we put it next to the project we're working on, and for us it's dazzle and we tell the AI, copy the feature inside, copy the interaction inside. Now, I'm not saying that it's 100% definitely with complex products, the developer is going to need to wire some of the fins, probably to see that they work correctly. And it's really dependent on how the developer works with AI, because projects that work a lot with AI and developers that work a lot with AI, a lot of the information of how a feature needs to be written into their product, it's already there. So just having the information of the code itself and the prototype, that's usually the end of you want. And a lot of it can be automated.
- [60:37]
Akash
So I think you basically you just hit the publish button and then you share that link with them. It's as simple as that.
- [60:43]
Nadav Nobrami
That. Well, it's that it's also letting them get the code if they want it, which obviously is also something you can do here. We're editing git integration really, really, really soon. At that point it'll be much easier to give them just the git that you created so they can connect that basically to their ID and it can read the code from there. It's not as if they even need to download it anymore. The second thing is that we saw here before in the dev tool, this is basically the project. This is the entirety of the file system of the project. I can always just download it as a folder to my computer and I can also just take any file that I want. If I have a spec or anything else that I want to just have in the project, just drag it in there. It'll be added obviously. Now, you talked about workflow before and I think there's one thing that really is important in my workflow with AI and I think it's also something that a lot of PMs are going it and it's basically the idea of storing some of the data of the information of the Specs of different parts of the system in the system and it gives you a superpower. It's basically hitting that discuss mode we talked about before. Discussing an entire spec or entire aspect of the system with AI and then say, just saying okay, now write that to file. And that's an asset that is is also really important for the endof the developer or his AI are gonna get it with the rest of the files. It's not something else. But it's also really important for your iteration work with AI because you just have points of data that you can refer to it. You can manage some of the context. When it gets a bit bigger by yourself, you have for instance, in this case we could say just what is a sentiment analysis and how does it work? Even if it's. It's not there yet, having this information and something that's separate from the code means that now if I do another variation, I do another feature, I expand the feature, all of these places, I already have the context.
- [62:48]
Akash
Very important point and I actually want to double click on that a little bit. Let me share my screen here. So one of the hot topic questions that everybody is asking me is when do I use an AI prototype versus a prd? Do I have a prototype and a prd? So what is the role of the PRD Now?
- [63:08]
Nadav Nobrami
That's a really good question. I think first of all, PRDs are really important, but also really notorious. They have a number of problems in them. First of all is that it's a lot of text that people sometimes skim over and they miss some of the parts. Second thing is that everybody knows it takes a thousand words to describe one picture. And an application, if you put it down to pictures is like a thousand. So there's so much text and you're gonna not gonna cover it all. Some things you're gonna take as self explanatory, a lot of them because that's the way it works. And I think the prototype and the prd, they're not coming to replace each other. But for most people they're going to play around with the prototype and understand most of the things from the prototype. And in a way the PRD becomes something that is more useful for the AI. Even now I'm not saying it's not part of your deliverables, it is part of your deliverables. It is important. It's something that you need to see that makes sense. But if you do what we said before, if you manage it as something, as part of your project, the PRD as something that is a living part of the system you're building in a way, and you make sure that it is part of the prototype, then it's going to improve your prototype. Because one thing I can tell you is that the AI is going to probably read it and not skim it. And it means that it's going to create a sort of fidelity or mirroring between the PRD and the prototype. Now, now, it's not that we don't read the PRDs anymore, but they come second. They come as something that's for the edge cases for the fins that I didn't cover in the prototype, it'll cover a lot of fins that maybe didn't make sense. You talked about before the edge cases, the empty screen in the case of the sentiments and so on. Some of these fins are not going to be represented in your prototype. Prototype, right. We have a second edge case which is basically, we have too many posts. We didn't cover it. And I don't think that it's that important that we didn't cover it. But if it comes to a developer at that point between the PRD and the prototype, you don't want him to have any questions. I think that's like as a checklist for yourself, if you have anything that you feel like you need to say after somebody already read the PRD and played around with the prototype type, then something is missing. So it's, it's really a way both of covering all the edge cases and making sure that they're there. And it's important to understand that code costs more to develop costs code costs more to maintain and to tweak. And text is cheaper both in your time, your time to debug in it, because you don't need to debug text, you just need to read it. If it's an application, whenever you do a prompt you want might want to check different parts of it to see that everything works as expected and so on. It's so much simpler with text. So I would say cover the main 90% flows with the prototype and make sure that all of the edge cases are in the PRD.
- [66:28]
Akash
I really like this distinction. Cover your 90% flows in your prototype and then have all your edge cases in your prd. So that PRD plus prototype leads to no questions.
- [66:38]
Nadav Nobrami
Exactly.
- [66:38]
Akash
So to review everything we covered for you guys today, we talked about when should a PM use AI Prototyping vs other methods Ideation to feel production ready to sell an idea to reduce usability risk. And we talked about this ideal Workflow, you're going to explore the problem space, you're going to define a feature, you're going to match it to your design system like we did in step one. You're going to explore three to four divergent solutions. We explored two today. You're going to visually edit the best solution. We showed you how to do that. Then you're going to test it with real people, ideally your own users. And then you're going to share that prototype with a developer team. Is there anything else in this workflow PM should keep in mind?
- [67:12]
Nadav Nobrami
Have fun.
- [67:13]
Akash
Have fun with it.
- [67:15]
Nadav Nobrami
Yeah. I mean, you've got such amazing creation tools. I think about how much work I needed to do to create my first Flash game, my first interactive content, and you just get like the most magical genie that can build things for you. So, yeah, have fun with it. And it's really about the variations as well. Well, it's not being afraid to have fun and do a lot of variations.
- [67:38]
Akash
Yes. I would really emphasize this point. Three to four could even be low depending on what stage you are and what type of feature, how important that feature is. So before I let you go, Nadav, I have a couple hot questions for you. Hot question number one is why did you build Dazzle as a separate company and not inside of wix?
- [67:57]
Nadav Nobrami
There's so many answers to this one. WIX is a giant company and it's the most amazing giant company. I had so much luck being a founder of this incredible company. It is also a big company. And big companies in many ways, especially public companies, they are limited in how fast they can move. WIX is amazing in that regard, by the way. It moves really fast, but it's no startup. So I think in this time where everything is so volatile and changing so fast, I wanted to get on top of it. And that's one of the reasons. Second reason is the team that I have with me. I have the most amazing team of 30 people. Some of them working with me more than 10 years, built a number of the WIX editors, really amazing people. The superstar developers and superstar, well, everything you can imagine in a startup. And some of them have been with me for, as I said, more than 10 years. But they really. Wix is 20 years old almost or just now. So if you look at it, when they joined Wix, it was already kind of a big company and we love working together. I don't want to stop working with them, but I think they should have their own company by this point. So it's also about the people and giving them an opportunity because I think as a startup they have much more ownership and much more stake in the game and if they win a bigger cash out also. So this is, I think the second thing, third thing is that when I look at what we're building and where we're taking it and what we believe at Dazzle, it's very different from wix. WIX has always been about simplicity, about targeting. Do it yourself, but also do it for me, but. But not the professional high tech community as such. And I think what we're doing with Dazzle aims a lot more with professionals. So it made sense in that regard also to split it.
- [70:08]
Akash
And the final hot question here, if we see the progress that this has made since Chad GPT released three years ago, it's been phenomenal. If you forecast out three, five more years, we can only expect this to get much, much better. Is there a point where AI starts to replace developers or replace product manager? What's your forecast for the future? And specifically like, how should PMs be preparing themselves for whatever's happening in the next three to five years with AI?
- [70:36]
Nadav Nobrami
Well, three to five years, I don't know if AI is going to replace developers. It's going to replace some very simple things, development tasks in a way. Well, I think it does, is it blurs the lines between developers and just tech savvy people. If you want to become tech, tech savvy is somebody that wants to be tech savvy. It's somebody that wants to bother and understand a bit about what's going on inside. And really. Because writing code is not a limiting factor anymore. I think what PMs really need to do is level up the skill of understanding what they're building. Because I know it's. Again, it's talking dirty because the PMs don't want to be developers and they're right. It's something different, it's something else and they're totally. It's such an important and interesting job to just bring in the input and design the feature. But I think sometimes now, now with these superpowers, you can just become unblocked. I see our product managers at Dazzle, they're pushing code into the main project as well. Not huge things, not like starting out and, I don't know, not building a huge new feature. But if we want to change the publish dialog, if we want to change the media gallery, if we want to, not just visual stuff, sometimes we want to add a link to some other back office we have and stuff like that this is done by the product managers and the designers, not by the developers many of the times. And it's going to grow more right. When writing code is not a problem, in a way, the developers become the gatekeepers. They're in charge of making sure the code still makes sense in the end, but they're not going to be the only contributors of code. So one thing I'd suggest is level up. It's basically understand that the fact that you're not a developer doesn't mean that you don't write code anymore. I mean, obviously you don't type the code right, but you don't even have to type anything, just put it on speaker and talk to it. But you can contribute code and you should contribute code and it should be something small at the start. I think it's a level up that all of your organization is going to say, see, it's not going to be simple. Maybe politically just making the organization accept that PMs are starting to put in code. But I think it's so worth it. And if you get your organization to do this, it's a huge level up. And also there's something you can do to start getting ready for it, which is basically sit down with whatever AI tool you want that has access to your project, to the actual project that your company is working on and start asking it question, ask it for a high level diagram, ask it for whatever you want to basically understand bit more about the architecture. I think it's, it's a muscle, it's really something you can practice, you can look at and you can also practice it on different applications if you build something in whatever vibe coding tool you want. Not all of them have the amazing tools Dazzle have for looking at the output, but all of them have an amazing AI developer that can read the code and tell you stuff about it. And I think it's going to teach you how to talk to the developers better. Also just talking to the AI about the code a bit, asking it about the big concept that's going to teach you so much. And if you do it on your project, that's amazing, you're going to have a common language with the developers in the team that you never had before.
- [74:13]
Akash
What a great way to end it. Guys, we just walked through using Dazzle as a case study, but more importantly, all the fundamental skills for AI prototyping. We talked about the importance of not just jumping into your AI prototype, but exploring the problem space once you actually build your AI prototype, making sure it conforms to your design system, making sure you're exploring different divergent solutions and then testing it with your users. I promise you, if you implement the things that Nadav taught you today into your work, you will be a better pm. More of your features will be successful. They will have a greater impact. So go out there, stop watching now. Start using a tool, whatever tool you have access to. Hopefully you have access to a tool like Dazzle. You can get a free month of Dazzle if you use my code, which is below in the description. So don't let that be your blocker. Get started today and I'll see you in the next episode.
- [75:10]
Nadav Nobrami
Can I say one more thing, Akash?
- [75:12]
Akash
Yes.
- [75:13]
Nadav Nobrami
Okay, so one thing. If I can sum up and say we keep working on new features. If you come and use Dazzle and you want to see it from the other side, how this usability looks, don't just use the coupon. Give us a holler on discord on the email, wherever you want, talk to us and you'll get to see one of these experiences from the other side, which is I think super interesting as well.
- [75:40]
Akash
Yeah, take both sides of the chair, give them some feedback and see it on the other end. Thanks so much, Nadav.
- [75:47]
Nadav Nobrami
Thank you. It's been a pleasure, Akash.
- [75:49]
Akash
Hi everyone. I hope you enjoyed that episode. If you could take a moment to double check that you have followed on Apple and Spotify podcasts, subscribed on YouTube, left a rating or review on Apple or Spotify and commented on YouTube. YouTube. All these things will help the algorithm distribute the show to more and more people. As we distribute the show to more people, we can grow the show, improve the quality of the content in the production to get you better insights to stay ahead in your career. Finally, do check out my bundle@buildle.akashtri.com to get access to nine AI products for an entire year for free. This includes Dovetail, Mobin, Linear, Reforge, Build, descript, and many other amazing tools that will help you as an AI product manager or builder succeed. I'll see you in the next episode.