Full Tutorial: Zero to Shipped Game with Claude Code in… — Transcript

Hey everyone, so today I'm going to show you how to build a really fun retro space shooter game using Claude Code. Building games with my seven-year-old and Claude Code is one of my favorite weekend activities, so I want you to learn how to do this too.

Okay, so first of all, here's some games that I built with my kid. I built a side-scrolling underwater shooter where you play a swimmer shooting against a shark. My kid and I also built an animal hospital game where you have to cure different animals, and then we use Nano Banana to generate the images.

But in this tutorial, I want to show you exactly how to build a retro 2D space shooter in five steps: So step one, set up the project, two, find game assets, three, draft the spec, four, build the MEP and iterate, and finally, clean up and ship the game.

And, you know, Claude Code can be pretty intimidating, but I promise you that this is a tutorial that anyone can try. My seven-year-old doesn't even know how to type right now, and she knows how to build games, so don't get intimidated and let's get straight into it.

Okay, so here I have an empty folder called space-shooter-game, and this software, if you don't know, is Cursor, which you can download for free, and you can talk to Claude Code using a terminal or something else too, but I just prefer Cursor because I can actually see the files that Claude Code is making.

So how do you actually load Claude Code in here? You go to terminal, and you have to make sure that Claude Code is actually installed. All right, so quick recap, to install Claude Code, just search for Claude Code.

And all you're going to do is just copy this link and just paste it into terminal to install it.

And by the way, terminal is kind of like an intimidating thing, but it really isn't that intimidating, it's basically just talking to an AI agent and going back and forth with it, so the default way to start Claude Code in terminal after you install it is just type Claude, right, and you press yes and then it starts Claude Code.

But the way I like to use Claude Code is I use type Claude dash-dash dangerously-skip-permissions, right, and trust me when I say this, for stuff that you're vibe coding, for stuff that you're building for fun, this just makes it way more fun, and Claude is generally smart enough not to screw up your files.

Okay, so that's the setup. Now, let's move on to step two, which is finding the game art. So what you can do, and this is how I build games with my kid, is I have a voice dictation app installed called Whisperflow, you can also use other ones, but basically, I just kind of give Claude an idea of what we want to do, and my kid can talk to Claude too.

So here we go. I want to build a retro 2D space shooter. Where can I find some free pixel art assets for this game? And there you go, it's pasted directly in here, and let's go ahead and get Claude to execute on this prompt.

So Claude has, you know, web search capabilities built in, so it can actually do research for you.

And it's going to find a bunch of interesting links up here, OpenGameArt, itch.io, and so on and so forth that you can either browse yourself or get Claude to browse, but just to make this tutorial as simple as possible for you guys, I actually found a really great pixel pack already, uh, it's made by this awesome creator called Ansimuz, and, uh, you can basically download it for free.

I think I paid five bucks for him to download this, and it's got some pretty amazing pixel art, you can make a Castlevania game, you can make different types of platformers, you can make a pixel girl dance, and, uh, you can even make like, um, cyberpunk stuff, and so on and so forth.

And in here, there's also a pack for making space shooters. So, all you got to do is, uh, go ahead and download this pack, and I'll include a link to this pack in the description of this video.

Okay, let's come back into Cursor, and I've already downloaded the pixel pack, and let's actually go to Finder right now and open our space shooter folder, and let's just drag and drop this pixel pack into our space shooter game folder. So there it is. So if it work properly, it should appear here, and if you open this, there's a bunch of characters, aliens, and so on, environments, and all the great things that we can use to build our space shooter game.

All right. So now, let's go back to Claude Code and say, hey, I just added some pixel art. Why don't you look through the folder and list the ones that we can use for retro 2D space shooter?

All right. So now, I'm going to tell Claude Code, write a spec with requirements, three milestones, and links to all the pixel art assets that we're going to use, and each milestone should be playable. And by the way, use ask user question if you have any questions.

So before we execute this command, let us take a look at some best practices that we just covered in here, right?

So first of all, write a spec with the requirements, you should always write the spec first before you get Claude to build anything, always plan first before building.

And we broke the project into three milestones so that we can test it along the way, you don't want to try to get Claude to build too much at once.

