Award-winning gaming landing page featuring cutting-edge 3D animations, scroll-triggered effects, and immersive user experiences.
- Awwwards Site of the Day - Featured for exceptional design and animation
- 98% Performance Score - Lighthouse audit
- 60fps Animations - Smooth across all devices
An immersive gaming website showcasing advanced web animation techniques, 3D transformations, and interactive storytelling. Built with modern React and GSAP, this project demonstrates mastery of frontend animation engineering and performance optimization.
Live Demo: awwards-site-phi.vercel.app
- Video Management System: Multi-video handling with smooth transitions
- Scroll-Triggered Animations: GSAP ScrollTrigger integration
- 3D Transformations: Perspective-based hover effects
- Clip-path Morphing: Dynamic shape transformations
- Parallax Effects: Mouse-tracking interactive elements
- Loading Animations: Custom three-body spinner
- Dynamic Video Switching: Click-to-change video preview system
- Tilt Effects: Interactive bento card animations
- Gradient Animations: Smooth color transitions
- Floating Images: Mouse-responsive 3D movements
- Custom Cursors: Context-aware cursor states
- Audio Visualization: Animated audio indicators
- Hover States: Sophisticated button animations
- Navbar Animations: Scroll-based visibility controls
- Form Interactions: Smooth input transitions
- Lazy Loading: Optimized video and image loading
- Code Splitting: Chunked JavaScript bundles
- Preloading: Strategic resource prioritization
- Debounced Events: Optimized scroll/resize handlers
- 60fps Target: Hardware-accelerated animations
{
"framework": "React 18.2",
"language": "TypeScript 5.0",
"build-tool": "Vite 6.1",
"styling": "Tailwind CSS 3.4"
}{
"animation": "GSAP 3.12 + ScrollTrigger",
"icons": "React Icons 5.5",
"utilities": "react-use 17.6",
"parsing": "clsx 2.1"
}- ESLint - Code quality enforcement
- TypeScript - Type safety
- PostCSS - CSS processing
- Autoprefixer - Browser compatibility