2023

20 Degrees

A visually immersive website for a California wellness startup using GSAP and ScrollTrigger for complex scroll-driven animations while maintaining high performance.

20 Degrees

Static websites? Bye Felicia! Thrilled to share my latest project, 20 Degrees, a California-based wellness startup brimming with modern design and captivating animations. I poured all my best practices and learnings into this beauty, using cutting-edge tools like GSAP (GreenSock Animation Platform) and ScrollTrigger.


Technical Highlights:

GSAP Animation: Employs GSAP to bring elements to life through intricate animations, smoothly orchestrating transitions in opacity and scale.
Text Scrambling: Features dynamic text-scramble animations for enhanced user engagement.
Performance First: Achieved impressive PageSpeed scores through meticulous code minification and asset optimization.
Lazy Loading: Implemented lazy loading for images and videos to ensure lightning-fast initial loads.
Scroll-Triggered Magic: Seamless background color transitions and clip-path animations driven by user scroll.

Live Demo

Technologies

GSAP ScrollTriggerJavaScriptWebpackLazy Loading