Arrow Flow

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 playable 3D puzzle game titled “Arrow Flow” using a Three.js-like scene. Show a fixed, slightly swaying elevated perspective camera looking down at a square 5x5 board centered on a dark blue-gray 18x18 floor. Use a moody low-poly factory/park presentation: fog fading from dark navy to blue-gray, soft hemisphere lighting, a warm directional shadow-casting light, visible grid lines, and eight small decorative trees around the board perimeter. The board cells are spaced evenly on the floor.

The objective is to rotate directional arrow pieces so that following the arrow in each visited cell creates one continuous path from the start at grid coordinate (0,0), the top-left cell, to the goal at (4,4), bottom-right. Each non-blocked cell contains a large 3D arrow model, initially randomized to one of four cardinal directions. Clicking an arrow rotates it clockwise through north, east, south, and west; increment the Rotates counter on every click. Arrows point to adjacent cells only. When a path goes off the 5x5 board, enters a blocked cell, or revisits a cell/loops, the attempted path is invalid and should show a message such as “No valid path! The arrows create a loop or hit a wall.”

Represent the goal with a 3D flag at the bottom-right cell. During simulation, trace the computed path from the start: show a small glowing yellow/gold sphere moving cell-by-cell over about 0.35 seconds per step, interpolating and lightly bouncing between cells. A valid run succeeds only if it reaches the goal and collects every gem on the level. Display a temporary testing message with the gem count. If successful, show a centered green-tinted “Level Complete!” overlay, award points, and emit a burst of roughly 42 small gold and pale-green particles from the goal; include a Next Level button. If the path ends elsewhere or does not collect all gems, hide the player and show a failure message.

Implement exactly three levels, each on a 5x5 grid, all starting at (0,0) and ending at (4,4): Level 1 has no barriers or gems, with intended solution path (0,0)-(1,0)-(2,0)-(3,0)-(4,0)-(4,1)-(4,2)-(4,3)-(4,4). Level 2 has barriers at (1,2), (2,1), and (3,3), no gems, and intended path (0,0)-(0,1)-(0,2)-(0,3)-(0,4)-(1,4)-(2,4)-(3,4)-(4,4). Level 3 has barriers at (1,1), (2,3), and (3,2), gems at (1,3), (2,1), and (3,4), and intended path (0,0)-(1,0)-(2,0)-(2,1)-(2,2)-(1,2)-(1,3)-(0,3)-(0,4)-(1,4)-(2,4)-(3,4)-(4,4). Render barriers as compact 3D dungeon-style objects and gems as crystal models. Do not place arrows in barrier cells.

Add a top HUD with left panel “Level 1/3” and “Score: 0”, and right panel “Time: 180s”, “Gems: 0/0”, and “Rotates: 0”; update values during play. Use a 180-second per-level countdown; when it reaches zero while not simulating, display “Time up! Resetting level...” and reset the current level shortly afterward. Scoring on success should use a base of 250, add 8 points per second remaining, add 120 per collected gem, and subtract 1.5 points per rotate (with a minimum award of 50); show the points, time bonus, gem bonus, and rotate penalty in the completion overlay. Preserve the accumulated score between levels.

At the top center display subdued letter-spaced text “ARROW FLOW”. Along the bottom center provide buttons: Simulate, Demo, Hint, Random, and Reset. Simulate starts the current arrow path only when valid. Demo applies the intended solution directions, reports “Demo path set — simulating!”, then automatically simulates. Hint fixes one incorrect arrow along the intended solution path and costs one rotate, or reports that all solution arrows are already correct. Random randomizes every non-barrier arrow and costs 3 rotates. Reset reloads the current level with fresh randomized arrows. Provide keyboard shortcuts: Space simulates, D runs Demo, H uses Hint, and R randomizes. Show the small instruction line “Click arrows to rotate • Space or Demo to watch path”. Use dark translucent navy rounded panels and buttons with muted blue borders, white/gray text, and a centered dark message popup for transient status messages. Make the layout responsive and allow pointer clicking on the 3D arrows while simulation is not running.