Simon Willison’s Weblog

Newsletter
Atom feed for three-js

5 posts tagged “three-js”

2026

Another game experiment with Claude. This one used the default Claude iPhone app (chat mode, not Claude Code mode) where I prompted Claude Opus 5.5 Max with:

Build a three js game called "Tree appreciator" - it shows you two algorithmically generated trees and the game mechanics is about appreciating the differences between them. Think hard about how to make sure it is both fun and beautiful.

Somewhat embarrassingly given my recent talk, I've found that telling Opus 5.5 "make sure it is fun" works uncomfortably well. In this case Claude crunched for 3 hours and 7 minutes before retuning a cosy little spot-the-difference game with music and animation and achievements that's quite compelling to play.

Screenshot of a mobile spot-the-difference puzzle game with a dark interface. Header reads "No. 003 Acer autumnalis ‘Hid…" with subtitle "Autumn maple · A country lane in late a…" and icons for sound, a book, and help. Two nearly identical 3D-rendered scenes are stacked vertically, labeled "Fig. i" and "Fig. ii", each showing a dark-trunked maple tree with red, orange and pale peach leaves, leaves falling through the air, a golden grassy field with a few small rocks, and hazy hills with pine silhouettes under a pale sky. Two differences are circled in blue in both images: circle "a" at the base of the trunk, where Fig. i has a small red mushroom that is missing in Fig. ii, and circle "b" in the right side of the canopy, where Fig. i has a patch of green leaves that are red in Fig. ii. The bottom bar shows "2 of 4", a reset button, a "Hint" button with three filled and two empty dots, and a score of "1,803".

One-shotting a Raccoon Heist game using Claude Fable 5

Visit One-shotting a Raccoon Heist game using Claude Fable 5

Back in 2022 I tweeted screenshots of a game concept generated by GPT-3 and some concept “art” created using DALL-E. Today, on the fourth anniversary of that tweet, I decided to see if Claude Fable 5 (running in Claude Code for web) could build the entire game from the content of that tweet. It did a pretty good job of it!

[... 3,479 words]

2024

Tree.js interactive demo (via) Daniel Greenheck's interactive demo of his procedural tree generator (as in vegetation) built with Three.js. This is really fun to play with - there are 30+ tunable parameters and you can export your tree as a .glb file for import into tools like Blender or Unity.

# 8th June 2024, 9:43 pm / 3d, javascript, three-js

2023

Write shaders for the Vegas sphere (via) Alexandre Devaux built this phenomenal three.js / WebGL demo, which displays a rotating flyover of the Vegas Sphere and lets you directly edit shader code to render your own animations on it and see what they would look like. The via Hacker News thread includes dozens of examples of scripts you can paste in.

# 1st December 2023, 6:45 pm / 3d, graphics, webgl, three-js

2022

three.js examples: webgl_postprocessing_pixel (via) Neat new example for three.js that uses a pixel-shader postprocessor to apply an isometric pixel-art feel to a 3D scene.

# 1st December 2022, 9:57 pm / 3d, javascript, pixelart, webgl, three-js