Make your own board game - Vibe Coding for FUN | Unscripted Coding

Hi everyone, welcome to unscripted coding. Uh today I am feeling just a bit tired. So I was thinking of doing a bit of vibe coding and in particular doing something fun. So um I had Gemini open just a few minutes ago to say, "Hey, let's brainstorm some board game card game ideas." And of course, uh, I looked at the different ones it suggested and just went one step further of let's, uh, push it towards a pusher luck. Um, what I'm going to do is, uh, take this description right here and ask Google Gemini to create this as a web app um, against AI users. Um, and by AI, I mean that loosely as a computer opponents rather than, you know, chat GPT. So, um, can you create this game as a single page web app with CPU components to test out mechanics and we're going to see uh how we can kind of push it a little bit here and there whether it comes to actually making it function. um gameplay elements, design elements, and so on. But uh for those of you who don't do this, I I think it's a lot of fun to vibe code at times, doing absolutely nothing useful. Um you'll see right here that both of these are completely consumer grade um uh tools. They're they're we're not using an IDE. We're not using cloud code or cursor or anything like that. We are just going into gemini.google.com uh at the very bottom. We used uh one of the tools which is canvas so that uh we can start building apps that we can preview. Um, you can of course use more sophisticated tools, but we're just in an era where it's a lot of fun to do this. And um, ever since I've been playing some board games recently, I've been thinking this is incredibly, you know, it used to be really hard to do. I had a friend who wanted to build a card game and and actually built one that's pretty fun, but he had to iterate in person with his friends. He had to print them out, cut them out, kind of play test it a number of times. But now you you have an AI that you can brainstorm with. It can create the art. It can create the look and the feel and you can even get it to create uh what I think is really important which is a web app version um so that you can play test it yourself. So here we go. Um let's come back to the instructions here. Uh we are junkyard scrappers basically. Uh we're collecting we're collecting parts and basically trying to create a sophisticated uh high points. But one of the problems is you can potentially blow something up with the glitch cards or alternatively uh when the the heat pile gets too big it just acts as a timer. you cut out. So there is that push your luck element where you want to build a big hand, you want to build a big thing, but it could all end at a moment's notice. So you need to create this. Um, okay. Let's just take a look at how we're going to do this. Uh, we're going to draw CPU draws a bunch of things. See? So, I'm going up up against two people. There is a log of what's happening. I'm going to zoom out just a little bit so you can see more of the interface and we can start creating things. So, uh let's take a look. Click a card in your hand to move it to the workshop and click it in the workshop to move it back. The attemp build will light up. Um, okay. Uh, let's take a look and see what happens if I, um, try and attempt to build. So, don't think I can do that yet. So, let's just draw again. See what happens. We'll keep drawing. H I am not seeing the blueprint. So the problem here is how do I build something? It isn't clear to the user how to build something. The attempt. Ah, here we go. So, we can get a mechanical canary. And it looks like three gears and two wires. I I only have one wire, so I'll have to keep um drawing cards here. I think this deck has to be a lot larger because these are so specific. So, I'm still waiting for a wire. Okay, this is Aha. What is this? Creaking metal. So, um, building So, CPU has built something. He's secured 14 points by building it. Um, and I think that gave him one of those glitch cards that we were talking about. Okay, now we have the opportunity to build something. So, here we need two crystals. Uh, oh, wait a minute. Three wires. So, I'm still short wires. This is frustrating. Two tubes, one gear. Perfect. Okay. So, I'm going to ask it to can you adjust this so that um we are drawing three cards at a time and the deck is much larger. That way, we can build more items. And so, as you can see, as I was playing, I was frustrated because the the time to actually get things is wasn't ideal. And this is something that would be annoying because if you're building this game, I'd have to go and print out a bunch of extra things and cut out more. And instead, right now, I'm just waiting for a bunch of code to happen here. Um, so hopefully that will be fairly quick. And I'm just going to go on pause for a moment while this loads. And we're back. So, uh, this time it should have been sped up quite a bit. Uh, so we're going to draw three cards. And so we're already seeing, uh, two gears, one wire. We're still waiting for those wires. I'm going to draw. Uh, the deck has been expanded. But what's nice is uh that in the code um now they have h uh created more of these configurations. So uh we can make this go longer by changing the scrap heap. Uh we could start us at 10. See what happens here. So we're refreshing. And so right off the bat we have 10 and we can start right away. Um I'm going to draw just two turns. Um, but with so many more cards, we actually uh speed up the game quite a bit. Uh, Sprocket, our CPU, has already built one item at seven. Um, and this time we're short on tubes, but we can build two gears with two wires. And I remember one of the suggested things is we can throw in as many extra cards as we want to get more glitch cards. And so we will attempt to build. OS all my parts are lost. Did I even get any points? Um no I did not. So that hurt quite a bit. Now I think the scrap heap is going to have to expand just given uh how how quickly things are ending. So I am going to go back to the code and say the scrap heap limit is going to be 10. Okay, we come back into the preview and we're going to start uh I'll draw two gears, one wire. I have one gear, three tubes. Uh ah this one will work. So I can build right away two crystals. Oh no, I can't. So, I'll draw. And you can see the scrap heap is already building so building up so quickly. And I need more cards. Here we go. So, I have two wires now. I think I can build. No. Two wires. Two crystals. Three wires. Three tubes. Two gears. No gear. Nope. I still can't do anything. So, I'll draw three cards. More wires. Perfect. So, now I have uh three wire. I think I can build this one. Three wires, one gear, two crystal, and then I could get rid of a bunch of extra things here. try and build this. H okay really rough here. Um, and I think we're reaching pretty close to the end. And like that, we're at the end. So, I think this feels a bit better. I think if I was to continue building this out, um, this is actually fine. And all I needed to do is adjust some of these variables. I don't think there's anything inherently wrong with the current play. I just think um this could last a bit longer. So scrap heap might be um let's say uh 20 because it's going too early. Uh I might start with 12 and maybe draw five cards at a time. Uh, I do have to increase the number of cards by quite a bit. And so I'm going to ask, how do I increase the number of cards in the deck? Because this is not sufficient. But through this iteration, I can get to a pretty fun game pretty quickly. So, I'm going to end the video here. This actually turned out better than I expected. Now, of course, I can uh refine the look, I can refine the style, I can refine all of these pieces, but you have a functional card game right here. And uh from there, I can maybe print out like do some artwork, use AI to build the artwork, maybe add some sound effects, um maybe some animations as well. But uh the hardest part I think when creating some of these games is that uh you have to find the core gameplay loop first. Uh you can very easily make the mistake of just trying to create really really nice art. But, uh, getting this down to a point where it's fun, where it's like, this is just enough time, this is just enough length, there's just enough cards in the deck to make it competitive. Um, you know, changing some of the, uh, recipes here, the blueprints and changing the requirements and the points. getting that down and making it fun is the hardest part traditionally, but now that you can just prototype everything digitally, uh it makes it a lot simpler. So, um hopefully you have fun building your own games because this this was incredibly simple. And then tomorrow if I decide, you know, this junkyard theme kind of sucks, um I can just change all these names to something else to make it ancient Rome themed. It could be um you know uh workplace themed, whatever it may be. Um anyways, uh I hope you had fun. That was fun. I think vibe coding uh especially these kind of mindless goalless ones are are fun and it's part of the reason why I started this channel. Thanks for watching and I will see you again next week when we do another project. Bye.