arrow_backBack to projects
Serenity - 3D Portfolio Experience
An immersive 3D world built with React Three Fiber, featuring interactive scenes and smooth animations.
Project Status: Live Experience (Feb 2026)
The Problem
Traditional 2D portfolios can feel static and uninspiring. Serenity solves this by providing an engaging, game-like exploration of professional skills and projects.
Development Process
Camera Mechanics
Developed a sophisticated Spline-based camera system for cinematic transitions between different 3D scenes.
Performance Tuning
Optimized geometry and textures to ensure high frame rates across a wide range of devices.
State Management
Utilized Zustand to manage global world state, synchronizing animations with user interaction and background audio.
Tech Stack
Next.js
Three.js
TypeScript
Tailwind CSS
Framer Motion