And we also asked it to link all the pixel art so that Claude knows where to find each art asset.

And finally, ask user question, this is my default way to write specs now.

It's a new tool that Anthropic introduced that gives Claude to ask you a series of questions to flesh out the spec together, it's absolutely brilliant, and I'll show you how it works.

All right.

So let's execute the command.

And I don't think we're going to use this dancing girl, so let's get rid of this.

Okay, so here we go. So Claude is going to ask us some questions, so which technology platform should we build this with?

We can use basically HTML, we can use Phaser, for games like this, I prefer to use Phaser, and if you don't know what Phaser is, you can always like ask Claude some more questions or open up web Claude to ask this question.

But Phaser from my experience is great for building games.

Let's use Phaser.

What scrolling direction and gameplay style?

I like top-down vertical shooters personally.

So I'm going to pick one.

What features do you want?

And this is actually a multiple choice.

So let's actually pick all these features, we have power-up system, boss battle, score, and let's do multiple waves too.

Right.

So let's actually pick all these at once.

And, uh, submit.

And there you go, let's go ahead and submit the answers.

And now Claude is going to write our spec for us based on our guidance.

So I'm going to quickly skip ahead until Claude generates the spec.

Okay, so you see here that Claude actually wrote the spec for us, you know, as a PM, I don't have to write specs anymore, and, uh, usually what I do now is I take a look at the spec together with my daughter, right?

So we're building is a classic vertical-scrolling 2D space shooter.

Makes sense.

Core gameplay.

Smooth 60 frame per second.

Okay, sure.

Let's go down.

Like a power-up system and so on and so forth, and what I'm looking for is actually the milestones, because I want to make sure that it's building the right playable experience each time.

So milestone one is a playable prototype with some basic shooting mechanics.

It's going to set up the project, it's going to have the background.

It's going to have the player ship, and there's going to be some enemies from the top and moving downwards.

Okay, that sounds good.

And then milestone two is the progression and power-ups, and milestone three is the boss battles and polish.

Now, Claude has also linked all the pixel art assets that we're going to use, which is going to be super useful.

And, uh, yeah, overall, this spec looks pretty good, right?

Uh, usually when Claude generates a spec, it tends to want to build too many things at once, so usually I like to cut stuff out.

So for example, like smooth 60 frame per second, who, who cares?

I think it's going to be smooth anyway.

But, uh, Opus and the latest models are so good that Claude can actually frequently one-shot things.

All right.

So let's actually just go ahead and get Claude to build milestone one.

Build milestone one, and let's just say remember to use all the pixel art that you linked.

All right.

So again, I'm going to skip ahead to when milestone one is done.

Okay, we're back. That took maybe about two minutes, and, uh, when building this with my daughter, when we wait for Claude to work, usually what I do is, you know, I try to get her to look at some of the code, see how it all works behind the scenes, but usually she tunes out and does not pay attention until the game actually works.

All right.

So now Claude is saying, go to this link to play the game.

Let's actually go ahead and just paste this link in here.

Localhost.

And here we have our game, and let's see, I can move it around, I can shoot, the airplanes are coming, things seems to be working very well, like some of the background seems kind of weird, but overall, we have a basic game working already in just three minutes of planning and two minutes of actually getting Claude to build.

All right.

So let's go back to Cursor and Claude Code.

And let's ask it to now build milestone two.

Which, let's go ahead and take a look at milestone two.

Milestone one, core combat.

Milestone two is progression and power-up system.

Okay, that sounds good to me.

Let's go ahead and build milestone two.

Now let's skip ahead a few minutes, and let's come back once milestone two is done as well.

All right, so Claude has finished milestone two.

And there are some bugs here with the ships, but you can see there's more ship variety, there's screen shakes, there's a health bar at the bottom, you know, things look pretty decent.

And let's go back to Cursor now.

And let's go ahead and ask it to finish the game with milestone three.

So milestone three is going to add boss battles.

I'm just going to make sure and double check.

What sprites are you going to use for the boss battles?

Just to make sure that it actually has art for that stuff.

So let's see what it comes up with.

Okay, interesting enough, it's asking me some questions, so let's take a look, use big enemy sprite.

