🚀 Aexo Digital – Animated Landing Page for a Digital Agency
Client: Aexo Digital
Duration: ~3 months
Role: Web Developer
Team: Developer (you), Designer, Client/PM
Website: aexodigital.com
Interested in the technical explanation? Click Here
🔍 Overview
While it may look like a simple landing page at first glance, the Aexo Digital project pushed the boundaries of animation, performance, and content flexibility. Built for a modern digital agency with a bold, space-themed aesthetic, this landing page delivers a dynamic user experience through Framer Motion and GSAP, backed by an unconventional—but effective—stack that includes Next.js, Notion, and Vercel.
🎯 Project Goals
- Create a visually impactful landing page that reflects Aexo’s creative identity
- Integrate sophisticated animations and transitions without compromising performance
- Use cost-effective tools and infrastructure
- Allow the client to manage content easily (via Notion)
👨💻 My Role & Responsibilities
- Implemented the entire frontend and deployment pipeline
- Developed all animations using Framer Motion and GSAP
- Handled Notion API integration as the content source
- Collaborated with designer and PM for smooth handoff and build
- Optimized page for performance, SEO, and CI/CD using Vercel
🛠 Tech Stack
- Frontend: Next.js, Tailwind CSS
- Animations: Framer Motion, GSAP
- Content Source: Notion API (custom setup)
- CI/CD & Hosting: Vercel
- Tooling: Git, VS Code
🚀 Key Features
🌌 Visually Stunning Animations
- Sophisticated transition effects using GSAP and Framer Motion
- Smooth scroll-based interactions and element reveals
- Precise timing to match outer space design themes
🛰 Unconventional Content Management
- Pulled live content from Notion, enabling the team to update data without a traditional CMS
- Maintains flexibility while keeping costs low
⚡ Performance + SEO Optimization
- Optimized images, scripts, and layout shift prevention
- Tuned Next.js for fast page loads and crawlable structure
🔄 Seamless Dev & Deploy
- Instant rollouts via Vercel
- Easy-to-maintain setup for future content or feature additions
💡 Challenges & Solutions
| Challenge | Solution |
|---|---|
| Learning curve for GSAP + Framer integration in Next.js | Self-driven learning, rapid prototyping, animation breakdown |
| Using Notion as a headless CMS | Created custom API mapping to handle structured blocks from Notion |
| Maintaining performance despite heavy animation | Lazy-loaded animations, optimized render cycles, structured components |
📈 Outcome & Feedback
- Successfully launched and actively used by Aexo Digital to attract new clients
- Received positive feedback from client for both visuals and ease-of-use
- Built a strong frontend foundation that can scale into more interactive or data-rich experiences
- Helped reinforce Aexo’s brand as a creative and modern tech agency
🧠 Reflection
This project reminded me that even “small” websites can require deep technical decisions. I pushed my skills in animation logic, CI/CD integration, and headless CMS thinking, while also keeping a strong focus on maintainability and user experience. The end result was not just a landing page, but a dynamic front door for a fast-growing agency.
