Making Music'em, the music discovery app
Montage of my three month end-to-end design journey in creating a mobile app that makes it easy for fans to discover and stream music through personalized content.
case study, design, development
Introduction
You're probably wondering how I got here, on a Full Sail University stage, in front of a global audience, presenting Music'em, the mobile app, as my capstone project for my BS in HCI.
How can I make it easier for fans to discover music they would like?
It started three months ago when I asked myself, "How can I make it easier for fans to discover music they would like?"
Month 1
The concept of an app was a natural progression for the work i've done documenting and contributing the hip hop music scene in Orlando, FL through my music platform 8pounds.
Validating my idea through user interviews, and analytics
To validate my idea i leveraged my network of venue owners, concert goers, and event creators for user interviews and establish a source for content to recommend users.
To know what brands to curate from i researched user behaviors and learned from user interviews their favorite brands. As well as analytics from my site that infromed me on demographics and age range for my vistors to build a classification of 'influencers' based on this information.
Research led to a solid sitemap
The sitemap was next for me to make. While i consider the tech stack that would be best to create the app from. I ended up with the MEAN stack due to tools like material design for the UI layer, and my experience with it in the past years would lend itself for a smoother development process within in the short timeframe.
Month 2
The sitemap helped me to make wireframes in SketchApp. Each iteration leading to higher fidelities. focused on usability tests.
The onboarding process user tested with high fidelity wireframes.
All the technical stuff including QA
Material design helped me convert the high fidelity mockups into their design language using the angular component library to easily create the front end and tieing it to the Firebase backend using ES6.
Firebase also helped for OAuth for seamless authentication and managing user profiles securely.
As a registered Facebook developer i'm given analytics of my user-base and in app advertisement capabilities.
Conclusion
The full project's codebase can be found on my github page here github.com/ptlergo/musicemapp.
To view the app itself follow the link to musicemapp.com here.
© Patrick Tunga-Lergo 2024