What if we say like, uh, search the legacy collection to see if you can find relevant art?

Okay, because there's just like a lot of, uh, art in here, and I'm surprised it cannot find other things for boss battles.

All right.

All right, so looks like it found a top-down boss folder.

You know, sometimes you just have to remind Claude to look harder, right?

So it found a top-down boss folder.

And, uh, it wants to proceed with milestone three.

So let's go ahead and get it to do it.

So, proceed with milestone three.

All right, and let's see what it comes up with for the final game.

Hopefully there's no bugs.

All right, so it built milestone three now.

It took about four minutes.

And let's play the game.

So wave one.

Let's see, there's enemies to shoot.

There's power-ups.

Weapon up.

All right.

Now we have a dual shooter.

You know, I, I think just like a problem, right?

The game is kind of boring, it's like too easy, right?

There isn't really, um, the most challenge.

The enemies appear one at a time.

So, why don't we give Claude some feedback saying, you know, the game is too boring, man.

Make the enemy numbers higher, make it more frantic, also make the boss appear faster in level one, and also fix some of the pixel art seems off.

Okay, so this is not exactly super precise instructions, right?

Like imagine basically you have a junior engineer or someone who's trying to build this game for you, and you just kind of give me a feedback.

And let's see if it can actually fix everything based on this vague feedback that I gave it.

Okay, Claude tells me it's all done, so let's play the game again.

All right, so we have our level one.

And let's see this is more challenging now.

There's still some issues with the art that we can fix later.

But you can see a lot more enemies are appearing, it's hopefully a little bit more frantic.

Let's get all the power-ups.

Shield.

Great.

What else is there?

Speed boost.

Weapon up.

Shield, shield.

Okay.

We're in pretty good shape now.

And I actually want to see if the boss even appears or not.

So I'm just going to keep playing for a little bit longer.

And let's see if the boss even appears.

Oh, there we go.

Warning, boss approaching.

Let's see if the boss.

And, um.

You know what, I actually do not see the boss at all.

There actually is no boss.

So, why don't we actually fix this?

Here's what I'm going to do.

I'm going to take a screenshot of this.

Copy it.

And put it into Claude Code, just paste it here.

And say the boss doesn't actually appear and seems to have zero HP.

All right, and let's see based on that feedback.

If it can fix this bug.

Guys, fixing this boss is more painful than I thought it'd be.

But let's see if it actually works now.

Let's actually, uh, so what I did was.

I added a hotkey to just load the boss.

Right.

Boss approaching.

There we go.

So here's the boss.

There's the health points.

And, uh, let's, yeah.

Looks like the HP decreases now.

Oh, this boss is pretty hard, man.

I'm like dying.

Uh, let's see if I can get it down to zero before I die.

All right.

Lost a ship there.

All right.

But it's almost dead, I think.

Let's see.

I wish there were some power-ups here.

Okay, now it's getting really hard.

Okay.

Oh my God.

Okay, I think I made this boss way too hard.

Okay, there we go.

I managed to kill him before he killed me.

So that was pretty fun.

But I want to show you guys this.

Okay.

So this is the actual conversation I had with it to try to fix the boss, and it can see here it's a pretty long conversation, right?

And honestly with you guys, it probably took me like 10 minutes to fix this.

And, um, if you're building this with your kid, they're not going to have the patience to fix bugs.

So maybe get them to watch YouTube or something while you fix the bug.

But.

What was the bug?

Right, so it's important to actually learn what you're vibe coding this stuff.

Even for yourself.

Right.

So I asked it.

Like, what was the bug?

And the bug was, they were storing the boss HP directly on the Phaser object.

And, um, yeah, Phaser sprites can have their stuff modified by the Phaser engine.

So we should move HP to a scene-level variable and so on and so forth.

And maybe I understand maybe like 30% of what they're saying here, and I can always ask more questions.

But again, if you encounter a gnarly bug, don't give up.

Okay, just give it instructions to try to fix it.

Paste images into Claude Code as examples.

And learn after you finally fix the bug, why the bug happened in the first place.

Okay.

So we have a great game now.

And now our last step is to clean up and ship the game.

