One Piece | Fluid Animation
- Period
- Jan 2026
GPU-Powered Fluid Dynamics Bringing One Piece to Life.
- Interactive Fluid Dynamics - GPU-accelerated particle simulation where mouse/touch movements generate flowing brush stroke trails that dynamically blend between two portrait images in real-time.
- Countdown Timer - Flip-clock style odometer countdown to April 5, 2026, with per-digit GSAP animations, IST timezone support, and full responsive design.
- Idle Animation System - When inactive for 2+ seconds, automated brush strokes animate across the screen in timed cycles (2.5s active / 5.5s pause), fading out smoothly when the user returns.
- Music Player - Background music toggle with GSAP-animated wave bar visualizer, smooth volume fade in/out, and auto-stop at track end.
- Language Toggle (EN/JP) - Glassmorphism-styled switcher that instantly translates all UI text between English and Japanese using React Context API.
- Immersive Visual Design - Custom GLSL shaders handle image blending via ping-pong rendering, with custom typography (Electroharmonix, Keinan Pop fonts) and a fully responsive layout.
Technologies
ReactThree.jsCustom GLSL shadersGSAPTypeScriptCSS