SonicSurf

Inspiration 💡

Ocean water covers more than 70% — 75% of the Earth. Over the last decade we have become increasingly alarmed at the amount of plastic in our oceans. Sources say more than 8 million tons of it ends up in the ocean every year. It's estimated that if pollution grows at this rate, there will be more plastic than fish in the ocean by 2050.

Our friend Blahaj 🦈 is stranded in the middle of a toxic water body, starving for oxygen just to live. Our primary objective to make sure that it survives and in return we'll get our reward!

We aim to make both Blahaj's life and Our's better, so the reward is Health Benefits. Thus we came up with SonicSurf ✨

What it does 🤔

Prolonged screentime can extensively affect our eyes and hence might weaken our vision, or worst can give blindness. Leveraging eye-tracking, players can control Blahaj and guide him to safe areas in the ocean by performing various eye-exercises. Don't worry we aren't forcing you to leave your desk, instead you can vibe through the exercises which will increase bloodflow in your eyes stimulating the production of Aqueous Humor (a clear fluid that fills and helps form the anterior and posterior chambers of the eye) that prevents our eyes to dry up, hence keep the moisturization level optimal.

Hence, we prove, More Screentime ≡ Better Health 👨‍💻

How we built it ⚙️

SonicSurf is crafted with ❤️. SonicSurf is primarily a Webapp where for the front-end we're using Next.Js with TypeScript along with Tailwind CSS. For Eye-Segmentation & Tracking were using WebGazer API. We also leveraged various 3rd-party API's for optimization purposes. The application is deployed on a free instance of Vercel.

Also, it's to be noted that variable lighting condition and low-spec systems might affect the experience!

Challenges we ran into 😤

Had to fix tons of Bugs in the way. Also, it was a bit difficult for us to collaborate in a virtual setting but we somehow managed to ship the project on time.

Design 🎨

We utilized design tools like Figma, Photoshop & Illustrator to prototype our designs before doing any coding. Through this, we are able to get iterative feedback so that we spend less time re-writing code.

Research 📚

Research is the key to empathizing with users: we found our specific user group early and that paves the way for our whole project. Here are a few of the resources that were helpful to us —

Reference	Link
Screen time effect on Eyes	https://bit.ly/3duGz1Y
Exercise for better Vision	https://bit.ly/3eZvoyG
Eye Exercise for better vision	https://bit.ly/3doFY22
Velo API Docs	https://www.wix.com/velo/all-documentation
Paper1	https://arxiv.org/pdf/2106.15069.pdf
Paper2	https://par.nsf.gov/servlets/purl/10024076
Paper3	https://arxiv.org/ftp/arxiv/papers/2105/2105.02460.pdf

Design Resources : Freepik
Icons : Icons8

Accomplishments that we're proud of ✨

We initially aimed not to participate in the hackathon and instead use the weekends to recharge ourselves for the next week! But later, we both agreed and started discussing the ideas. It took a lot of time to come up with this impactful idea, which has the potential to help many! We are really proud of it.
Also, pulling off this hackathon with just two members is something we're very proud of. 🎉

What we learned 🙌

A lot of things, both summed up in technical & non-technical sides. We also gave our level best to make the UI/UX look solid which helped us learn more about different design-centric approaches! Not to mention, Stackoverflow was the gem for us while we're troubleshooting some complicated issues late-night.

What's next for SonicSurf 🚀

Multiplayer-Mode! Yes, we know that you want that, and we won't let you down ;) Moreover, we aim to improve the experience for low-spec users along with adding in-game transitions for a more beautiful experience!

Note ⚠️ — API credentials have been revoked. If you want to run the same on your local, use your own credentials.