Cosmic Portfolio

landing page
projects section

Inspiration

As someone who genuinely loves stargazing, I’ve always found wonder in the night sky. The idea of crafting a portfolio that captures the feeling of exploring the cosmos came naturally. I wanted to build something more than just a list of my projects — something that feels like a journey through space, where each section reflects a new discovery, like finding a new planet or star. That passion for the stars became the foundation of Cosmic Portfolio.

What it does

Cosmic Portfolio is an interactive, animated portfolio website that showcases my developer journey in a visually immersive, space-themed experience. It includes: A cosmic-themed landing page with animated stars and transitions. Sections like About, Projects, and Skills represented as celestial elements. Smooth scroll-based animations and responsive design. A visual narrative that blends creativity with coding.

How we built it

The project was built using: Next.js for a fast, SEO-friendly React framework. TailwindCSS for utility-first, responsive styling. Three.js to add immersive 3D elements and starfield backgrounds. Framer Motion for smooth, animated transitions between sections.

Challenges we ran into

Three.js integration in a Next.js environment required careful handling of server/client rendering. Balancing visuals with performance — especially for 3D elements and animations — was tricky but rewarding. Ensuring responsiveness and consistent experience across different devices took multiple rounds of iteration.

Accomplishments that we're proud of

Creating a portfolio that’s visually unique and true to my personality. Learning to combine creative storytelling with frontend development. Successfully integrating 3D visuals and animations in a performant and responsive way.

What we learned

How to build smooth, engaging UI animations using Framer Motion. The fundamentals of Three.js and 3D scene rendering. Deeper understanding of responsive and accessible UI design in a creative context.

What's next for Cosmic Portfolio

Adding a dark/light toggle with thematic transitions (day/night sky). Integrating an AI chatbot assistant with a cosmic personality. Creating a project timeline animation that feels like navigating a star map. Expanding into a personal blog space that continues the celestial theme.