-
-
Home page of Musial.
-
Search page for albums and songs.
-
Search result for the album 'Submarine'
-
Search result for the song 'Birds of a Feather'
-
Poster editor for the album 'Submarine'
-
Randomly finished album poster.
-
Randomly finished single poster.
-
.pdf file downloaded once the 'download' button is hit.
Inspiration
Thousands of people listen to music on Spotify, but why stop there? We decided to create a website that allows users to format their own custom posters of their favorite songs and albums so that they can then save it as a .pdf, which they can then use as a digital decoration or print and frame to add personality to their lives!
What it does
Musial encourages users to express their creativity and passion for music through the creation of custom posters. They will be presented a simple home page that will lead them to a search page where they can search for albums or posters, which was done using Spotify's API. Once they select what they are looking for, they will be sent to a poster generator page, which allows them to choose from a variety of poster layouts, and even customize the background colors and patterns. Once finished, users are then able to download their work as a .pdf file and use it however they wish!
How we built it
We began by placing our thoughts on a Miro, and then we designed plenty of poster layouts using a paper and pen. The front-end of the website, or what the user sees, is done using HTML for formatting, CSS for styling, and Alpine.js for simple Javascript functionality within the HTML scripts. The back-end was developed using Python and Flask, which allowed us to send and read data from our website. For our search page, we used the Spotify API to allow users to choose from a large variety of songs and albums.
Challenges we ran into
Our biggest challenge was retrieving data from the Spotify API and sending it to the poster. We faced many reference problems which cause a ton of errors initially, but once we resolved them everything was worth it. Another problem we faced was the formatting of the posters, as we had to take into account that some songs/albums have longer names that what would look good, so adjusting the code to allow any song/album to fit nicely was tough and definitely necessary.
Accomplishments that we're proud of
Our proudest accomplishment is the formatting of our front page, search page, and poster development page. We took the time to make our website have a clean, professional look, but not seem soulless to users. We are also proud of our Spotify API implementation, as it was our first time using an API. Finally, our download feature was also a shocking product of our work because we did not expect it to work as well as it does.
What we learned
We improved our understanding on how to use APIs and improved our programming format and organization.
What's next for Musial
We've initially had many ideas to add to our website, including a playlist feature that uses AI to choose some songs based off of genres, a music theory page to teach our users a bit about how music is made, a music streaming feature, and a simple music-making platform, but we prioritized our poster feature as we felt it would be the most creative and doable within our given time frame. We do want to come back someday and continue adding features to our website!
Log in or sign up for Devpost to join the conversation.