Right.

So how are we going to ship the game?

Here's the thing.

You should have a GitHub repo, and you should create a new one.

Let's go to repo.

And let's just create a new repo.

And let's call it space-shooter-game to match the same folder as our local folder.

Right.

And let's hit create repo here.

So now we have a brand new GitHub repo.

And by the way, if GitHub is intimidating to you, it really isn't that intimidating, just like using Claude Code isn't intimidating.

Like you can just set up a free GitHub account and just follow the steps I'm showing you here to create a new GitHub repository.

Okay, so basically just like a folder that lives on GitHub.

All right.

So now what's important here is we have this link here, right?

So let's go ahead and copy this link.

And let's go back to Claude Code and be like, commit this to this link right here.

So now Claude Code is going to do all the work for us, it's going to do the pull requests, it's going to do everything here.

And, uh, let's actually skip ahead and come back once Claude has finished uploading our files to GitHub.

All right, so Claude Code said it's done, it's pushed it to GitHub.

Let's take a look.

Uh, let's go ahead and refresh this.

And there we go, now we have all of our files, right?

So we have our source code, and we have our Legacy Collection here.

Probably what we should have done was to actually only include the pixel art that we actually use in our game, right?

But now I want to show you how to actually get a link to play the game.

So.

You can use GitHub pages, but lately what I've been doing, and the easiest way to do this, is to make a Vercel account.

Vercel.com.

And to sign up for a free account.

And let's go ahead and hit add new here.

And let's go ahead and hit add new project.

All right, so it's saying enter a Git URL to deploy.

Right.

So our Git URL is right here.

So let's go ahead and copy right here.

And paste it.

And hit continue.

And, uh, there you go, our new project.

And let's just hit deploy.

Okay, so now Vercel is going to generate a URL where hopefully anyone can play our space shooter game.

All right, so Vercel has deployed our game.

And let's see if this link actually works.

Click on this.

And there you go, now anyone can play our space shooter game.

And I can also link to it in the description.

So let's go ahead and play it and see if it works.

We got our wave.

Still have to fix that ship.

Looks kind of weird.

But we got our power-ups.

And let me actually get some power-ups there.

We go.

Let's trigger the boss.

Remember, we still have our hotkey Z to trigger the boss.

So now I got three bullets, man.

Now you're going to die a lot faster than before.

All right.

It's getting hard.

It's getting hard.

Okay, but it's going to die soon.

There we go.

We killed the boss.

And, uh, level complete, and the next wave will start.

And you can see the background's changed too.

So we just built a retro pixel shooter with Claude Code in five steps.

First, we set up the project.

We found the game assets.

We drafted our spec with Claude's help using ask user question.

We had three milestones for Claude to build.

We built and iterated, ran into some pretty gnarly bugs with the boss.

But we got it working because we didn't give up.

And finally, we decided to ship it.

And now anyone can play our game.

And again, if you want to play it too.

It's right in the description.

So, here's the thing.

The pixel pack that I use has art for way more than space shooters.

You can build Castlevania style platformers, you can build cyberpunk shooters.

Underwater adventure games, like I showed you before with my kid.

You can even build top-down RPGs.

And what's the takeaway from this tutorial?

Look, a lot of people feel intimidated by Claude Code, by terminal, by GitHub, by Vercel and all this stuff.

But it really just comes down to chatting with AI.

Just like how you chat with AI in ChatGPT, Claude, or Gemini.

Don't overthink it.

You have this AI who's here to help you build the game.

So, pick a game idea.

Find some free pixel art or use the one that I'm using.

And just start prompting.

All right, I've linked the game and my GitHub repo below, so you can fork it and continue to improve the space shooter.

But I hope you get inspired from this tutorial to go build a game on the weekend with your kid or your spouse or anyone else.

It's incredibly fun.

And I'll leave you with this, right now we live in a world where creating is actually more fun than consuming.

You know, it's way more fun to vibe code this game than to watch some slop on Netflix or YouTube.

In my opinion.

Uh, except for my interviews, of course.

So, yeah, go ahead and build a game this weekend, and be sure to like and subscribe to this channel for more practical, no bullshit AI tutorials and interviews.