Skip to content

Bouncing logo screensaver in one self-contained HTML file

Exact prompt

# Bouncing logo screensaver in one self-contained HTML file Make a classic bouncing-logo screensaver: a logo of your own design that bounces off the edges of the window. Style, colours and technique (CSS, SVG, canvas) are up to you. **Looks are not scored**; only the objective checks below are. Write one file, `logo.html`, in the working directory. ## Checks (all must pass; partial credit = fraction passed) 1. `file_exists_under_size_limit`: `logo.html` exists and is at most 50,000 bytes (50 KB). 2. `no_external_requests`: fully self-contained. No `http://`, `https://` or `//` URLs in `src`, `href`, `srcset`, `poster`, `action`, `data` or `url()`, no asset URLs anywhere, no `@import`, `fetch(`, `XMLHttpRequest`, `WebSocket`, `EventSource`, `sendBeacon`, JS `import`, `<script src>` or `<link href>` (inline everything; `data:` URIs are fine). When a browser is used, any non-file request the page attempts also fails this check. 3. `animation_present`: CSS `@keyframes` plus an `animation`/`animation-name` property, or `requestAnimationFrame(` / `setInterval(`. 4. `loops_forever`: an `infinite` CSS animation (`animation-iteration-count: infinite` or `infinite` in the `animation` shorthand), or rAF/`setInterval` with no `cancelAnimationFrame`/`clearInterval` anywhere; when a browser is used, the page must also still change between ~6 s and ~7 s after load. 5. `page_animates`: when a headless Chrome/Chromium is available, the page is opened once with the network blocked at 800x600, and screenshots at ~1.5 s and ~2.5 s after load must differ. Without a browser (or if it fails to start) this and the browser part of check 4 fall back to the static checks 3-4; the scorer reports `check_mode` (`headless-browser` or `static-fallback`). 6. `required_id_and_title`: an element with `id="logo"` and a `<title>` containing "Bouncing Logo" (case-insensitive). No other files, no build step, no network. Run time limit for scoring: 120 s.

Recreate the classic bouncing-logo screensaver as one self-contained HTML file with a tighter 50 KB size limit. The scorer checks only that it makes no network requests, animates continuously, visibly changes in headless Chrome, and carries the required id and title. Looks are not scored and are left to a public poll. Original benchmark task written for usecaserank.com (not based on a specific public post). Headless, offline run on a reproducible fixture. Each run's notes say how its cost was measured (estimates are marked).

Success criteria: 1. file_exists_under_size_limit 2. no_external_requests 3. animation_present 4. loops_forever 5. page_animates 6. required_id_and_title

Best model for this task so far: Claude Haiku 5.5 (effort default (no --effort flag) · thinking on) (success, $0.0068, 33s). Best AI model for Creative / Web Animation →

Latest output per model

Run this on another model

All runs (4)

100% pass rate across 4 eligible runs: 4 pass, 0 partial, 0 fail. Partial and failed runs are listed below with everything else.ⓘ

Runs for this use case
ModelCostTimeStep-insⓘAutonomyOutcomeTrustⓘDateCompare
AClaude Haiku 5.5default · thinking on$0.006833s0Fully autonomouspassTrust 80%2026-10-20
AClaude Sonnet 5.5default · thinking off$0.0410s0Fully autonomouspassTrust 80%2026-10-20
OGPT-6.1 Soldefault · thinking off$0.0438s0Fully autonomouspassTrust 80%2026-10-20
AClaude Opus 5.5default · thinking on$0.1121s0Fully autonomouspassTrust 80%2026-10-20

Embed this result

A live badge for this use case. It links back here and updates as new runs are published.

UseCaseRank badge for Bouncing logo screensaver in one self-contained HTML file

Get new runs and ranking changes weekly

Which models got better or cheaper on real tasks like this one.