$10,000 AWWWARDS Animation — Built with GSAP + Next.js
This is a full Awwwards-style hero animation using Next.js 14 and GSAP — smooth staggered reveals, clip-path overlays, and responsive match media, all in one timeline.
✨ What we built:
• Staggered image gallery reveal
• Clip-path overlay wipe animation
• Responsive hero scaling (mobile + desktop)
• Text reveal with overflow masking
• Dark overlay reveal transition
• GSAP matchMedia for breakpoint-aware animations
🔗 Links:
Live site → https://alexandra.dimaac.com/
Source code → https://github.com/Hank-D-Tank/alexandra
Inspiration (Alena Figurová) → https://aladesign.cz/
🛠 Stack: Next.js 14, GSAP, @gsap/react, Tailwind CSS
Drop a comment if you want a full breakdown! And hit subscribe for more frontend animation content.
#gsap #nextjs #webdesign #animation #frontend