Cover
Home dashboard — Explore water health around you
Community Map — Find waterbodies near you
Home dashboard — Explore water health around you
Site detail — Water quality trends & health snapshot
Wildlife breakdown — Biodiversity at a glance
Observation with One Health Insight — Water, human, ecosystem
Water Stories — Community feed
Comments — Threaded discussion with experts
Profile — Impact, badges & contributions
Badges — Gamified citizen science journey
Community Actions — Join cleanups & challenges
Challenge detail — 7-Day Observation Streak
Recent Observations — Community activity feed

Inspiration

Growing up in Cox’s Bazar, Bangladesh, I have always felt connected to water and the environments that depend on it. Rivers, canals, and coastal ecosystems are part of everyday life here, yet environmental concerns can go unnoticed when people lack simple ways to document what they see and connect their observations to meaningful action.

I wanted to build something that could help bridge that gap. What if people did not need to be scientists to contribute to understanding their local waterways? What if observing a polluted site, documenting visible litter, or noticing changes in the surrounding environment could become the first step toward collective action?

That idea inspired AquaQuest — Observe. Understand. Act.

My goal was to combine accessible environmental observation, interactive maps, community participation, and engaging challenges in one mobile-friendly platform, starting with the kinds of waterways and environmental concerns relevant to communities like mine.

What it does

AquaQuest is a mobile-first Progressive Web App (PWA) designed to help people explore aquatic environments, document visible environmental concerns, learn about ecosystem health, and participate in community-oriented environmental activities.

Its core experience follows a simple journey: Explore → Observe → Understand → Contribute → Act.

Key features include:

Explore Water Sites: Discover water locations through an interactive map and site directory, with examples centered on waterways such as the Bakkhali River in Cox’s Bazar.
Guided Observations: Record visible conditions such as water clarity, unusual colour, litter, smell, and wildlife through a structured workflow.
Photo-Supported Reports: Use photographs, notes, and observation details to document potential environmental concerns.
Community Stories: Explore environmental stories and community-focused content that make local water issues easier to understand.
Challenges and Contributions: Engage with environmental challenges and track participation through progress indicators, points, levels, badges, and achievements.
Environmental Learning: Explore educational content about water, biodiversity, ecosystems, and the connections between environmental, animal, and human health.
Personal Impact: Review personal contributions and prototype activity indicators that help make participation more visible.
Mobile and Offline Support: Use a responsive, installable PWA with service-worker caching and an offline fallback for greater resilience when connectivity is unreliable.

AquaQuest is designed to make environmental participation more approachable. It does not replace laboratory testing or professional environmental assessment; its purpose is to help people document observations and build awareness around local waterways.

How we built it

I built AquaQuest as a solo student developer using an Android phone and Acode. I wanted to create a complete, navigable application experience with the tools available to me, rather than limit the idea to a static mockup.

The project uses:

HTML5 for application structure.
CSS3 for responsive layouts, styling, and interface components.
Vanilla JavaScript (ES6+) for application logic, interactions, and state management.
Leaflet.js for interactive maps.
Chart.js for data visualizations.
Browser LocalStorage for local persistence.
Web App Manifest and Service Worker for installability and offline support.
jsPDF for PDF/export functionality.
Font Awesome for interface icons.
GitHub Pages for deployment.

I organized the application into separate core utilities, data modules, services, features, pages, and reusable UI components. This modular structure makes the prototype easier to maintain and gives it a foundation for future integration with real environmental data services.

The current version uses demonstration content, a mock API/service layer, and browser-based storage. It is a functional frontend prototype rather than a production system with a shared cloud database or real-time synchronization.

Challenges we ran into

One of the biggest challenges was balancing a broad environmental idea with a practical application that could be built and tested entirely on a mobile development setup.

1. Turning a broad problem into a clear user journey

Environmental monitoring can involve complex scientific concepts. I needed to organize the experience into understandable steps so that someone without a technical background could explore a site, record an observation, and understand how participation connects to possible action.

2. Designing for both usability and meaningful participation

AquaQuest brings together maps, observation forms, reports, educational content, community stories, and challenges. Making these features feel like parts of one coherent experience required careful attention to navigation, information hierarchy, and mobile usability.

3. Working within a frontend-only architecture

Without a production backend, I had to use mock services, demonstration data, and local storage to develop and demonstrate the application experience. This also meant being careful about the distinction between local prototype interactions and genuinely shared community activity.

4. Building and testing on a phone

Developing a modular application using a mobile code editor presented practical constraints. Managing project files, debugging JavaScript, keeping assets organized, and checking responsive layouts required an iterative approach.

5. Communicating environmental information responsibly

A photograph or visual observation can indicate a concern, but it cannot establish the full chemical or biological condition of water. I wanted AquaQuest to encourage documentation and investigation without presenting unverified observations as confirmed scientific findings.

These challenges helped shape the project into a more focused, transparent, and extensible prototype.

Accomplishments that we're proud of

Building a complete application experience independently: I brought together multiple connected features in one navigable prototype rather than stopping at an idea or a collection of static screens.
Creating a citizen-science-oriented workflow: AquaQuest connects site discovery, guided observations, photo-supported reporting, environmental learning, and participation in a single experience.
Making mobile development work: I developed and deployed the project using an Android phone and Acode, demonstrating how much can be built with a lightweight web technology stack.
Combining usability with environmental purpose: Maps, structured forms, community features, and challenges are designed to make environmental engagement approachable for non-specialists.
Planning beyond the first prototype: The modular architecture provides a starting point for future integration with validated environmental datasets, shared reporting, and community review.

Most importantly, AquaQuest represents my attempt to connect my interest in technology with a problem that matters to the waterways and communities around me.

What we learned

Building AquaQuest taught me that an environmental application needs more than an attractive interface or a map. It needs a clear purpose, an understandable reporting process, and a responsible way to communicate what the available information can—and cannot—tell us.

I learned how different frontend components work together in a larger application, how to organize JavaScript into reusable modules, and how maps, charts, local persistence, and PWA features can support a more complete user experience.

I also learned to distinguish a working prototype from a production-ready system. Local storage can support a demonstration, but genuine community monitoring requires secure shared data, reliable evidence handling, validation, and appropriate review.

Finally, I learned that technology can lower the barrier to participation, but meaningful environmental impact depends on trustworthy information, sustained community involvement, and practical next steps.

What's next for AquaQuest

The current prototype is a starting point. The next stage is to move from demonstrating the experience toward supporting reliable, real-world environmental participation.

My priorities are:

Build a secure shared backend: Enable observations and reports to be stored centrally and accessed across devices, with appropriate privacy and access controls.
Improve evidence collection: Make photo uploads more reliable and preserve relevant details, timestamps, and site information.
Introduce report validation and community review: Help identify incomplete or duplicate submissions and allow appropriate reviewers to assess reported concerns.
Integrate trustworthy environmental data: Where available, connect validated datasets or sensor feeds while clearly distinguishing measured values from community observations.
Develop community insights: Present trends and recurring concerns over time without overstating what the available evidence proves.
Pilot with local waterways: Explore a small, carefully documented pilot around waterways in Cox’s Bazar, beginning with community feedback and verified information rather than assuming the prototype already has real-world impact.
Improve accessibility and localization: Make the experience easier to use for more people, including those with limited technical knowledge or unreliable internet access.

My long-term vision is for AquaQuest to help communities move from simply noticing environmental problems to documenting them responsibly, understanding them better, and organizing informed action to protect local waterways.

AquaQuest is built around one simple belief: every observation can be a starting point, and collective understanding can help communities take better care of their water.