Kask Kapmaca

Cinevva's analyzer read this game's design doc and its source, then wrote the brief below. "Make your own" hands it to the game creator as your opening message, so you start from a real spec rather than a one-line idea.

Rebuild a full-screen 2D browser arcade game titled “Kask Kapmaca” (Turkish for Helmet Chase), using an HTML canvas that fills the viewport and responsive HTML HUD overlays. The game is viewed from directly overhead on a flat field: draw a dark navy vertical gradient background (#172554 at top to #0f172a at bottom) with a subtle blue-gray square grid, vertical lines every 48 px and horizontal lines every 48 px beginning around the HUD boundary. Use a clean, colorful minimalist vector style with no external assets.

At the start, show a centered modal near the upper-middle of the screen, width about 88vw and max 500px, with a very dark translucent navy background, rounded 18px corners, a 2px yellow border, and shadow. Display the large yellow title “Kask Kapmaca”, then Turkish instructions: “Güvenlik görevlilerinin kasklarını yakalanmadan topla. Sarı kasklara dokun, kırmızı görüş alanlarından kaç!” and controls text “PC: WASD / ok tuşları · Telefon: alttaki tuşlar”. Include a large rounded yellow button labeled “Oyunu Başlat”. Starting can also happen with Space when not running.

The goal is to collect all 10 yellow helmets before the 60-second countdown reaches zero, while avoiding five moving red security guards and their red translucent vision cones. The top HUD is fixed above the canvas with three dark translucent pill-shaped counters spaced across the width: “Kask: 0/10” (update the collected count), “Süre: 60” (show ceiling of remaining seconds), and “Can: 3” (remaining lives). Keep Turkish labels. At the bottom, show a centered small hint reading “Kasklara yaklaşınca otomatik toplanır”. On touch devices, provide fixed bottom controls: four dark translucent rounded square buttons with white arrow icons for left, down, up, right, plus a separate ⚡ button on the right for dash. On desktop these controls may be reduced in opacity and scale but remain available.

Gameplay starts with the player centered. Represent the player as a cyan/sky-blue circular character of radius 16: a light pale-blue helmet-like arc on its upper half, a dark blue horizontal visor/bar, and a dark bottom detail. Move with WASD or arrow keys, and support the on-screen buttons; normalize diagonal movement. Base speed is 190 px/sec. Hold Shift (either Shift key) or the ⚡ control to multiply speed by 1.7. Clamp the player within the play area, keeping its center at least 24 px from left/right/bottom edges and at least 74 px from the top to leave room for HUD.

On each reset, place exactly 10 collectible yellow helmets at deterministic spread-out positions based on the viewport: x = 80 + (index*83) modulo max(220, viewportWidth-120), y = 110 + (index*137) modulo max(180, viewportHeight-210). Each helmet has radius 15 and is drawn as a bright yellow semicircular hardhat (upper half of a circle) with a yellow brim extending horizontally, plus a small pale highlight rectangle. Animate each uncollected helmet with a gentle vertical bob of about 3 px. When the player comes within 32 px of a helmet, automatically collect it, increment the score, hide it, and emit a brief burst of 12 small yellow particles. Reaching 10 helmets immediately wins.

Create exactly five red guards at deterministic positions: x = 100 + (index*173) modulo max(240, viewportWidth-160), y = 150 + (index*101) modulo max(160, viewportHeight-260), radius 17. Each moves horizontally, initially alternating direction, with speed magnitude 42 + index*5; reverse at x=35 or viewportWidth-35. Their vertical position oscillates subtly from a phase offset (phase=index*1.7), using a sine wave over time, and clamp them between y=90 and viewportHeight-50. Draw each guard as a red circle with a pale horizontal eye/visor stripe and a dark lower stripe. From each guard, draw a translucent red fan-shaped vision cone: radius 82 px, spanning angles -0.8 to +0.8 radians around the right-facing direction. The cone is visual warning only; collision with the guard itself is what costs a life.

If the player comes within 30 px of a guard while not invulnerable, subtract one life, set 1.3 seconds of invulnerability, and emit 12 pink/red particles. During invulnerability, make the player blink by alternating reduced opacity. If lives reach zero, end with a loss overlay titled “Yakalandın!” and text “Toplanan kask: [score]. Bir daha dene!”. If the timer reaches zero, also lose unless all 10 helmets have already been collected. If the player collects all 10, end with a win overlay titled “Kazandın!” and text “10 kaskı da topladın. Skorun: [score]”. End states stop gameplay and change the button label to “Tekrar Oyna”; pressing it resets score, lives, timer, player, helmets, guards, and particles.

Use smooth requestAnimationFrame updates with a capped timestep of 33 ms, continuously update the HUD, and keep the canvas responsive to window resizing. Add simple particle bursts whose particles move outward, slow down, fade over roughly 0.55 seconds, and are colored yellow for collection or pink for damage. Preserve the prominent yellow/navy/cyan/red visual palette and Turkish UI text shown above.