9/29/2025 - Building a Fully Functional Pet Selfie App From Scratch Using Lovable's New AI and Cloud

Transcript

1. 0:04All right, we're live there. We're live here. Come on, champ. [Music]
2. 0:27[Music] [Music]
3. 0:46freedom came our way that night [Music] just like a jet plane. out of sight. I was hauling ass at a million miles and
4. 1:01I was wondering how hard I'd hit when they came into the shop.
5. 1:15They said I was bad beyond repair, but I got no qualms with my situation. [Applause] Say here I am.
6. 1:31[Music] So say Sheree Sheree Sheree won't you dare to say Sheree Sheree Sheree won't you dare to say Sheree Sheree Sheree.
7. 1:52Uhhuh. Yeah. Leave a message and your number. Please [Music] take a time to want to satisfy me. [Music]
8. 2:06Take all these old fantasies and send them care of me. [Music]
9. 2:29You got bad breath, doggy. That is some bad breath. You had to come closer to me to give me some some of that. Is that
10. 2:36That's a That's a stinky dog. That is one stinky dog. What's happening, good people? What's happening? What is going down with shaking?
11. 2:45[Music] Have I tried making songs for my dog singing? I haven't cuz he's a bit monotone. He's just he's Johnny one note.
12. 3:02[Music] [Music]
13. 3:22Yeah. Woohoo. [Music]
14. 3:44Hello. [Music] Hello. [Music]
15. 4:03Oh, good lordy good people. So, we got some stuff to play with tonight. We're going to do some vibe coding later.
16. 4:14We're going to do it in two places. [Music]
17. 4:50[Music] and then open AI's up to some really interesting stuff. So, have you been paying attention? Probably not, cuz why would you? [Music]
18. 5:04Um, there are now three different apps that have vertical video Tik Tok like platforms that are AI generated content. One of them is POLABS.
19. 5:20One of them is Sunno. They've got this thing called, what's it called in Sunno? Jams. No, something rolls. Hang on. Sunno
20. 5:35inso. No, not radio. It's called Hooks. Hooks. So if you go to sununo hooks, it's like Tik Tok except it's sununo music and
21. 5:51then whatever video you put on top of it. So it could be real video, could be generated video, but it's AI songs. And
22. 5:59then you've got Meta who's got this thing called Vibes. Apparently, OpenAI is about to launch a vertical video feed template, flicking
23. 6:11video vertically like Tik Tok that is Sora 2 powered. It's Tik Tok question. What are your thoughts on Dcript's
24. 6:20Underlord? Um, well, I think that, um, I haven't played with it enough to have an informed opinion on it,
25. 6:29but having used, um, I played with it a little bit early on and it was a little janky. Um, and and um,
26. 6:41but I but I like the concept. And if you if you want to experience something like it, go to producer.ai.
27. 6:49Um, and that's just for audio. It's not for video. Um, but it's it's like Sunno, but it's it's more like a chat interface
28. 6:56for Sunno. Uh, question. Have you used Cloud 4.5? No, that's one of the things we were going to vibe code tonight was
29. 7:02go over to Claude and play with 4.5. So 4.5, we're going to play with Lovable's new um cloud backend. we're gonna play
30. 7:11with. And they're clawed or lovable AI where you don't have to do um APIs in to use AI. [Music]
31. 7:25And then I figured we'd go look at OpenAI's back end. But anyway, what? So, so apparently uh OpenAI is coming out with this Tik
32. 7:35Tok like clone that's going to be all AI generated video. This is now the fourth of these and there's probably more but
33. 7:44this is the fourth of companies that that have got you know large language models or you know some sort of
34. 7:50generative generative model putting out content sites AI generated content. Um sorry Mr. IT I can't uh wonder where human verification
35. 8:04fits. Um, I I don't think it probably does at this point. I I think I think human verified platforms are going to be different. I
36. 8:17think you're going to see AI generated content platforms proliferate. You're going to see a ton of them.
37. 8:26I don't think people are really going to give a [ __ ] to be quite honest. I know everyone's got their panties in a twist
38. 8:32about is it AI generated? If it's AI generated, it's just AI slop. Unless it's not like you can you can make
39. 8:41things with AI that don't suck. Most people don't. [Music] But the things that that get popular on these platforms will be
40. 8:54things that have, you know, are popular, right? It might not be your cup of tea, but it'll be the things that are
41. 9:02popular. Tik Tok pin. Brother 52. I had a GPT agent try to take online quizzes. A trip to watch it try to cheat on behalf of students.
42. 9:23Was it trying to cheat on behalf of students? I guess students having the agent take the quiz for them. [Music]
43. 9:34That's where human verification could be really important, right? Verify that the student is the student and they can only
44. 9:41log into the site if they've got a verified human ID, right? And then you can track their IP address and [ __ ] like that.
45. 9:51When it didn't know the answer, it tried to go to Course Hero. Oh, that's f funny. I don't I assume Course Hero is a cheating site.
46. 10:01I don't I don't I haven't been in college in a while, so I don't know the uh I don't know the cheating scene in college these days.
47. 10:11I don't know the learning scene in college these days. Oh man, that's funny. That's funny. Can do a little 10 to 20 second vid.
48. 10:31All it takes is a slightly invasive brain probe. Um, let's go. Um, what did I do? I did a post today.
49. 10:46Twi Twitter's so [ __ ] weird, man. You know, I put up stuff that I'm really proud of or stuff that I've really
50. 10:52thought about. It gets zero views. And then today I basically just did a repost of a a quote a quote tweet
51. 11:02of the Lovable Lovable's new cloud service thing. And I basically said this is a bigger deal than people think it
52. 11:10is. And that's gotten like all these shares and likes and comments and [ __ ] like that. And I didn't really say that
53. 11:18much. It's just bizarre what what clicks and hits, you know. It must be some someone did something. Yes. After AI, none of us
54. 11:27know what learning is anymore. Yeah, brother 52. I mean, I I think that you're right. I think we don't know what
55. 11:34we don't know what learning is right now. And I and I think that we don't know the value of organized learning.
56. 11:43It was funny as I was saying that I was thinking organized religion, but it's, you know, it's organized learning up to this point, you
57. 11:53know, to get knowledge into someone's head required some amount of process. You could agree or disagree with the
58. 12:02process, but it took time to get knowledge out of books and out out of professors and out of, you know, online
59. 12:09courses and into someone's head. And that took time. And now we're living in a world where we're going to play with
60. 12:17lovable tonight. I don't have to go to computer science school to be able to code. Now, you could certainly make the argument if
61. 12:26you want to go if if you want to be able to code, right? You go to school. But what does coding right mean? Coding
62. 12:34right means what what is the definition of it today? Right? The big deal about lovable is that they're starting to bury
63. 12:44the configuration part of coding. They're starting to take care of that for you. They're starting to handle that for you. Um,
64. 12:52speaking of which, because I had Superbase hooked up and I think because I challenged some computer dude, I think
65. 13:00he hacked my Superbase. So, so there's a good example of if you just have a clueless vibe coder like me coding and
66. 13:09you don't set up your superbase config, right? Someone could come in there and knock the [ __ ] out of it, which I think
67. 13:15is what happened. Um, which is fine. Like I'll I'll deal with that. But like as soon as someone can crack that, right? as soon as if it's
68. 13:26lovable or if it's cursor or whoever whoever figures out how to have regular people create apps that are decently,
69. 13:35you know, you know, decently robust, then they're going to win, man. They're going to they're going to get lots and
70. 13:43lots and lots of people that have ideas that want to put them out in the world. So, yeah. Yeah. Yeah.
71. 13:54Um, all right. Let's go let's go take a look at a couple of things. So, Open AI show this tab instead.
72. 14:12All right. Um, so a couple of things. Sora is missing from this list. Sora used to be here below Codeex.
73. 14:30So Codeex is their is their coding library or is their coding tool. And Sora used to be right there. Okay, so
74. 14:42that probably tells me that Sora 2 is coming. Maybe it's going to be built into this, maybe it's not. Who knows? Um,
75. 14:50and then I went into settings and there's a whole bunch of new [ __ ] so I figured we'd just go through it. Um, the general tab,
76. 15:07color theme, accent color. If you didn't know, you can change accent colors. You can, that's kind of fun. Language,
77. 15:14spoken language, voice, you choose your voice. And then show additional models. If you want to see 40, you have to turn
78. 15:21that on. Um, notifications. Um, push notifications, push, and emails for responses and tasks. So, you can turn those off or on. Um,
79. 15:32personalization. So, there's a bunch of stuff in personalization now. They've completely redesigned this panel.
80. 15:40Um, and why is that? Oh, there we go. That's better. I was having weird screen redraw [ __ ] Um, so enable customization. I don't think
81. 15:52you could turn that off entirely before. So, this is now I think they've added this blanket switch GPT personality. If you click on that,
82. 16:01wait, this is now different. Hang on a sec. Let me reload this page. But I just loaded this. This is weird. Oh man.
83. 16:19Okay, I see what they're doing here. Okay, so chat GPT personality, they've got four default modes other than
84. 16:29default. Cynic, robot, listener, and nerd. So if you haven't played with personality, go play with that. And then
85. 16:36in custom instructions, you can add additional behavior. And they've got a whole bunch of those. Chatty, witty,
86. 16:42straight shooting, encouraging, Gen Z, pragmatic, outside the box, things like that. Um, about you, what's your nickname? What's
87. 16:55your occupation? More about you, excuse me. Um, reference saved memories. So, this is the ones where you say remember
88. 17:06something or when it says, "Hey, I remembered this." This is where you manage them. And if you go to manage
89. 17:10them, it'll load them and you can I don't think you can edit these still. No, you can delete memories, but you
90. 17:18can't edit the memories. So, if you want to edit something, you have to delete it and then go tell it to save your
91. 17:25whatever version of it you want to save. And then reference chat history is in here. And then there's record mode. And
92. 17:32in advanced, you can turn on or off tools. So, I don't know if you've been in this back end for a while, but it's getting quite complicated.
93. 17:46Connectors are like connecting to things like Gmail and Google Calendar. I've done that. I don't really use it. I
94. 17:53don't really trust it. So, they're connected, but I don't tend to use that. Schedules are interesting. Uh if you
95. 17:59schedule uh you know you can schedule regular prompts like every morning go do research on the latest things on
96. 18:09some subject orders. This is new. No orders yet. Products you buy with chat GBT will show here. So, one of the
97. 18:17things that OpenAI announced today is that they're going to have um the ability to order natively for Etsy and Shopify to start with more
98. 18:31to come. So, they they've been toying with this for a while that they now show product pages and links out to e-commerce sites within
99. 18:42ChatGpt. Now you're going to be able to buy directly within chat GBT and they've got some sort of commerce connection um
100. 18:51like an MCP kind of commerce connection. Um these tools. So so here's the battle going on as far as I can tell it. If if
101. 19:03you think chat GPT is now making a Tik Tok like thing with with AI generated videos in the feed they're kind of trying to do everything.
102. 19:16And so I think what you're going to see is these frontier models as their as their platforms get more and more and
103. 19:21more capable they're all going to try to do everything. Um Elon Musk two years ago described this as the everything
104. 19:29app. He wants X to be the everything app. It's where you shop. It's where you chat. It's where you get hired. It
105. 19:37becomes LinkedIn. It becomes where you do your work. It becomes everything, right? It's the everything app. Um I
106. 19:43think that's where they all start to go. There's Mchester. What's happening? Source camp's in the house. Connectors
107. 19:49are amazing when they work. Then you have data controls. So you can, you know, tell it if you want uh it to
108. 19:59train other people. You've got security. You you've now have parental controls. You can add a family member. This person
109. 20:07is my parent or guardian. This person is my child. You put in an email address and when they sign in, it's got parental
110. 20:14controls. Now, if they've got parental controls, could you turn off the [ __ ] babysitting guard rails, please? That
111. 20:21would be nice. It'd be nice to be able to just, you know, write a fiction story that's got that's got bad things in it,
112. 20:29you know, um without getting yelled at for being an immoral piece of [ __ ] Uh and then you got and then you got your
113. 20:37account stuff. So anyway, if you haven't been into chat GPT settings in a while, it's worth going in there and looking. Um
114. 20:45okay, so Claude, let's go to Claude. So Claude today launched um uh Sonnet 4.5 which Claude Claude Sonnet 4 and Opus 4
115. 21:00was it Opus 4? I think so. Opus 4.1 uh was the the big powerful coding model and now you've got Sonnet 4.5 and
116. 21:12apparently this thing coded straight for 30 hours without losing context. It generated 11,000 lines of code over 30
117. 21:22hours. I don't you know it basically just kept working until it got it right um and did it for 30 hours continuously.
118. 21:30Um, I don't quite know what that means, but I know that the record previously was five hours. So, if this thing can
119. 21:37now go for 30 hours straight working on a coding problem, you know, I don't know. These things are getting better. Let's just put it that
120. 21:47way. So, I think what might be fun is to just go ahead and tell it to write a program for us and see if see how it how it do.
121. 21:58Um, so we'll say um and and I'm going to do a uh an Asteroids video game clo clone because I've done enough of them
122. 22:08now that I kind of know what decent looks like. So, let's just see if it does a decent one. Make me an Asteroids video game
123. 22:22clone like the original arcade game with vector graphics. Um, great physics.
124. 22:37Um, sounds that match the original controls, high score,
125. 22:53etc. Make sure the game looks as much like looks and plays. Make sure the game looks and plays as much like the original
126. 23:09as possible. All right. Am I sharing the wrong tab? Yes, I am. Thank you very very much.
127. 23:23All right. So, now this thing is going
128. 23:39Kyloids. That just sounds like a medical condition. [Laughter] All right. Asteroids arcade game. Let's see how it do.
129. 23:56I'll create an authentic Asteroids arcade game clone for you with vector graphics, classic physics, and all the
130. 24:03original features. Like, I I mean, here's the thing. Enough people have done Asteroids clones over the years
131. 24:11that there are probably thousands, tens of thousands of variations of asteroids, you know, in the training set. So,
132. 24:21all right, here we go. That looks pretty decent actually. Press enter to start. Enter.
133. 24:37Enter. Oh, there we go. Oh, this actually this is really good. Oh, except I don't know how to shoot. Press enter to play again.
134. 24:57Okay. So, the entire game. How do I stop that? Stop. Stop.
135. 25:11Doesn't fit in the window. The um ship is too fast. Spacebar doesn't shoot. All right, let's just
136. 25:28have it go fix some [ __ ] Why is that? Okay. Diagnosed and strategized fixes for the game's technical hiccups.
137. 25:54V4. So, it's already written two. It's already written and started over on two different versions or yeah, two
138. 26:04additional fixes. So, we're on version four already. And the cool thing with this is is you can go back you can go
139. 26:11back to previous versions. Now it's on V5, the latest. All right, here we are. Asteroids. Enter.
140. 26:30Okay. Okay. Uh, things are way fast still and I can't see any bullets.
141. 26:45Reload. All right. V7.
142. 26:59So, it looks like it's going in and fixing one thing at a time, which I I don't know if that's what it is doing,
143. 27:06but that's actually kind of promising. rather than try to fix a bunch of stuff and go screw things up.
144. 27:19All right, so let's go over. We're going to hop over to Lovable here in a second. And because while this is cool, if I want to turn
145. 27:32this into actual something real with like a backend, I have to set all that up. So let's let's see if we got this
146. 27:38some version of working. All right, that's good. There we go. That's not bad. It's Oh my god.
147. 27:55Horrible. Okay, whatever. Let's go to lovable. All right, so here we are at lovable. Um, what's it going
148. 28:04to do? Okay, so so lovable. So here's the big deal with lovable. Lovable was the first of the vibe coding tools to
149. 28:17to basically not assume that you're a developer. It's one of the first vibe coding tools like all of the other tools like like um
150. 28:26like cursor and even replet agent to some degree and um uh co-pilot GitHub copilot from Microsoft. Um all these things basically assume
151. 28:40that you know what a backend is you know you know you know you know what a web server is you know what a database is.
152. 28:46You know what authentication is and how to configure it. you know, how to do all the security stuff. Lovable was the first one that said,
153. 28:55"We're just going to focus on web apps, right?" Which which limits what what you can do with them, but it also makes it
154. 29:01more simple, right? You're just developing from one platform, a web browser. And they tightly incorporated Superbase, which was which was a
155. 29:11third-party database system, and they kind of configured it for you, but you still had to set it up. it would sort of
156. 29:17tell you what to do, but you had to set it up. So, when that came into place was if you wanted people to be able to
157. 29:23remember what they typed into your app, you need a database. So, what they've launched today is Lovable Cloud and
158. 29:32Lovable AI. And in both of these cases, um, in theory, we don't have to set up [ __ ] So, we can just make an AI app that
159. 29:45allows people to log in, save their [ __ ] and use AI tools. We can build AI tools. So, so let's let's go on ahead
160. 29:55and create a something. Let's see. Um, I want to go look for something first. I want to go look for some interface.
161. 30:06So, here I am on the Google. Let me see. Um, let me see. Um, image uh generator app and then let's go look at images.
162. 30:23Let's go find something that's got cool interface, man. Yeah, man. All right. This is pretty cool. Where is it?
163. 30:39D. Can I copy this image? Copy image. And then we'll go back to Lovable. Can I just paste this? Yes. All right. Beautiful. I really enjoy
164. 30:54Lovable and their un user interface is beautiful, but no idea how to use Superbase. So, in theory, um, Source
165. 31:02Camp, you no longer have to do that. So, here's what we're going to do. I want to create a pet. I've made this
166. 31:13before. I made this before on Google Gemini. Um, a pet selfie maker that uses lovable AI.
167. 31:34um and lovable cloud for um so users can save their creations. Um, a
168. 31:52user uploads a picture of their pet and then selects from wait. Selects
169. 32:06from a list of locations or types in a location.
170. 32:26Let's see. Location or types in a location and then should we have um and let's see and the kind of outfit
171. 32:42the pet is wearing. And then the app generates a selfie
172. 32:58as if the pet took the pick themselves. All right. Boom. So, let's see. Here we go.
173. 33:13Let's see if this actually works. Now, if you've already created an app that already uses Supabase, my gut,
174. 33:24well, my experience was it's hard to get it to understand that it's got this cloud [ __ ] which they may have fixed
175. 33:31since I tried it because I tried it when it first went into beta. Do you write a good prompt to connect all of those? No, I write shitty
176. 33:42prompts. So, so one of the So, there's a couple of things. Um, because I'm kind of writing these on the fly, I'm not
177. 33:51really using um I'm not really using good prompts. Now, what I could and should do is I could go over to chat GPT
178. 33:59and explain to chat GPT what I want, have it write a software spec, things like that. So, I've done that before in
179. 34:05here. It just takes it's just a few more steps. I also like to see how well these tools do with shitty prompts, right? So,
180. 34:14if if you want one of the best practices with something like lovable is give it really clear instructions. One of the
181. 34:21downsides of giving it really clear instructions is you're losing a bit of that serendipity. Like sometimes it'll come up with
182. 34:29something you're like, "Oh, I wouldn't have thought of that." So you can overthink it, but it's probably it's
183. 34:35probably better to come in with a more structured prompt into something like this than not. But most non-engineers
184. 34:45are not going to come in with good, highly structured prompts. They're going to come in with shitty prompts. So if we
185. 34:51if this thing can actually pull off something interesting with a shitty prompt, then think what it could do with
186. 34:56a good prompt. Okay, let's see what it says here. I'll create a a stunning pet selfie maker app. Let me analyze the reference
187. 35:04image. It shows a modern AI art generation app with a dark theme of vi vibrant pink and purple gradients. Oh, I
188. 35:10should have told it not to use pink and purple. Oh well. Um, pet photo upload with preview, location selector, outfit selector, AI powered
189. 35:21generation using lovable AI, user authentication, email and password. Save selfie view. Gallery of pet selfies. Responsive design.
190. 35:32Tech approach. Lovable cloud for database. O and AI image generation via edge functions. Dark purple theme. Enable cloud. Oh,
191. 35:42look at this. Allow. Oh, look. Oh, it was waiting for me. Okay. Complete backend and AI models out of the box. Built-in backend. database,
192. 35:54storage, authentication, and back-end logic. What I haven't heard there, I don't think that they've got commerce. I
193. 36:01don't think that they have payments. That that is likely next. I would think add an LLM to your app. Add chat, image
194. 36:10generation, and text analysis instantly. Free to start, pay as you scale. Free usage included everywhere. Top up on
195. 36:19paid plans. Track usage and settings. settings- usage. All right. Enabled AI modified the database. Create profile tables.
196. 36:33Can I look at them? No. Wait. Oh, look. There's our tables. Look at all our tables. Oh, so sexy. It's so sexy. Hey,
197. 36:44I noticed you have a database table there, big boy. Did you set up that database just for me? Oh my god, that's so sexy. That's very sexy.
198. 36:56Um, all right, it's spinning up the preview. We can go look at code that it's writing. Starting live preview. Um,
199. 37:08oh, that's interesting. It hasn't even started writing code yet, although it says starting live preview.
200. 37:19Editing. Yeah, it's editing all this stuff. It's just not showing us yet. Cloud's enabled. Yeah, this is pretty slick. So, so um so
201. 37:34Source Camp, this is this is doing what you hoped it would. You don't have to deal with Superbase Fairy Tale Revolution. Hello. Oh, what's
202. 37:49happening? What's shaking? What's going down? I do it the logical way in writing rather than prompt engineering.
203. 37:57That's cool. Yeah, that's a that's another cool way to do it, too. Yeah, if you just if you just describe it well.
204. 38:03Yeah, you don't need to do prompt engineering. You don't need to do highly structured prompts. You can just you can
205. 38:08just do well-written, detailed um you know, explain it in English really well. it like lovable was the first one
206. 38:20when I first started playing with these. Replet agent got it pretty close. Lovable was the one that the app
207. 38:28actually looked good, functioned, and was super easy. And then when it came time to configure the database and
208. 38:36things, it was actually simple enough that you could do it. They they were helping you a fair amount. Um, Replet
209. 38:42agent did that to a degree, but they there were kind of some handoffs where they were like, "Go figure it out
210. 38:47yourself there, big boy." Um, and then things like cursor and co-pilot and things like that. Those those are very
211. 38:54much designed for engineers, right? They assume that you know what the [ __ ] you're doing. And quite frankly, if
212. 39:00you're creating an app to put in the world, you should know what in the [ __ ] you're doing. But that's not always going to be the case.
213. 39:07And we're in this transition period right now where real engineers are looking at these tools and going, "But
214. 39:14those are those are just play things, children. That's not real programming." And they're not wrong, right? Just like
215. 39:22a year ago, film people were saying, "Oh, that video. Yeah, that's just not that's uh that's not usable for
216. 39:30production grade stuff, right?" And now all of a sudden this year, some stuff's starting to come out where production
217. 39:35people like, "Holy [ __ ] Now, you're also starting to see, you know, companies like Lionsgate going, "Uh, this is harder than we thought.
218. 39:45Um, but we're in a transition period. So, if you're on the side of assuming that these tools suck and vibe coding
219. 39:55will never be real coding, you're wrong. If you're on the side of vibe coding is awesome and it makes worldclass apps,
220. 40:04you're also wrong." Right? So on these two polls, both of those teams are wrong right now. We're in this squishy middle
221. 40:12place where depending on the use case, maybe lovable with its cloud backend gets to the point that you could
222. 40:19actually launch a decent app and I guess you're going to have to probably figure out how to add your own commerce to it.
223. 40:26But once they add that, you could actually have an app that you could charge for, right? Okay. So don't have an account? Sign up.
224. 40:34Let's go ahead and sign up, shall we? Apparently, we can't. Oh, wait. Welcome back. Sign in to continue. Create an
225. 40:42account. Okay. So, we'll do that. And we'll do uh [Music]
226. 40:57dang. Okay. Let's see. Don't need that. Don't need that. Create amazing pet selfies. Upload your pet's photo. So, let's go
227. 41:08find a Champy photo. Champ name contains champ. Oh, there's a bunch of selfies. Um, Adam Champ. Champ.
228. 41:25Ah, look how cute he is. Oh, wait. You're not seeing that cuz I'm That's all right. Let me close that. Oh my god,
229. 41:34I've got too many windows open, people. You can't see any of this. Okay, drag and drop did not work. So, that's annoying. Click to upload.
230. 41:49So, the first thing we're going to say is we need drag and drop champ. [Music] Hang on a second. Dad and Champ, what's this one? Oh, no.
231. 42:07Hang on. I'll be with you in a second. I just got to get a picture of my dog, my big fat pupper. All right, here's a good one.
232. 42:17Image must be less than 5 megabytes. Okay, let's fix this. Um we need drag and drop and um large images should be reampled
233. 42:33down. And then while that's doing that, let me see if I can go find a smaller image. That's not good.
234. 42:52That one's good. And that's smaller. So, we're going to say coffee shop outfit sports jersey generate pet
235. 43:07selfie. All right. There's my little doggy generating magic.
236. 43:38See what I'm saying? You see why this works, people? So cute, right? [Laughter]
237. 43:55Oh, let's see. Can I generate another one? Eiffel Tower in a sunglasses and Hawaiian shirt. Should be good.
238. 44:05Save that image. Oh, wait. Hang on. Can I copy this image? Wait. How do I get to it? Oh, it's not letting me. it. Oh,
239. 44:14damn it. Oh, save to gallery. Save to gallery. Download. Nice.
240. 44:28Oh, yeah. Look, now I have a gallery. Hey, this is cool. Okay. Okay. I should be able to
241. 44:45rightclick save or copy the images that are generated. Um,
242. 45:00let's see what else. What What else didn't it do? What else did it do that I didn't like? Can we Can we drag and drop
243. 45:06now? Let me close this. Let me see if we can drag and drop. image optimize. So, it just optimized the image for us. That's cool. That's
244. 45:22cool that it did that. All right. So, we're going to select a location. Time Square in a superhero outfit. Generate pet selfie.
245. 45:33It should autosave to gallery. Well, but if it creates a shitty one, you I don't mind I don't mind it being a
246. 45:41manual saved to gallery. Like that doesn't really look like him. Oh, but look, it took a picture of of him and put him
247. 45:50there. Make sure you can upload any file size. Save in Oh, yeah. Save in in different file formats. Um,
248. 46:03I should be able to rightclick save the images generated. Um um I should be able to upload in any aspect
249. 46:23ratio and I should also choose um wide or vertical output. All right, let's let's
250. 46:40check your internet connection. No, it's My internet connection is fine. Are you going? Are you Are you doing your thing?
251. 47:00All right, it says it's thinking. Let me go let me go drag a different photo in there.
252. 47:28These are These are selfies from my other time I did this. They're so good. These selfies are the best. This is all Nano Banana, by the
253. 47:39way, on the back end here. It's so annoying how much how most of the selfie image generators include a picture of the camera. Oh, we
254. 47:50can tell it to fix that. Um, fix the prompt so that the selfie doesn't include the device,
255. 48:07just that they have their leg slasharmm out or even just a picture of them
256. 48:23like a friend took it. All right. And we're going to go fix that. And let's see. Save to gallery. Let's save that one. See if that writes
257. 48:35it to our database. We can't see what you're seeing in the other images. Yeah, I know. It's a drag. All right. So, I've got I I do have two
258. 48:44Eiffel Tower Paris. I do have two things in my in my my pet selfie gallery. This is good. He'll be the emperor of the litter
259. 48:56litter. Kyle, why? Why? What? Why? Why am I making this app? Because it gives me great joy. A new social media company would be
260. 49:07interesting if it did it. Um, what did you make you never did say? I don't know. I might have to copy this one. Actually,
261. 49:20source camp, this is this is a really good um this is a really good parlor trick, right? generate a selfie maker. Because
262. 49:31for someone that doesn't understand coding, website design, or AI, if you want to blow their [ __ ] mind,
263. 49:39you could go, "Hey, listen. Let's say you had an idea and you thought, wouldn't it be cool if someday
264. 49:47you could make an app?" Like if you went to the right school and you learned the right coding and you learned about
265. 49:54compression ratios and aspect ratios and mathematics that you could create an app where someone could upload a picture of their
266. 50:04pet or take a picture of their pet and turn it into a selfie as if that pet was traveling all over the world. Yeah,
267. 50:13that'd be cool. Yeah, whatever. And then as you're saying that, you're typing in the prompt or you just paste in the
268. 50:20prompt and then you just build it right there in front of them. That would that would be pretty mind-blowing.
269. 50:26Great parlor trick, right? I saw them making apps that will do voice calls for business, setting up appointments. Create an app using iOS
270. 50:37and Cotlin for a startup. Um, Lovable doesn't do that. There's I think there's a new there's a new one out
271. 50:50there called Mocha, which might do native iOS, but there's another one. There's one that specifically does Yeah. RORO. RK
272. 51:01specifically does um native iOS apps. Um, okay. Let's Let's see what this thing says. Done. I've updated the
273. 51:12prompt to remove devices that are generated. Now selfies will look either like paw extended style like the pet
274. 51:18stretched out their leg or arm or friend candid style like a buddy took a picture. The images will focus on the
275. 51:25pet's face with natural expressions and good lighting. Fix the selfie prompt preview latest. All right, I think we're good. So, let
276. 51:36me let me just hit re-roll here. We'll reload it. Loading your gallery. Oh, look. It kept my gallery. Okay, so the database is
277. 51:47working. So, source camp. This is pretty slick, man. Pet selfie maker powered by lovable AI. Oh, I'm going to say remove.
278. 51:58Let's see if it'll do it. Powered by lovable AI under the title. And let's kill the pink and purple
279. 52:16color scheme scheme. Since every vibe coded app
280. 52:33uses uses it. Let's make it look more like I don't know.
281. 52:47Um, come up with a unique idea. Um, or I could just go to Google and get a better interface that doesn't have
282. 53:03pink and purple in it. Hang on. Share this tab instead. Hang on a sec. Let me see here. Breaking.
283. 53:18Oh, all Google models are free for a week and lovable. Well, that's cool. All right, I'm down with that.
284. 53:31So, wait. There's no image generation app out there that doesn't have purple and and pink. Well, here's blue. It
285. 53:40still has that pink and purple [ __ ] in it. Let's see. Image generator app analog
286. 53:54style. No. [Music] There's green. Let's at least get green. Okay, here.
287. 54:10We'll just copy this image. We'll go over here to lovable. Oh, what did it do? Oh, it made it some sort of vomit color. Try this one.
288. 54:22And then we'll hit paste. Um, update interface to match.
289. 54:39I kind of feel like Oh, yeah. So, wait. So, you upload you upload your pet selfie, right? Okay. Hang on. Hold please. Champ.
290. 54:51Name. Champ. Let's see. What's that? No.
291. 55:11[Music] [Laughter] He's just a cutie. Oh, wait. You're not seeing any of this. Oh, you can't cuz because you can't. But
292. 55:28hang on. I I'll be with you in a second. Everybody just calm down. You just calm You just cool your jets.
293. 55:40Oh, perfect photo. Okay, here we go. Boom. We're going to share this tab. Oh, and it made it made the color green. I like this color.
294. 55:53Look at that. Look how cool that is. Okay, we're going to go vertical. We're going to go Oh, I should be able to Can
295. 56:00I type in here? No. Okay. Oh, wait. Custom location. Okay. Custom. Okay. So, let's see the pulld down menus.
296. 56:18Oops. The pulld down menus for location etc. should let me natively edit
297. 56:34what's in the box. I should be able to choose or type or edit.
298. 56:48Okay. So, we're going to have it fix that [ __ ] but we're going to go let's see coffee shop. Uh, party hat vertical generate pet
299. 57:00selfie. So, we've got a we've got this will be interesting to see if it's good at this. We've got a horizontal input
300. 57:07and we're asking for a vertical output. Nano Banana is notoriously shitty at this. So, maybe because we're using Yeah, see it didn't do it.
301. 57:21It did it horizontal. Um,
302. 57:38we're going to we're going to have to we're going to if Nano Banana is the back end, can you also create animations of this? Possibly.
303. 57:48Um, that would be that would be uh whatever you call it. What's their what's their video one? V3. Um, can you make it so that
304. 58:06there is an additional button after the selfie is made that is uh
305. 58:24animate which makes the image image into a looping video. I'm going to take out looping. Just
306. 58:38makes it into a video. All right, we'll try that. Okay, now I've got locations and I can edit. Great. Beautiful. Did it do that
307. 58:51with all of them? Yes, it did. Veras. Very nice. Except for aspect ratio. Okay, for aspect ratio um
308. 59:07I don't need to edit just make that a pure pulld down. Also increase the font size
309. 59:21on the editable pulld down menus. All right. So, we'll do that as soon as it fixes if it if it adds this animate
310. 59:35thing. That would be kind of cool. And notice it did it. He's got a weird hand, but but it didn't put the uh it
311. 59:48didn't put the what you call it in there. Three edits made. Perfect. I've added an animation feature. Oh, animate. Look here. Animating.
312. 1:00:03You think it's really doing it? Edge function returned a non2x status code. Yeah, I bet.
313. 1:00:18Okay, so wait, let's let's go look at that. Add animate button. The video button may take a longer and it uses credits from your workspace.
314. 1:00:36and animate. All right. So, so I'm going to say animate button
315. 1:00:51didn't work. Let's lose it also for aspect ratio. Okay. So, let's let's fix our app.
316. 1:01:18Joe Dissult. Hey gang, what's he building? Some kind of animation tool in lovable. I I built a selfie maker. So
317. 1:01:25you upload a picture of your pet and then you stick a location in winter jacket. And then we're going to go Oh, we don't have
318. 1:01:38We're going to go whatever. We're just going to say generate selfie picture. And then it's going to generate a selfie
319. 1:01:45for us. Oh, wait. Can I right click? Yes. Cool. That worked. It did. It did. Save that. Generating magic. It It actually seems
320. 1:01:56to be Hey, there's Champion. There's Champion in in snowy Denver at Sloan's Lake. That's pretty funny. Uh, and then
321. 1:02:07I can save to gallery. And it doesn't really look like him. Like, it [ __ ] up his eyes a lot, but that's all right.
322. 1:02:17And so now I've got four different images saved because I'm using the database and I can trash them if I don't like them.
323. 1:02:36Okay. So, there's vertical. So, let's do Oops. Um, it looks like you lost
324. 1:02:57the pick list for location and outfit. Make them more creative.
325. 1:03:13Anyway, and you know what what what's interesting about this having built this in the Gemini app building thing
326. 1:03:32which is at a studio.google.comapps. It's pretty good and it does some of this backend stuff for you as well. I
327. 1:03:41think Lovable's just it's a friendlier interface environment and it's a friendlier like it just seems to be a
328. 1:03:49bit more smooth and fluid with how it's updating the app dynamically. Um, I just like it. 24 options for locations.
329. 1:04:01Northern Lights in Ireland underwater coral reef space station window. Private jet interior. Perfect. Hot air balloon. This is These are so
330. 1:04:13good. 24 optional outfits. Okay, they're not working. Let's reload. All right, we got to upload We got to
331. 1:04:27upload our picture of our dog. There's our dog. Hello, doggy. Look, optimized image. It It resized it from 6.45
332. 1:04:35megabytes to port.48. 48 megabytes. Like just think about that. I've done enough product stuff in my
333. 1:04:44life that I I understand that if you put a file limitation in, can't be larger than five megabytes because we don't
334. 1:04:52want to upload giant photos here, right? You have another option. If someone uploads a giant photo, rather than
335. 1:04:59saying, "Hey, go [ __ ] yourself." You just say, "We'll just take that photo and we'll resize it because we
336. 1:05:05don't need a giant photo here." here. Nano Banana doesn't need super amounts of detail. It's not generating super
337. 1:05:10amounts of detail, right? And so it just did that. How cool is that? All right. So, let's go pick our location. Very. And I can type it in.
338. 1:05:21Good. Very nice. That's what we wanted. And then let's see. Private jet interior. I think 24 is a bit much, but
339. 1:05:29that's okay. We'll do ninja head headband and mask. We're going to try to do vertical again. and we're going to
340. 1:05:35see if we can get it to to fix this. I have an idea for how to fix it. [Music]
341. 1:05:51Yeah. Generate. Look at him with his ninja headband on his jet.
342. 1:06:06Okay, there is an issue with Nano Banana where the last image you upload
343. 1:06:25determines the aspect ratio. Let's fix this bug. Let's [ __ ] fix this bug
344. 1:06:40for Google, shall we? Let's fix this bug by um uploading a dummy frame.
345. 1:06:58That is the correct aspect ratio after we upload the picture of the pet.
346. 1:07:13Oh, also we need to be able to put in the name of the pet. And
347. 1:07:30we should handr write let's see we should handr write a note on the photo
348. 1:07:51that is that mentions the application and signed by pet name on uh
349. 1:08:07yeah that's good. We'll see we'll see how that does. All right. Now I want to share something maybe interesting to you here.
350. 1:08:20That thing that I just talked about where the last image that you upload determines the aspect ratio of Nano
351. 1:08:27Banana. How did I discover that? Through a lot of frustration just playing with Nano Banana. Just playing
352. 1:08:37with it and playing with it and I could not figure out what is it? Why can I not get a consistent aspect ratio? I asked
353. 1:08:44for it to give me an aspect ratio and it [ __ ] it up. And at some point on Twitter, someone said, "Oh, by the way,
354. 1:08:51whatever is the last image that you upload on on Nano Banana, that's what it does the output aspect ratio of." The
355. 1:08:58dumbest thing I've ever heard, but that's how it works. So, the only way I knew that is by playing. So, part of the
356. 1:09:05goal here of this channel is just play. Just play. Just play. Try and fix. Yeah, I had a feeling you were going to [ __ ] that up.
357. 1:09:16You went on ahead and you screwed it up, didn't you? All right, let's see. Did it lose images? No. All right, this is still going. I'll fix
358. 1:09:29the aspect ratio bug bug and add the pet name at the handwritten note in the photo. I'm already thinking how to monetize
359. 1:09:38this. Play with mixboard yet. So amazing. Yeah, papa papa dunk dunk. Papa Dunk. So, not only did I play with
360. 1:09:46Mixboard, we went to Where did we do it? I think we went to the Gemini astudio.google.comapp, the appmaker, and we made um a version
361. 1:10:02of Mixboard. We we vibecoded a version of Mixboard like three nights ago. It was It was really cool. Yeah, mix
362. 1:10:09Mixboard's pretty slick, but it's like you can vibe code you can vibe code a better version of Mixboard than what
363. 1:10:16Mixboard currently is. Like I had I had it um auto aligning pictures with, you know, auto alignment with with like the
364. 1:10:24lines that show up dynamically. It was pretty cool. All right. Um let's see if we have a functional app. All right. Red carpet premiere.
365. 1:10:37He's going to be wearing a wizard robe. And we're going to go vertical. Generate pet selfie. Please enter your pet's
366. 1:10:45name. Where's the pet's name? Oh, pet's name. Champ. Champy. [Laughter] Hey, Champy. Look at that. It had error checking in
367. 1:10:59it. I didn't put in the the pet's name and it fixed it. It flipping fixed it. How cool is that? Now, let's look at our
368. 1:11:07selfie gallery. If you click on the pictures, it's not zooming in. Look at that. Greetings from the red carpet premiere. Champy. How cool is
369. 1:11:16that? Damn. Save to gallery. Saving. Wish that were a little snappier, but you know.
370. 1:11:31There you go. It it it also did not do a vertical selfie. Um, let's see. Aspect ratio fix. Uh, added a
371. 1:11:41dummy frame upload after the PET image to force the correct aspect ratio. Um, the aspect ratio fix did not seem to
372. 1:11:57work. Um, another
373. 1:12:11did not seem to work. Um, that red carpet thing is really good. It's a really good photo. Oh, okay.
374. 1:12:25uh try something else. And then we're going to also do um clicking on any image uploaded,
375. 1:12:40generated or um gallery should zoom into that.
376. 1:12:57image full screen. Okay. So,
377. 1:13:11we got a we we got a pretty cool app here, I gotta say. Oh, you know what else I want to do? I'm going to I'm going to say um
378. 1:13:20reduce the number of choices in the location and outfit to 12 each. Keeping the most
379. 1:13:37creative with some classic locations. Um, let's see. Also
380. 1:13:55make the list font size larger. Do we want anything else? Oh, yeah. Finally, keep the
381. 1:14:13customize your pet selfie window um on screen even before
382. 1:14:28the user uploads their pet photo. Okay. What did we just have it do? Oh, fix the aspect ratio. All right. Let's
383. 1:14:41try one more thing. We're going to fix this. Let's try to do our aspect ratio. I have low self-confidence this will work.
384. 1:14:55Snowy Mountain Lodge in a fashion designer outfit. His name's Champy. Oh, we should also That should be
385. 1:15:05We should remember that. Oh yeah, that's what we should do. Um, we should also remember the uploaded photo and
386. 1:15:20the pet name into the database. Uh uh uh uh uh uh.
387. 1:15:38Greetings from Snowy Mountain Lodge. Champy, tell me this isn't the [ __ ] best.
388. 1:15:53Oh my god. It's good. Okay, now we lost our Now we're losing [ __ ] Okay. So, let's fix this. By the way, what I'm experiencing here
389. 1:16:07where I fix one thing, it breaks another thing. I do this, it breaks that. This thing I just can't fix at all. That's vibe coding.
390. 1:16:17And if you want to [ __ ] about it, you can [ __ ] about it. But, um, the option the the other option is go learn to code.
391. 1:16:34[Music] All right. That's life. Exactly. That's exactly right.
392. 1:16:58Okay. So, it kept our our this thing here. So, it's not a big empty hole. That's great. And your pet's name, Champy.
393. 1:17:08Let's drag and drop an image onto it. Bang. It's It's processing. Pet photo uploaded. Beautiful. There it is.
394. 1:17:19There's our 12 locations. Hot air balloon ride. Outfit. Sunglasses and Hawaiian shirt. Vertical refactor update lovable to something
395. 1:17:30whatever. Okay. Generating selfie magic. It's still remembering other selfies. I'm feeling like we need those to be smaller.
396. 1:17:44We need those to be a little smaller. Well, that's a very cute photo, but we ain't got no aspect ratio action. Okay, I have another idea
397. 1:18:01for aspect ratio. If I change the aspect ratio, why don't you recrop
398. 1:18:19the up loaded photo to match the aspect ratio virtually. Y
399. 1:18:37and then when you send the photo to Nano Banana, send the cropped
400. 1:18:53version. Let's try that. Boom. Greetings from Hot Air Balloon Ride Champy.
401. 1:19:12It's so amazing what's possible. It blows my mind every day. I I listen, we are in such different territory. What
402. 1:19:20what's what blows me away when I when I posted today that that this lovable update was a big deal and I got, you
403. 1:19:28know, coders coming in there, show me one example of something that was done that's, you know, an actual scalable
404. 1:19:34app. Like, they're just all [ __ ] bitter. Like, I get it. I get the existential threat. like Accenture, Accenture laid off
405. 1:19:4411,000 people today and more are coming uh because AI is changing consulting fundamentally. Um that's every job every
406. 1:19:55job is going to be blasted like that. But but like the the the idea that that these tools aren't going to get better is crazy.
407. 1:20:08It's crazy. It's crazy. I tell you, crazy crazy crazy. Oh, cropped preview. Vertical. Look at that. That works. Square. All right.
408. 1:20:21Vertical. Choose a location. Okay. So, wait. So, so instead of wait instead of the corrupt preview
409. 1:20:36being in the customize window, just
410. 1:20:51change the display of the uploaded original uploaded original.
411. 1:21:06Yeah, that's good. You should share this on X. Tag Lovable once you publish it. Oh yeah, by the way, Lovable for the
412. 1:21:19next seven days is doing a Lovable Buildathon. Today was the first day. I didn't even realize that. But um this is
413. 1:21:26a cool enough um feature launch. This this virtual backend, this cloud cloud backend, cloud AI and cloud lovable
414. 1:21:36cloud lovable AI. You don't have to configure [ __ ] The only thing missing right now is uh is what you call it? Um
415. 1:21:54The only thing missing right now is payment Champion. Okay, so it's not remembering Champy's name. Okay, so um the app isn't
416. 1:22:05retaining remembering the pet name or the pre file upload. It should
417. 1:22:27this experience that we're having right now where the bulk of the app was done in whatever it was 15 minutes and then
418. 1:22:36all of these little details that I'm doing right now are taking for [ __ ] ever. This is software development. Like
419. 1:22:42this is it. Software development is oh that's cool. Oh, but you know what it should do? It should do this. You're like,
420. 1:22:51"Dang, nab it." Uh oh. Did Oh, allow that. Why? Okay, that's working. Free tier. Five prompts per day gets 25 bucks a month in
421. 1:23:04cloud compute credits. AI plus storage. That 25 bucks a month in cloud compute credits, Brandon, is like I that that is
422. 1:23:12such a meaningless number. I mean, it's it's not, you know, it's it's it's not meaningless, but does that is that going to get you
423. 1:23:25like you can have two users making 10 images and then you're done, or is that like 2,000 users making 20 images and
424. 1:23:34then you're done? That's a lot. That's a lot for a startup. Well, not if if Nano Banana is still as expensive as it was. I think Nano Banana
425. 1:23:47is like 30 cents an image or something like that. Maybe even more. Northern Lights in Ireland wearing tuxedo. We're
426. 1:23:56going to go vertical. Notice how it fixed our our image vertical image here. This is cool. All right, let's see if it generates a
427. 1:24:05vertical image. Come on here, boys. generating image. We got vertical.
428. 1:24:20We got vertical. You understand what I'm saying, peoples? All right. I like it. I like it. I like it a lot.
429. 1:24:38All right. So, oh, and we're getting our we're getting our Yeah, we're getting our full If you click on [ __ ] you get
430. 1:24:45the full zoomin image. This is good app. This is I I got to say that I don't know what what backend they're using here right now. Do we know
431. 1:24:57settings? Project settings. Project category. Hide the lovable badge. Yeah, we want to hide that. Includes unprotected database samples
432. 1:25:13and security scans. Rename, remix. All right. I don't know what I don't know what backend they're using here, but it's really good.
433. 1:25:23Like, it's it's quick and it's it like it's not really [ __ ] too much up. Oh, let's see. Okay, so here's a bug. bug.
434. 1:25:38After I generate the pulld down menus are blank.
435. 1:25:52So, we want to fix that. Oh, also um let's make the gallery three columns
436. 1:26:09instead of two. and display whatever aspect ratio
437. 1:26:24the image is in the thumbnail. So the user doesn't have to open the image to see
438. 1:26:40the tiles should remain consistent size regardless of aspect ratio.
439. 1:26:57Okay. Beautiful. Beautiful. Beautiful. Beautiful. Let's go. Let's go square and generate a selfie square while it's while it's recoding.
440. 1:27:11So, are we saying that Lovable doesn't need a Gen Xer? No, you of course you need a Gen Xer. You You've got to have a
441. 1:27:19cranky Gen Xer in the corner. But I would say Lovable Here's what's clear to me about Lovable. Lovable has hired some
442. 1:27:27liberal arts majors. Is that square? That's square, right? Yep, that's square. Beautiful. Beautiful. Beautiful. Beautiful.
443. 1:27:37And now let's do a horizontal wide. Should we should call it not vertical, we should call it tall. It should be
444. 1:27:44wide and tall. Square wide. Tall. Come on. Come on, people. Let's go wide. Oh, look. It did it. It fixed it. It
445. 1:27:56fixed it vertical. Okay. fix both issues. Um, no, it's not. It's not three across, is it? Oh, it's three AC across if you go wide.
446. 1:28:14Uhoh. What did I do? Can I get it back?
447. 1:28:29That's so cute.
448. 1:28:49Okay. Got an idea here. Okay. Um um let's
449. 1:29:08make the gallery tiles smaller still. So, it's four wide
450. 1:29:23for a web page, three wide for a skinny page, and vertic and and uh skinny page. Okay.
451. 1:29:40Damn it. And uh single for mobile also. Um,
452. 1:30:01generate the selfie above the controls and uploaded image.
453. 1:30:18Should it be should it be the gallery? You either flip to the gallery.
454. 1:30:40Let's just let's just see what this looks like. What are the little crowns next to our names? Why am I number three?
455. 1:30:53How do I become a number one? Does Lovable work for mobile apps, too? No. Right now, Lovable's only for web apps.
456. 1:31:07Nano Bananas 4 cents on replicate. Okay. All right. So, this is good. So now put the selfie up here.
457. 1:31:27Okay, let's add so let's add so to the options be low the selfie.
458. 1:31:41Let's add a couple The buttons should be um
459. 1:31:58retake. Let's see. Um redo. Redo. Um redo.
460. 1:32:13Save to gallery. View gallery. Download. Oh, you know what else is
461. 1:32:29missing? Share. Let's add a few. And then share should use use native sharing panel.
462. 1:32:46Boom. All right. This is now starting to turn into an app. Maybe add a little dice icon that will randomly choose a
463. 1:32:53location and outfit. Some people aren't very creative. I like that. I like that. Okay. Um we'll we'll do that next time.
464. 1:33:13This is so cute. [Laughter]
465. 1:33:32If you wonder why they call it vibe coding cuz like just how I'm going tonight like I'm like ah we could do this. We could do
466. 1:33:39that. Oh, I have an idea. Could do this, could do that. An error occurred trying to fix automagically. Beautiful. What model is it using for
467. 1:33:49the images? Nano banana. An error occurred. We'll try to fix automatically. Okay, good. This is This is good.
468. 1:33:59Times Square, New York. We're going to go Rockstar Leather and we'll go tall. Oh, we didn't call it tall yet. We've
469. 1:34:06got to fix that. Generate pet selfie. Now, let's see if this is confusing. I'm just going to let it sit here because
470. 1:34:14what what the selfie is going to do is it's going to move all this [ __ ] out of the way. I think that's right. I think
471. 1:34:20we want the top of the thing to be the image, right? Pet selfie generated. Ah, okay. We've got to jump to the top. [Laughter]
472. 1:34:37Okay. Redo. Um, all right. Let's see. Important
473. 1:34:56question via one of your API keys or lovable lovable baby. So listen, the reason we're playing with lovable
474. 1:35:08tonight, today they they launched it came out of beta. I played with it a little bit in beta, but it came out of beta today. Lovable
475. 1:35:18launched two different products, Lovable Cloud and Lovable AI. Lovable Cloud is a back-end database and O
476. 1:35:33uh environment. So instead of having to hook up Superbase, which you had to do before, in which mine got hacked tonight because
477. 1:35:43I was mouththing off to developers, someone went in and said, "I'll teach you, you [ __ ] punk." So that that is now all just handled.
478. 1:35:53And then lovable AI is it just automatically I assume it's using Google technology here because it's using nano
479. 1:36:02banana for the images. But basically you can create an AI powered app. It it doesn't look like we can do animations.
480. 1:36:10It doesn't look like it's using V3 but we're using nano banana. I didn't have to configure a [ __ ] thing.
481. 1:36:18Like this was literally let's make a pet selfie maker. And essentially from the first prompt, this thing has been
482. 1:36:25generating pet selfie make pet pet selfies. Um, okay, let's see. Um, okay. We we we've got to do something here. So, wait. When a selfie is
483. 1:36:41generated, um, jump to the top of the page. Also,
484. 1:36:57um set a max height on images
485. 1:37:12that matches
486. 1:37:32The customize your pet selfie pain
487. 1:37:46so that vertical images aren't massively tall and require you to scroll to see
488. 1:38:01them all. Also change the aspect ratio name vertical
489. 1:38:16to tall. Let's just do that for now. Um, the way that I am prompting this right now is bad. So again, use me as the way not to do
490. 1:38:33[ __ ] You can do it better. Um, ideally what you do is you generate your little app. You then fully test it and you take
491. 1:38:46little notes, right? And you compile your bug list off to the side and then you compile your ideas. And rather than
492. 1:38:54doing it ad hoc, like two or three little unrelated ideas, like look at your things and and put together like a
493. 1:39:02long list of here's all of the bugs I found. Please go fix them all because you b you burn way more credits doing it
494. 1:39:09the way I'm doing it right now. Um the other thing that you can do in Lovable, which I haven't really done yet, is you
495. 1:39:16can go into chat mode. Um and it doesn't burn as many credits because you're not actually generating code. You can also
496. 1:39:24edit the the the front end. Like if I go edit right here, I can go in and I can change, you know, this color if I want
497. 1:39:31to some other color. So, um there's all sorts of [ __ ] that you can do in there. Okay, this is good. Okay, so this
498. 1:39:39generated this. We're going to save this to the Wait, that's see the gallery. Okay, save saves it to the gallery.
499. 1:39:47We're going to see the gallery. That jumps us down here. All right, let's let's shrink that. Okay, so it goes to three, then it goes
500. 1:40:01to four. Okay, that's nice. That works nice. That's good. There's our pet selfie. It's not massive. Okay, that's really good. Let's go
501. 1:40:17wide. We're going to go Oh, we still have the Okay. Uh, still have the bug where the dropdown
502. 1:40:31menus are blank after generating a selfie. Okay, we're we're getting there. This is This is almost a publishable site at this
503. 1:40:46point. I would think we're getting pretty close still to talk about the Chroma Awards. So, yeah. So, if you go to the AI salon
504. 1:40:57and go to there's a competitions space. Um, go look at the Chroma Awards. I I uploaded um the to kill you for a dollar
505. 1:41:08video. I think I showed that last night, didn't I? Wait, what's today? Today's Monday. Didn't I show that Friday or did
506. 1:41:14I finish that this weekend? Maybe I finished that this weekend. I'll I'll show you the uh I'll show you the
507. 1:41:20video I uploaded uh to the Chroma Awards. Um but but if you haven't um applied for the Chroma Awards, you should.
508. 1:41:30Okay, so now we Okay, good. This is good. Can I still get in here and edit? No, I can't. Okay, here's a this is a
509. 1:41:38good example of a shitty bug where it fixed one thing and then broke another thing. Um, now you made it so that the
510. 1:41:53fields are no longer editable. They should be nice and big fonts and easy
511. 1:42:08to read like they are now. But I should be a damn it should be able to
512. 1:42:24um edit the fields manually. except for output format.
513. 1:42:39Okay.
514. 1:42:56Everybody having fun? This is cool. This is This is You understanding what's happening here, right? We're vibe coding up a [ __ ] storm.
515. 1:43:11What do they call that? Where they put like a blurred version of the same image zoomed in behind it. Anybody know what that's called?
516. 1:43:20Greetings from Times Square, New York. Champy. That's so good. Depth of field. No, it's not called
517. 1:43:34depth of field. Composite. Yeah, sort of. Once the bugs are fixed, can you tell her to give you all the directions to create a
518. 1:43:47functional app? Tell who? Lovable. I don't know. Maybe it is a background, Mr. It, but it's a specific thing. It's not parallax, but
519. 1:44:01it's like you're zoomed in and blurred and usually desaturated. Um, what did I just ask it to do? Make
520. 1:44:12these editable. And but see, look, see, see now. Okay. Okay. We are in a horrible
521. 1:44:27loop here. Now the fields are editable but the options are missing again.
522. 1:44:47do better.
523. 1:45:02Let's add a different picture here. Is that the same one? I think that's the same one. Lordy.
524. 1:45:25All right, while this is all doing this. All right, things things are happening here, people. Things are happening.
525. 1:45:33Oh, that's a great photo. Um, I came up with Wait. Oh, there we go. Okay. I came Look at that picture of
526. 1:45:49him. Isn't that great? Wide. Tall. All right. That's going to be fascinating. See if the tall one gets all chopped off. Um.
527. 1:46:08All right. Well, this is fine. underwater coral reef. Oh, and but now clicking on them. Oh, this this is so buggy now. Now clicking
528. 1:46:16on them doesn't release the window. Jesus Christ. Generate self pet selfie. Okay, now you have the pulld down menu
529. 1:46:32as a separate interface button. And the
530. 1:46:48really all right now you have the pull down menu is separate and the menu doesn't release when I click on it. Man, get a [ __ ] muffler
531. 1:47:03on that thing. Remember, you do have a roll back feature in lovable. Yeah, I know. I'm just trying to have it not be quite
532. 1:47:13as frustrating. Wait, did I make a square image there? No, I made a tall one. Why did it do it as a square image on a white background?
533. 1:47:27Let me generate another one.
534. 1:47:44Okay. Yeah. See, now it did it right. Okay, that's fine. Great. All right. It's editing our menus. And then we should do a um
535. 1:47:54let's see. Fix now. When you click on a drop down, it should be right. It's remembering all our [ __ ] which is cool. Reload.
536. 1:48:17Ancient Roman coliseum. Astronaut helmet. Wide. Generate pet selfie.
537. 1:48:37Heavy grass mowing at night. Yeah, I don't know what that was. That was someone riding like a It was definitely
538. 1:48:42like a lawn mower engine on a on a two- wheeled vehicle. Okay, so it jumped us to the top. That's great.
539. 1:49:04So these Okay, that's good. That's That's fine. It's not great, but it's fine. So, we're going to do save. Show the
540. 1:49:15gallery. Jumps you down there. Down. Share. We haven't checked that. Failed to share image. Okay. The share button doesn't call the native
541. 1:49:29share function. And then let's change redo to roll
542. 1:49:44the dice with a dice icon. that randomly randomly
543. 1:50:00chooses a what's it called? Um location and outfit.
544. 1:50:17Use AI to create locations and outfits that are not on the pick list. This is
545. 1:50:32an Easter egg. A little Easter egg for to to delight our users.
546. 1:50:46That's a cool little Easter egg that if you hit roll the dice, you get you get new suggestions. Look at Champion. That [ __ ] bowl.
547. 1:50:58Let's save that to the G gallery if we if we haven't. We have it. Save.
548. 1:51:14That's so cute. That's so cute, champ. What? Why you Why you being such a little wiener? Huh? Why you being such a little wiener, dog?
549. 1:51:36All right. Did it do it? Nope. Still editing. Roll dice. Bang. Failed to generate a creative combo. Roll dice. Oh, maybe it's still editing
550. 1:51:50it. I have no patience. It fixed the button. I'm like, it's good to go. All right, let's let's reload our interface here.
551. 1:52:06Okay, so we're gonna take this. We're gonna go. Okay, let I hate that thing. Yeah, but it's getting to be time.
552. 1:52:22Space station window astronaut helmet tall generate selfie. I mean, other than the little frustration with the pull down menus,
553. 1:52:38and that's a decently complicated thing. I'm probably not explaining it very well. There's your pet selfie. That's very
554. 1:52:45cute, except he doesn't have a body. Now, if I say roll dice. Rolling the dice. New creative combo ready.
555. 1:53:06Is it generating it? No. Okay. Um,
556. 1:53:21when I say roll dice, I don't need to see the
557. 1:53:36visual update. You should just submit the generation right now. it. Now it tells me
558. 1:53:52it made a combo, but then doesn't generate anything. All right, that should be fine. We should fix this.
559. 1:54:06I'm probably going to blow out all my lovable credits making this stupid app. But how cool is this with the little gallery? Come on, man.
560. 1:54:21All right. And on the Zoom page, we should have share. Oh, also share didn't work, did it? Right. Okay. So, those have got to be fixed. So,
561. 1:54:34let's see. The share button doesn't work. It should call the native OS share
562. 1:54:50pane. What's that called? Share pane. Also, when I zoom into an image, I should have
563. 1:55:06download and share options in that window. All right. Are we good? Let's see what it did here.
564. 1:55:21Okay. So, that's going to go do that. So now we need to make a square. Fine.
565. 1:55:36What's wrong, champ? You a good boy. You a good boy. Yeah. You a good little dogger. Pet selfie generated.
566. 1:55:51All right. Greetings from Times Square, Champy. It's cheese o'clock. Yeah, it is. Rolling the dice. Okay. Generating your surprise selfie.
567. 1:56:07Come on. I'm getting no surprise. Oh, there's our surprise selfie. We got a mermaid. We got an amputated amputated champion.
568. 1:56:28He doesn't look very happy there cuz we took his legs. Oh my god, that's cute. Okay, so that's gonna make us random selfies. That's
569. 1:56:44cool. Oh, let's see. When generating, we need an animated animated
570. 1:57:00overlay. Wait. Uh, well, we don't. Screw it. Um, share failed to share image. Uh, sharing button still broken.
571. 1:57:22downloading works. It's a PNG. Let's go make sure that they're actually downloading. They are. We got to save the the amputee.
572. 1:57:37A champute. The champ. Too much acid in high school. Champy. I see the issue. The web share API is throwing a permission error. Since this
573. 1:57:47is a capacitor app, we need to use capacitors native share plugin instead. Let's fix both buttons instead.
574. 1:57:58Oh, look. Look what it did there. Nice. Download. That works. Great. All right. Let's see. Fix the share
575. 1:58:08button. Share. Failed to share. Click the So, let's reload it and just make sure. Um Oh.
576. 1:58:35[Music] Wait, we don't need this, do we?
577. 1:59:01sharing still broken. Can't you just call the operating system
578. 1:59:20share panel rather than what you're doing now?
579. 1:59:40Champ, he's tired from all the traveling. Greetings from space station window. I'll check the console logs here. Let's
580. 1:59:50roll the dice. Let's get another here and we'll save him. See if it saved. Oh, did it? Selfie saved to gallery.
581. 2:00:05That worked. [Laughter] Share
582. 2:00:20image downloaded. No, that's not right. Share. All right, I'll fix this later. Maybe we'll fix this tomorrow or something like that.
583. 2:00:31All right, I'm gonna get out of here. Um, so I, so I I put out a uh, so so I'm going to leave you on this tonight. I
584. 2:00:44came up with a like a a little catchphrase tonight that I'm really happy with, or not tonight, this morning. And then I made a I made a
585. 2:00:52video of it on Tik Tok. So if you haven't seen it on Tik Tok, go check out my latest Tik Tok video. And it's AI
586. 2:00:58your why. And what AI your why means is what's what are you all about? What's your why? What's your purpose? Who are
587. 2:01:08you trying to do something for? AI your why. Like think about who you are and what you want. That's what should be
588. 2:01:15going into your prompt. If you if you put your why into your prompt, your prompt will generate results that are
589. 2:01:22relevant to you. AI, your why. So think about that every time you're interacting with AI. If you're doing it as this kind
590. 2:01:31of cold separate thing from you, I'm just going to put in a prompt and get out an answer. Shift that AI your why. Think about who
591. 2:01:39you are and what you want and do it from your point of view and your results will improve pretty dramatically. So I was I
592. 2:01:48was pretty happy with that. Um, trying to think if I want to publish this. Preview it on the web. Let's see. We are
593. 2:01:58previewed. Okay. Publish. Pet selfie pal. I don't want pet selfie pal. I don't like pet selfie pal. Oh, edit.
594. 2:02:15So, pet selfie.loable.app. App URL successfully updated. Yeah, that's good.
595. 2:02:29All right. Icon and title. Add icon. No.
596. 2:02:47One warning.
597. 2:03:15Yeah, I'm not going to publish it tonight. I've got to go fix my bug in that other app, my Superbase hack or
598. 2:03:22whatever the [ __ ] happened. All right. Um, hopefully you're playing along and you made your own pet selfie maker.
599. 2:03:34All right, everybody. I'm going to get out of here. Tomorrow night's just a regular Tuesday. Celsius at 8 o'clock.
600. 2:03:40It's almost like Champy knows that he's the center of our entertainment for tonight and he's getting pissed.
601. 2:03:46Um, don't you get charged for API use if it's public? Yeah, you do, actually. So, that's that's the other reason I'm kind
602. 2:03:53of hesitating digital gods. I at the point at which they put um the ability to charge for a website, like if I could
603. 2:04:01do five bucks a month for this thing, that would be fun. But like right now, it's just going to cost me money to put
604. 2:04:08it out there. So yeah. So anyway, there's there's a bunch of [ __ ] I would do to fix this, too. Like I'd probably
605. 2:04:14I'm going to kill the this title. I don't think we need it. We've got it twice, right? We've got it up here and
606. 2:04:19we've got it down there. So we'll just start this start the site right there. Yeah. Yeah. All right. Cool. G.
607. 2:04:34Peace out, good people. I will see you tomorrow. All right. Um, have a good night. Bye.