Inspiration

This year’s Hackathon’s are a little different. Instead of the mingling, the networking, and the awesome food – this year, we have to go virtual. Since the COVID-19 pandemic, online studies have caused anxiety, stress, and a general lack of social activity between students. If you are a first-year university student, you probably haven’t even seen your campus yet! It’s lonely. University life has always been promised to be exciting, fun, and the first time you can experience true freedom away from your home and into the world. While we are all in this together, Wave is here to help put a name to a face. It’s hard to find a study buddy these days. Whether you use Discord, Teams, Zoom, or any other apps, you need either a friend request or an invite link. What if you want to study on the go? What if you want to save on that Chegg subscription and have someone you can ask at any time for help?

What it does

Wave verifies your identity through your school to ensure that all our users have a secure environment. You walk around on a map and talk to anyone that catches your eye. Bump into a friend? See a group studying for that exam next week? Need a tutor to help you with math? You can just walk up and ask to join! No invite link, no referral, no friend requests, just like bumping into someone in the street and saying hi.

How we built it

We use Google Maps API to generate an aerial view of your campus, where you can walk around and explore that soon to be university life. You can see other users around the map and choose to walk to them.

frontend: React Google Maps API Socket.io

backend: Nodejs Express Socket.io

We use React to facilitate these functions, so they can be cross-platform with iPadOS.

Challenges we ran into

The biggest challenge we faced was implementing Canvas drawings and Google Maps with React. React has a very unique rendering procedure that makes using external libraries rather difficult, especially ones like Google Map’s Javascript API that require native node access. Canvas was only difficult because we wanted to not only allow drawing, which is not natively supported and had to be done via mouse events, but we also had to serialize a given shape to be sent to others via web sockets

Accomplishments that we're proud of

Social distancing has made it difficult for students to connect with each other, their families, and with themselves. Wave by Group 128 looks to solve this problem by allowing students to jump in and interact with others in a way similar to real-life interactions. We are proud of our implementation of the whiteboard and chat room, which allows live communications between two or more people. The speed and quality of this implementation has allowed a seamless communications channel for quality time spent in a quality company. To be able to jump around the world and join any room that you so desire, we have accomplished a communications tool that connects the world like never before.

What we learned

We learned how to manipulate HTML5 Canvas elements, how to serialized data and finely control dataflow between clients for live-sync. We learned how to use socket.io to facilitate live communication.

What's next for WAVE

In the future, we can scale this into a full-blown iPadOS app with full support for Apple Pencil. We are social creatures, and this pandemic is keeping us shut-in. Before we can return to normal, or if this becomes the new normal, our app will help connect students from across the world. Say hello and wave to people that you would have met but haven’t yet.

Share this project:

Updates