OceanMaster

Home Page!
Trivia Game: We've loaded a bunch of different questions into the database so you can have a different experience every time you play!
Facts and Figures: Learn interesting information about oceanic pollution and see why Marine Conservation is such a pressing issue!
How You Can Help: Displays Marine Conservation centers located across the United States with a detailed description on what they do.
Image Gallery: Shows shocking images on oceanic pollution and how it is drastically affecting aquatic wildlife.
Infographic 1
Infographic 2

Inspiration

For our project, we wanted to focus on an important issue, Oceanic Pollution, that affects aquatic plants and animals around the world. We realized that many people in this area are oblivious to the events occurring in today’s society and we wanted to create something that can help us change this narrative.

What it does

OceanMaster provides people with a platform to educate themselves on environmental issues and learn what they can do to help save the oceans.

How we built it

For the main design of the website, we used a Bootstrap template and used HTML and CSS for the main features of the site. For the Trivia game, we used Javascript to create new questions, check if the users’ answers are correct, and keep track of scores. For the “How You Can Help” Section, we used the Mapbox API to display a real-time satellite map and used jQuery geocoding to show some of the marine conservation centers, through markers with detailed pop-ups, located throughout the United States.

Challenges we ran into

We faced many challenges while developing the website; from getting a functional map to properly storing questions and displaying them on the page. Along with this, we also struggled to adapt to the workflow of a team environment, since we had conflicting schedules and most of our team was unfamiliar with aspects of the project development process and new to computer science in general. However, by conducting more research and establishing better communication, we were able to overcome these hardships and successfully build our website.

Accomplishments that we're proud of

We were able to develop this project with skills we were previously inexperienced with. By finding the resources necessary, we were able to obtain the skills needed in order to successfully accomplish our goals. This hackathon allowed us the opportunity to grow, not only as computer scientists, but also as contributors to our communities.

What we learned

Team collaboration and communication is critical in order to efficiently develop a project. Without the strong team-based environment we created for ourselves, we would not have been able to complete this project in such a short time frame. Although most of our team was new to computer science, by using javascript tutorials and having effective communication, we were able to create a project that is fully functional and ready for immediate deployment.

What's next for OceanMaster

Polishing and expanding OceanMaster in order to make it readily accessible for communities around the world. We also plan on gaining the support of Marine Conservation centers to help us on our campaign to protecting aquatic wildlife and our oceans.