CleanWave

Default Page Extended
Dr Clean Ai, Which asks you three trivia questions through which you can earn points!
Our Store
Store Extended, here you can redeem points
Default Page - For Everyone
Login Page
User Dashboard After Logging In
Sign Up Page

Inspiration

The inspiration for Cleanwave came from our passion to improve our ocean life environment. We want to preserve our beaches and oceans to make sure they are suitable and sustainable for future generations of humans and sea life!

What it does

Our goal was to create a website where users can submit videos of them cleaning the local beaches by collecting trash and throwing it away in the proper waste areas. These videos are verified and upon verification, the points are awarded. The user can also do a mini three-question quiz with our very own Dr.Clean AI Bot! Dr.Clean will ask the user for Ocean trivia-related questions and based on the number of questions the user gets correct, they will earn more points. These points can then later be used in purchasing various products such as hoodies, t-shirts, swimsuits, and other souvenirs!

How we built it

As for the frontend component of our project: we built the styling and functionality of the homepage and the dashboard using HTML, CSS, and Javascript. Our AI component page was built using tools such as React and Node.js. As for the backend part of the component: We used PHP and MySQL to store information regarding user login and tracking the user’s points. We also used AWS (Amazon web services) to keep track of and store the uploaded videos.

Challenges we ran into

There were numerous challenges we ran into throughout our journey of developing this project. One of the major challenges we ran into was figuring out how to properly connect the front end to the back end of the project as a whole. Another challenge was properly implementing the Open AI API, making sure all the API keys were in place, and connecting it to the other components of the website. We also ran into minor issues with brute force coding and using defensive programming tactics to make our code more efficient.

Accomplishments that we're proud of

The foremost accomplishment we are proud of is the implementation of our AI chatbot, Dr. Clean. As mentioned before, we ran into several challenges trying to implement the chatbot with the API. Because it was proven to be the most difficult aspect of our project, it was incredibly rewarding to witness the chatbot functioning in the way we intended. Dr. Clean is very interactive, providing great insight into the world of oceans and how to keep them clean. With countless companies finding ways to implement AI on their websites, we considered it a must to implement it on CleanWave. Dr. Clean provides the opportunity to greatly increase awareness of ocean pollution and encourage people to keep them clean. Additionally, we put countless efforts into our back-end and styling to ensure the user experience would be as smooth as possible. With a maritime color scheme, the CleanWave website proves to be a navigable and aesthetic website with great capabilities.

What we learned

This project was our first experience implementing something with the OpenAI API. In turn, we learned how to implement it and how it works throughout the process. We were working with React and Node.js as well, so with the learning curve, we were able to come away with a great deal of knowledge we had not previously had. Additionally, we learned about the capabilities of Amazon Web Services and how to implement them into our project. This project took a great deal of perseverance to complete, and through learning about all these frameworks, we were able to maximize the capabilities and quality of CleanWave.

What's next for CleanWave

CleanWave hopes to reach a wider audience to spread awareness regarding ocean pollution while also encouraging people to help clean up our oceans. As a nonprofit, CleanWave continuously seeks to improve nature and human society. As this website is deployed, it will continue to spread the mission of empowering individuals to partake in ocean cleanup efforts, in turn facilitating vast improvements in our ecosystem and the world.