Case study · Interactive web film
The Bridge
A 4.5-minute interactive web film — Three.js portals, GLSL, GSAP — built to show that a method can be a place you walk through.
The problem it answers
I have been filed under several professions at once. The Bridge answers as a film rather than a résumé: one continuous walk through seven realms where the work happened, each one a portal rendered in WebGL.
Structure
A single master timeline drives the whole piece. The camera, the portals, the text and the music are cued from one GSAP timeline, so it plays as a cut, not as a page you scroll.
Visual and motion
Three.js builds the portals; GLSL shaders carry the transitions between them.
Sound
The music is Kevin MacLeod’s, used under Creative Commons Attribution, and the sound effects come from Mixkit. The music and effects are credited to their creators; this is not an original score.
Where it plays
Built for a desktop browser with a GPU. On this site, Play opens the film in its own viewing page, with a full-screen option where supported. The still stands in until you choose to play.
What it proves
The Bridge introduced the visual vocabulary of the original portfolio, where it later became the closing card of the selected work. It proves the craft; the tools prove that the craft ships.
- Role
- Concept, writing, visual design, motion and code
- Stack
- Three.js, GLSL shaders and one GSAP master timeline
- Music & sound
- Kevin MacLeod, under Creative Commons Attribution; sound effects from Mixkit. Full track credits are in the film.
- Practice
- Interactive web experiences