10x10 - Block Puzzle Game

Seele01-Flash
By
10x10 is an addictive block puzzle game that combines strategic thinking with satisfying line-clearing mechanics. Place colorful blocks on a 10x10 grid, clear complete lines, and challenge yourself to achieve the highest score possible.

Prompt

MODEL: Seele01-Flash
Please use Three.js to generate a **mobile-first game** with the theme "10x10 Puzzle Blitz". Please read the following detailed game design requirements first, and then generate the code accordingly: ### 1. Assets & Environment * **Visual Style**: Create a clean, "Juicy" aesthetic similar to modern hyper-casual mobile games. Use a top-down Orthographic Camera to ensure the grid is perfectly square and readable on small screens. * **The Grid**: Generate a 10x10 grid board background. The slots should be slightly indented or marked with a light grey distinct color (`#f0f0f0`) against a white background. * **The Blocks**: Create 3D rounded cubes (BoxGeometry with bevel segments) for the puzzle pieces. They should look tactile and slightly glossy (use `MeshPhysicalMaterial` with low roughness). * **Color Palette**: Use a vibrant, candy-like palette. Assign specific colors to specific shapes (e.g., 1x1 is yellow, L-shape is orange, long bar is red, 2x2 square is cyan, etc.). * **Visual Feedback**: * **Highlighting**: When a player drags a shape over the grid, the valid placement area on the grid should light up faintly ("Ghost" preview). * **Particles**: When a line is cleared, generate a simple particle explosion (using `THREE.Points` or small mesh instances) matching the color of the cleared blocks. * **Performance**: Use `InstancedMesh` for the static grid blocks if possible, or merge geometries to keep draw calls low for mobile browsers. ### 2. Audio Requirements * **BGM**: Synthesize or request a placeholder for a "Zen Puzzle" track—soft electric piano chords with a slow tempo (approx. 80 BPM), creating a focus-inducing atmosphere. * **Sound Effects (SFX)**: * **Pickup**: A soft "pop" or "whoosh" when a shape is lifted. * **Place**: A satisfying "thud" or "click" when a piece snaps into the grid. * **Line Clear**: A high-pitched, harmonious digital chime (pentatonic scale). * **Combo**: Pitch shift the clear sound up if multiple lines are cleared at once. * **Game Over**: A descending, low-tone "thud". ### 3. Gameplay Loop * **Initialization**: Start with an empty 10x10 grid and a score of 0. * **Shape Spawning**: Three random "Polyomino" shapes (Tetris-style shapes + single blocks) appear in a "Docking Area" at the bottom of the screen. * **Placement Logic**: * Players drag shapes from the dock to the grid. * Shapes can be placed anywhere as long as the grid cells are empty. * Shapes **cannot** be rotated (per original 10x10 rules). * **Clearing Mechanics**: * Check for full rows and full columns after every placement. * Unlike Tetris, blocks do not fall; they disappear, and the remaining blocks stay in place. * Clearing a line grants points. Clearing vertical and horizontal lines simultaneously grants bonus points. * **Refill Logic**: New shapes are only spawned when **all three** current shapes in the dock have been placed. * **Game Over Condition**: Calculate if any of the remaining shapes in the dock can fit into the empty spaces on the grid. If no move is possible, trigger the Game Over state. ### 4. Mobile Controls & Interaction * **Touch Input**: Implement `Raycaster` logic for Touch Events (`touchstart`, `touchmove`, `touchend`). * **Offset Dragging**: **Critical for Mobile**—When the user drags a shape, render the shape slightly *above* the touch point (y-axis offset) so the player's finger does not obscure the grid under the piece. * **Screen Layout (Portrait Mode)**: * Top 15%: Score and Best Score UI. * Middle 60%: The 10x10 Grid (Scale to fit width with padding). * Bottom 25%: The "Dock" containing the 3 draggable shapes. * **Haptics**: Trigger `navigator.vibrate(10)` on successful block placement and `navigator.vibrate([30, 50, 30])` on line clears. * **Animations**: Use a tweening library (like TWEEN.js or GSAP) to animate the blocks moving from the dock to the finger, and shrinking/fading out when lines are cleared. Do not just snap coordinates; smooth transitions are essential for the "premium" feel. Do not ask for clarification. Do not request confirmation. Directly execute the generation task based on the given instructions.

Game Introduction

About the Game

10x10 is a captivating puzzle game that puts a fresh spin on classic block-placement mechanics. Unlike traditional falling-block games, 10x10 gives you complete control over where you place each piece on the board. The game features a clean 10x10 grid where you strategically position various shaped blocks to create complete horizontal and vertical lines.

The game's intuitive design and gradually increasing difficulty make it perfect for both casual players looking for quick entertainment and puzzle enthusiasts seeking a mental challenge. With its colorful blocks and smooth gameplay, 10x10 provides hours of engaging puzzle-solving fun.

Core Features

Strategic Block Placement

Unlike traditional Tetris-style games, 10x10 allows you to freely place blocks anywhere on the 10x10 grid. This freedom of placement opens up countless strategic possibilities and requires careful planning to maximize your score.

Diverse Block Shapes

The game features a variety of differently shaped blocks, from simple single squares to complex multi-square formations. Each new set of three blocks presents unique placement challenges that keep the gameplay fresh and exciting.

Line Clearing Mechanics

When you successfully fill a complete horizontal row or vertical column, it disappears from the board, freeing up valuable space. The key to high scores lies in creating multiple line clears simultaneously and maintaining enough open space for future blocks.

Customizable Themes

The game includes a shop system where you can purchase new visual themes to personalize your gaming experience. Choose from different color schemes and visual styles to make the game uniquely yours.

Cross-Platform Compatibility

Play seamlessly across desktop and mobile browsers without any downloads or installations required. The game automatically adapts to your device for optimal gameplay experience.

Gameplay Mechanics

The core objective is simple yet challenging: place the given blocks on the 10x10 grid to form complete lines. Each turn, you receive three different block shapes to choose from. You must place all three blocks before receiving new ones, which adds a strategic layer to your decision-making.

Successful line formation (either horizontal rows or vertical columns) causes those lines to disappear, earning you points and creating space for more blocks. The game continues until you can no longer place any of the three available blocks on the board.

Operation Guide

Desktop Controls

  • Mouse Drag : Click and drag blocks from the selection area to your desired position on the grid
  • Block Rotation : Blocks cannot be rotated - strategic placement is key
  • Placement Confirmation : Release the mouse button to place the block

Mobile Controls

  • Touch and Drag : Tap and hold blocks, then drag them to your desired grid position
  • Visual Feedback : The game provides clear visual indicators showing valid placement areas
  • Responsive Design : Optimized touch controls for smooth mobile gameplay

Why Play This Game

10x10 offers the perfect blend of relaxation and mental stimulation. The game's non-time-pressured environment allows you to think through each move carefully, making it ideal for stress relief and cognitive exercise. The satisfying visual and audio feedback when clearing lines provides a rewarding gameplay experience.

The game's accessibility across all devices means you can enjoy quick puzzle sessions during breaks or engage in longer strategic gameplay sessions. With no pay-to-win mechanics or forced advertisements, 10x10 delivers pure puzzle gaming fun.

Whether you're a fan of classic puzzle games or new to the genre, 10x10's intuitive mechanics and progressively challenging gameplay make it an excellent choice for players of all skill levels.

Frequently Asked Questions (FAQ)