How It Started
I’ve always loved those sleek websites you see on Awwwards — smooth animations, scroll-triggered effects, and that “wow” factor.
So I thought: why not try building one myself? That’s how this project began.
I decided to use React with Vite for speed, and TailwindCSS for styling. But the real magic came from GSAP (GreenSock Animation Platform) — the library that powers some of the best animations on the web.
👉 Live Demo: Awwwards Website
👉 Source Code: GitHub Repo
Learning GSAP
At first, GSAP felt overwhelming — timelines, easing, scroll triggers… it was a lot.
But once I got the hang of it, I realized how powerful it is:
- Timeline control → I could chain animations together like a movie script.
- ScrollTrigger → Elements come alive as you scroll, making the site feel interactive.
- Performance → Everything runs buttery-smooth, even with complex sequences.
I followed tutorials by Adrian Hajdin (JavaScript Mastery), which made the learning curve much easier. His explanations helped me connect the dots between React components and GSAP’s animation logic.
Tech Stack
- React + Vite → Fast dev environment with hot reload.
- GSAP + @gsap/react → The animation engine.
- TailwindCSS → Utility-first styling.
- ScrollTrigger → For scroll-based animations.
Installation & Setup
If you want to try it yourself:
git clone https://github.com/Sachinanand99/Awwwards-Website.git
cd Awwwards-Website
npm install
npm run dev
What I Learned
When I first started, I thought animations were just fancy extras — something you add at the end to make a site look cool. But working with GSAP completely changed that perspective.
I realized animations can actually tell a story. They guide the user’s eyes, set the mood, and make the whole experience feel alive. With GSAP’s timelines, I felt like a director, sequencing scenes in a movie. And with ScrollTrigger, I could make the page react to how someone explores it — almost like the site was listening to them.
The biggest takeaway? Animations aren’t just decoration. They’re a way of communicating. They can turn a static website into an interactive journey, and that’s what makes building them so exciting.