TenTrix - Online Puzzle Game

Seele01-Flash
By
TenTrix is an innovative 10x10 puzzle game that combines the best elements of Tetris with strategic block placement. Unlike traditional Tetris, pieces don't fall - you have complete control over where to place each colorful block on the board.

Prompt

MODEL: Seele01-Flash
Based on the provided game description and screenshot, here is the detailed prompt to guide an AI in generating the Three.js code for "TenTrix". *** Please use Three.js to generate a **mobile-first game** with the theme "**TenTrix 3D**". Please read the following detailed game design requirements first, and then generate the code accordingly: ### 1. Assets & Environment * **Visual Style**: Glossy, semi-realistic "Jewel/Gem" aesthetic. The blocks should look like beveled, shiny plastic or glass tiles with distinct colors (Red, Blue, Green, Yellow, Purple, Orange, Cyan). * **Grid System**: A **10x10 grid** playing board. The board itself should be a dark blue, semi-transparent plane with a subtle glowing grid pattern (neon blue lines) to indicate slots. * **Block Geometry**: Use `THREE.BoxGeometry` or `THREE.ExtrudeGeometry` with beveled edges to simulate the "pyramid/jewel" look seen in the screenshot. Add a `MeshPhongMaterial` or `MeshStandardMaterial` with high shininess (`shininess: 100`) and specular highlights to make them pop. * **Camera View**: A fixed Orthographic camera (preferred for puzzle precision) or a high-angle Perspective camera looking slightly tilted down at the board, ensuring the entire 10x10 grid and the "spawn area" at the bottom are visible without scrolling. * **Background**: A subtle, abstract techno-grid background (dark blue tones) that moves slowly or pulses to add depth without distracting from the gameplay. * **Performance**: Use `InstancedMesh` for the grid cells and placed blocks if possible to keep draw calls low on mobile devices. ### 2. Audio Requirements * **BGM**: A chill, "Zen Techno" or "Ambient Puzzle" track. Smooth, repetitive, low-tempo electronic music that aids concentration (think "elevator music" but modern). * **Sound Effects (SFX)**: * *Pickup*: A soft "pop" or "click" when picking up a shape. * *Place*: A satisfying "thud" or "snap" sound when a shape is successfully dropped onto the grid. * *Invalid Move*: A low-pitch "buzz" or "spring" sound if the player tries to drop a piece where it doesn't fit. * *Line Clear*: A high-pitched, sparkly "chime" or "glass breaking" sound. This sound should pitch up if multiple lines are cleared simultaneously (combo). * *Game Over*: A descending electronic tone. ### 3. Gameplay Loop * **Core Mechanic**: 1. Spawn 3 random shapes (tetrominoes/pentominoes) in a "dock" area at the bottom of the screen. 2. The player drags these shapes onto the 10x10 grid. 3. **No Gravity**: Blocks do not fall. They stay exactly where placed. 4. **No Rotation**: Shapes cannot be rotated. * **Clearing Logic**: When a row (horizontal) or column (vertical) is completely filled with blocks (10 units), that line disappears instantly. Colors do *not* need to match; only structural completeness matters. * **Progression**: The player *must* use all 3 spawned shapes before a new set of 3 appears. * **Game Over Condition**: Check after every move. If any of the remaining shapes in the dock cannot fit anywhere on the current board, the game ends. * **Scoring**: +10 points per block placed. +100 points per line cleared. Bonus multipliers for clearing multiple lines at once. ### 4. Mobile Controls & Interaction * **Touch Input**: Implement Raycasting for touch events (`touchstart`, `touchmove`, `touchend`). * *Drag Behavior*: When the user touches a shape in the dock, create a slightly larger "ghost" copy of the shape that follows the finger. The shape should float slightly above the board (Z-axis offset) to avoid visual clipping. * *Offset*: Important! Render the dragged shape slightly *above* the user's fingertip (Y-axis offset) so the player can see where they are placing it. * **Snap-to-Grid Preview**: As the player drags a shape over the board, highlight the underlying grid cells (e.g., turn them white or semi-transparent green) to show exactly where the piece will land. If the placement is invalid, highlight red. * **Orientation**: Portrait mode preferred for mobile (Grid on top, Dock on bottom). Responsive design to scale the camera zoom based on screen width (`window.innerWidth`). * **Feedback**: * *Haptic*: Trigger `navigator.vibrate(20)` on successful placement and `navigator.vibrate([50, 50, 50])` on line clears. * *Visual*: Simple particle explosion (small cubes) when a line is cleared. ### 5. Implementation Notes Please write the code in a single HTML file containing CSS, JS (Three.js via CDN), and logic. Ensure the touch event listeners define `passive: false` to prevent the browser from scrolling while dragging pieces. Do not ask for clarification. Do not request confirmation. Directly execute the generation task based on the given instructions.

