Blockfall Lab

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 2D physics sandbox titled “Blockfall Lab.” Use a full-window HTML canvas with a fixed HUD overlay. The visual style is dark, minimal, and polished: a vertical gradient background from deep navy (#121c36) at the top to near-black navy (#0b1020) at the bottom, subtle 44-pixel blue-gray grid lines across the playfield beginning below the top hint, and a dark blue floor/platform strip occupying the bottom 92 pixels of the viewport. Add a thin brighter blue-gray line along the top of the floor.

At the upper left, show a translucent dark rounded panel with the bold title “BLOCKFALL LAB” and the subtitle “stack it. stress it. smash it.” At the upper right, show a matching small rounded stats panel reading “0 blocks · build mode” initially; dynamically update the count with singular/plural (“1 block”, “2 blocks”) and the current mode. Centered near the top below the bar, show a pill-shaped hint: “Drag on the playfield to drop a block. Tap Knock Down to send a shockwave.” At the bottom, above the edge with a little margin, center three rounded buttons: a yellow/orange “＋ Add Block” button, a coral/pink “✦ Knock Down” button, and a dark “↺ Reset” button. Buttons have light borders, shadows, bold text, and a slight pressed/translated effect.

The playfield is a simple axis-aligned rectangle physics sandbox. Blocks are solid colored rectangles with a small dark offset shadow behind them, a 5-pixel translucent white highlight strip across their top, and a darker strip along their right edge. Use a repeating palette of yellow-orange, mint teal, periwinkle blue, pink, lime, and purple. Blocks fall under gravity, collide with the floor, screen side walls, and each other, and settle into stacks with basic damped bouncing and friction. Keep all blocks within approximately 8 pixels of the left/right boundaries. Use a lightweight custom AABB physics system: downward acceleration around 980 px/s², horizontal drag, vertical drag, low-bounce floor collisions, and several collision-resolution passes between blocks. Blocks should be rectangular and non-rotating.

Interaction: clicking/tapping the yellow Add Block button spawns one randomly sized block near the horizontal center, around y=155, with width randomly 48–90 pixels and height randomly 30–58 pixels, then lets it fall; its status becomes “physics running.” Clicking/tapping an empty area of the canvas creates a similarly randomly sized falling block at the pointer location, clamped so it is not above y=110 and does not start below the floor. Update the block count after spawning. Support drag creation directly on the playfield: on pointer down record the start point and draw a white dashed rectangle preview while dragging; on release, if the drag is shorter than 14 pixels, create a random-sized block at that location. Otherwise create a custom block whose width is the absolute horizontal drag distance clamped to 34–150 pixels and whose height is the absolute vertical drag distance clamped to 24–100 pixels, centered between the start and end points and clamped above the floor. The block then falls and the mode changes to “physics running.” Support mouse and touch/pointer input, with touch action disabled so dragging works on mobile.

The coral “✦ Knock Down” button triggers a shockwave from approximately the horizontal center and 110 pixels above the floor. For every block, calculate its direction away from that point and apply an outward impulse based on distance, plus a small upward kick; closer blocks receive stronger force. Also spawn 28 tiny 4x4 square particles at the shockwave origin in the palette colors, with randomized outward velocities and short lifetimes; particles fall under gravity and fade out. Change the status text to “shockwave!” The button should work even when there are no blocks, still producing the particle burst. The “↺ Reset” button removes all blocks and particles and restores the status to “build mode” and count to “0 blocks.”

The simulation should run continuously with requestAnimationFrame and a capped timestep for stable motion. The HUD is fixed over the canvas, uses translucent navy panels, subtle white borders, rounded corners, blur/shadow styling, and responsive layout: on narrow screens, wrap the bottom buttons and allow the hint to use multiple lines. Do not add enemies, scoring, lives, rotation, levels, timers, or other mechanics not described here.