Immersive Three.js Interactive Portfolio -- 2

via Freelancer ·

Budget / SalaryHourly project
TypeFreelance project
LocationRemote
Posted2 hours ago
Create a complete, single-file HTML website (index.html) featuring immersive 3D animations and advanced interactive elements using Three.js and GSAP (with ScrollTrigger).

The website must include the following features:

1. Fullscreen Fixed 3D WebGL Background:
- A Three.js scene featuring a dual-layer 3D core (e.g., a rotating wireframe outer Icosahedron and a glowing inner Torus Knot).
- A cosmic dust particle field (3,000+ particles) drifting in space.
- Mouse raycasting and parallax interaction: hovering over or moving the mouse across the screen shifts camera angles and object rotation smoothly, and clicking anywhere triggers an explosive 3D particle burst.

2. GSAP ScrollTrigger Horizontal Pinned Section:
- As the user scrolls down vertically, a dedicated section locks/pins in place and seamlessly translates content to the right horizontally across multiple showcase panels (at least 4 detailed panels, e.g., Projects, Capabilities, Tech Stack, Timeline).
- The 3D camera dynamically orbits and changes focal depth in sync with the horizontal scroll progress.

3. Futuristic Customizer Control Terminal & UI:
- A floating glassmorphism control panel allowing users to toggle themes live (Cyberpunk Cyan, Neon Magenta, Matrix Emerald, Solar Gold), adjust rotation speeds, and toggle wireframe modes.
- Integrated Web Audio API sound effects for clicks/hovers, complete with an animated visual equalizer bar in the navigation header.
- Modern glassmorphic cards with 3D spatial tilt effects, glowing borders, live stats, and a contact terminal.

Provide the entire production-ready HTML code in a single file with embedded CSS and JavaScript.
javascript python css animation html5 html jquery / prototype web development three.js web design
Apply on Freelancer →

Project sourced from Freelancer.com. Applications happen directly on the original platform — we never collect your data.