SPYLT is a bold new energy drink brand targeting young, active consumers with their unique "protein + caffeine" formulation. We partnered with them to create a digital experience that captures their high-energy brand personality — a single-page site that doesn't just list product features, but makes users feel the energy through immersive scroll-triggered animations. The result is a scroll-driven cinematic experience that transformed how their audience connects with the brand.
What We Faced
SPYLT, an emerging energy drink brand, needed a digital presence that matched their bold "freaking delicious" positioning. Their brand message of combining protein with caffeine for sustained energy wasn't connecting with their target audience through static marketing. They needed a website that could communicate their unique value proposition while capturing the youthful, energetic vibe of their brand. The challenge was creating an experience that worked across devices — from desktop users who could appreciate cinematic animations to mobile users who needed fast, accessible information.
How We Solved It
We built a high-performance React 19 single-page application featuring a custom GSAP ScrollSmoother engine that creates fluid, momentum-based scrolling. Implemented a unique horizontal flavor carousel with parallax motion, a pinned video section with circular clip-path reveal, and split-text animations throughout for dramatic typography. Every interaction was designed to feel energetic and premium, from the video background hero to the hover-triggered testimonial videos. The content structure flows naturally from brand story → flavors → nutrition → benefits → social proof, creating a narrative arc that keeps users engaged. We implemented responsive breakpoints for mobile/tablet that simplify animations while preserving the core experience.
What We Delivered
Single-page React application with GSAP scroll animation engine, custom video pin effects, and responsive mobile-first design.
How We Got There
Discovery & Brand Immersion
Deep-dive sessions with the SPYLT team to understand their brand voice, target demographic (18-34 active consumers), and unique protein+caffeine formulation. Analyzed competitor energy drink sites to identify opportunities for differentiation.
Creative Direction
Developed an energetic design language inspired by youth culture and sports marketing — bold typography, vibrant gradients, and dynamic motion. Created a comprehensive style guide and interactive prototypes in Figma mapping out the scroll narrative.
Animation Architecture
Designed a custom GSAP animation system with ScrollTrigger for section reveals, ScrollSmoother for smooth scrolling, and SplitText for typography effects. Built the pinned video reveal with canvas-like clip-path expansion.
Development & Responsive Optimization
Implemented the full React 19 application with component-based architecture. Used react-responsive to create device-specific experiences — preserving animations on desktop while ensuring fast performance on mobile with simplified effects.
Testing & Launch
Cross-browser testing across Chrome, Safari, Firefox, and mobile devices. Performance optimization ensured smooth 60fps animations even on mid-range devices. Deployed via GitHub Pages with automated build pipeline.
Visual Showcase
Scroll-triggered text reveals create dynamic entry
Flavor section with horizontal scroll and parallax panels
Circular clip-path expands on scroll for dramatic reveal
“ILYTEX captured the energy of our brand perfectly. The scroll animations make you feel like you're moving with the product — it's not just a website, it's an experience. Our investors and retail partners consistently mention how premium and polished the site feels.”