Tetroid - Classic Block Puzzle Game

Seele01-Flash
By
Tetroid is a relaxing block puzzle game that combines the classic appeal of Tetris with a stress-free gaming experience. Create horizontal or vertical lines by strategically placing colorful block shapes on the grid.

Prompt

MODEL: Seele01-Flash
Please use Three.js to generate a **mobile-first game** with the theme "Tetroid". Please read the following detailed game design requirements first, and then generate the code accordingly: ### 1. Assets & Environment * **Visual Style:** "Clean Voxel" aesthetic. Use a bright, high-saturation color palette (Cyan, Magenta, Yellow, Lime Green, Orange) for the game blocks. The visual style should mimic the reference image where blocks appear to have a beveled or pyramid-like top face (simulated using `THREE.ConeGeometry` with 4 radial segments or `THREE.BoxGeometry` with specific lighting/shading). * **Grid System:** Render a **10x10 main grid** in the center of the screen. The grid background should be a soft, light grey (`#e0e0e0`) with darker grey grid lines. The grid cells must be distinct depressions or marked areas. * **Lighting:** Use Soft Ambient Light combined with a Directional Light (top-left) to cast subtle shadows, giving the blocks a "2.5D" depth effect. * **Performance (Mobile):** Use `InstancedMesh` for the grid cells if possible to reduce draw calls. Keep geometry segments low (Low-poly). * **Camera:** Orthographic Camera positioned at a slight angle (top-down view) to emphasize the 3D nature of the blocks while maintaining gameplay clarity. ### 2. Audio Requirements * **BGM:** A relaxing, loopable "Lounge/Elevator" style electronic track. Low BPM, non-intrusive, to emphasize the "no pressure" gameplay description. * **Sound Effects (SFX):** * **Pick Up:** A soft "pop" or suction sound when a player touches a shape. * **Snap/Drop:** A solid, plastic "click" when a piece is successfully placed on the grid. * **Line Clear:** A satisfying, harmonious chime or rising arpeggio when a row/column vanishes. * **Invalid Move:** A dull, low-pitch "thud" if the player tries to drop a piece where it doesn't fit. * **Game Over:** A descending "power down" sound effect. ### 3. Gameplay Loop * **Core Mechanic:** This is a "1010!" style game, not classic Tetris (no gravity). 1. **Spawn:** Three random shapes (tetrominoes/polyominoes) appear in a "docking area" at the bottom of the screen. 2. **Placement:** The player drags one shape at a time onto the 10x10 grid. The shape must fit completely into empty cells. 3. **Clearing:** If a row or column is completely filled, the blocks in that line disappear immediately (and visually shrink/fade out). **Crucial:** Remaining blocks do *not* fall down; they stay fixed in place. 4. **Refill:** Only when all three shapes from the docking area are used, three new shapes spawn. * **Scoring:** Points are awarded for placing blocks and bonus points for clearing lines (combo multiplier for clearing multiple lines at once). * **Undo Feature:** Implement an "Undo" button logic that stores the previous grid state and score, allowing one step back. * **Game Over Condition:** The game ends immediately if none of the current shapes in the docking area can fit anywhere on the grid. Display a "Game Over" modal with the final score and a "Restart" button. ### 4. Mobile Controls & Interaction * **Input Handling:** Use Raycaster for both Mouse (Desktop) and Touch (Mobile) events. * **Drag Offset (Crucial for UX):** When the player drags a shape on mobile, render the shape significantly **above the touch point (Y-axis offset)** so the player's finger does not obscure the block they are trying to place. * **Visual Feedback:** * **Ghosting/Highlight:** When hovering over a valid grid position, highlight the grid cells in a semi-transparent color to show where the block will snap. * **Invalid State:** If hovering over an invalid position, tint the block red or reduce opacity. * **Orientation:** Force or optimize for **Portrait Mode**. * *Layout:* Header (Score/Menu) -> Main Grid (Center) -> Docking Area (Bottom). * **Haptics:** Trigger `navigator.vibrate(10)` (light vibration) when a piece snaps into the grid or when a line is cleared. * **UI Size:** Ensure buttons (Undo, Menu, Restart) have a hit area of at least 44x44 pixels. Do not ask for clarification. Do not request confirmation. Directly execute the generation task based on the given instructions.

Game Introduction

About Tetroid

Tetroid is a captivating casual puzzle game that offers a fresh take on the beloved block-stacking genre. With a stellar rating of 4.1 out of 5 from thousands of players, this game delivers the perfect balance of challenge and relaxation. Unlike traditional Tetris games, Tetroid removes the time pressure, allowing you to think strategically about each move while enjoying colorful, clean animations.

Core Features

Stress-Free Puzzle Experience

Tetroid eliminates the pressure of falling blocks, giving you unlimited time to plan your moves. This makes it perfect for players who want to enjoy puzzle gaming without the stress of time constraints.

Strategic Block Placement

The game presents you with three different block shapes at a time. You must use all three pieces before receiving a new set, adding a layer of strategic planning to each move. This unique mechanic encourages thoughtful placement and forward thinking.

Clean Visual Design

Featuring bright, colorful blocks and smooth animations, Tetroid provides a visually appealing gaming experience that's easy on the eyes during extended play sessions.

Universal Accessibility

  • Completely Free : No payment required to access all game features
  • No Download Required : Play instantly in any modern web browser
  • Cross-Platform Compatible : Works perfectly on desktop computers, tablets, and smartphones
  • HTML5 Technology : Ensures smooth performance across all devices

Game Mechanics

Objective

Your goal is simple yet engaging: create complete horizontal or vertical lines of blocks. When you successfully form a line, it disappears from the grid, clearing space for more pieces and earning you points.

Block Management

The game provides three different shaped pieces at a time. You must place all three pieces before receiving new ones, requiring careful planning to avoid blocking potential line formations.

Scoring System

Points are awarded for each completed line, with bonus points available for clearing multiple lines simultaneously or achieving consecutive line clears.

How to Play

Basic Controls

  • Drag and Drop : Use your mouse or finger to drag pieces from the selection area to the game grid
  • Strategic Placement : Position blocks to create complete rows or columns
  • Undo Function : Click the arrow in the upper-left corner to undo your last move
  • Menu Access : Use the menu button to restart the game or adjust sound settings

Winning Strategy

  1. Plan Ahead : Always consider how each piece placement affects future moves
  2. Avoid Blocking : Don't place pieces in ways that prevent line formation
  3. Use All Space : Efficiently utilize the grid space to maximize scoring opportunities
  4. Think in Sets : Remember you must use all three pieces before getting new ones

Why Play Tetroid

Perfect for All Skill Levels

Whether you're a puzzle game veteran or a casual player, Tetroid offers an accessible yet engaging experience. The lack of time pressure makes it ideal for players of all ages and skill levels.

Relaxing Gaming Session

Unlike intense action games, Tetroid provides a calming, meditative gaming experience that helps reduce stress while keeping your mind engaged.

Brain Training Benefits

Regular play helps improve spatial reasoning, pattern recognition, and strategic planning skills, making it both entertaining and mentally beneficial.

Convenient Gaming

With no download required and cross-device compatibility, you can enjoy Tetroid anywhere, anytime. Perfect for short breaks or extended gaming sessions.

Platform Compatibility

Tetroid works flawlessly on: - Desktop Browsers : Chrome, Firefox, Safari, Edge - Mobile Devices : iOS and Android smartphones and tablets - Operating Systems : Windows, macOS, Linux - Connection : Can be played online with stable internet connection

Frequently Asked Questions (FAQ)