Track · FPS · Browser build
Build a first-person shooter in a week.
Not a toy. A fast, good-looking arena shooter that runs in any browser: real movement and gunplay, enemies that flank and shoot back, a HUD with a radar and a kill feed, sound, objectives, a menu, and a link you can text a friend so they can play it in one click. This is a serious week. Plan on roughly ten to twelve focused hours a day, a lot of debugging, and a lot of reading what the agent wrote. That is the job.
Want the longer game — a full, career-oriented path where this week becomes the on-ramp to terminal, Linux, tmux, Git, TypeScript, full-stack, and responsible AI-assisted engineering? This browser sprint is a conceptual and portfolio on-ramp to Learn dev by building a game — the ideas carry straight over, though that longer path deliberately starts a maintainable Babylon.js product rather than continuing this week's Three.js code.
Why the browser, and why this is the AI-native route
You will direct an AI agent that writes nearly all the code, in JavaScript, on top of Three.js. Code-first, text-based stacks are exactly where today's agents are strongest and where you can actually read and understand every line they produce, which is the whole point. It also ships to a URL for free, so “come play my game” is one link, not an install. Want the industry engine instead? There is a parallel Unity week.
How this track actually works
Each day below is a milestone, not a single prompt. A real day is dozens of prompts, test runs, and diff reviews, plus genuine debugging when the agent does something plausible but wrong. The discipline that separates a finished game from a pile of slop: spec the day before you prompt it, read every diff before you accept it, and play after every change. You are the engineer and the designer; the agent is the fast hands. Keep the five chops open in another tab.
#Day 0: the stack and the harness
Set up the tools and, just as importantly, the way you will work with the agent.
- Runtime + editor. Node 24 (you already have it from the Groundwork setup via mise) and VS Code or your editor of choice.
- An AI coding agent that edits files in your project: Claude Code, Codex, or Cursor.
- The project. A Vite + Three.js app, version-controlled with Git from commit one.
- The harness. An
AGENTS.md in the repo root with your conventions and guardrails, so the agent stays consistent across a week of sessions.
ask your AIScaffold a Vite + Three.js project for a first-person shooter. Set up a basic scene with a lit ground plane, a skybox, and a render loop locked to the display refresh rate using a fixed timestep for game logic. Add an AGENTS.md documenting our conventions: ES modules, no framework, small focused files, and a note that you should propose a short plan before large changes.
Concept · The harness is the workBefore any gameplay, you are setting up how a human and an agent collaborate over days: a clean repo, a render loop with a fixed timestep (so physics behave the same regardless of frame rate), and a written contract the agent reads every session. This is agentic engineering, not vibe coding. The spec and the conventions are the real instructions; the code is downstream.
Your turn: open the scaffold and trace one full frame in your head: input, update, render. If you can't, ask the agent to walk you through the loop line by line. You cannot direct what you don't understand.
▶Running A lit 3D scene in the browser, a clean repo, and a written harness for the week.
1Day 1: movement and a world that feels real
ask your AIBuild a first-person controller with pointer-lock mouse look and WASD movement, including gravity, jumping, sprinting, crouching, and a little air control so it feels responsive. Then build a real arena: walls, cover blocks, crates, ramps, and a raised platform, with proper collision against all of it, textured surfaces, and lighting that reads clearly. No gray boxes.
Concept · Game feel is engineered“Feels good” is not luck: it is acceleration curves, friction, jump arcs, and mouse smoothing you can tune. You will meet vectors (movement and aim are vector math), delta time (frame-independent motion), pointer lock (capturing the mouse), and collision (stopping at walls). The arena is level design: sightlines, cover, and verticality decide whether combat is fun.
Your turn: tune movement speed, gravity, and mouse sensitivity until it feels right to you, then add an FOV slider. Comparing 90 vs 103 FOV teaches you why shooters argue about it.
▶Playable You sprint, slide around cover, and jump across a real arena in first person.
2Day 2: weapons with weight
ask your AIAdd a weapon viewmodel with idle sway and bob, plus recoil and a reload animation. Implement hitscan firing with a raycast from screen center, muzzle flash, tracers, and impact decals. Add an ammo and reload system, then a second and third weapon (a fast rifle, a high-spread shotgun, a precise pistol) with distinct fire rates, spread, and damage, and weapon switching on number keys. Wire up firing, reload, and switch sounds.
Concept · Data-driven weapons and feedbackThree weapons should not be three copies of code. You will factor shared firing logic and describe each gun with data (fire rate, spread, damage, ammo), the first taste of real architecture. Raycasting is how hitscan guns hit; feedback (flash, tracer, decal, sound, recoil) is what makes a shot feel powerful. Watch the agent for the classic bug: firing tied to frame rate instead of a timer.
Your turn: read the firing code and confirm fire rate is time-based, not per-frame. Then change one weapon's spread and fire rate and feel how two numbers create a whole different gun.
▶Playable Three weapons that each feel distinct, with punchy hit feedback and reloads.
3Day 3: enemies that fight back
ask your AICreate enemy units with health that spawn into the arena and navigate toward the player around walls and cover using pathfinding on a navigation grid. Give them line-of-sight checks, a state machine (idle, hunt, take cover, attack), and two types: a rusher that closes to melee and a shooter that fires from range and retreats when hurt. Add damage, death effects, and a hit reaction. Keep it performant with twenty enemies active.
Concept · AI is state machines plus pathfindingGame AI is not mysterious: a finite state machine (a few states and the rules to switch) plus pathfinding (A* over a grid, or steering with obstacle avoidance) plus line of sight (can it see you?). The hard part is performance: twenty units pathfinding every frame will tank your frame rate unless you spread the work out. This is where you start profiling.
Your turn: open the browser performance tools and watch the frame time as enemies spawn. Find the most expensive function and ask the agent to optimize that one specifically. That targeted question is the skill.
▶Playable Enemies hunt you through the arena, take cover, and shoot back. It is genuinely tense.
4Day 4: the combat loop and the stakes
ask your AIGive the player health, armor, and regenerating shields, with directional damage indicators showing where hits come from, plus hitmarkers and a headshot damage multiplier with a distinct sound. Build a wave system that spawns escalating groups with a short break between waves, an objective (survive, or clear all waves), a score and kill-streak system, and a clear game-over and victory state. Tune the first five waves so it ramps from easy to genuinely hard.
Concept · A game is a loop with stakesYou now assemble the core loop: spawn, fight, survive, escalate. Game state (playing, between waves, game over) is a state machine you own. Balancing is design work no agent can do for you, because it depends on how the game feels to play, which only you can judge. Stakes (you can lose) are what make winning mean anything.
Your turn: play wave 5 ten times and write down what feels unfair, then fix exactly that. Tuning by feel, not by theory, is how shooters get good.
▶Playable A full survival shooter with armor, headshots, escalating waves, and a real win/lose.
5Day 5: HUD, menus, and juice
ask your AIBuild a full HUD: health and armor bars, an ammo counter, a top-corner radar showing nearby enemies relative to where I face, a kill feed, a crosshair that reacts to spread, and an objective marker. Add a main menu, a pause menu, and a settings menu (sensitivity, FOV, volume), plus a game-over and victory screen with run stats. Then add juice: screen shake on hits, a damage vignette, hit-stop on kills, and particle effects.
Concept · UI is architecture, juice is feelA HUD has to read live game values without becoming spaghetti, so you will think about how the UI observes game state cleanly. The radar teaches a real bit of math: projecting world positions into screen-relative directions. Juice, the screen shake and hit-stop and flashes, is the difference between “it works” and “it feels amazing,” and a little goes a long way.
Your turn: add a toggle to turn all screen shake off, then play with it on and off. Deciding how much juice is too much is a taste you are building.
▶Playable It looks and feels like a real game: radar, kill feed, menus, and satisfying feedback.
6Day 6: sound, performance, and content
ask your AIAdd 3D positional audio so footsteps, gunfire, and enemy sounds come from the right direction and distance, plus ambient music that shifts when combat starts. Do a performance pass: pool bullets and effects instead of creating and destroying them, cull what is off-screen, and hold a steady 60 frames per second with everything active. Then add content: a second arena, health and armor and ammo pickups, and one elite enemy with more health and a special attack.
Concept · Spatial audio, pooling, and profiling3D audio doubles immersion: hearing a flank is gameplay. Object pooling (reuse objects instead of constantly allocating) is the single biggest performance win in a bullet-heavy game, because creating and garbage-collecting objects mid-fight causes stutter. Profiling is how you find the real bottleneck instead of guessing. This is the day the game stops hitching.
Your turn: profile before and after the pooling change and read the difference in frame time yourself. Measuring the win, not assuming it, is the engineering habit.
▶Playable Smooth 60fps, directional sound, two arenas, pickups, and an elite to fight.
7Day 7: ship it where friends can play
ask your AIMake a production build with Vite and walk me through deploying it so it plays in any browser from a single link, on itch.io or GitHub Pages. Add a title screen with the game's name and branding, a short how-to-play, and make sure it loads fast. Help me capture a few screenshots and a short clip for the page.
Concept · Shipping is a skillA production build bundles and minifies everything for the web; deploying to a static host gives you a public URL with no install. Shipping is where most projects die, so finishing one, even at small scope, puts you ahead of most people who “are learning game dev.” The reward is real: a link, and the face of the first friend who plays it.
Stretch goals (each is its own multi-day adventure)
- Online leaderboard — add a tiny backend so scores persist and rank. This is the bridge to the Apps track.
- An AI announcer — call a language model at runtime for dynamic callouts and enemy taunts.
- Real-time multiplayer — the true Call of Duty frontier. Networking with WebSockets or WebRTC is hard and worth a project of its own.
Your turn: send the link to one person and watch them play without helping. Where they get confused is your next design task.
▶Shipped A complete, online, good-looking first-person shooter, built in a hard week, that you are proud to share.
#Where to go next
You touched every core system of a 3D shooter: a controller, gunplay, enemy AI, a combat loop, UI and radar, spatial audio, performance work, and a shipped build, while reading and understanding the code the whole way. To go deeper:
- Fundamentals, free: the Three.js docs and examples and MDN Game development. Going back to the fundamentals after building something fun makes them stick.
- The chops: return to Vibe → agentic. Before each stretch feature, write a short spec, then review every diff.
- The industry engine: run the same arc in a real game engine on the Unity FPS week.
- Practice with a deadline: join a game jam on itch.io. Finishing a small game on a clock teaches more than a month of tutorials.
The honest partThis is not a one-prompt miracle. It is a week of directing, reading, debugging, and tuning, with an agent that is fast and frequently wrong. That is exactly why finishing it means something: AI made an ambitious shooter reachable, and you stayed the senior partner who understood and shipped it. Get excited, then put in the hours.