Inspiration

We were inspired by our group's interest in working with Spotify, and we thought it would be a fun and creative project to create a mosaic using hundreds of album covers to allows users to discover new music and admire a nice colour gradient at the same time.

What it does

Spotify Colour Mosaic generates a mosaic of hundreds of album covers based on the colour that the user chooses.

How we built it

Node.js, HTML, CSS, JavaScript, Flask, Python, Spotify's API.

Challenges we ran into

We faced challenges in ensuring that we were able to import 100+ album covers onto our webpage using the Spotify API since the API restricts users to only be able to grab 50 albums at a time, so we needed to ensure that it would be possible to call the API multiple times instantaneously once the webpage is loaded to show hundreds of album covers to create the mosaic. We also had issues with the colour sorting functionality as we underestimated the complexity of determining the dominant colour of the album covers and figuring out what method to use to properly sort the album covers to create the mosaic.

Accomplishments that we're proud of

We were proud to have completed our first major project together in such a short period of time, as we are all 2nd year Computer Science students at Dawson. We also managed to learn how to use Node.js during this hackathon, which was completely new to all of us so we're proud to have overcome the learning curve and accomplished to create a well functioning web page using our prior knowledge of HTML, CSS, JS, Flask, and API calling.

What we learned

We learned how to work with Node.js to create the web server, work with the Spotify API Documentation to find the exact aspects that are relevant to our project, and work with a variety of Python libraries that are new to us to implement some of the app's functionalities.

Share this project:

Updates