Floating Islands
Six tropical islands held aloft by columns of cyan energy in noon sun above an endless sea, ringed around a humming alien craft you can take the helm of. Scroll the cinematic ascent, then drop into the cockpit and pilot the ship yourself — first-person or chase-cam, twin plasma cannons, a turbo drive that warps the world around you. Plus a music-synced dance mode, a 22-second aerial lap with real jet physics, and a chameleon island past the horizon pretending not to notice the kraken. Scored to Pineapple Static.
The Ascent
Inspired by Studio Ghibli's floating-world aesthetic and the soft, sun-bleached palette of a tropical lagoon. Every element — the foam rings collaring each island, the swirling columns of energy holding them aloft, the reef schools drifting beneath the surface, the slow heartbeat of the alien craft at the centre — is tuned to feel alive without ever being busy.
The journey unfolds vertically. As you scroll, the camera climbs through six cinematic waypoints — First Sanctuary, The Garden, The Quarry, The Outpost, The Grove, The Crown — and lands at The Helm, where the controls become yours. Press SPACE to glide between them; tap a dot on the right edge to jump anywhere.
The alien craft at the centre is always alive — a high-frequency micro-vibration shimmers it across all three axes so it reads as a hovering machine with engines running, layered on a slow swell-bob like the air itself has weather. Tap it and the vibration revs sharply for a heartbeat before three energy beams fire from the core and outer arms, concentric shockwaves ripple across the water, and the craft lifts on a seven-second arc above the islands before settling back. Click and drag to spin it.
Past the arch, in the far southeast of the disc, an enormous kraken hauls itself out of the water — bulk half-submerged, tentacles curling above the surface, head tilted toward the islands. It doesn't move. It doesn't need to. From most cinema waypoints you only catch its silhouette through the haze; from The Crown and The Helm it anchors the southeast horizon. The wayfinder boundary system knows it by name: bump too close in cockpit and the toast reads "The kraken is sleeping."
Take the Helm — Wayfinder
Click wayfinder in the nav. The screen blanks into a BOOTING WAYFINDER cockpit handshake — concentric reactor rings spin in the alien craft's cyan / magenta / amber beam palette while the GPU warms its caches. The camera then glides into the cockpit and the ship is yours.
WASD thrust, mouse look, space ascend, shift descend, QE roll. The ship auto-banks into turns. Soft cushion zones around every island, the arch, the chameleon's rock, the kraken, and the outer cylinder push you back if you press too far — each one with its own toast line. Three jet engines emit white-hot plasma plumes behind you that streak as you build speed.
Hold R-click for the twin pulse laser — a white-hot saber core inside a plasma rim, animated lightning arcs branching off the burst sphere. Hold L-click for the heavy burst cannon — counter-rotating halo rings, dense electric storm, three-layer water splash on impact. T engages turbo: FOV punches wide, speed streaks rip past the cockpit edges, the screen warps outward in a continuous radial blur with chromatic aberration at the periphery — sustained hyperspace travel, not a one-shot punch. G-force jitter rides the camera through it. T again releases.
V swaps between first-person cockpit and third-person chase cam — the ship hull goes solid in chase mode, translucent around you in cockpit. The tactical HUD in 1P shows velocity, altitude, heading, and a banking artificial horizon line that rolls with the ship. ESC exits cleanly; alt-tabbing out of the tab drops you back to explore mode automatically so the cockpit isn't running while your attention's elsewhere.
Three Detours
Three small italic links sit ready in the top nav from any chapter: ✦ island vibes, ✦ dance, and ✦ fly. Each takes the journey somewhere different and brings you back exactly where you were.
Island vibes arcs the camera out across open water in a single smooth three-second curve and lands you at a tiny island far past the others, where a chameleon in sunglasses stands beside a hand-painted ISLAND VIBES sign — the kraken framed behind him in the water through the arch, tentacles curled, head turned the chameleon's way. He's pretending not to notice. The arch and the main archipelago reflect across the calm. Stay as long as you want. Return to the mother ship drops you back exactly where you came from.
Dance glides the camera into a low cinematic orbit and the craft starts to dance. A live Web Audio analyser splits the song into bass / mid / high bands and pipes them into the visuals — the craft tilts and rolls into the music, bounces on bass kicks, traces a slow figure-eight; energy beams pulse with the lows; halos fire on the beat; water ripples spawn on every cymbal; three colored strobe lights orbit the craft. A drop detector watches the bass and punches into a quick rise / dip / triple-shockwave move when the song breaks. Scroll dials the orbit zoom in or out.
Fly sends the ship on a 22-second aerial lap with real jet propulsion physics — wingtip vortex cones spiral off the wings during hard banks, heat shimmer ripples through the engine wake, asymmetric thrust visibly throttles engines up and down to bank the ship, shock-diamond stripes appear in the beams at peak throttle. The camera chases with Dutch tilt and sub-pixel G-force shake, punches in to a close hero portrait of the chameleon as the ship streaks past his island, then arcs wide around the stone arch before spiraling home. Hit stop mid-lap and the ship tweens back to its takeoff spot.
The Tech
Built on Three.js + WebGL. Everything is generated or composed at runtime, then served as a single static bundle:
- Ten hand-built 3D models — six unique islands averaging ~1.9 million triangles each, the alien craft, a half-submerged stone arch, a tiny far-flung island for the easter egg, and a 4,200-unit kraken hauling itself out of the water in the far southeast (the second-biggest asset in the scene after the islands, originally 60 MB raw — Draco compression got it down to ~6.5 MB so it ships on mobile too). 15.6M triangles in the scene, 9.7M vertices, all delivered via Draco mesh compression at roughly a sixth their raw size, with a per-asset progress loader so nothing pops in after the scene appears.
- Wayfinder cockpit mode — first-person + chase-cam piloting for the alien craft. Custom ShaderMaterial plasma weapons (fresnel rim + electric flicker + counter-rotating halo rings + branching lightning arcs), a 240-particle Points engine trail emitting from three jet positions, a 160-segment LineSegments speed-streak field rushing past the cockpit during turbo, a tactical HUD updated per-frame from physics state, a cylinder + per-model sphere boundary system with mesh-raycast tunneling protection for tight geometry like the stone arch, and a BOOTING WAYFINDER loader that runs a full pre-warm path (shader compile, canvas-texture upload, hidden warm-render) behind the curtain so the first frame of gameplay never stutters.
- TurboWarpPass — a screen-space postprocess shader that fires on T-press and runs continuously while turbo's on. Six-tap radial blur from screen center outward with a periphery-only mask (center 8% stays crisp so the reticle reads). Radial chromatic aberration: red shifts inward, blue shifts outward, scaled by edge distance. A periphery saturation crush adds the "hot energy throughput" feel. Strength ramps with an eased turbo blend; pass auto-disables when blend hits zero so it's free outside of turbo.
- Music-synced dance mode — Web Audio
AnalyserNodesplits the soundtrack into bass / mid / high every frame. Bass drives body bob + beam intensity + emissive flash + halo-beat triggers; mid drives roll-lean + spin + camera shake; high drives water scan-ring spawns. A slow EMA detects musical drops and fires a quick-rise / dip / triple-shockwave move. Continuous animations read a low-pass-filtered signal (~280ms time constant) so motion follows the song's phrases rather than per-frame analyser jitter. - Scripted aerial lap (fly mode) — 30-waypoint
Catmull-Rom spline with a sin0.4-minus-Gaussian-dip
velocity profile. Orientation derived live from velocity:
yaw from
atan2(vel.x, vel.z), pitch from vertical velocity, roll from clamped lateral accel. Real jet propulsion physics: differential wing thrust (the outside-of-turn engine throttles up to bank the ship), 200ms spool inertia, procedural shock-diamond stripes at peak throttle, gaussian plume taper, GPU-side wingtip vortex cones spawning during hard banks, a heat-haze postprocess that distorts UVs behind the engine wake. - Eight reef-fish species, ~107 individuals — boids physics, cross-species avoidance, banking + pitch swimming, tail animation locked to swim speed. They scatter when the craft fires and drift back over seconds.
- Procedural butterfly clusters — 24 around the main islands + 5 at the chameleon island. Each is a 25-vertex two-lobe model (forewing + hindwing + clubbed antennae). Wings flap at ~10 Hz with an asymmetric 40 / 60 stroke and a torsional wing-twist wave propagating tip-to-root each reversal. Random pitch (±29°) and roll (±43°) per butterfly so the cluster reads as 3D bodies at varied angles. They scatter with quadratic outward repulsion when the craft sweeps within 280u.
- Three-layer particle energy beams under every island, each on its own pulse rhythm. Tap-triggered triple beam on the craft — core + two outer arms, yaw-locked so they track as it spins — lifts it to apex altitude on a seven-second arc.
- Always-alive idle — four prime-ratio sines per axis on the craft, golden-ratio frequency stack so the loop never visibly repeats. Click-time rev-up envelope amps the vibration 3.5× for a quarter-second before the lift.
- Custom water shader with reflective mirror, FBM foam rings collaring each island, painterly tropical sky, ACES tone mapping tuned for saturated noon color rather than wash-out.
- Scroll-driven cinema — hand-tuned waypoints, auto-descent intro, spacebar glide, fly-from-anywhere tween when you jump to a chapter mid-explore. Soft + hard camera leashes mean you can't clip a model, dip below water, or drift off the world.
- Easter-egg flight — single 3-second cubic Bézier arcs the camera over the arch to the chameleon island. Pre-flight pose / cinema progress / scroll position are snapshotted bit-for-bit; return to the mother ship restores exactly where you were.
- Ambient soundtrack — Pineapple Static loops at low volume; ducks down during wayfinder so cockpit SFX read cleanly. Mute toggle persists across visits in localStorage. First user gesture unlocks autoplay.
On a Phone
iPhones have plenty of power but a famously narrow window of GPU memory per browser tab — around 256 MB before Safari quietly reloads the page. Fifteen million triangles decompressed into vertex buffers don't fit. So the mobile build is rebuilt from the same source with a lighter footprint:
Stripped: the half-submerged stone arch (its Draco GLB alone decompresses to a ~50 MB vertex buffer that pushes Safari past the cliff), the 107-fish boids shoal, the heat-haze postprocess pass, and the wayfinder cockpit (mouse-look + WASD don't translate to touch — built for desktop only). Shrunk: three of six islands, scrolled chapters, foam rings, energy-beam particle counts (~half), the water mirror (768 vs 1024).
Kept whole: the alien craft tap-to-power interaction, dance mode with its full music-synced light show, the 22-second fly-mode aerial lap with real jet propulsion physics (differential thrust, spool inertia, shock diamonds, plume cone taper), wingtip vortex cones during hard banks (180-particle pool — costs essentially nothing), butterfly clusters drifting through every island (~425 verts total, two draw calls, no textures), the chameleon island easter egg, and the kraken — Draco squeezed its 60 MB raw geometry down to ~6.5 MB, just inside Safari's window. He hauls out of the water on every device. Half the weight, all the soul.