Game Introduction

About the Game

TenTrix is a captivating puzzle game that revolutionizes the classic Tetris formula. Set on a 10x10 grid, this game challenges players to think strategically about block placement without the pressure of falling pieces. The colorful, geometric blocks create a visually appealing experience that's both relaxing and mentally stimulating.

What sets TenTrix apart is its unique approach to puzzle gaming. Instead of racing against time as pieces fall from above, you have complete freedom to analyze the board and make calculated moves. This makes it perfect for players who enjoy strategic thinking and careful planning.

Core Features

Strategic Block Placement

Unlike traditional Tetris, TenTrix gives you full control over piece placement. You can position blocks anywhere on the 10x10 grid, allowing for more creative and strategic gameplay approaches.

Multi-Directional Row Clearing

Clear complete rows both horizontally and vertically! This dual-direction clearing system opens up countless strategic possibilities and keeps the gameplay fresh and engaging.

No Time Pressure

Take your time to plan each move. There's no countdown timer or falling pieces to stress about - focus purely on strategy and optimal placement.

Endless Gameplay Potential

The game continues indefinitely as long as you can fit new pieces. Challenge yourself to achieve higher scores and longer gameplay sessions.

Colorful Visual Design

Enjoy vibrant, colorful blocks on a clear grid system. The clean visual design makes it easy to spot patterns and plan your next moves.

Game Mechanics

TenTrix presents you with three pieces at a time, and you must place all three before receiving new ones. This system adds a layer of strategic planning as you need to consider how all three pieces will fit together on your current board state.

The game ends when you can no longer fit a required piece on the board, making space management crucial for high scores. Each completed row (horizontal or vertical) clears from the board, creating new space for future pieces.

Operation Guide

Basic Controls

  • Mouse : Click and drag pieces from the bottom selection area to the game board
  • Touch : On mobile devices, tap and drag pieces to your desired location
  • Placement : Position pieces anywhere on the 10x10 grid where they fit

Gameplay Strategy

  1. Analyze all three pieces before making your first placement
  2. Plan for row completion - look for opportunities to clear multiple rows
  3. Avoid small enclosures - keep open spaces for larger pieces
  4. Think in multiple directions - remember you can clear both horizontal and vertical rows
  5. Manage board space efficiently - don't let one area become too cluttered

Key Differences from Tetris

  • No rotation : Pieces cannot be rotated, adding to the challenge
  • No falling : Place pieces exactly where you want them
  • Any direction clearing : Complete rows clear both horizontally and vertically
  • No color matching required : Any blocks can form a clearing row

Why Play TenTrix

TenTrix offers the perfect blend of familiar puzzle mechanics and innovative gameplay features. It's ideal for players who love Tetris but want a more thoughtful, strategic experience. The game's accessibility makes it perfect for quick sessions during breaks or extended play sessions when you want to challenge your spatial reasoning skills.

The absence of time pressure makes it an excellent choice for stress-free gaming, while the strategic depth ensures it remains challenging and engaging for experienced puzzle game enthusiasts.

Frequently Asked Questions (FAQ)