Víbora

Cinevva's analyzer read this game's design doc and its source, then wrote the brief below. "Make your own" hands it to the game creator as your opening message, so you start from a real spec rather than a one-line idea.

Create a browser-based 3D Snake game titled “Víbora,” using Three.js. The entire game is a simple playable grid arena viewed from a fixed elevated perspective camera: camera around (0,22,16), looking at the origin, with a perspective field of view around 55 degrees. The background outside the arena is very dark green (#112211). Render with antialiasing, directional lighting from above/front-right with shadows, plus ambient light, for a modest realistic 3D appearance.

Build a square 20x20 gameplay field made from a green grass-like plane, centered at the origin, with one unit per grid cell. The ground is dark/mid green (around #3a7a3a), slightly shiny, and has a subtle 20-by-20 grid drawn over it in a darker green (around #2a5a2a). Surround the field on all four sides with a raised dark-gray rectangular corral/wall: each wall is about 1.8 units tall and 0.4 units thick, with the north/south walls spanning just over the 20-unit width and the east/west walls spanning just over the 20-unit depth. The result should visually match an isometric-ish/top-down game board with thick charcoal edging and visible wall shadows.

The player is a snake that moves one grid cell at a time, automatically every 250 milliseconds. Start it with three blocky segments in a horizontal row near the center-left: head at grid coordinate (0,0), then body at (-1,0) and (-2,0), initially traveling right (+x). Each segment is a green rectangular cuboid approximately 0.92 x 0.85 x 0.92 units, positioned with its base/center around y=0.5. Use darker green for body segments (around #228833) and a brighter green head (around #33aa55). Add two white spherical eyes with small black pupils to the head, positioned toward its forward/right end and on opposite sides, so the snake visibly faces its travel direction. Use simple Phong materials, cast shadows, and receive shadows.

The snake advances discretely: on each tick, apply the queued direction to the head, shift every body segment into the prior segment’s cell, and move the head to the new cell. Arrow keys and WASD control direction: Up/W moves toward grid y=-1, Down/S toward y=+1, Left/A toward x=-1, and Right/D toward x=+1. Reject immediate 180-degree reversals; direction input may be queued and is applied on the next movement tick. Also support touch swipes on mobile: compare horizontal and vertical swipe distance and choose the corresponding cardinal direction, while applying the same no-reverse rule.

Place a single apple collectible at a random integer grid cell inside the arena, with a two-cell margin from all edges (not on the outer boundary), and never on the snake. Prefer loading a small realistic Kenney-style apple GLB asset from an external URL and scale it large enough to be clearly visible (approximately 4.8 model scale), casting shadows. If the asset is unavailable, use a procedural shiny red/orange apple sphere around 0.42 radius with a short green stem and a simple green leaf. Keep the apple at its cell’s x/z coordinates. When the snake head enters the apple cell, add 10 points, append one new body cuboid at the current tail position, and spawn another valid random apple.

The game ends immediately if the next head cell leaves the 20x20 bounds or overlaps any existing snake segment. Stop movement when game over. The initial score is 0 and restart resets score, snake length, direction, apple, and game-over state. Allow restarting via a prominent “Jugar de nuevo” button in the game-over panel and via the spacebar when game over.

Overlay the following Spanish UI in HTML over the canvas. At the top center, show a translucent black rounded rectangle with “Puntuación: 0” and update the green bold number as apples are eaten. At game over, show a centered dark translucent panel with the heading “🐍 ¡Juego Terminado!”, “Puntuación final: [score]”, and a bright green button labeled “Jugar de nuevo.” Keep the panel hidden during play. At the bottom center, show the semi-transparent instruction text “Usa las flechas o WASD para moverte.” Use a full-window responsive canvas, hide page overflow, and resize the Three.js camera and renderer with the window. The visual style should remain clean, sparse, dark-green, and low-poly/primitive 3D rather than a 2D flat Snake board.