Skip to content
Lizely

Brick Builder Studio

Create an original 5-by-5 stacked-brick model, earn five transparent activity milestones, and export the current build as a local PNG.

Privacy: your files never leave your device. All processing happens locally in your browser.

How to use

  1. 1.Select a cell on the free 5-by-5 grid, choose Clay, Sand, or Slate, then use Add brick or the keyboard controls to build any arrangement.
  2. 2.Use Remove top to edit the selected stack; earn the five disclosed activity milestones for 200 points each without following a fixed target shape.
  3. 3.Keep editing after 1,000 or choose Export PNG to redraw the current local model into a 1,200-by-900 image.

About Brick Builder Studio

Brick Builder Studio is a free-form browser construction toy built around a five-by-five grid. Every cell can hold zero to four bricks, and each brick uses one of three fictional visual labels: Clay, Sand, or Slate. There is no required silhouette, permit sequence, budget, finite inventory, physics simulation, or hidden solution. The board starts empty and remains editable throughout the session, including after every activity milestone has been earned.

Select any cell, choose a material, and use Add brick to place the selected style on top of that stack. Remove top deletes only the highest brick from the selected stack. Pointer and touch users select a cell before using the explicit add or remove action, so an existing stack can be inspected or shortened without accidentally placing a new brick first. Keyboard players move the grid cursor with the Arrow keys, add with Enter or Space, remove with Backspace or Delete, and choose Clay, Sand, or Slate with 1, 2, or 3. Modified shortcuts are ignored.

The score records five visible creative milestones rather than judging one correct layout. Groundwork is earned by placing the first brick. Footprint requires four occupied cells. Tower requires one stack at least three bricks high. Palette requires all three material labels to appear somewhere in the current model. Studio build requires at least twelve bricks spread across at least eight cells. Each milestone is awarded once for 200 points, so earning all five produces an exact maximum score of 1,000.

Milestones remain recorded after they are earned. Removing a brick can change the current model without erasing prior activity credit, and adding or removing bricks after 1,000 remains available. This persistence is disclosed beside the grid so the score is not confused with a structural rating. Restart is the only action that clears the model, selected material, milestones, and score and returns the studio to its deterministic empty state.

The live status area reports total bricks, occupied cells, tallest stack, material count, earned milestones, and score. Every cell exposes its row, column, current height, capacity, and top material to assistive technology. The board uses a roving keyboard focus, and all action controls meet the shared touch-target size. On narrow screens the board and milestone ledger stack vertically without hiding controls or requiring a fixed desktop viewport.

Export PNG creates a fresh 1,200-by-900 canvas in the browser and redraws the current pure brick model. The export traverses the same tested row, column, level, and material snapshot used by the game logic. It does not capture an unrelated page screenshot, fetch an image, load a remote font, call an API, or upload the model. The generated image is offered as brick-builder-studio.png through a temporary local object URL.

The five-by-five grid, four-layer limit, three labels, milestone thresholds, score, and export layout are original product fixtures. They do not represent real brick dimensions, load capacity, structural engineering, construction codes, architecture guidance, or material performance. Brick Builder is recreational creative software, not a building design or safety tool.

Focused verification independently constructs a twelve-brick model that reaches all five milestones, proves every milestone ID is unique, checks the exact 1,000-point cap, edits after completion, removes bricks without duplicating awards, compares pointer-style and keyboard-style reducer paths, tests grid boundaries, and validates deterministic Restart. Browser acceptance additionally checks touch selection and removal, Boss-mode no-ops, responsive layout, and that an exported PNG has the expected type and canvas dimensions.

Methodology & sources

Maintain a pure 25-cell model with zero to four ordered material labels per cell. Selection and editing use shared pure reducers. Compute current brick count, occupied cells, tallest stack, and distinct materials, then persist each of five unique milestone IDs once and cap the score at 5 x 200 = 1,000 without freezing later edits. Export traverses a deterministic snapshot of every cell, row, column, stack level, and material and redraws that model to a fresh 1,200-by-900 PNG canvas. No external reference data is asserted.

Frequently asked questions

Is there one correct Brick Builder layout?
No. The studio is free-form. Five transparent activity milestones reward exploration, but no required plan, target silhouette, budget, or finite piece set determines your layout.
Can I edit the model after reaching 1,000 points?
Yes. Milestones and the capped score remain recorded while adding and removing bricks stays available. Restart is the only action that clears the studio.
Does PNG export upload my build?
No. The browser redraws the current tested model into a fresh local canvas and downloads a PNG through a temporary object URL without an upload or external asset.

Related tools

Mini Games guides

View all