Space Invaders · kimi-k3

Let me build a single-file Space Invaders game. I'll write index.html with canvas, procedural graphics, keyboard controls, aliens grid, bunkers with pixel-level destruction, lives, game over/win, restart.

Design:
- Canvas 800x600.
- Cannon at bottom, move with Left/Right or A/D, Space fire with cooldown.
- Aliens: 5 rows x 10 cols, move horizontally, direction reversal at edges + descend. Speed increases as aliens die (classic).
- Alien fire: random bottom-most alien in a column fires toward player occasionally.
- Bunkers: 4 bunkers, pixel arrays (e.g., 60x40 cells, each cell maybe 4px). Destruction: on hit remove a circular blast radius of cells.
- Player hit: lose life, invulnerable 2s (blinking).
- Aliens reaching player zone (y threshold) → game over. Lives 0 → game over. All aliens dead → win.
- Restart button + R key.
- Score display, lives display, controls display.

Collision: shots as rects; aliens as rects. Bunker cells: store occupancy grid per bunker; collision check maps shot position to bunker-local cells.

Let me write it. Then run browser tool to verify: screenshot, simulate keys (key events?), the browser tool has "key" action — sends key press. I can use browser key to move/fire. And inspect console.

Let me write the file.

Bunker representation: each bunker: x, y, cols, rows, cell size (e.g., 5px), grid 2D boolean array. Shape: arch — remove cells in bottom middle for classic bunker shape. Damage: on projectile impact, clear cells in radius r around impact point.

Projectile vs bunker: compute impact cell from projectile rect overlapping any alive cell. Simplify: check projectile center point; find any alive cell within projectile bounds. Then blast.

Alien drawing: procedural pixel-art aliens via small bitmap arrays, two-frame animation.

Write code carefully.

Key handling: keydown/keyup set state; Space triggers fire (also allow holding with cooldown). Prevent default scrolling for Space/arrows.

Game loop with requestAnimationFrame and dt.

Fire rate: player shot cooldown 350ms, max maybe 3 shots on screen? Just cooldown. Alien shots limited to e.g. 3 concurrent, interval based.

Projectile lifetime: remove when off-screen (top/bottom), that's bounding lifetime. Also could add max life; offscreen is fine.

Alien movement: classic step-based: moveTimer with interval decreasing as aliens die; on each step move all aliens by dx; if any hits edge, reverse direction and descend. Alternative smooth movement: move at speed px/s, check bounds each frame. Smooth is fine: each frame x += dir*speed*dt; find min/max x of alive aliens; if exceeds edge, shift back and descend, flip dir. Do descend when hitting edge.

Edge check: compute bounding box of alive aliens; if box right > W-margin and dir>0 → descend & dir=-1; similar left.

Alien firing: every shotInterval, pick random alive alien that is bottom-most in its column, spawn shot moving down aimed slightly? "fires toward the player" — straight down is classic; make it move down with slight x toward player. I'll do straight down from alien, but biased: velocity downward, maybe aimed at player x with some spread. Straight down is fine, but requirement says "fires toward the player". I'll aim: vx = (playerCenter - alienCenter)*factor normalized, speed fixed.

Collision player: enemy shot vs cannon rect → if not invulnerable: lives--, invulnerable until now+2000, explosion effect. If lives 0 → game over.

Alien reach player zone: if max alien bottom y >= cannon top y → game over.

Win: alive aliens == 0 → win overlay.

Restart: reset everything. Button in overlay + R key anytime.

HUD: score, lives, controls text below/above canvas.

Draw bunker: iterate alive cells, fillRect green. Fine performance: 4 bunkers * (12x8) = 384 cells max. Use cell size 6px, bunker 66x42? Let's do cols=11, rows=7, cell=6 → 66x42. Arch: remove bottom-middle notch.

Blast radius ~ 9-11 px → clear cells within radius.

Effects: simple particle explosion list.

Starfield background maybe for flair — procedural stars, cheap.

Now write file.

Player cannon draw: procedural: base rect + barrel.

Alien bitmaps:
Row types: top row "squid" 8x8, middle "crab" 11x8, bottom "octopus" 12x8. Two frames each. Define arrays of strings.

I'll define bitmaps as arrays of strings with '1'.

Sizes: scale 3 → squid 24px wide, crab 33, octopus 36. Keep uniform cell: width per alien slot 40, height 30.

Points: top row 30, middle 20, bottom 10 (by row index).

Score increases once per alien — straightforward.

Write the HTML now.

For bunker damage from alien shots too, and player shots — yes both. Also alien shots pass through gaps. Collision checks against cells handle that.

Alien body vs bunker collision: classic invaders erase bunker when passing through. Optional; skip or implement cheap: when alien overlaps bunker, clear cells overlapped. I'll add it — cheap and nice. Actually keep simple: check each frame alien bounding boxes vs bunkers, clear overlapping cells. Might be minor perf cost but fine (55 aliens * 4 bunkers, only when overlapping y range). I'll include.

Invulnerability blink: draw cannon at reduced alpha alternating.

Now code.

const W=800,H=600.

Cannon: w=44,h=18, y=H-46. speed 300 px/s.

Player shots: array {x,y,w:3,h:12,vy:-520}. cooldown 300ms.

