Asset Store
Discover high-quality assets for your next game project, or create your own with AI.
Create AssetDiscover high-quality assets for your next game project, or create your own with AI.
Create Asset
Made with Nano Banana 2 Lite · CC0 · 5 Oct 2026
Generated from: a scene from a small video game about: Act as an expert 3D Game Developer specializing in HTML5 Canvas, JavaScript, and Three.js. Your objective is to generate the complete, production-ready, fully functional 3D endless runner game clone of "Subway Surfers". The entire code must be delivered in a single, runnable HTML file containing HTML, CSS, and JavaScript. --- ### 1. GAMEPLAY ARCHITECTURE & MECHANICS 1. 3-Lane System: - Fixed 3-lane path (Left: -x, Center: 0, Right: +x). - Smooth lane switching animation (using lerp/interpolation) triggered by Left/Right Arrow keys or A/D. 2. Vertical Mechanics (Jump & Roll): - Jump (Up Arrow / W): Gravity-based parabolic jump curve. Smooth ascending and descending phases. - Roll/Duck (Down Arrow / S): Shrinks player bounding box by 50% height for sliding under high obstacles. - Jump to Roll transition: Pressing down while in mid-air must trigger a fast-fall ground pound animation. 3. Speed Progression & Game Loop: - Incremental forward speed acceleration over time. - Global distance score counter updating continuously based on survival time and speed. - Frame-rate independent physics loop using delta time (`requestAnimationFrame`). --- ### 2. VISUAL & SCENE REQUIREMENTS (Three.js) 1. Player Character: - 3D Mesh hierarchy representing a stylized runner (Head, Torso, Limbs). - Dynamic running pose animation using sine/cosine leg-swing mechanics. - Jump, Roll, and Death animation states. 2. Track & Environment Generation: - Procedural infinite track generation (spawning blocks ahead, destroying behind). - Subway Train Tracks: Wooden ties, metal rails, side walls, overhead signal arches. - Visual Depth: Atmospheric fog effect fading into the distance. 3. Obstacles & Pickups: - Obstacle Types: a) Static Barriers (Low: Jump over; High: Roll under). b) Stationary Subway Trains (Block 1 or 2 lanes, option to jump onto roof via ramps). c) Moving Trains (Approaching player from distance). - Pickups (Gold Coins): - Rotating, glowing 3D gold coins floating in lanes. - Coin patterns: Straight lines, parabolic jump arcs, high-train top arrays. - Magnet power-up logic: Smoothly pulls nearby coins toward the player when active. --- ### 3. COLLISION DETECTION & PHYSICS 1. Precise AABB (Axis-Aligned Bounding Box) system: - Separate collision boxes for Player, Trains, Low Barriers, High Barriers, and Coins. 2. Dynamic Bounding Box Updates: - Shrink player height box when crouching. - Elevate player bounding box when standing on top of trains. 3. Crash & Game Over: - Immediate crash detection on front obstacle collision. - Stumble/death animation followed by Game Over overlay screen. --- ### 4. UI & HUD DESIGN 1. Overlay Canvas/HTML UI: - Score & Multiplier Display (Top Right). - Collected Coin Counter (Top Left). - High Score memory using `localStorage`. 2. Screens: - Start Screen: Game Title, "Press Space to Run" prompt. - Game Over Screen: Final Score, High Score, Coins Collected, "Restart" button. --- ### 5. TECHNICAL CONSTRAINTS & LIBRARIES 1. Use Three.js via CDN (`https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js`). 2. Pure JavaScript — NO external asset/texture download dependencies (use procedural canvas textures, colors, and Three.js basic geometries like Box, Cylinder, Sphere). 3. Mobile & Desktop Support: - Arrow keys / WASD controls. - Touch/Swipe controls (Swipe Left/Right/Up/Down). 4. Audio Synth Engine: - Use Web Audio API for sound effects (Coin pick-up chime, Jump sound, Crash sound) without external audio files. --- Generate the entire HTML document starting with <!DOCTYPE html> to </html>. Ensure there are no placeholders, pseudo-code, or omitted sections., as an in-game screenshot in chunky low-poly 3D with flat shaded materials. Palette: dusk violet #2b2d42, stone #8d99ae, player coral #ef8354, threat teal #2a9d8f, accent gold #f4d35e. Everything is original: never draw or resemble characters, places or logos from existing games, films or brands (no red-capped plumbers, no famous mascots), even when the idea names one. Keep the pictures honest: they promise what a small first version of this game, made in a game engine in a few days, can look like. Simple readable shapes, clear silhouettes, few flat materials, the in-game camera view. Never film stills, photoreal renders, AAA key art, detailed textures, cinematic lighting, or anything that looks like a big-studio game. No text, UI, HUD, logos or editor screens inside any image.
Creator
Daulat Barve
Sign in to join the conversation.
Sign in to comment🌍CC0
Use, share, and remix the model freely with no restrictions and no attribution needed.