About the Project

AquaSphere Lite was inspired by a simple question:

How can groundwater awareness become something people can actually experience rather than just read about?

Groundwater is usually invisible. People interact with taps, soil, plants, ponds, farms and rainfall every day, but the connection between these everyday observations and the water beneath the ground is not always obvious.

We wanted to turn that hidden connection into an interactive learning experience.


What We Built

AquaSphere Lite brings three connected experiences together:

AquaQuest — Explore

A 30-level environmental story where users investigate everyday water situations, make decisions and see how their choices affect the landscape.

Users encounter situations involving:

  • Household water use
  • Leaking taps and pipelines
  • Rainfall and runoff
  • Soil and infiltration
  • Agriculture and irrigation
  • Ponds and wetlands
  • Trees and vegetation
  • Groundwater recharge
  • Community water decisions

The user's progress and decisions influence the landscape state throughout the experience.

AquaBot — Understand

A conversational knowledge guide that helps users learn about:

  • Groundwater
  • Recharge
  • Rainfall
  • Soil
  • Roots
  • Plants
  • Trees
  • Wetlands
  • Drought
  • Water conservation

AquaBot uses scenario-based responses so that explanations can consider the situation described by the user rather than simply matching one isolated keyword.

AquaCheck — Observe

A simple environmental awareness tool based on everyday observations.

Users answer questions about:

  • Soil moisture
  • Heavy rainfall and runoff
  • Plant condition
  • Local water sources
  • Changes in surrounding water use

The tool provides an awareness-focused interpretation. It is intentionally not presented as a scientific groundwater diagnosis.


The Core Experience

AquaSphere connects the three experiences into one journey:

Explore → Understand → Observe → Act

  1. Explore a realistic water situation.
  2. Understand why it happens.
  3. Observe similar signs in the world around you.
  4. Act by thinking about practical everyday choices.

The idea is to help users understand that water is not only a household resource. It connects homes, soil, plants, farms, ecosystems and communities.


How We Built It

AquaSphere Lite was designed as a lightweight browser-based application.

Technology

  • HTML5
  • CSS3
  • Vanilla JavaScript
  • LocalStorage
  • Google Fonts

There is no backend, database or API key required.

The application is contained in a single index.html file, making it easy to run and demonstrate.

AquaQuest uses JavaScript state management and LocalStorage to preserve the user's progress across its 30 levels.


What We Learned

Building AquaSphere taught us that environmental education does not necessarily need to begin with complicated data or technical terminology.

We learned how to:

  • Turn an environmental problem into an interactive experience.
  • Design a story-driven learning flow instead of static information.
  • Connect multiple features into one coherent product.
  • Build interactive game logic using JavaScript.
  • Create scenario-based educational responses.
  • Design an awareness tool without presenting it as a scientific diagnostic system.
  • Focus on user experience while keeping the technical architecture lightweight.

One of our biggest takeaways was that people can understand complex environmental systems more easily when they are connected to situations they already recognize.


Challenges We Faced

Making Invisible Groundwater Understandable

Groundwater cannot normally be seen directly by users.

Instead of trying to visualize the entire underground system scientifically, we used familiar situations such as leaking taps, overflowing tanks, rainfall runoff, drying soil, stressed plants, ponds and changing water sources.

These everyday observations become entry points into larger groundwater concepts.

Keeping the Project Simple but Meaningful

Another challenge was creating something that felt like a complete product without adding unnecessary technical infrastructure.

We focused on:

  • Clear navigation
  • Interactive scenarios
  • Persistent game progress
  • Contextual educational responses
  • Observation-based interaction
  • A consistent visual experience

This allowed us to keep the application lightweight while still making it interactive.

Avoiding Overclaiming

Environmental observations can suggest patterns, but they cannot independently determine the condition of an underground water system.

For this reason, AquaCheck clearly communicates that it is an awareness tool, not a scientific groundwater diagnosis.


Why AquaSphere Lite?

AquaSphere Lite is built around one central idea:

Make the invisible journey of water easier to understand through everyday experiences.

Instead of asking users to learn groundwater science first, AquaSphere lets them:

Explore a situation → Ask why it happens → Observe similar signs → Think about action

The result is an interactive environmental-awareness experience that connects water, soil and life in a way that is approachable for everyday users.


Project Inspiration

AquaSphere Lite was developed as an independent educational prototype inspired by groundwater-awareness problem areas and the broader goal of making environmental knowledge more accessible.

It is not an official government system, scientific groundwater prediction system, or replacement for professional environmental assessment.

Its focus is simple:

Help people notice water, understand its journey, and think about how everyday choices affect the environment.

Built With

  • accessibility
  • awareness
  • browser
  • conservation
  • css3
  • ecology
  • education
  • elearning
  • environment
  • frontend
  • gamification
  • groundwater
  • html5
  • interaction
  • interface
  • javascript
  • localstorage
  • nature
  • responsive
  • storytelling
  • sustainability
  • water
  • web
Share this project:

Updates

Submission history