Rotating icosahedron · llama-3.1-70b-instruct
Using the pre-provided three.min.js (global THREE), render a full-screen scene with a rotating icosahedron lit by two colored point lights, orbit-style auto-rotation, and a subtle starfield background.
transcript · 6 messages
Using the pre-provided three.min.js (global THREE), render a full-screen scene with a rotating icosahedron lit by two colored point lights, orbit-style auto-rotation, and a subtle starfield background.
index.html (1605 bytes)Successfully wrote 1605 bytes to index.html
{"path":"index.html"}<!DOCTYPE html><html><head><title>Rotating Icosahedron</title><style>body { margin: 0; background-color: #f0f0f0; overflow: hidden; }</style></head><body><script src="three.min.js"></script><script>const scene = new THREE.Scene();const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);const renderer = new THREE.WebGLRenderer({ canvas: document.createElement("canvas"), antialias: true });renderer.setSize(window.innerWidth, window.innerHeight);document.body.appendChild(renderer.domElement);const geometry = new THREE.IcosahedronGeometry(1, 0);const material = new THREE.MeshPhongMaterial({ color: 0xffffff });const icosahedron = new THREE.Mesh(geometry, material);scene.add(icosahedron);const light1 = new THREE.PointLight(0xff0000, 1, 100);light1.position.set(5, 5, 5);scene.add(light1);const light2 = new THREE.PointLight(0x00ff00, 1, 100);light2.position.set(-5, -5, -5);scene.add(light2);const starGeometry = new THREE.SphereGeometry(0.1, 10, 10);for (let i = 0; i < 100; i++) { const starMaterial = new THREE.MeshBasicMaterial({ color: 0xffffff }); const star = new THREE.Mesh(starGeometry, starMaterial); star.position.set(Math.random() * 200 - 100, Math.random() * 200 - 100, Math.random() * 200 - 100); scene.add(star); }let orbit = 0;function animate() { requestAnimationFrame(animate); icosahedron.rotation.x += 0.01; icosahedron.rotation.y += 0.01; orbit += 0.001; camera.position.x = Math.sin(orbit) * 5; camera.position.z = Math.cos(orbit) * 5; camera.lookAt(0, 0, 0); renderer.render(scene, camera);}animate();</script></body></html>
The code renders a rotating icosahedron lit by two colored point lights, with a subtle starfield background. The icosahedron is created using the `IcosahedronGeometry` class from the Three.js library, and the lights are created using the `PointLight` class. The starfield is created by generating 100 random stars with a basic material and adding them to the scene. The animation is handled by the `animate` function, which updates the rotation of the icosahedron, the position of the camera, and renders the scene.
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
EVALUATION
Rotating icosahedron with red/green point lights and faint starfield animates continuously, but keyboard/mouse inputs cause no camera or interaction change.
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.