↖ ALL WORK
PROJECT 04 / Creative development2025
3D Tree Portfolio
An interface that grows branches.
A procedurally generated tree turns portfolio navigation into a spatial experience, with interactive fruit nodes and smoothly focused content.
Interactive Three.js project
SPATIAL INTERFACESTHREE.JS ↗
Play the original 3D tree recording
THE BUILD
Interactive Three.js project
2025 / Creative development
01 / THE QUESTION
The challenge.
Connect an organic, procedural 3D scene to usable portfolio navigation without losing the visitor’s sense of place.
02 / THE RESPONSEInside the build.
Recursive branches follow Catmull–Rom curves, with leaves and coloured content nodes. Raycasting identifies selected fruit, then interpolated camera motion brings the related content into focus.
01
Procedural geometry
02
Raycast interaction
03
Content / camera state
- Recursive branch generation
- OrbitControls for spatial navigation
- Raycast-based content selection
- Interpolated camera and interface transitions
03 / EVIDENCE IN THE DETAILS
The original work.
PROJECT RECORDING