oneshotlm
Compare all models on this prompt →

2048 · qwen3.8-max

Build a playable 2048 game with arrow-key tile sliding and merging, smooth animations, a score, and win and lose states.

⛨ sandboxed Open in new tab ↗
transcript · 6 messages
user

Build a playable 2048 game with arrow-key tile sliding and merging, smooth animations, a score, and win and lose states.

assistant
thinking
Build a 2048 game in a single index.html file. Standard implementation: 4x4 grid, arrow keys, merging, score, win overlay at 2048, game over detection, smooth animations using absolutely positioned tiles with transitions.

I'll write it carefully. Animation approach: maintain a board as a grid of tiles with unique ids, render tiles as absolutely positioned divs, use CSS transitions on transform/position. On move, compute the new positions and merges, animate, then finalize.

A simpler, more robust approach: track tiles as an array of {id, value, row, col}. On move, process each line, compute the post-move positions and merges. Update the DOM: move existing tile elements, and when merging, slide both tiles to the target position, then remove one and bump the value with a "pop" animation.

Let's write the code.

Key logic:
- state: 4x4 grid of tile objects or null.
- move(dir): traverse rows/columns in order; for each tile, find the farthest empty cell and the next cell; if the next cell has the same value and hasn't yet merged this turn, merge.
- Track moved flag; after the move, spawn a random tile (2 or 4) and check win/loss.

Rendering: absolutely position tiles inside the board container; use CSS transitions on transform. After a merge, render a merged tile with a pop animation.

Let's write the file.
write /tmp/ws/index.html (13498 bytes)
toolResult

Successfully wrote 13498 bytes to /tmp/ws/index.html

assistant
thinking
Verify quickly with node that there are no syntax errors? Extract the script and check it.
bash {"command":"cd /tmp/ws && node -e \"\nconst html = require('fs').readFileSync('index.html','utf8');\nconst js = html.match(/<script>([\\s\\S
toolResult

JS syntax OK, file size: 13498

assistant
thinking
Maybe I should also run a simple logic simulation of the merge algorithm, but it's probably fine. One thing to double-check: the merge animation — on merge, the moving tile slides to the target position (transform transition 130ms), then after a 130ms timeout, we delete the moving tile and update the target tile's value with a pop animation. The pop animation includes scale(0) at 0%, so the tile momentarily disappears — this is the standard 2048-style behavior; actually, the original starts the pop from scale(0)→1.2→1. No problem.

Also verifying: does `won && !keepPlaying` trigger the overlay on every move afterward? After the win overlay is shown, `move` is blocked by the `won && !keepPlaying` guard. If you continue, keepPlaying becomes true. No problem.

Game over check: after each move, if there are no empty cells and no merges, over=true. No problem.

Done.

Done. `/tmp/ws/index.html` is a complete, self-contained 2048 game — no external resources, no network requests. **Features:** - **Arrow-key sliding** (plus WASD and touch/swipe for mobile), with proper traversal order so tiles closest to the edge move first - **Merging logic** with the classic rule: each tile can only merge once per move - **Smooth animations**: CSS transitions slide tiles (`transform`, 130ms), new tiles pop in with a scale animation, and merged tiles "pop" at 1.2× size; score gains float up from the score box - **Score + Best score** (best persists via `localStorage`) - **Win state**: overlay when you reach 2048, with a "Keep Going" option to continue endlessly - **Lose state**: "Game Over" overlay when the board fills with no possible merges, with "Try Again" - Authentic 2048 color palette per tile value, responsive layout for small screens Open it in any browser to play (the JS syntax was verified with a parse check).

TAKE IT TO CODE

A single self-contained HTML file — copy it and open in any browser, or reuse the prompt with your own pi-agent run.

RUN

modelqwen3.8-max
vendorQwen
harnesspi-agent
generated2026-08-03

EVALUATION

4/5 working

A working 2048 clone that responds correctly to arrow keys and WASD, merging tiles and updating score.

Vision grade · anthropic/claude-sonnet-5

MEASUREMENTS

Raw readings from the capture, not a verdict — the grade above is the only judgement. Percentages are how much of the screen changed; the measure under-reports sparse motion on a dark background.

idle motion0.0%
on click0.0%
on drag0.0%
on wheel0.0%
on enter + space0.0%
on arrow keys2.9%
on w/a/s/d3.9%
frame spread24.8 / 255
console errors0
js errors none

METRICS

runtime97.2s
tokens in15k
tokens out5.6k
cached8.3k
cost / run$0.0489