Project Brief

While enrolled in our Information Design class over the course of a semester, 15 weeks, we were tasked to create a unique and dynamic way to visually display a music library consisting of 50 songs.

Background

I chose to use Adobe Brackets as my source code editor and utilized HTML, CSS, and Javascript libraries. My goal was to present my songs in a dynamic yet efficient way to creatively sort and listen to music.

Design Solution & Strategy

To sort my music library, you could start with a standard shuffled play all, then sort by genre, or duration. As an avid music listener however terrible with remembering artist names etc. to help those who struggle along side me I added a map in which you could then locate where your favorite artists were born, learn their name and the genre of music they create. I utilized a honeycomb layout as a way to efficiently display a large quantity of data in a dynamic yet structured way.

Research

I began with surveying current music streaming sites and analyzing each of their aesthetics. Drawing inspiration from Spotify I knew I wanted to utilize a youthful color palette.

When it comes to executing the construction of the site, I relied heavily on in class lectures, activities, and online tutorials for research and execution.

Challenges

Throughout my site you see a hexagon theme, which provided a certain level of difficulty when coding from scratch. In general, coding is not something that comes naturally to me, it took heavy amounts of research, patience, and de-bugging along the way.

Process & Materials

Adobe Brackets, Text Wrangler, HTML, CSS, Microsoft Excel, Illustrator