Built with Spline
Portfolio site: an interactive 3D world in three.js
Emilie Thonat
Interactive 3D Portfolio: A Vibecoded World
My new portfolio is designed as an interactive, scroll-driven 3D experience. A digital river fluidly carries the visitor through my tech stack and projects, while an interactive jellyfish playfully follows the user's pointer.
My role: creative direction, UI/UX design, 3D scene composition, animation and front-end development.
🧩 Scope & Architecture
Creative & Design: Full creative direction, UI/UX design, and 3D scene composition.
3D & Animation (Three.js, GSAP, Lenis): Single-context WebGL world, reversible scroll-driven animations, and smooth scrolling mechanics.
Front-End (Astro): Site architecture and multi-language routing (English/French).
Testing (Vitest & Playwright): End-to-end testing pipeline.
AI Workflow (Claude Code): AI-assisted front-end development.
🌊 The home page
Entry screen: enter with or without sound.
Hero: an isometric 3D world, a blue river and a jellyfish that follows the pointer.
Scroll-driven camera: the view tilts to a top view, then the river breaks into pixels.
What I do: three services, each with its own 3D island.
Contact: 3D pieces to drag and drop, with physics.
📱 Responsive and accessible
Responsive layout, from desktop to mobile.
Reduced motion: the animations respect the visitor's system setting.
Fallback: a static image when WebGL is not available.
✨ Some previous greeting cards in Spline
An interactive website intro and two interactive greeting cards made in Spline, with particles, shape morphing and sound.
What I also built
Like this project
Posted Oct 12, 2026
Scroll-driven 3D home page built with Astro, three.js and GSAP: isometric world, pointer-following jellyfish, drag and drop physics. In progress.
Likes
5
Views
83
Timeline
Sep 15, 2026 - Oct 15, 2026
