Pixel-art Formula 1 game on a floating island
- Views
- 14.1K
- Likes
- 281
- Replies
- 30
- Saves
- 156
A pixel-art Formula 1 game on a floating island with 12 cars, rain, pit stops, DRS and an autopilot mode, built by Sonnet 5.5 as a single HTML file with Three.js. The creator reports 1.5 hours of work and $35.88 in API costs.
Full prompt6,098 chars
Build a single-file HTML5 game, "Island Grand Prix": a pixel-art 3D Formula 1 race on a floating voxel island. Use three.js r128 from cdnjs. No build step; everything inline (HTML, CSS, JS). The page <title> is a 2-4 word name.
LOOK
- Render the 3D scene to a low-res render target (default 2 px art pixels, slider 1-6). Then a post pass: depth-texture outlines wherever depth jumps, snap every pixel to a fixed 90-colour palette in OKLab, Bayer 4x4 ordered dither. Orthographic isometric camera (rotate, zoom, tilt, pixel-snapped target). Place the camera ~850 m from its target with far plane ~1700 so the 660 m wide island is never clipped at low tilt angles. Sun shadow map, day / dusk / night lighting that eases between states, six floodlight towers with point lights, rain particles.
- Island: a slab of 2.4 m voxel columns (ellipse ~330 x 232 m with a lobed outline), terraced at the rim, banded soil and slate strata below, a waterfall, floating rocks and cones underneath. Build cells for the WHOLE island, including the core, and give the slab material side = DoubleSide so no sky shows through the underside from any angle. The top plane carries a 2048 px painted ground canvas: grass, mowed run-off strips, paddock tarmac, plaza tiles, lake, harbour basin, town streets, stream.
- Circuit: a closed centripetal Catmull-Rom spline through ~24 control points, ~1240 m long, resampled every 1 m with tangent, normal and smoothed curvature. Meshes: 14 m asphalt ribbon, red/white kerbs on corners, gravel traps, start line, 14 grid boxes, barriers, sponsor boards, instanced tyre walls, marshal posts with little marshals. Pit lane with entry/exit ramps, six garages (coloured parapet, skylights, air-con, mast, team flag), pit wall with signal gantry and screens, control tower.
- Venue: 216 m main stand with a giant screen, ~9 corner stands with instanced coloured crowds that cheer, start gantry with five lamp pairs, podium, lake with lighthouse islet and yachts, harbour crane, small town with windmill, ferris wheel, fan zone, paddock motorhomes, helipad + helicopter, gate arch, blimp, balloon, birds.
- Doll's-house lift: every tall structure (each stand, each garage bay, towers, tower of control ...) is its own lift group with a bounding box. Each frame, cast the sight line from the camera target toward the camera; groups whose box it crosses below roof height rise 90 m and stop casting shadows (hide when fully raised). Switch the effect off in the Island camera and by checkbox. Merge static meshes by material; instance crowds and trees; aim for ~1,000-1,300 draw calls.
GAME
- 12 cars, 6 invented teams x 2 drivers, procedurally named. Cars are boxes: monocoque, sidepods, front and rear wings with a flap that opens for DRS, helmet, number plate, four wheels with steering fronts, coloured tyre-compound discs, brake light.
- Flow: grid -> five red lights with a random hold -> race -> chequered flag -> finish -> podium ceremony. Formats: Quick 3, Short 5, Full 10 laps. Count the line crossing at the start as the start, not a lap; guard lap counting with unwrapped distance.
- Track model: per-sample speed profile from curvature (grip G0 ~25 m/s2, acceleration ~16, braking ~40, vmax ~74 m/s) with a forward and a backward pass.
- AI cars run on rails (distance s along the spline, lateral offset): speed from the profile, racing line, pass offsets and speed caps when a car is ahead, DRS, tyre wear per compound, pit stops when worn or when the weather mismatches the tyres, rare random retirements (likelier in rain), per-race pace jitter.
- Player car: arcade physics (steering rate falls with speed; lateral grip = G0 x downforce x tyre x surface; slide and smoke when over the limit; gravel and grass drag; wall hits with sparks; DRS +6% on straights within range; engine modes lean / standard / push). Autopilot is ON by default: the player's car is driven like the AI (and pits itself when the tyres are worn). Any drive key (arrows, WASD, Space) or touch on the pad takes the wheel instantly; the key G, a corner button ("Autopilot / You drive") and a checkbox hand it back. An automatic "marshals push you back" recovery when stuck in gravel.
- Cars are solid: after every step resolve overlaps for all pairs in track coordinates (car 4.9 x 2.2 m): the rear car is moved back and slowed to the front car's speed, side-by-side cars move apart; skip cars in the pit lane; add sparks and a bump sound on hard contact.
- Pit stop: box call -> pit-lane entry with a 22 m/s limiter -> stop at the team's garage -> crew animation (jack, wheel guns, lollipop) -> tyre change -> release and merge back onto the track before handing control back.
- Conditions: Dry / Damp / Wet change grip, wear, visibility, light and rain; starting tyres switch to inter/wet automatically.
UI (panel beside the canvas, below it on phones)
- On the canvas: timing tower (compact on phones), speedometer strip (speed, gear, lap, tyre with wear, DRS state, position and gap), caption banners, autopilot button top right.
- Panel: format, team and driver, rival strength, new race, skip grid, speed 1/2x-4x, pause, auto-next, track condition with grip/wear/visibility gauges, time of day with floodlights, tyres for start and next stop, engine mode, box this lap, back on track, camera (Follow / Chase / Heli / Island), rotate, zoom, pixel size, outline / dither / raw 3D / sound / lift toggles, classification table, stats, race log, palette view. Set the initial camera mode explicitly so it matches the pressed button.
- Keys: arrows/WASD drive, Space DRS, G autopilot, B box, M engine, T next tyres, R back on track, C track condition, L light, Q/E turn, 1-4 cameras, +/- zoom, P pause, N new race, K skip grid. Touch: dock a left/right + DRS/brake/throttle pad under the canvas; drag to turn, pinch to zoom. Procedural WebAudio engine note, beeps, horn, pit gun.
QUALITY BAR
- Headless bot tests: AI laps ~25 s, a simple bot ~27 s, full races finish in dry, damp and wet, pit stops happen on 10-lap races, zero car overlaps, no console errors, no horizontal scroll on a phone.Source: the creator's reply under the post. Kept in its original language, unedited.
Want more prompts like this one?
Get the 50 most-viewed Claude 5.5 video prompts on one page: the full original text, the creator and the post it came from. We'll only email you when there's a new prompt worth trying. Unsubscribe anytime.
Tools the creator mentioned
Original post: https://x.com/vib3coded/status/2117913818252644522
All works are open data at GitHub · awesome-opus-5.5-video.
Model attribution is as stated by the creator and was not independently reproduced. View counts are a snapshot from 2026-11-08. The work belongs to its creator; DM @GoSailGlobal on X for corrections or removal.
More games
0:37Porting Call of Duty WaW Zombies map to the web
4.7M views
1:03Little Prince 3D exploration game
3.9M views
2:51Browser-based Fallout game built with code
3.7M views
2:21Browser game world (third iteration)
1.8M views
3:03Sci-fi first-person shooter game
1.6M views
1:17Old-school MMO RPG built by AI
1.6M views
Related articles
Vibe Coding Website Development: Four Ways to Build from Scratch
A summary of four website development approaches from my enterprise training sessions — from dumping raw requirements straight into AI, to leveling up with an AI Website Cloner combined with Design Skills.
A Practical Guide to Claude Code Skills: Your Secret Weapon for Developer Productivity
A deep dive into Claude Code's Skills system, covering Design Skills evaluations, SEO audits, code quality guardrails, and other hands-on techniques.
The Complete Workflow for Creating Educational Training Videos: Four Skills to Take You from Slides to Video
Use four Skills to build a complete pipeline from course PDF to content extraction, quiz generation, mind maps, and video.
OpenClaw Data Collection Capabilities Research: Tools for Social Media and Website Data Extraction
A survey of the tool ecosystem for social media and website data extraction, including agent-reach, opencli, bb-browser, and more.