WEB DEVELOPMENT
Portfolio V1
An interactive developer portfolio that explored how React and browser-based 3D could turn a traditional personal site into a more playful technical experience.
- REACT
- TYPESCRIPT
- JAVASCRIPT
- HTML
- CSS
- THREE.JS
- REACT THREE FIBER
- DREI
- VITE
- TAILWIND CSS
- QA
Exploring beyond a conventional portfolio
Portfolio V1 started as an experiment in making a personal developer website feel more interactive than a traditional collection of static sections and project cards.
It became a place to explore React-based 3D rendering, animated interfaces, spatial layouts, and ways of presenting technical information through interaction.
Turning a skills list into a 3D interface
Instead of presenting technologies as a conventional badge grid, the skills section distributed them across a rotating 3D sphere.
The layout used a golden-angle distribution to spread labels evenly across the surface while keeping each item oriented toward the camera as the sphere rotated.
The implementation used React Three Fiber Canvas, Drei Text and OrbitControls, automatic rotation, camera-facing labels, and hover-based color and scale feedback.
Mixing application UI with a 3D scene
The project combined conventional React interface development with a Three.js scene rendered through React Three Fiber.
That made it possible to treat 3D elements as part of the application rather than as a separate visual demo, while still working within a component-based React structure.
What changed between V1 and V2
PORTFOLIO V1
- experimentation-first
- heavier use of 3D and motion
- more emphasis on visual novelty
- technical information presented through interaction
PORTFOLIO V2
- recruiter-first information hierarchy
- stronger emphasis on professional experience and engineering work
- more restrained motion
- interactive 3D used selectively
- clearer accessibility and performance priorities
- deeper project storytelling through case studies
Portfolio V1 taught me how much interactive 3D can add to a web experience—and where it can begin competing with the information the interface is supposed to communicate. Portfolio V2 keeps that interactive identity, but applies it more selectively around stronger engineering content.