A · Fable 5.1
- Time
- 8:25
- Cost
- $3.39
AI Bakeoff · Loomwater · 25-09-2026
Opus 5.5 vs Fable 5.1
Anthropic says its cheaper model now works at the level of its flagship. So both got the same website brief at the same moment, one attempt each, and were judged blind as A and B.
The brief
A one-page site for Loomwater, a three-day music festival that doesn't exist: a poster hero, twelve acts with their own artwork, a schedule you can filter, a ticket calculator with awkward rules, and a map linked to the schedule. Plain HTML, CSS and JavaScript, every picture drawn in code.
B · Opus 5.5
- Time
- 8:55
- Cost
- $1.88
This one looks like a real festival: a poster drawn in code, artwork made for each act, a map with a winding river. It handles the awkward corners too. It leaves one stage empty on purpose so the brief's "no sets" message actually appears, and it names the camping rule when you break it.
The verdict
Ship B. Both sites meet the brief and pass every automated check, but B handles the hard parts properly and looks like a festival rather than a form. And it cost 55% of A. Fable finished 30 seconds sooner; on this brief, that's all the extra money bought.
The design was also judged blind by Gemini 3.1 Pro, from outside Claude's family: A 6, B 9 out of 10. One run of one brief, not a ranking.
The rules
- Both models got the same brief and started at the same instant. Each was given a random letter, so both sites were judged as A and B before the models were named.
- Claude Code 2.1.282, run stock: safe mode, no settings, skills, plugins or MCP servers.
- Both at high effort with a 30-minute cap. One attempt each, no questions answered, no follow-ups.
- Nothing fetched from the internet, no frameworks, and the site has to work opened straight from disk.
- Every feature was checked with the same scripts on both sites: headless Chromium, Lighthouse and axe-core.
- Both sites are published exactly as the models left them. Times are the race stopwatch; costs are Claude Code's estimate at Anthropic's API list prices, on a subscription.
The feature checks
| A · Fable | B · Opus | |
|---|---|---|
| Phone menu, every section reachable | Pass | Pass |
| Hero artwork made in code | Geometric scene | Full poster |
| Twelve acts, detail on choosing | Opens in place | Opens a dialog |
| 24+ sets, filter by day and stage | 36 sets | 27 sets |
| Empty combination says so | Never reachable | Pass |
| Prices, 1–12 limit, 10% discount | Pass | Pass |
| Camping without a weekend ticket | General message | Names the rule |
| Map and schedule highlight each other | Pass | Pass, plus a set list |
| FAQ accordion by keyboard | Pass, plus arrow keys | Pass |
| Lighthouse accessibility, desktop · phone | 100 · 100 | 100 · 100 |
The numbers
| A · Fable | B · Opus | |
|---|---|---|
| Time to finish | 8:25 | 8:55 |
| Estimated cost | $3.39 | $1.88 |
| List price per million tokens, in · out | $10 · $50 | $4 · $20 |
| Output tokens | 46.6k | 61.0k |
| Cache reads | 245k | 618k |
| Turns · commands | 7 · 6 | 12 · 8 |
| Files · size | 3 · 81.9 KB | 3 · 94.9 KB |
The full prompt
Build a complete, polished one-page website for a fictional music festival: Loomwater Festival, three days of live music on 17, 18 and 19 July 2027 in the invented riverside town of Carrow Vale. Everything about it is made up: no real festival, artist, venue, person, address, phone number or brand appears anywhere. This is a one-shot task. Nobody will answer questions or give feedback, so make every decision yourself and finish. What the site must contain 1. Header with the festival name and navigation to every section. It stays usable on a phone: below 720 px wide the navigation collapses into a menu button that opens and closes. 2. Hero: the name, the dates, a one-line promise, a poster-style scene made entirely in code, and a button that takes the visitor to the ticket section. 3. Line-up: twelve made-up acts, each with a name, a genre, a one-sentence description and its own artwork made in code. Choosing an act shows more about it: its stage, day and set time. 4. Schedule: every set across the three days and three stages (Main Stage, River Tent and Lantern Field), with at least 24 sets in total. Visitors can filter by day and by stage without the page reloading, and a combination with no sets says so. 5. Tickets: a ticket calculator. Weekend £165, Day £69, Camping add-on £45 (only with a Weekend ticket) and Under-16s £30, with a checkbox for a Loomwater Friends discount of 10% off the whole order. The total updates as the visitor changes quantities. An order holds at least 1 ticket and at most 12 in total; show a clear message when an order breaks either rule or adds camping without a Weekend ticket. 6. Site map: a plan of the festival site drawn in inline SVG showing the three stages, the campsite, food, toilets and the entrance. Hovering or focusing a stage on the map highlights that stage's sets in the Schedule, and the reverse. 7. FAQ: at least five questions as an accordion. 8. Footer: the dates, a fictional address in Carrow Vale with no postcode, the email hello@example.com, and a copyright line. Constraints - Plain HTML, CSS and JavaScript. Put index.html, styles.css and script.js in the current folder; further files are allowed. No frameworks, libraries, package managers or build step. - Nothing is fetched from the network when the page runs: no CDNs, no web fonts, no external images, no audio or video files. Use system font stacks. Every piece of artwork is made in code (inline SVG, CSS or canvas). - It must work by opening index.html straight from disk: classic script tags, no ES module imports between files, and no fetch() or XMLHttpRequest of local files (put data in the script). - Responsive from 360 px to 1440 px wide, with no horizontal scrolling at any width. - Accessible: semantic landmarks and headings, every control usable by keyboard with a visible focus style, text contrast at WCAG AA or better, and motion reduced when the visitor asks for reduced motion. - Written in British English, with real copy throughout. No lorem ipsum, no placeholders. - Do not open a browser or any other window, and do not start a server. Checking your work from the command line is fine; install nothing. - You have 30 minutes. A finished site in less time is better. Done means All eight sections are present with real content; every interactive feature above works; the page loads from disk with no console errors; nothing is requested from the network; and it looks like a finished festival site someone would be proud to launch, not a wireframe.
Tidy and complete. Every control works, the schedule's solid stage labels are easy to scan, and it's the kinder of the two for screen readers. But the artwork is simple geometry, the map reads like a diagram, and the whole thing looks like a well-made template rather than a festival.