Oort Website Homescreen
We were inspired by Loop's ability to make parties and social gatherings simpler and more fun & enjoyable to organise. We wanted to simplify the problem of annoying song requests for hosts trying to simply DJ a party with a Spotify playlist. The host can set up a playlist before the party, and host a lobby on the Oort web app to allow people to seamlessly choose which songs come up next making the music stress-free for the organiser!
The Space Jam website was the inspiration for the theme, which is still up despite having not changed since 1996. Everyone loves cursor trails and custom cursors, as well as space-themed website with dubious colour-contrasts, so we included those as well!
What it does
There are two main parts to the Oort platform - The host of the party opens the page in a web browser, where they authenticate with Spotify and select one of their playlists as the basis for the party. They are placed into a custom lobby with a unique ID and are presented with a list of songs in their chosen playlist.
The attendees at the party open the Oort app on their smartphone, and connect to the lobby by its unique ID. Each person is presented with a list of songs in the playlist and has the option to place a single vote on songs to promote them in the playlist. The more votes a song gets, the higher up it reaches in the playlist - these are then updated in realtime in the Spotify queue for the host, allowing people to communally choose the next songs to play.
How we built it
For the Host side of the platform, we have a NodeJS server utilising ExpressJS and Pug (previously Jade) for hosting HTML/CSS and handling GET/POST requests. The server has an API for requests to be made & sent by the app, allowing for the app to synchronise with the lobby for playlist songs, and to send upvotes to songs in the queue.
The mobile application is written in Java using Android Studio, and utilises JSON parsing to handle the responses from the server and POST/GET to send votes from the app to the admins lobby.
Both front-ends of the website & mobile application have beautiful 90s-style space themes, with brilliantly low-resolution tiled images and slow animations, written with CSS styling and HTML.
Challenges we ran into
Having never written a full Node server application before, one of the main challenges for the back-end was have a read/write safe way of storing the data to be shared by the server. We knew that having a single JSON file stored on the server would be simple to work with initially, but would cause issues when trying to handle multiple requests that require reading/writing to the file. To fix this, we replaced the JSON file on disk with a 'Storage' class to handle storage safely, with its own class methods and variables that can be called asynchronously to safely modify data on the server.
For the mobile application, the hardest issue was getting the app to efficiently communicate with the server. Initially to stay up-to-date, the app would make update calls on a timer which meant that many unnecessary requests are made to the server causing needless load, and handling the responses for these requests bogged down the app. This was modified to make these requests only when the app needs to refresh, or when it receives a prompt to on the socket on which it is listening.
We are proud of creating a 90s-style GUI despite the difficulty overcoming the our aversion to such sharp edges and high-contrast text-on-space background complete with particle effects and rocket-ship cursor.
What's next for oort
Integrating the Spotify Web API (Beta) to allow for playback controls and automation within the browser.