← Prompts

Canyon Run

Read the current prompt
Role: You are an expert Three.js and WebGL game developer specializing in high-performance, minimalist arcade racers.

Objective: Create an HTML5 game (HTML/CSS/JS) that is a "High-Speed Procedural Canyon Racer." The gameplay must mimic the "flow" and "tension" of Race the Sun.

1. Core Gameplay Mechanics (The "Feel")
Movement Physics: Implement a "flight-based" physics model rather than direct axis control. The player (a sleek, low-poly geometric craft) should have momentum, banking (rolling) during turns, and pitch-based acceleration. Movement should feel "weighty" but highly responsive.
The Risk/Reward System (Proximity Scoring): Implement a "Near-Miss" mechanic. The closer the player passes to canyon walls or obstacles without colliding, the higher the score multiplier becomes.
Energy/Fuel Mechanic: The player has a constant "energy decay." Collecting glowing geometric orbs (recharges) is essential to stay alive. This forces the player to take risky paths through narrow gaps to stay fueled.
Speed & Acceleration: Implement a "Boost" system. Collecting items or maintaining high-speed straightaways builds a "Turbo" meter that allows for temporary extreme velocity and visual FOV widening.
2. Procedural Environment Generation
Infinite Generation: Use a chunk-based procedural generation system. As the player moves forward, generate new canyon segments and destroy old ones to ensure the game runs infinitely without memory leaks.
Terrain Variety: Generate three types of obstacles:
Canyon Walls: Massive, sweeping geological formations.
Floating Monoliths: Large, geometric pillars that require banking to avoid.
Tight Squeezes: Narrow gaps that require precise pitch/roll control.
Difficulty Scaling: As the score increases, increase the speed of the player and the density/tightness of the procedural obstacles.
3. Visual Direction (Aesthetic & Atmosphere)
Art Style: "Minimalist Low-Poly." Use a highly stylized, geometric aesthetic. No textures; use flat shading or simple vertex colors.
Lighting & Color Palette: Use a "Golden Hour" or "Cyber-Sunset" palette (deep oranges, purples, and silvers). Implement dramatic, long shadows cast by the canyon walls.
Post-Processing Effects (via Three.js):
Bloom: To make the energy orbs and the craft’s engine glow.
Motion Blur: To simulate extreme speed.
Camera Shake: Subtle shake when passing very close to walls or during high-speed boosts.
Particle Systems: Add a "trail" effect behind the player craft and "dust" or "debris" particles that fly past the player to emphasize speed.
4. HUD & User Interface
Minimalist HUD: The HUD should be non-intrusive.
Speedometer: A sleek, thin line representing current velocity.
Multiplier Counter: A large, stylized number that pulses when a "Near-Miss" is detected.
Energy Bar: A glowing bar (possibly circular around the player or at the bottom) that depletes and refills.
Game Over Screen: A clean, high-contrast overlay showing "Final Score," "Max Speed," and a "Restart" button.
5. Technical Requirements
Frameworks: Use Three.js for 3D rendering (include Three.js via CDN).
Performance: Use requestAnimationFrame. Optimize geometry to ensure a smooth 60fps on most hardware.
Collision Detection: Implement efficient bounding-box or sphere-based collision detection between the player and the procedural geometry.
Sound Synthesis: Use the Web Audio API to generate procedural sound effects (a low hum for the engine, a "ping" for collectibles, and a synthesized "whoosh" for near-misses).