Exogenesis

• 

  EXOGENESIS: Starting Screen

• 

  Galaxy Page : Provides a map for user to navigate.

• 

  Selecting a Target Celestial Body

• 

  Deep Scan : It scans the selected celestial body

• 

  Data : This page display all the details about the celestial body. It includes details like atmosphere, temperature, life expectancy, etc.

• 

  Colonization Page : This pages describes probability of colonization. It involves science outpost, mining facility, habitat dome, etc.,

• 

  Tech Level

Inspiration

EXOGENESIS began from a simple but powerful thought:

“What if humanity’s first interstellar exploration mission actually felt scientifically believable?”

While reading about space exploration, exoplanet discoveries, black holes, and the expansion of the universe, I became fascinated by how massive and mysterious space truly is. Most space games either focus heavily on fantasy or arcade gameplay, but I wanted to create an experience that felt grounded in real science, cinematic exploration, and humanity’s curiosity to move beyond Earth.

The goal of EXOGENESIS was not just to create another sci-fi interface, but to build an immersive futuristic exploration simulator inspired by real aerospace systems, NASA mission control aesthetics, and cinematic space experiences like Interstellar and The Expanse.

The core idea became:

Explore → Scan → Analyze → Colonize → Upgrade

I wanted players to feel small compared to the universe while also feeling emotionally connected to humanity’s first steps into deep space.

What It Does

EXOGENESIS is a realistic sci-fi space exploration and colonization prototype set within the Milky Way galaxy.

Players begin from Earth and travel across a curated set of real celestial objects using futuristic spacecraft systems. The experience combines scientific exploration, planetary scanning, intelligent analysis systems, and colony establishment mechanics.

The application includes:

• Interactive galaxy exploration
• Realistic planetary scanning systems
• Scientific analysis reports
• Colonization mechanics
• Technology progression systems
• Futuristic aerospace-inspired UI
• Real astronomical data integration
• Cinematic transitions and immersive atmosphere

The project uses real scientific inspiration and references from:

• NASA
• ESA
• ISRO
• Exoplanet archives
• Telescope imagery and planetary datasets

Instead of using expensive live AI APIs, I designed a smart rule-based scientific analysis system that dynamically generates realistic planetary reports using curated scientific data.

This allowed the project to remain scalable, affordable, and hackathon-friendly while still feeling intelligent and immersive.

How I Built It

The frontend was built using:

• React
• Tailwind CSS
• Framer Motion
• Three.js/WebGL

The UI was designed with a cinematic aerospace aesthetic:

• dark futuristic interfaces,
• holographic overlays,
• glassmorphism panels,
• scientific telemetry systems,
• and mission-control-inspired layouts.

The 3D galaxy and planetary systems were designed using Three.js to simulate space navigation and celestial visualization.

The backend architecture and data structure were planned around:

• scientific planetary datasets,
• colony management systems,
• progression systems,
• and rule-based scientific analysis generation.

The application structure focused on delivering a polished gameplay loop rather than building a massive full-scale universe simulation.

⸻

Challenges I Faced

The biggest challenge was balancing:

• ambition,
• realism,
• immersion,
• and hackathon scope limitations.

Initially, I attempted to create a much larger experience with advanced AI systems, massive galaxy datasets, and highly cinematic interactions. However, I quickly realized that realistic sci-fi presentation is extremely difficult because every small detail matters:

• lighting,
• motion,
• typography,
• visual hierarchy,
• transitions,
• and planetary rendering.

Another major challenge was performance and polish. Space exploration experiences rely heavily on atmosphere and cinematic presentation, so placeholder visuals immediately reduced immersion.

I also learned that:

building many features is easier than making a few features feel truly premium.

This project taught me the importance of scope management, UI hierarchy, cinematic presentation, and focusing on one polished core experience instead of trying to build everything at once.

⸻

What I Learned

Through EXOGENESIS, I learned:

• how to structure large-scale project ideas,
• how cinematic UI differs from standard web UI,
• how to design immersive futuristic interfaces,
• how to integrate scientific datasets into interactive systems,
• and how important presentation quality is in game experiences.

Most importantly, I learned that:

strong atmosphere and emotional immersion can make even a small prototype feel meaningful.

This project pushed me creatively and technically, and it gave me a much deeper understanding of how difficult — and rewarding — realistic sci-fi experience design can be.

⸻

Future Plans

Future versions of EXOGENESIS could include:

• multiplayer exploration,
• procedural galaxy systems,
• advanced colony simulation,
• AI-assisted scientific companions,
• dynamic space events,
• realistic spacecraft interiors,
• and expanded interstellar progression systems.

But for this prototype, the focus was on creating:

A believable and immersive first step into humanity’s journey beyond the known.

Built With

• clsx
• date-fns
• framer-motion
• lucide-react
• nasa/esa/isro-scientific-datasets
• postgresql
• react-19
• react-three-drei
• react-three-fiber
• react-three-postprocessing
• react-three-rapier
• row-level-security-(rls)
• sql-migrations
• supabase
• supabase-auth
• supabase-edge-functions
• tailwind-css
• three.js
• typescript-5.9
• vite-(rolldown)
• webgl
• zustand