Built and curated by Vedant Trivedi • Learn modern UI/UX animation by exploring and extending this project
- Introduction
- Tech Stack
- Features
- Quick Start
- Snippets (Code to Copy)
- Assets
- More
- Disclaimer
- Contributing
- License
- About Me
This project is a high-end, scroll-driven UI experience inspired by award-winning design systems (like Zentry).
It demonstrates how to combine GSAP animations, React component architecture, and Tailwind CSS to craft immersive, responsive storytelling with geometric transitions, video integrations, and subtle 3D interactivity.
It’s structured so you can learn by reading, customizing, and extending—ideal for building your portfolio or showcasing modern frontend craftsmanship.
- React.js – Declarative UI and component structure
- GSAP – ScrollTrigger, timelines, and animation control
- Tailwind CSS – Utility-first responsive styling
- Vite – Fast dev server & optimized builds
- 🔄 Scroll-Based Animations – Element motion tied to scroll position
- 🎲 Clip Path Transitions – Geometric reveals and masking effects
- 🌀 3D Hover Interactions – Depth-enhancing pointer feedback
- 🎥 Video Transitions – Integrated, seamless video storytelling
- ✨ Smooth UI/UX – Polished transitions and responsive feedback
- 📱 Fully Responsive – Desktop to mobile, consistent experience
- 🧩 Reusable Code Architecture – Clean component patterns for extension
Make sure you have installed:
- Git
- Node.js (v20+ recommended)
- npm or yarn
# Install dependencies
npm install
# Start local dev server
npm run dev
👨💻 About Me
Vedant Trivedi — MCA student and full-stack web developer building polished, animated experiences.
I’m focused on combining frontend craftsmanship with modern animation to create interfaces that feel alive.
Find more of my work on GitHub.