🧠 Project Overview
What is NeovaSphere? NeovaSphere is a next-generation personal portfolio designed to go beyond static webpages. It merges design, AI, and 3D visuals to create an immersive, responsive experience.
🎯 Goal: To showcase a young innovator’s journey through an intelligent, story-driven platform.
✨ What’s Unique: It’s interactive, dynamic, and powered by AI — unlike traditional scroll-and-read portfolios.
👤 Target Audience: Students, creators, recruiters, judges, and curious minds exploring innovation.
🌐 Branding Redefined: NeovaSphere transforms personal branding into a conversation — where users don’t just read about achievements, they experience them.
💡 Inspiration
As a student passionate about innovation, I wanted a portfolio that felt alive — not just a static webpage filled with text. Traditional portfolios lacked personality, interactivity, and emotion.
So, I asked myself: What if my portfolio could tell a story? What if people could talk to it? Inspired by:
Sci-fi UIs and futuristic control panels
AI chatbots and 3D websites
My own journey in coding, robotics, and AI
NeovaSphere was born — to bring the wow factor to student portfolios, making them as dynamic as the creators behind them.
💻 What It Does
NeovaSphere is more than a site — it’s an experience. Here's what makes it stand out:
🤖 AI Chatbot (Gemini 1.5 Pro): Users can ask questions about my journey, projects, or experiences.
🌌 3D Scroll Animations: The hero section dynamically rotates and responds to user movement.
✨ Glowing Cursor & Transitions: Every click and scroll feels cinematic and interactive.
🧠 Achievement Explorer: Projects, awards, and key milestones are displayed in a futuristic, organized layout.
📱 Fully Responsive: Optimized across devices for seamless access.
🛠️ How We Built It
Tech Stack:
🔧 Next.js – Blazing-fast, SSR-ready React framework.
🎨 Tailwind CSS – Design flexibility with utility-first styling.
🎬 Framer Motion – Smooth, hardware-accelerated animations.
🧩 Three.js – For the 3D background and visual depth.
🧠 Gemini AI – Integrated via API for chatbot interactions.
🌐 Vercel – Lightning-fast deployment and preview URLs.
Why this stack? This combination offered full control over performance, design, and interactivity — essential for a project focused on futuristic UI and storytelling.
🚧 Challenges We Faced
🧠 AI Integration: Rate limiting and token management for Gemini took careful tuning.
🎞️ 3D Animations: Balancing responsiveness and performance in Three.js was tough — especially on mobile.
🌍 Routing Issues: Vercel threw unexpected 404s on dynamic routes — fixed with rewrites and link adjustments.
📱 Mobile Optimization: Making sure animations didn’t lag on smaller screens required media-query-based logic.
🎨 Design Harmony: Ensuring glowing cursors, font styles, color palettes, and scroll effects all played nicely together was a balancing act.
🏆 Accomplishments That We’re Proud Of
🚀 Built a fully interactive, AI-powered portfolio at just 15 years old.
🧠 Created a conversational AI chatbot that personalizes exploration.
🌀 Implemented scroll-responsive 3D hero section for visual storytelling.
🎖️ Showcased key milestones:
NASA Space Apps Challenge – Team Leader, Innovation Presenter
Tech Titans Hackathon – Built EduPilot, a student productivity app
Gold Medal – SOF International Mathematics Olympiad
Chess Champion – State-level Gold Medalist
UI Hackathon – Created a full animation-based landing page
📚 What We Learned
This journey taught me more than just coding:
⚙️ Technical Growth: Mastered Framer Motion, AI API integration, and Three.js rendering optimizations.
🧪 Design Thinking: Designed around how users feel — not just what they see.
⚡ Performance Optimization: Learned how to keep animations fast and glitch-free across devices.
📖 Storytelling through Tech: Found creative ways to make my work speak for itself through interaction.
🔮 What’s Next for NeovaSphere?
🌍 Multilingual Support: So, students from any country can experience it.
🗣️ Voice-Based Assistant: Let users talk to the portfolio naturally.
📊 Analytics Dashboard: To track visitor behavior and engagement.
🧱 CMS Integration: For easy updates and dynamic project display.
🕶️ Augmented Reality Mode: View portfolio achievements in AR!
Built With
- api
- gemini
Log in or sign up for Devpost to join the conversation.