Workshop note: This workshop drives all animation with GSAP — see the gsap-expert skill for rolling animation, timelines, and easing. This skill covers Three.js-native animation (keyframe tracks, AnimationMixer, skeletal animation, morph targets) which are not used in the LLL Animation Workshop.

Three.js Animation

Quick Start

import * as THREE from "three";

// Simple procedural animation
const clock = new THREE.Clock();

function animate() {
  const delta = clock.getDelta();
  const elapsed = clock.getElapsedTime();

  mesh.rotation.y += delta;
  mesh.position.y = Math.sin(elapsed) * 0.5;