11-11 - Block Puzzle Game

Seele01-Flash
By
11-11 is an engaging block puzzle game that challenges your spatial reasoning and strategic thinking. Drag colorful blocks onto the board to complete rows and columns while maximizing your score.

Prompt

MODEL: Seele01-Flash
Please use Three.js to generate a **mobile-first game** with the theme "**11-11 Block Puzzle**". Please read the following detailed game design requirements first, and then generate the code accordingly: ### 1. Assets & Environment * **Visual Style**: Minimalist "Soft 3D" aesthetic. Use an **Orthographic Camera** to achieve a clean, flat isometric look similar to the reference screenshot, but with 3D depth for the blocks. * **The Grid**: Create an 11x11 main grid board. The empty cells should be represented by light grey, flat squares with rounded corners (using `THREE.ExtrudeGeometry` or a rounded rectangle shader). The background should be a clean, bright off-white (`#f0f4f8`). * **The Blocks**: Generate "Polyomino" shapes (similar to Tetris pieces but including single blocks, 2x2 squares, etc.). * Blocks must look "juicy": slightly beveled edges, soft pastel colors (Mint Green `#4ade80`, Salmon Orange `#fb923c`, Lavender `#a78bfa`, Mustard Yellow `#facc15`). * Blocks should cast soft shadows on the grid. * **Performance**: Use `THREE.InstancedMesh` for the static grid cells to minimize draw calls on mobile devices. ### 2. Audio Requirements * **Background Music (BGM)**: A calm, "Zen" style ambient track. It should be looped, low-tempo, and unobtrusive to help the player focus. * **Sound Effects (SFX)**: * **Pickup**: A soft "pop" or "suction" sound when a player touches a block. * **Placement**: A satisfying wooden "thud" or "click" when a block snaps into the grid. * **Line Clear**: A harmonious, ascending chime or digital "sweep" sound when a row or column is destroyed. * **Game Over**: A descending, slightly dissonant tone. ### 3. Gameplay Loop * **Setup**: The game starts with an empty 11x11 grid. Three random block shapes are spawned in a "hand" area at the bottom of the screen. * **Placement Logic**: * The player drags a shape from the bottom "hand" to the main grid. * The shape can only be placed if all its constituent blocks fit into empty grid cells. * Upon release, if the position is valid, the block snaps to the grid. If invalid, it returns to the hand. * **Scoring & Clearing**: * After every placement, check the grid. If a horizontal row or vertical column is completely filled, that line must visually "shatter" (particle effect) and disappear, freeing up space. * Multiple lines cleared at once award combo points. * **Win/Loss Condition**: There is no "win" state (endless mode). The game is **lost** when there is no space on the grid to fit any of the remaining shapes in the hand. ### 4. Mobile Controls & Interaction * **Touch Input**: Implement a robust Raycaster system for touch events (`touchstart`, `touchmove`, `touchend`). * **Drag Offset (Crucial)**: When the user drags a block, render the block slightly **above** the touch point (y-axis offset). This ensures the player's finger does not obscure the block they are trying to place. * **Visual Feedback**: * **Ghost Preview**: When dragging a block over a valid grid position, show a semi-transparent "ghost" of the block snapping to the grid to indicate where it will land. * **Scale Effect**: When a block is picked up, scale it up by 1.1x to indicate selection. * **Haptics**: Trigger `navigator.vibrate(10)` on successful block placement and `navigator.vibrate([30, 50, 30])` when a line is cleared. * **Orientation**: Lock the game to **Portrait Mode** for best mobile playability. Ensure the UI (score, restart button) stays at the very top, safe from notch areas. Do not ask for clarification. Do not request confirmation. Directly execute the generation task based on the given instructions.

Game Introduction

About the Game

11-11 is a captivating puzzle game that combines the satisfying mechanics of block placement with strategic thinking. This brain-training game challenges players to carefully position colorful blocks on a grid to complete rows and columns for maximum points. With its intuitive drag-and-drop gameplay and progressively challenging scenarios, 11-11 offers an addictive puzzle experience that's perfect for players of all ages.

The game features a clean, minimalist design with vibrant colored blocks that make gameplay both visually appealing and easy to follow. Each puzzle session presents unique block shapes that require careful consideration of placement strategy to avoid running out of space.

Core Features

Strategic Block Placement

The heart of 11-11 lies in its strategic gameplay mechanics. Players must think several moves ahead to efficiently place blocks while maintaining space for future pieces. The game rewards both quick thinking and long-term planning.

Intuitive Controls

Designed with accessibility in mind, 11-11 uses simple mouse controls that make it easy for anyone to pick up and play. The drag-and-drop interface feels natural and responsive across all devices.

Progressive Difficulty

As you advance through the game, the block shapes become more complex and the available space becomes more precious. This creates an engaging difficulty curve that keeps players challenged without becoming frustrating.

Score-Based Progression

Earn points by completing full rows and columns. The scoring system encourages efficient play and strategic thinking, as players work to achieve higher scores and beat their personal bests.

Game Mechanics

11-11 operates on familiar yet refined puzzle principles:

  • Block Placement : Drag various shaped blocks from the selection area onto the main game board
  • Row/Column Completion : Fill complete horizontal rows or vertical columns to clear them and earn points
  • Space Management : Carefully manage board space to ensure you don't get stuck with unplaceable blocks
  • Shape Recognition : Analyze upcoming block shapes to plan optimal placement strategies

Operation Guide

Getting started with 11-11 is simple and straightforward:

Basic Controls: - Mouse Cursor : Use your mouse to select and interact with blocks - Drag and Drop : Click and hold on a block, then drag it to your desired position on the board - Block Rotation : Some block shapes can be rotated for better placement options - Strategic Planning : Take time to analyze available blocks before making your move

Gameplay Tips: - Start by focusing on completing easier rows or columns - Always keep an eye on the upcoming block shapes - Try to maintain open spaces for larger, more complex blocks - Don't rush - strategic thinking leads to higher scores

Why Play This Game

Perfect Brain Training

11-11 serves as an excellent cognitive exercise, improving spatial reasoning, pattern recognition, and strategic planning skills. Regular play can enhance your problem-solving abilities while providing entertaining gameplay.

Accessible to Everyone

Whether you're a puzzle game veteran or a complete beginner, 11-11's intuitive design makes it immediately playable. The simple controls and clear visual feedback ensure that players can focus on strategy rather than struggling with complicated mechanics.

Stress-Free Gaming

Unlike time-pressured puzzle games, 11-11 allows players to think at their own pace. This makes it perfect for relaxation, casual gaming sessions, or mental breaks during busy days.

Cross-Platform Compatibility

Play seamlessly across desktop computers, tablets, and mobile devices. The game's responsive design ensures optimal performance regardless of your chosen platform.

Completely Free

Enjoy the full 11-11 experience without any cost. No hidden fees, no premium upgrades required - just pure puzzle gaming enjoyment.

Frequently Asked Questions (FAQ)