Slopey - Ball Rolling Skill Game

Seele01-Flash
By
Slopey is an addictive online skill game where you control a ball rolling down endless slopes. Test your reflexes as the ball speeds up, collect gems, and unlock new skins in this challenging endless runner.

Prompt

MODEL: Seele01-Flash
Please use Three.js to generate a **mobile-first game** with the theme "Slopey - Neon Downhill Runner". Please read the following detailed game design requirements first, and then generate the code accordingly: ### 1. Assets & Environment * **Visual Style:** A futuristic, high-contrast Synthwave/Neon aesthetic. The dominant color palette should use deep purples and magentas for the background fog and skybox, contrasting with a dark, sleek track. * **The Ball (Player):** A simple sphere with a metallic/emissive material (white or silver). It must have a glowing "Bloom" effect. Implement a `TrailRenderer` or simple particle trail behind the ball to emphasize speed. * **The Track:** A procedurally generated, winding 3D ribbon that curves downwards, left, and right. The material should be dark grey with grid lines or neon edges (cyan or pink) to help the player perceive depth and curvature on small screens. * **Obstacles & Collectibles:** * **Obstacles:** Low-poly cubes (bright yellow/orange) placed on the track. * **Collectibles:** Spinning diamonds/gems (ruby red) inside a golden ring, emitting a soft light. * **Mobile Optimization:** Use simple geometry (low polygon count) for the track segments. Use `THREE.InstancedMesh` for repeating obstacles to maintain high FPS on mobile browsers. Avoid complex dynamic shadows; use baked lighting or simple directional light. ### 2. Audio Requirements * **BGM:** A fast-paced, driving Synthwave or Electronic track with a steady beat to match the rolling momentum. * **Sound Effects (SFX):** * **Rolling:** A continuous low-humming rolling sound that increases in pitch slightly as the ball accelerates. * **Steering:** A subtle "whoosh" when changing direction sharply. * **Collection:** A high-pitched, positive "chime" or "ding" when grabbing a gem. * **Game Over:** A digital "crash" or "shatter" sound when falling off or hitting an obstacle. ### 3. Gameplay Loop * **Core Mechanics:** The game is an endless runner. The ball moves forward automatically, with gravity pulling it down the slope. The speed of the ball must strictly increase over time (linear acceleration) to increase difficulty. * **Physics:** Implement basic arcade physics (potentially using `Cannon.js` or a custom simple physics implementation). The ball must have inertia—it shouldn't stop instantly when steering stops. * **Track Generation:** The track must generate infinitely ahead of the player. As the player progresses, previous track segments should be disposed of to manage memory. The track should feature gaps (jumps), slanted turns, and moving obstacle blocks. * **Win/Loss:** * **Loss:** Falling off the edge of the track (Y-position threshold) or colliding head-on with a red obstacle. * **Win:** Endless mode (high score based on distance traveled). * **Scoring:** Display a distance counter at the top center. Add bonus points for collected gems. ### 4. Mobile Controls & Interaction * **Control Scheme (Touch-to-Steer):** * **Input:** Divide the screen vertically into two touch zones. Holding the **Left half** steers the ball left. Holding the **Right half** steers the ball right. * **Sensitivity:** Steering should feel responsive but slightly "heavy" (adding torque) to simulate the momentum of a heavy ball rolling downhill. * **Camera Behavior:** The camera must follow the ball from behind (Third-Person View). Crucially, the camera should slightly tilt/roll with the track's curvature to create a dynamic sense of speed, but smooth out the jitter to prevent motion sickness. * **UI Layout:** * **Start Screen:** A large "Tap to Start" overlay. * **Game Over:** A modal showing "Score", "High Score", and a large, thumb-friendly "Restart" button (at least 60x60px hit area). * **Orientation:** Force or optimize for **Portrait Mode** (vertical) as it suits the "downhill" perspective best, but ensure the canvas resizes correctly if the user rotates to Landscape. * **Feedback:** Trigger `navigator.vibrate(50)` (if supported) upon crashing or collecting a gem for haptic feedback. Do not ask for clarification. Do not request confirmation. Directly execute the generation task based on the given instructions.

Game Introduction

About the Game

Slopey is an exciting online skill game that challenges your reflexes and precision. Control a ball as it rolls down randomly generated slopes, trying to survive as long as possible without falling off the edge. Inspired by the popular Slope game series, Slopey offers a thrilling endless runner experience with beautiful 3D graphics and increasingly challenging gameplay.

The game features a minimalist yet captivating design with vibrant colors and smooth animations. As you progress, the ball gains speed, making each second more intense and requiring split-second decisions to navigate the treacherous slopes.

Core Features

Endless Slope Challenge

Navigate through procedurally generated slopes that become increasingly difficult. No two runs are the same, ensuring unlimited replayability and fresh challenges every time you play.

Speed Progression System

Your ball automatically accelerates as you travel further down the slope. The increasing speed creates an intense, adrenaline-pumping experience that tests your reaction time and concentration.

Gem Collection System

Collect sparkling gems scattered throughout the slopes to earn currency. These gems are essential for unlocking new ball skins and customizing your gaming experience.

Skin Customization

Unlock various ball skins using collected gems. Each skin offers a unique visual appearance, allowing you to personalize your ball and show off your achievements.

Daily Rewards

Check in regularly to receive free gems as bonus rewards. This feature helps you progress faster and unlock new content without having to play extensively.

Cross-Platform Compatibility

Play seamlessly on both mobile devices and desktop computers through your web browser. No downloads required - just open and play instantly.

Game Mechanics

The core gameplay revolves around precise steering and timing. As your ball rolls down the slope, you'll encounter:

  • Sharp turns that require quick reflexes
  • Narrow passages demanding precise control
  • Speed boosts that increase the challenge
  • Gem collection points for progression rewards

The physics engine creates realistic ball movement, making every roll feel natural and responsive to your inputs.

Operation Guide

Desktop Controls: - Left Arrow Key : Steer ball left - Right Arrow Key : Steer ball right

Mobile Controls: - Touch and drag : Swipe left or right to steer the ball - Tilt controls : Available on some mobile devices

The simple two-button control scheme makes Slopey accessible to players of all ages while maintaining the depth needed for skillful play.

Strategy Tips

  1. Anticipate turns : Look ahead to prepare for upcoming obstacles
  2. Collect gems safely : Don't risk falling for hard-to-reach gems
  3. Practice smooth movements : Avoid overcorrecting your steering
  4. Stay calm : The faster speed can be overwhelming, but steady nerves win
  5. Learn the patterns : While slopes are random, certain configurations repeat

Why Play Slopey

Free and Accessible : Completely free to play with no hidden costs or required downloads. Simply open your browser and start rolling.

Perfect for Quick Sessions : Ideal for short gaming breaks or extended play sessions. Each run can last anywhere from seconds to minutes, depending on your skill.

Skill Development : Improves hand-eye coordination, reaction time, and concentration. The progressive difficulty ensures continuous challenge and improvement.

Stress Relief : The simple yet engaging gameplay provides an excellent way to unwind and focus your mind on a single, enjoyable task.

Competitive Element : Try to beat your personal best score and challenge friends to match your distance records.

Frequently Asked Questions (FAQ)