Ember & Grain
Artisan coffee e-commerce with cinematic animations
Tech Stack
The Challenge
Create an e-commerce frontend that feels as premium and artisanal as the coffee it sells. The site needed to stand apart from generic Shopify themes while maintaining excellent performance and a seamless shopping experience.
The Solution
Designed and built a cinematic e-commerce experience using GSAP for scroll-triggered animations and page transitions, Lenis for buttery smooth scrolling, and a custom cart system. Every interaction was crafted to feel intentional and premium.
Key Features
Cinematic Scroll Animations
GSAP ScrollTrigger-driven parallax, reveals, and transitions that create a storytelling experience.
Smooth Scrolling
Lenis-powered buttery smooth scroll that elevates the browsing feel.
Cart System
Fully functional shopping cart with add/remove, quantity management, and checkout flow.
Product Showcases
Rich product pages with image galleries, origin stories, and tasting notes.
Technical Highlights
- Implemented complex GSAP ScrollTrigger animations with timeline orchestration
- Integrated Lenis smooth scrolling with GSAP for seamless scroll-driven effects
- Built performant cart state management with React context
- Achieved 60fps animations on mobile through careful optimization