This is a responsive and animated homepage UI for the Cosmic Soul platform, built to fulfill a frontend developer task. It translates a detailed Figma design into a functional Next.js application, featuring multiple interactive states and animations.
/public/Screenshot.png
-
Animated "Features" Page
Dynamic hero section with fading text and synchronized blinking character animation. -
Interactive Home Page
Multi-state UI that transitions from a greeting to mock chat/voice interface based on user clicks. -
Responsive Design
Optimized layout using CSS Modules, Flexbox, and modern CSS practices. -
First-Visit Redirect
UseslocalStorageto redirect first-time visitors from Home to Features page automatically. -
Modern Tooling
Built with the Next.js App Router for fast, client-side navigation.
- Framework: Next.js (App Router)
- Language: TypeScript
- Styling: CSS Modules
- Animations: CSS Keyframes & Transitions
- Icons: React Icons
Install dependencies and run the development server:
yarn install
yarn dev
Let me know if you'd like to add your own screenshot or demo link too.