• 

• 

• 

• 

• 

SOLARIS — Explore Worlds. Discover Their Stories.

Inspiration

What if exploring the universe could feel as natural as reaching out and touching it?

Most educational resources explain the solar system through textbooks, static illustrations, or prerecorded videos. While informative, these formats often limit how people interact with what they are learning.

I wanted to create something different: an experience where users could explore planets through their own movements, discover remarkable locations, and uncover the scientific discoveries and historical stories connected to them.

That idea became SOLARIS, an interactive 3D planetary exploration experience that combines immersive visualization, gesture-based interaction, and educational storytelling.

What It Does

SOLARIS transforms the solar system into an interactive space for discovery.

Users can select planets, rotate and zoom in on them, and explore highlighted locations through intuitive controls, including hand gestures.

Each planet features carefully selected points of interest.

On Earth, users can discover capital cities and famous destinations such as Beijing, Tokyo, Paris, London, and New York.

On Mars, exploration focuses on extraordinary formations and milestones in space exploration, such as Olympus Mons and historic robotic landing sites.

Other planets feature their own distinctive scientific phenomena, including Jupiter's Great Red Spot and Saturn's rings.

Rather than requiring users to navigate endless menus, SOLARIS introduces locations through elegant spatial annotations.

Selecting an annotation reveals a floating, glass-inspired information panel with photographs, scientific explanations, and historical context. Users can browse multiple images while the original planetary scene remains in the background.

The goal is simple: make discovering the universe more interactive, engaging, and accessible.

How I Built It

SOLARIS was developed using a modern web-based 3D technology stack.

The application uses React, TypeScript, and Three.js with React Three Fiber to create and manage interactive planetary scenes.

MediaPipe Hand Landmarker enables camera-based hand tracking, allowing users to interact with the solar system without relying exclusively on traditional input devices.

GSAP helps create smooth camera transitions and animated interactions.

The interface combines 3D rendering with a reusable annotation system and translucent glass-style information panels. Educational content and image galleries are organized separately from the rendering logic, making it easier to expand the collection of planets and locations.

I also used AI-assisted development tools, including OpenAI Codex, to help translate design ideas into working code, refine interactions, and iterate on the user experience.

An important design decision was to focus on selected educational landmarks instead of attempting to reproduce an entire high-resolution planetary mapping system. This approach keeps the experience more manageable while preserving its visual identity.

Challenges I Faced

One of the biggest challenges was balancing visual quality with real-time performance.

Rendering an interactive solar system while processing hand-tracking input requires careful management of graphics, animations, and computational resources.

Another challenge was creating a consistent interaction experience across different planets. Locations must remain visually connected to their planetary surfaces as users rotate and explore.

Designing the information panels also required several iterations. I wanted them to feel like part of a futuristic exploration interface, rather than ordinary webpage pop-ups.

Content accuracy presented another important challenge. Scientific imagery, historical photographs, and educational descriptions require appropriate context, source attribution, and careful verification.

What I Learned

Building SOLARIS taught me that an engaging educational experience depends on more than visual effects.

The most important decisions involved interaction design, information presentation, performance optimization, and deciding which features genuinely help users learn.

I also learned how AI-assisted development can help turn ambitious ideas into functional prototypes, while human judgment remains essential for product direction, factual accuracy, and quality.

What's Next

SOLARIS is designed to grow into a broader interactive planetary knowledge experience.

Future development includes expanding the collection of landmark stories, introducing more lunar exploration locations, improving the educational content, and strengthening accessibility and multilingual support.

I am also working toward adapting the experience for Fire TV, with a focus on large-screen presentation and remote-friendly controls. Platform compatibility and device-specific behavior will need to be validated through actual testing.

My long-term vision is to make SOLARIS a new way to explore the solar system—one where every planet invites curiosity, and every highlighted location has a story worth discovering.

Explore worlds. Discover their stories.

Built With

• codex
• github
• gsap
• mediapipe
• react
• three.js
• typescript
• vite
• webgl