Rumble Circuit

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.

Create a browser-based 3D third-person arena fighting game titled “Rumble Circuit.” Use Three.js or an equivalent WebGL engine, with a dark, polished arcade presentation. The camera should be a perspective third-person camera following the player fighter from roughly 7 units away, with movement-oriented controls and the arena visible around the character. Use a near-black navy background with fog, strong shadows, a warm directional key light, cool purple rim lighting, and a subtle neon championship-fight atmosphere.

Build a compact rectangular championship ring in the center of the scene. The ring should have a dark, slightly metallic outer apron, an 8-by-6-unit blue-gray mat raised slightly above a larger dark arena floor, four gold/tan corner posts, and three pale ropes around all four sides at approximately waist, chest, and head height. Add simple dark colored crowd-wall blocks beyond the back edge, translucent blue-purple cone-shaped spotlights above/around the ring, a blue-corner banner, a red-corner banner, and a championship trophy near the rear of the arena. Enable cast and receive shadows, fog the arena into the dark background, and use a cinematic tone-mapped look.

Load or create two humanoid soldier-like 3D fighter characters using the same base model. Place the player in the blue corner near one end of the ring and tint its materials subtly cyan/blue; place the rival opposite it and tint it subtly red/pink. Scale both fighters up to a readable arcade size. The player initially faces toward the rival and the rival faces back. Give the characters idle animation, an attack-melee-right animation for the player, and hurt and die reactions for the rival when those clips are available. The player can rotate toward its movement facing direction.

The goal is to defeat the rival by reducing its health to zero before the rival defeats the player. Start a single exhibition round, round 1, with player health 100, rival health 100, and player energy 100. The rival AI should continuously pursue the player: if it is more than 2 units away, move toward the player at approximately 0.65 units per second and turn toward the player; if within 2 units, attack no more than once every 1.6 seconds, dealing randomly either 7 or 10 damage. Show “RIVAL HIT” when this happens. When player health reaches zero, stop gameplay and show “KNOCKED OUT” in red/pink.

Allow the player to move with WASD, run with Shift, and jump with Space through third-person controls. Add three attacks, available both from keyboard and on-screen touch/click buttons: J / Punch, K / Kick, and L / Grapple. Attacks require at least 10 energy and are blocked during a short attack lock. Punch costs 9 energy, has a 0.55-second lock, and deals 10 damage at close range. Kick costs 13 energy, has a 0.55-second lock, and deals 14 damage at close range. Grapple costs 18 energy, has a 1-second lock, and deals 24 damage at close range. Consider an attack close enough when the player and rival are less than 3.1 units apart. On a successful hit, push the rival backward along its z direction by 0.25 units for punch/kick or 0.65 units for grapple, play the rival’s hurt animation, and show “PUNCH!”, “KICK!”, or “POWER SLAM!” respectively. If the player is too far away, spend the energy but show “MISS.” While an attack lock is active, play the player’s melee attack animation. Regenerate energy continuously at 12 per second, capped at 100.

When the rival reaches zero health, stop the game, play its die animation, and show “PINNED! YOU WIN” in mint/cyan. Do not add rounds, scoring systems, weapons, projectiles, inventory, or other mechanics beyond this single exhibition fight. The exposed game state should include player x/y/z position, score (initially 0), round (1), playerHp, enemyHp, energy, and gameOver.

Create a fixed responsive HUD over the canvas. At the top left, show the uppercase brand “RUMBLE CIRCUIT” and a translucent dark rounded card labeled “BLUE CORNER,” with a cyan-to-blue player health bar and numeric health value, plus a yellow energy bar and numeric energy value. At the top right, show “EXHIBITION • ROUND 1” and a matching card labeled “RED CORNER,” with an orange-to-pink rival health bar and numeric value. Put a large centered temporary message near the upper portion of the screen: initially “FIGHT!” in gold, then fade combat notifications after about 0.9 seconds; use strong uppercase lettering, spacing, and a dark text shadow.

At the bottom center, place three large rounded, highly visible action buttons: a magenta/red-purple “PUNCH J” button, an orange “KICK K” button, and a teal/blue “GRAPPLE L” button. Give them gradient fills, dark offset shadows, pressed-state movement, and touch-friendly sizing. In the lower left, show a compact keyboard hint: “WASD move · SHIFT run · SPACE jump” and “J punch · K kick · L grapple,” with keys rendered as small bordered dark keycaps. Make the layout responsive: on small screens reduce card and button sizes and hide the keyboard hint, while retaining the three touch buttons. Keep the page full-screen with no scrolling and render the WebGL canvas behind the HUD.