For rationale and demo: SLIDES/VIDEO
Profile
We are from Montgomery Blair High School. Our Discord usernames are kmh#0778 and vivi#5230.
Inspiration
Social interaction is integral to our well-being, and in the wake of COVID-19 and self-quarantine, online communication is our savior. But chatting is currently fragmented across many platforms -- some friends use Google Hangouts, some use Discord, you might be in an organization or two that uses Slack, and some people use Telegram (why???). We set out to fix that, and wrap it all up in a clean, customizable user interface.
What it does
MasterChat provides as easily extensible chatting UI that can have new chatting platforms added as simple modules. During the course of the hackathon, we implemented modules for Discord and Hangouts, but adding more would be easily doable.
How I built it
The backend is written in Node.js and uses websockets and HTTP requests to communicate directly with Discord's API. It also uses the hangupsjs library to communicate with the Hangouts API.
The frontend is written with Vue.js, and makes use of a few Bootstrap components. It communicates with the backend through a websocket.
Challenges I ran into
Converting Hangouts's and Discord's message and user formats into a single format for use by the frontend was pretty difficult. It took a lot of thinking and messing around to come up with a nice layout for organizing and normalizing the data.
What's next for MasterChat
We plan on implementing more features of the underlying chat platforms in our interface, including read indicators, typing indicators, message reactions, and pins. We would also like to implement modules for more chat platforms.

Log in or sign up for Devpost to join the conversation.