Inspiration
Currently, oceans are undergoing massive changes. After the world started turning to cheap and disposable plastics, a lot of waste has started going into the seas. Combined with the problem of overfishing, the oceans are becoming a lot less safe and lots of species that live in them are at risk. Unfortunately, most people don't seem to realize this issue. For that reason, I created Ocean Guardian.
What it does
OceanGuardian is an interactive web platform that serves as a comprehensive resource for ocean conservation awareness and action. Key features include: Real-time Ocean Health Monitoring: Interactive visualizations of ocean temperature trends and vital signs across different regions Marine Life Tracker: Global mapping system showing the distribution and movement patterns of various marine species Pollution Monitor: Detailed analysis of ocean pollution levels with hotspot identification Sustainable Seafood Guide: Comprehensive database helping users make environmentally conscious seafood choices Conservation News Feed: Curated updates on ocean conservation efforts and marine environmental news Personal Impact Calculator: Tool for users to measure and understand their impact on ocean health Prevention Guide: Structured information on reducing ocean pollution through personal and community actions Educational Quiz System: Interactive learning modules to test and enhance ocean knowledge
How we built it
Frontend: HTML5, CSS3, and vanilla JavaScript for a lightweight, fast-loading experience Data Visualization: Chart.js for creating responsive, interactive charts and graphs Mapping: Leaflet.js for implementing dynamic, interactive maps APIs Integration: NOAA API for ocean temperature data GBIF API for marine life tracking Guardian API for news content ERDDAP for oceanographic data
Challenges we ran into
One major challenge I ran into was API integration. Not only were there a lot of API's I had to implement, there were also a lot of other inherent problems. For example, rate limits were a key issue, as it was very difficult to find an API that fit the criteria that I needed for this site. Additionally, I had to ensure all data was in a readable format for the reader and that there were adequate resources for them, so adapting to that was also relatively difficult.
Accomplishments that we're proud of
I'm most proud of the educational aspect it brings. It is not only able to show the issues in oceans that are caused by society, but it also is capable of teaching the audience what they are supposed to do, how they're supposed to act, and how they can help.
What we learned
I learned a lot about code organization and API usage. This project allowed me to expand on a lot of prior skills I had built and further improve my coding skills. Additionally, away from the coding side, I learned a lot about the oceans, marine life, and which organizations play a role. The information I learned is reflected in this project, ranging from which organizations' APIs I used to which seafood is sustainable.
What's next for OceanGuardian
In the future, I hope to build 2 main features: Firstly, I want to build a function for hosting events. Clean-ups, workshops, and other useful ocean-related events can help make a major impact. Second, I want to fully implement the donation aspect. All money donated to help the ocean makes a major difference, and ensuring that it's possible can help assist these people in continuing to save our oceans and marine life.
Log in or sign up for Devpost to join the conversation.