Okkio Website
I built this demo to practice scroll animations and parallax. The code uses GSAP (ScrollTrigger, ScrollTo, SplitText, ScrollSmoother) for reveals and section motion, plus a simple parallax on images. Audio uses the Web Audio API with a cross-fade looper; hover/click SFX are generated with Adobe Firefly. I designed the logo, wrote the copy, edited and recolored all images, and set the color palette. The site is fully responsive and SEO-ready.
Technologies
HTML5
CSS3
JavaScript (ES6)
GSAP
ScrollTrigger
ScrollSmoother
Parallax
Web Audio API
Responsive Design
SEO
Challenges
Make animations smooth and light while staying readable on mobile.
Solutions
Used GPU-friendly transforms, GSAP timelines with ScrollTrigger, a custom audio cross-fade looper, compressed WebP images, and mobile-first media queries.
