LUMEN GAME

Turn light into a playground. Manipulate mirrors, prisms and lenses, solve immersive 3D physics puzzles, and explore the science of optics with an AI scientist.

Comment

Inspiration

Light is everywhere, but we rarely get to interact with it directly.

We wanted to turn something that normally feels invisible and scientific into something people can physically explore, manipulate, and understand.

That idea became LUMEN — an immersive 3D playground where light becomes the main character.

Instead of presenting optics through diagrams or traditional simulations, LUMEN turns reflection, refraction, dispersion, and optical convergence into a visual and interactive experience.

We were also inspired by the way modern AI can make technology feel more human. Rather than adding AI as a separate chatbot, we wanted to make it part of the experience: an AI scientist that can explain what is happening, guide players when they are stuck, and eventually help create new optical challenges.

Our goal was simple:

What if learning the physics of light felt like entering a futuristic world?

What it does

LUMEN is an interactive 3D light and optics sandbox combined with a puzzle experience.

Players manipulate optical components such as mirrors, prisms, and lenses to control real-time light beams and solve challenges.

The core experience includes:

  • Real-time light reflection using vector mathematics
  • Refraction based on Snell's Law
  • Prism-based dispersion of white light into a spectrum
  • Interactive mirrors, lenses, prisms, and targets
  • Dynamic glowing light beams
  • Particle-based atmospheric effects
  • Multiple optical puzzles with increasing difficulty
  • A free-form sandbox for experimenting with light
  • Procedural audio generated through the Web Audio API
  • Responsive visual and sound feedback
  • An AI scientist powered by a Hugging Face-compatible language model

The AI is designed to be more than a conventional chatbot. It can explain optical concepts in simple language, provide contextual hints, and respond to the player's actions and questions.

This creates a loop where:

Experiment → Observe → Understand → Solve → Explore

How we built it

LUMEN was built from the ground up using Three.js and TypeScript, giving us direct control over the WebGL rendering pipeline and the interactive physics simulation.

The 3D engine handles the world, cameras, optical objects, particles, animations, and light visualization.

We implemented the optical simulation using vector mathematics.

For reflection, the reflected direction is calculated using:

$$ \vec{r} = \vec{d} - 2(\vec{d} \cdot \vec{n})\vec{n} $$

where the incoming direction and surface normal determine the reflected ray.

For refraction, we use Snell's Law:

$$ n_1\sin(\theta_1)=n_2\sin(\theta_2) $$

Different refractive indices are used to simulate wavelength-dependent dispersion inside prisms, allowing white light to separate into visible colors.

Instead of depending on heavy post-processing frameworks, the visual glow of the beams is created using techniques such as additive blending, custom shader effects, transparent beam geometry, and particle fields.

We also created a procedural audio system using the Web Audio API. This allows LUMEN to generate ambient sound, beam hums, optical collision sounds, and puzzle-completion feedback without requiring a large collection of audio assets.

The AI layer is designed to return structured information alongside its natural-language response. This allows the application to connect AI reasoning with the 3D experience instead of simply displaying text.

Conceptually:

Player → AI → Intent / Explanation → 3D World Response

This architecture also allows the AI model to be replaced without rebuilding the 3D engine.

Challenges we ran into

One of our biggest challenges was making the physics feel convincing while keeping the experience responsive.

A traditional physics simulation can become expensive when many rays, objects, particles, and visual effects are updated every frame. We therefore focused on lightweight real-time calculations and separated the optical logic from the rendering layer.

Another challenge was visualizing light in a way that feels physically meaningful while still looking spectacular.

A mathematically correct line does not automatically look like light, so we combined ray calculations with layered glowing geometry, transparency, particles, and shader effects.

We also had to think carefully about AI integration.

A language model is excellent at generating explanations and ideas, but it should not be allowed to directly control arbitrary code. We therefore designed a constrained state-based approach where AI output is converted into predefined actions and world states.

Finally, we wanted the project to work as both an educational experience and an engaging game. The challenge was finding the balance between explaining the physics and allowing players to discover it themselves.

Accomplishments that we're proud of

We are proud that LUMEN turns fundamental optics concepts into something that can be physically explored in a browser.

Instead of watching a simulation, the player becomes part of it.

A mirror can redirect a beam.

A prism can split it.

A lens can converge it.

A successful solution can activate an entire environment.

We are especially proud of connecting the physics engine with the visual and audio systems so that interactions feel responsive rather than purely mechanical.

We are also proud of building the experience around pure Three.js and TypeScript, giving us direct control over performance, rendering, interaction, and visual effects.

Most importantly, we built LUMEN around a simple idea:

Physics should not just be explained. It should be experienced.

What we learned

We learned that building a 3D experience is not only about rendering beautiful graphics.

The most important part is the relationship between:

physics + interaction + feedback + storytelling.

We learned how vector mathematics can become interactive visual experiences, how optical phenomena can be approximated in real time, and how shaders and particles can transform simple geometry into convincing light.

We also learned that AI becomes much more interesting when it is connected to an environment rather than isolated inside a chat window.

Instead of asking:

"How can we add AI to a 3D website?"

we started asking:

"How can AI become part of the world?"

That change in perspective influenced the entire design of LUMEN.

What's next for LUMEN

LUMEN is designed to grow beyond a fixed set of puzzles.

Our next step is to introduce an AI-powered Lumen Lab, where players can describe the kind of optical challenge they want and the AI can generate structured puzzle configurations that the 3D engine can safely turn into playable environments.

We also want to expand the sandbox with:

  • More optical elements
  • Mirrors with different materials
  • Multiple lenses
  • Fiber-optic paths
  • Diffraction experiments
  • Interactive holographic objects
  • More advanced optical puzzles
  • AI-generated challenges
  • Collaborative experiments
  • More educational explanations
  • User-created optical worlds

Our long-term vision is to turn LUMEN into an interactive digital laboratory where anyone can experiment with light without needing physical equipment.

The future of LUMEN is not just solving puzzles with light.

It is learning how to create with it.

Built With

Share this project:

Updates

Submission history