What I love the most. Finally someone talking about TOKENS and cost of using AI. Those are rare things not - everyne is overhyping AI as selling ferrari without telling about fuel consumption and costs of maintnance.
I appreciate how you deliver useful information in a clear, straightforward manner, unlike others who tend to be overly dramatic. Keep up the excellent content!
Straightforward with no theatrics. Really appreciate it. I was blown away by the "Apply theme" part of it. If invention is about combining what's out there in creative ways, then this video is certainly inventive !
This video was published at a very important time as I’m building a dashboard and was frustrated with Bolt. But by combining Bolt and Claude, the process was smooth. Thank you thank you thank you far too kind ❤
While I've been working with AI tools to generate code for a while I have never thought about telling AI to apply a specific theme. Thanks, that was cool!
This is actually one of the best I have seen unlike all the useless todo apps that don't reflect day to day development. Please can you share prompts and step by step guide on how this was achieved. Thanks
@@AI.TooltipWould love to see a more detailed video. There are plenty of ai and no code Channels from programming guys so i really love to see someone approaching this more from the designing background. 🎉
I super appreciate this tutorial! You helped break down the barrier to entry for me. I experimented with this today with pretty good results. One thing to note about Bolt (not this tutorial which was great), I wanted to have a finished prototype to share with my team so I ended up going with a paid plan on Bolt. Annoyingly, when I was prompted to upgrade, the previous prompts I had entered where lost and I had to start over. Anyways, it took me three hours to have a three page clickable prototype. Neat!
Awesome! i’m glad it worked out at the end! These ai tools are still a little finicky but we’re at the forefront of this movement. they will get better quickly. Thank you so much for your contribution to my channel!! I really appreciate it. Let me know if you need any help.
Wow! Great video. Time to start the business I have been noodling on for 2 years. I now know enough to get started. You just saved me about 2 years of procrastination!
I'm actually so sick and tired of AI tutorials, mostly because they overpromise and oversimplify things, but this was actually refreshing. Liked and subbed dawg. Keep it up ✌️
Brilliant! Today I started the process of learning Figma on youtube, watched a movie for fun and then your video came up. Call it 'happenstance'! I call it a Blessing. Woo hoo! Gonna try your amazing process. Wish me luck! :) 💕
@@AI.Tooltip I'm new to these processes. Do you have a printout of all that you present in this video, so I can copy the structures and details, replacing text with my design and requirements? This would be very helpful :) 💕
@@AI.Tooltip I've spent 4 hours of this. Bolt just does not have the capacity to produce working code. It has failed and continues to fail endlessly. Maybe you can only build extremely simple applications at present before Bolt debug their product for real complex jobs. Very frustrating.
I’m not a designer, but I genuinely enjoy every one of your videos. You’re inspiring me to get creative with everything I’m learning from you! Also you're cute ☺️
"Absolutely loved this video! 🎥 Your vision and creativity shine through every frame. The attention to detail and unique storytelling truly sets your work apart. Can't wait to see what you come up with next!"
So great! Right now I am getting into Frontend Development, still learning. I also always wanted to create really user-friendly experiences and thus, needing a handy approach for grasping visual understanding of what I want to create. Helps 1000x! Looking forward to trying this myself :).
Excellent video breakdown. I have been using a similar proces. There's a button to have AI rewrite your prompt in a more optimized way. It can translate your prompt from multiple languages and really improve it so really try that out.
Thank you very much for this excellent content. Something that would make this and other videos even more instructive would be a transcript of the exact prompts that you used on the video(s) to get your results.
Thank you for the support and the suggestion. I'll keep that in mind. Here are the prompts in order: "I want to create a website for sharing experiences in any city, the goal is to let users explore experiences, add their own experience or rate experiences. the home page should start with the city closest to the user's location and show popular experiences. you can search for something specific using filters. to add an experience you can add photos, links, location, plain text and rating for multiple criteria. the user also has the option to save experiences. please give me a structure for this web app" "now give me a technical requirements document in a beautiful html format" "create a user flow chart" "now give me the contents of the home page in a wireframe"
this is awesome you explain the details very well especially for someone who has zero coding skills and seeing bolt as a great tool but there is alot of unanswered questions for newbies. maybe you can show the difference between the paid and free and how to host the application after its created just a thought? Keep making these great videos you just got me as a subscriber keep up the great work and thanks in advance.
🎯 Key points for quick navigation: 00:00 *🚀 Introduction to AI-Driven Design Process* - The speaker shares a shift to an AI-based workflow, moving away from traditional design processes, - AI has reshaped their approach, focusing on efficiency and creating a functional web application from scratch with only two AI tools. 00:35 *👤 Introduction and Purpose* - Introducing the speaker and explaining the challenge of replacing traditional tools with AI while maintaining efficiency, - Traditional workflows, such as prototyping and handing off to developers, are considered outdated in the face of AI capabilities. 01:01 *⚙️ Transition to Functional Design Process with AI* - The new AI-enabled process allows creating coded, functional prototypes instead of traditional clickable prototypes, - Emphasizes that designers or developers can now handle both design and development seamlessly. 02:23 *🔄 Adaptable Process with AI Tools* - AI-based workflow is flexible, with tools and steps that may vary depending on team dynamics or project needs, - Two main tools highlighted: Claude (for structure) and Bolt (for coding and functionality). 02:49 *🌆 Using AI to Define Structure and Technical Needs* - Detailed product structure is defined using Claude, with emphasis on including features like filtering and saving experience data, - User flowcharts and technical requirements are prepared for development handoff or self-completion. 04:14 *🎨 Functional Prototyping with Bolt* - The process starts with Bolt to generate a functional prototype based on design specifications, - UI elements and overall design are prioritized, omitting initial technical aspects like authentication for early design focus. 05:09 *🌈 Designing the Theme with MidJourney* - MidJourney is used to create a theme by generating images that inspire UI design elements, - Resulting themes are integrated into the UI, making it visually consistent and aligned with the design vision. 06:32 *🧩 Finalizing UI Elements and Pages* - Bolt is iteratively prompted to refine layout and page structure, focusing on aspects like grid layouts and filtering options, - Completes key pages like details and experience addition, resulting in a fully responsive, functional prototype. 07:29 *🌐 Deploying and Extending the Prototype* - The functional prototype can be deployed for live testing and shared with others, - Further functionalities like authentication and API integration can be added later through Bolt’s natural language prompts. 07:56 *📐 Creating a Style Guide with Bolt* - Screenshots of the design are used in Bolt to generate an interactive style guide for team collaboration, - Style guides facilitate consistency when working with other designers or developers. 08:21 *⚠️ Tips for Using Bolt Effectively* - Advises on handling multiple prompt requests, suggesting limiting each to two specific requests to avoid processing issues, - Recommends using Bolt’s revert feature to restore previous versions if the system encounters errors during iterative changes. 09:42 *💰 Bolt’s Token System and Project Cost Efficiency* - Describes token usage for Bolt, noting that the project required 1 million tokens and discussing free versus paid options, - For extensive projects, the daily free token limit may require a phased approach to completion. 10:10 *📢 Closing and Invitation to Engage* - Encourages viewers to ask questions and share feedback about the AI-driven design process, - Invites subscriptions to stay informed on new AI tools for design and development. Made with HARPA AI
Thank you that is a genius for me to use a workflow and then feed that to the AI to be able to build the app because I've had bolt just completely destroy all the controls for my app when asking to add a new control. Also there's a lot of things that I want both to do but I can't really explain it to him but you use animations that can be used with different objects. It'll try to animate each object individually with a new animation.
What you do here is a quite familiar software development process i think. Youre dividing the project in frontend and backend, so that makes alot sense for me since ai models are still to chaotic to handle many parrallel tasks. Still wondering if the ai agent will remember all places correctly when adding backend dependencies
Sure! Here are the prompts in order: "I want to create a website for sharing experiences in any city, the goal is to let users explore experiences, add their own experience or rate experiences. the home page should start with the city closest to the user's location and show popular experiences. you can search for something specific using filters. to add an experience you can add photos, links, location, plain text and rating for multiple criteria. the user also has the option to save experiences. please give me a structure for this web app" "now give me a technical requirements document in a beautiful html format" "create a user flow chart" "now give me the contents of the home page in a wireframe"
Thanks for the video. I started using bolt. One tip is that don't upload csv files with lots of rows, i think i used lot of tokens because the file was soo huge. i had 4 million tokens consumed in about half a day. i think this was due to the large file size being part of the chat / conversation.
Would be amazing if there was a way to keep track of variations all in one place. Similar to how when you design you try a few options in layout, colors, contrasts and end up landing on a specific one.
As a UX Engineer who does a little bit of design and development, how do you think employers will feel about staff using AI tools for both design and development? Will this be a welcome change in the name of speed?
Absolutely, I’m already seeing companies embrace AI by only hiring designers who implement it in their workflow. Thus reducing team sizes. As you said, in the name of efficiency and less overhead. I talked about this in more detail in this video: The State Of AI In UI/UX - 2025 Look Ahead ua-cam.com/video/tYHkYaSVhcI/v-deo.html
interesting, I use a similar workflow as a developer. I start with a broad draft from a large LLM like Claude or ChatGPT, then refine it. After that, I have ChatGPT generate the initial prompt for a tool like v0
Here are the prompts in order: "I want to create a website for sharing experiences in any city, the goal is to let users explore experiences, add their own experience or rate experiences. the home page should start with the city closest to the user's location and show popular experiences. you can search for something specific using filters. to add an experience you can add photos, links, location, plain text and rating for multiple criteria. the user also has the option to save experiences. please give me a structure for this web app" "now give me a technical requirements document in a beautiful html format" "create a user flow chart" "now give me the contents of the home page in a wireframe"
Great Video. What is the database of your choice for storing information? I see Supabase and Firebase as the most common databases being paired with bolt.
This is fantastic! Keep it up! Question. If I wanted to move these designs into Figma for any reason, would I be able to do it via Bolt (assuming not) or would I have to make use of UX Pilot like you showcased in another video of yours?
cool video. not gonna lie, it'd be nice to see a slowed down version too. like the whole process end to end with some "directors commentary" over it all. Just like I learn when I watch other designers use figma, i'm sure there are things that I'd learn. like an hour long video? I am game!
Good tools, can be used for inspirations, using it entirely results in lifeless product. There's a reason some designers still do pen & paper wireframes. Maybe useful for freelancers that churns out mid similar looking designs everyday, or small projects.
Hy mate nice video please make detail video how we can Deploy full style with database and login authentication in detail make full live project make this videl its help a lots for us. Thanks for your video nice ❤
I'm not a developer but I watched countless videos on UA-cam of experts commenting on the quality of the generated code in Bolt, and overall it seems surprisingly good and clean.
That is awesome. Easy results in a few steps. One hint to improve your videos: your voice is very monotone. No variation in tonality. It is hard to listen to you. You have such a great channel and content, make your voice match the other parts, would elevate everything. Thank you.
I experimented with ChatGPT and the Replit AI agent, but I encountered issues completing the project as the code kept crashing. While these tools work well for simpler designs, they tend to become problematic with more complex projects. any tips please let me know
If you have no coding skills then yes, Bolt is easier to use. Cursor is better if you want to do some manual coding. And in general I found that Bolt creates better looking UIs.
You, sir, are on the cutting edge. Unfortunately, there are millions of current designers stuck in businesses who are not only doing it. The old way, they are doing it the ancient way, a process that involves upwards to 12 people to do with you and AI can do today at 5X the amount of efficiency and speed.
Honestly I don’t think you need the human component if you’re creating a product for its functionality. there’s no reason to do things less efficiently just to have a “human component” unless you’re creating art or media.
![Lp. Сердце Вселенной #60 РОЖДЕНИЕ ЛОЛОЛОШКИ [Финал] • Майнкрафт](http://i.ytimg.com/vi/YoR0pAV9FVQ/mqdefault.jpg)
Thanks!
Thank you!!
What I love the most. Finally someone talking about TOKENS and cost of using AI. Those are rare things not - everyne is overhyping AI as selling ferrari without telling about fuel consumption and costs of maintnance.
I appreciate how you deliver useful information in a clear, straightforward manner, unlike others who tend to be overly dramatic. Keep up the excellent content!
Great to hear! I appreciate the feedback!
I second this!
I appreciate that this comment was written by AI.
@@jameshunt4603 yes... we are all agents of some intelligence ! aren't we? some of us are living in datacenters others in tiny apartments. 😂
@@cuios I don’t believe you are ‘living’ at all.
Straightforward with no theatrics. Really appreciate it. I was blown away by the "Apply theme" part of it. If invention is about combining what's out there in creative ways, then this video is certainly inventive !
When you said “use this theme” I was BLOWN AWAY! 😮
Likee I was super amazed
This video was published at a very important time as I’m building a dashboard and was frustrated with Bolt. But by combining Bolt and Claude, the process was smooth. Thank you thank you thank you far too kind ❤
Amazing! i’m so glad the video helped you! let me know if you have any questions.
While I've been working with AI tools to generate code for a while I have never thought about telling AI to apply a specific theme. Thanks, that was cool!
I'm glad it was helpful! Thanks for letting me know!
This is actually one of the best I have seen unlike all the useless todo apps that don't reflect day to day development. Please can you share prompts and step by step guide on how this was achieved. Thanks
Awesome! I will upload more detailed videos in long-form. stay tuned!
@@AI.TooltipWould love to see a more detailed video. There are plenty of ai and no code Channels from programming guys so i really love to see someone approaching this more from the designing background. 🎉
Hi Jad, excellent non nonsense approach. With this new paradigm you are changing the game - and helping us in the process. Thanks!!!
Thank you for the awesome feedback!
I'm definitely going to copy your new work flow. Genius dev model...
Man you are a gem to the internet, I can see you in 1 million subscribers soon. You got a sub...
dude: nicely explained. Makes perfect sense and have now signed up. thanks!
I super appreciate this tutorial! You helped break down the barrier to entry for me. I experimented with this today with pretty good results. One thing to note about Bolt (not this tutorial which was great), I wanted to have a finished prototype to share with my team so I ended up going with a paid plan on Bolt. Annoyingly, when I was prompted to upgrade, the previous prompts I had entered where lost and I had to start over. Anyways, it took me three hours to have a three page clickable prototype. Neat!
Awesome! i’m glad it worked out at the end! These ai tools are still a little finicky but we’re at the forefront of this movement. they will get better quickly.
Thank you so much for your contribution to my channel!! I really appreciate it.
Let me know if you need any help.
Just mind blowing 🤯
For this you've earn a new subscriber ❤️
Need more Masterclass like these
Wow! Great video. Time to start the business I have been noodling on for 2 years. I now know enough to get started. You just saved me about 2 years of procrastination!
Amazing! So happy to hear that!
Enjoy the process, and good luck!
That is very useful, thanks for sharing it in such a clear way!
this approach is magic sauce. thanks man, ya3tik l 3afyeh.
I'm actually so sick and tired of AI tutorials, mostly because they overpromise and oversimplify things, but this was actually refreshing. Liked and subbed dawg. Keep it up ✌️
Awesome! thanks for the feedback and support!
Wonderful guide and tips !! Thank you immensely for your videos, I look forward !
You've knocked it out of the park, once again. Thank you 🙏
Awesome! Thank you!!
Great work thanks for sharing I am a loyal subscriber and consumer of your content. Thanks once again for sharing. Awesome work
Brilliant! Today I started the process of learning Figma on youtube, watched a movie for fun and then your video came up. Call it 'happenstance'! I call it a Blessing. Woo hoo! Gonna try your amazing process. Wish me luck! :) 💕
Wonderful! good luck!
Enjoy the process!
@@AI.Tooltip I'm new to these processes. Do you have a printout of all that you present in this video, so I can copy the structures and details, replacing text with my design and requirements? This would be very helpful :) 💕
Check out my newest video, I have all the prompt details there:
ua-cam.com/video/wMPyghO7S60/v-deo.html
@@AI.Tooltip I've spent 4 hours of this. Bolt just does not have the capacity to produce working code. It has failed and continues to fail endlessly. Maybe you can only build extremely simple applications at present before Bolt debug their product for real complex jobs. Very frustrating.
Wow ,that's Awesome tutorial. Much Love from Africa's biggest tech hub, Nairobi KE❤.
The cats are cool as well 😻, had to sub
Thank you for the nice words! Awesome to have you on board.
Cheers and love to your community!
I’m not a designer, but I genuinely enjoy every one of your videos. You’re inspiring me to get creative with everything I’m learning from you! Also you're cute ☺️
Owww so glad to hear that!! thanks ❤️
"Absolutely loved this video! 🎥 Your vision and creativity shine through every frame. The attention to detail and unique storytelling truly sets your work apart. Can't wait to see what you come up with next!"
Thank you for this amazing feedback! ❤️
Wow this was an amazing clip, it changes things considerably, I am more of a developer than a designer, and this process changes the game big time.
Quite interesting! So we need to start rethinking the whole 'Design Process' 👀
Another banger. Thank you.
This was a really amazing tutorial! Thank you so much!
Glad it was helpful!
Love this!! I gotta learn more about refining the design workflow. Thanks for posting❤
Thanks for the feedback! Glad it was helpful!
As a Back-End Heavy FullStack Engineer: This video is PURE gold! I dont have to pay for designers anymore.
Thanks a lot bro!
Awesome!!
I share the same sentiments. Design is always a pain for me. Thanks @AI.Tooltip
Stay tuned for the new video on Saturday. It will help devs even more!
Haha we don't need a front end dev.
@@heavenstarhilary2817 thats for sure hahaha
So great! Right now I am getting into Frontend Development, still learning. I also always wanted to create really user-friendly experiences and thus, needing a handy approach for grasping visual understanding of what I want to create. Helps 1000x! Looking forward to trying this myself :).
Nice! Good luck with your journey!
Missy helpful video I've watched in a while!.. Thanks for this! 🔥🔥👏🏽👏🏽
Awesome! thanks for the feedback!!
Thanks for sharing this amazing process of creating UI🎉 it helps a lot!!
great video, came at the perfect time
That’s amazing mate! This kind of tool will open many doors.
C'est franchement chouette. Well done ! Makes me embrace the AI shift
Thanks for the tutorial, something i'd use in my workflow.
This is an awesome video for real.
Excellent video breakdown. I have been using a similar proces. There's a button to have AI rewrite your prompt in a more optimized way. It can translate your prompt from multiple languages and really improve it so really try that out.
Thanks for the tip!
this was absolute gold
Thanks for sharing ❤
Thanks for watching!
Thank you very much for this excellent content.
Something that would make this and other videos even more instructive would be a transcript of the exact prompts that you used on the video(s) to get your results.
Thank you for the support and the suggestion. I'll keep that in mind.
Here are the prompts in order:
"I want to create a website for sharing experiences in any city, the goal is to let users explore experiences, add their own experience or rate experiences. the home page should start with the city closest to the user's location and show popular experiences. you can search for something specific using filters. to add an experience you can add photos, links, location, plain text and rating for multiple criteria. the user also has the option to save experiences. please give me a structure for this web app"
"now give me a technical requirements document in a beautiful html format"
"create a user flow chart"
"now give me the contents of the home page in a wireframe"
@@AI.Tooltip Lol - ok, thanks! I thought that they were some of these very complex prompts.
Very cool! 👏 Would love to see this on a real project, working with devs, PMs and so on.
this is awesome you explain the details very well especially for someone who has zero coding skills and seeing bolt as a great tool but there is alot of unanswered questions for newbies. maybe you can show the difference between the paid and free and how to host the application after its created just a thought? Keep making these great videos you just got me as a subscriber keep up the great work and thanks in advance.
Thank you for the sub and the great feedback! I'm working on more detailed videos. I will keep your suggestions in mind. Cheers!
🎯 Key points for quick navigation:
00:00 *🚀 Introduction to AI-Driven Design Process*
- The speaker shares a shift to an AI-based workflow, moving away from traditional design processes,
- AI has reshaped their approach, focusing on efficiency and creating a functional web application from scratch with only two AI tools.
00:35 *👤 Introduction and Purpose*
- Introducing the speaker and explaining the challenge of replacing traditional tools with AI while maintaining efficiency,
- Traditional workflows, such as prototyping and handing off to developers, are considered outdated in the face of AI capabilities.
01:01 *⚙️ Transition to Functional Design Process with AI*
- The new AI-enabled process allows creating coded, functional prototypes instead of traditional clickable prototypes,
- Emphasizes that designers or developers can now handle both design and development seamlessly.
02:23 *🔄 Adaptable Process with AI Tools*
- AI-based workflow is flexible, with tools and steps that may vary depending on team dynamics or project needs,
- Two main tools highlighted: Claude (for structure) and Bolt (for coding and functionality).
02:49 *🌆 Using AI to Define Structure and Technical Needs*
- Detailed product structure is defined using Claude, with emphasis on including features like filtering and saving experience data,
- User flowcharts and technical requirements are prepared for development handoff or self-completion.
04:14 *🎨 Functional Prototyping with Bolt*
- The process starts with Bolt to generate a functional prototype based on design specifications,
- UI elements and overall design are prioritized, omitting initial technical aspects like authentication for early design focus.
05:09 *🌈 Designing the Theme with MidJourney*
- MidJourney is used to create a theme by generating images that inspire UI design elements,
- Resulting themes are integrated into the UI, making it visually consistent and aligned with the design vision.
06:32 *🧩 Finalizing UI Elements and Pages*
- Bolt is iteratively prompted to refine layout and page structure, focusing on aspects like grid layouts and filtering options,
- Completes key pages like details and experience addition, resulting in a fully responsive, functional prototype.
07:29 *🌐 Deploying and Extending the Prototype*
- The functional prototype can be deployed for live testing and shared with others,
- Further functionalities like authentication and API integration can be added later through Bolt’s natural language prompts.
07:56 *📐 Creating a Style Guide with Bolt*
- Screenshots of the design are used in Bolt to generate an interactive style guide for team collaboration,
- Style guides facilitate consistency when working with other designers or developers.
08:21 *⚠️ Tips for Using Bolt Effectively*
- Advises on handling multiple prompt requests, suggesting limiting each to two specific requests to avoid processing issues,
- Recommends using Bolt’s revert feature to restore previous versions if the system encounters errors during iterative changes.
09:42 *💰 Bolt’s Token System and Project Cost Efficiency*
- Describes token usage for Bolt, noting that the project required 1 million tokens and discussing free versus paid options,
- For extensive projects, the daily free token limit may require a phased approach to completion.
10:10 *📢 Closing and Invitation to Engage*
- Encourages viewers to ask questions and share feedback about the AI-driven design process,
- Invites subscriptions to stay informed on new AI tools for design and development.
Made with HARPA AI
Thank you 🙏🏻 extremely helpful 👍🏻
You gave me the idea where i was stuck its a bit unrelated to this but rather to use cases i need to write
Awesome! Good luck!
This is actually insane!
Thank you that is a genius for me to use a workflow and then feed that to the AI to be able to build the app because I've had bolt just completely destroy all the controls for my app when asking to add a new control. Also there's a lot of things that I want both to do but I can't really explain it to him but you use animations that can be used with different objects. It'll try to animate each object individually with a new animation.
Great video! Thanks for sharing
What you do here is a quite familiar software development process i think. Youre dividing the project in frontend and backend, so that makes alot sense for me since ai models are still to chaotic to handle many parrallel tasks.
Still wondering if the ai agent will remember all places correctly when adding backend dependencies
Great content! Thanks!
Went to the same transformation. Crazy days. ❤
Nice video, thank you!
Awesome!
Thanks for this, super useful and clear. Mini request if there any chance to share the claude prompt so we can go over and check the steps in detail?
Sure! Here are the prompts in order:
"I want to create a website for sharing experiences in any city, the goal is to let users explore experiences, add their own experience or rate experiences. the home page should start with the city closest to the user's location and show popular experiences. you can search for something specific using filters. to add an experience you can add photos, links, location, plain text and rating for multiple criteria. the user also has the option to save experiences. please give me a structure for this web app"
"now give me a technical requirements document in a beautiful html format"
"create a user flow chart"
"now give me the contents of the home page in a wireframe"
Awesome. Curious if there´s a way to migrate those static designs (more simple ones) into wordpress, (gutenberg compatible?)
Fantastic!
Dude, you shine
God bless you!
Thank you so much!! I really appreciate your contribution and motivation ❤️
Great video my friend
Thanks for the video. I started using bolt.
One tip is that don't upload csv files with lots of rows, i think i used lot of tokens because the file was soo huge. i had 4 million tokens consumed in about half a day. i think this was due to the large file size being part of the chat / conversation.
Oh thanks for the tip!
Would be amazing if there was a way to keep track of variations all in one place. Similar to how when you design you try a few options in layout, colors, contrasts and end up landing on a specific one.
Loved it, thank you 🙏
Awesome!
As a UX Engineer who does a little bit of design and development, how do you think employers will feel about staff using AI tools for both design and development? Will this be a welcome change in the name of speed?
Absolutely, I’m already seeing companies embrace AI by only hiring designers who implement it in their workflow. Thus reducing team sizes. As you said, in the name of efficiency and less overhead.
I talked about this in more detail in this video: The State Of AI In UI/UX - 2025 Look Ahead
ua-cam.com/video/tYHkYaSVhcI/v-deo.html
Good job. 🎉
interesting, I use a similar workflow as a developer. I start with a broad draft from a large LLM like Claude or ChatGPT, then refine it. After that, I have ChatGPT generate the initial prompt for a tool like v0
Yea perfect! that’s exactly what i’m trying to deliver in this video. All you need is an LLM to guide your project and a coding tool to make it 😊
Hey, Can we get a demo for Cursor ?
Great vid
Nice video man. Thanks. Do you mind in sharing the prompts for Claude in the beginning?
Here are the prompts in order:
"I want to create a website for sharing experiences in any city, the goal is to let users explore experiences, add their own experience or rate experiences. the home page should start with the city closest to the user's location and show popular experiences. you can search for something specific using filters. to add an experience you can add photos, links, location, plain text and rating for multiple criteria. the user also has the option to save experiences. please give me a structure for this web app"
"now give me a technical requirements document in a beautiful html format"
"create a user flow chart"
"now give me the contents of the home page in a wireframe"
Looks cool
Great Video. What is the database of your choice for storing information? I see Supabase and Firebase as the most common databases being paired with bolt.
Thank you!
I use Supabase. I included it in my other video right after this one.
This is fantastic! Keep it up! Question. If I wanted to move these designs into Figma for any reason, would I be able to do it via Bolt (assuming not) or would I have to make use of UX Pilot like you showcased in another video of yours?
Thanks for the feedback!
Yea, you would have to take a screenshot and convert it to UI in UX Pilot, then import it to Figma.
Thats sick though, nice workflow, i would copy that too
This is Crazy! OMG
Jaaz! Can you do part two of this pleae?
could you upload a design system / brand book guidelines instead of an image?
If you attach a screenshot of the design system it should work, but only for colors and maybe styles.
cool video. not gonna lie, it'd be nice to see a slowed down version too. like the whole process end to end with some "directors commentary" over it all. Just like I learn when I watch other designers use figma, i'm sure there are things that I'd learn. like an hour long video? I am game!
Thank for that! Working on longer videos!
nice one. bro
I didn't know Claude does as much... cool.
Yeah Claude is amazing! I have two videos just on Claude if you wanna know more.
Good tools, can be used for inspirations, using it entirely results in lifeless product.
There's a reason some designers still do pen & paper wireframes.
Maybe useful for freelancers that churns out mid similar looking designs everyday, or small projects.
can you please share me this prompt that you added in claude and bolt to understand what type of propmt i need to give for my App
Claude😍
Sensacional, meus parabéns 🎉
Magnifico!!
Hy mate nice video please make detail video how we can Deploy full style with database and login authentication in detail make full live project make this videl its help a lots for us.
Thanks for your video nice ❤
Okay sure!
Thanks for the feedback!
@@AI.Tooltip yes am waiting for it
Really interesting workflow! Do you have a coding background? Have you or an expert you know reviewed the quality of the code that's generated?
I'm not a developer but I watched countless videos on UA-cam of experts commenting on the quality of the generated code in Bolt, and overall it seems surprisingly good and clean.
@AI.Tooltip interesting. I'll give it a shot
يعطيك العافية جاد بدنا دروس اكتر حبيب
Eh akid, no problem!
I noticed a lot that it stops when it loads things that wants funds ... that makes huge problems i cant fix it.
That is awesome. Easy results in a few steps.
One hint to improve your videos:
your voice is very monotone. No variation in tonality. It is hard to listen to you.
You have such a great channel and content, make your voice match the other parts, would elevate everything. Thank you.
This is great
How did you post the project to bolt? Did you combine the entire conversation?
I just attached the requirements and the wireframe that I generated with Claude
i love this toturial, but can y give ai tools like bolt but for html, css, js and php support ?
Yes but no PHP support in bolt
I experimented with ChatGPT and the Replit AI agent, but I encountered issues completing the project as the code kept crashing. While these tools work well for simpler designs, they tend to become problematic with more complex projects. any tips please let me know
Can you do the same thing for mobile apps? I’m not sure if bolt works with mobile but I’d imagine that workflow can stay the same?
Yes it works for mobile. It automatically installs all the necessary tools and packages.
Please make the video more detailed and also provide all prompts pleaseeeeeeeeeee !!!
Sure no problem!
@ if possible can you share the prompts of this video
Would you offer office hours or online classes? Would love to join one day.
Awesome! i’m planning something like that soon. thanks!
What do you prompt midjourney to get those ui elements and like prototype
I mentioned the keywords 5:33, you can also check my prompts on the screen.
Been using Cursor for a while now. Will you recommend I switch to Bolt?
If you have no coding skills then yes, Bolt is easier to use. Cursor is better if you want to do some manual coding.
And in general I found that Bolt creates better looking UIs.
What about the UX research process? How can automate with AI
I have some videos on UX research. Check this out:
ua-cam.com/video/z8cGL_RuufE/v-deo.html
You, sir, are on the cutting edge.
Unfortunately, there are millions of current designers stuck in businesses who are not only doing it. The old way, they are doing it the ancient way, a process that involves upwards to 12 people to do with you and AI can do today at 5X the amount of efficiency and speed.
It deletes the human component, which sucks
Honestly I don’t think you need the human component if you’re creating a product for its functionality. there’s no reason to do things less efficiently just to have a “human component” unless you’re creating art or media.