Alien shots: {x,y,vx,vy} speed ~ 220 + level? vy 240, vx aimed: dx = (player.x - alien.x), normalized so total speed = S.

maxAlienShots = 3, fire timer random 0.6-1.4s.

Alien grid: rows=5, cols=10, xStart=90, yStart=70, gapX=48, gapY=38.

Direction edge margins: keep aliens within 20..W-20.

Descend step 18.

Speed: base 25 px/s + (55-alive)*1.2.

Blink animation frame toggle every 0.5s for alien sprite frame.

Collision: shot rect vs alien rect.

Bunkers: y=H-150, 4 bunkers spaced: bunker width 66; positions centered: x = W*(i+0.5)/4 - 33.

cell=6, cols=11, rows=7. Shape: alive unless (row>=rows-2 && col in middle 3..7)? Classic arch notch at bottom center: remove cells where row>=4 and |col-5|<= (row-3)? Let's do: skip if row>=4 && col>=4-row? Simpler: remove bottom-center trapezoid: if row >= 3 and col >= 5-(row-2) and col <= 5+(row-2) remove? That grows wider toward bottom. At row=3: col 4..6? hmm (row-2)=1 → col 4..6. row 6: (row-2)=4 → col 1..9. That's a big notch. Maybe modest: remove if row>=4 and col between 4 and 6. Fine.

Blast: given impact point (px,py) in bunker local coords, radius 10: for each cell, if cell center within radius → dead.

Also shot destroyed on bunker hit.

Enemy shot vs player shot? Classic cancels. Optional; skip? It's nice: player shots can destroy enemy shots. Cheap to add: if overlap, remove both, small particles. I'll add.

Game states: 'playing', 'over', 'win'. Overlay div with message + Restart button. Also HUD always shows score/lives/controls.

Write it.

Particles: on alien death spawn ~12 particles green; on bunker blast few; on player hit red.

Now the file:

Then test with browser tool: load, screenshot, press ArrowLeft/Right, Space, check console via inspect. Also test restart via clicking button (need to trigger game over? The Restart button can be always visible — good for testing). I'll put a Restart button in HUD always visible, plus overlay button.

Let me write.

Initial render good, no console errors. Now test movement and firing: press ArrowLeft, Space, take screenshot.

Aliens moved right (formation shifted), an enemy shot visible (orange). Player didn't move much — the key press may have been a single keydown/keyup quickly. Test holding? The key tool sends key event; movement happens only while key held. Player still at center. Let me press "a" key a few times, and Space to fire. Actually key tool likely sends press (down+up). Movement per frame only during hold; small. Fine — but let me verify firing works: press Space.

Bunker damage visible (third bunker has a bite taken from enemy shot; fourth has edge damage). Aliens animating (frame changed). Player shot not visible in this frame (may have fired and traveled). Let me fire repeatedly to hit an alien and check score. Fire several spaces in a row — but cooldown 0.32s between; key events come with delays presumably. Fire a few times, then screenshot. The player is centered under columns; shots should hit bottom-row alien eventually. Actually previous shot may have hit — score still 0. Keep firing.

Aliens reversed and descended (they moved left and down — good edge behavior). Player shots not visible... Player shot white — I don't see one. Maybe the key event fired while state ok, shot travels fast (540 px/s), gone between frames. Screenshot timing might miss it. Let me use motion to capture frames, or press space and immediately screenshot. Actually the key tool returns a frame at press time; the shot may already be off. Alternatively, use "motion" after pressing. Let's do key space then motion.

Lives dropped to 2 — player was hit by enemy fire (life loss works, invuln blink visible — cannon rendered lighter). Player shots still not visibly registering score. Hmm — is the player shot firing? Space key might be sent but keydown/keyup quickly; fire happens in update if keys[' '] true during a frame and cooldown passed. Should work. But maybe the browser "key" tool sends events to the page; preventDefault on space ok. Score remains 0 — shots may be missing aliens because player is centered and column above drifts. Shots at x≈600 (canvas center)... aliens are moving; a vertical shot should hit the bottom alien in that column when aligned. Possibly shots fired between screenshot frames and missed due to alignment.

Let me capture motion frames right after a space press to see the projectile.

Still no visible player shot and score 0. Suspicious: maybe the Space key press isn't being registered as keys[' '] because e.key for space is ' ' — keydown handler stores keys[' '] = true; keyup sets false. If key tool sends down+up synchronously before the next rAF frame, the shot never fires because update checks keys each frame. That would explain: player never fires in tests, but in real usage holding works. But a quick tap by a real user also spans at least a frame or two usually (~50ms+), so fine. However safer: fire on keydown event directly too. I'll add firing trigger in keydown handler for Space (respecting cooldown), making taps reliable.

Also I should verify player movement — cannon appears same position throughout. Same cause: key down+up between frames → no movement. For real users holding keys it works. But to be safe, also nudge movement? No — movement by held keys is standard; the test harness just can't hold. I can simulate hold using the "key" tool? It only sends press. Alternative: verify via keyboard repeat... skip; logic is simple and standard.

Let me add immediate fire on keydown.

Fresh restart state good. Now fire several times with pauses (motion between to let shots travel & cooldown). Fire space, then motion, then space again... Shots aimed at center column; the formation drifts, but center column should be hit eventually.