EAZL - UX Design Capstone

by William Lambert


 

PROBLEM

Cover art for music is hard to make.

Musicians and visual artists don’t have an easy place to find each other.

Platforms such as Instagram and Behance don’t offer specific methods of finding cover art creators -

thus holding back artistic expression and making it frustrating for creators of both disciplines.

From my work in the music industry, this problem occurred again and again, and all my friends felt the same thing.

SOLUTION

In order to encourage collaboration, less obstacles would need to lie in front of music being released.

My aim was to create a tool that would unite and foster both artistry types

 
 
 
 

Step 1 - Competitive Analysis

To create broad strokes for my design, I wanted to analyse what my competitors were up to and how they lacked the overall space for fostering cover art collaboration.

Below are the three main competitors: Behance, Instagram & Fiverr

 
 

After evaluating my competition, here’s what I gleaned of EAZL’s potential market position.


Step 2 - User Research 

After reviewing competition for EAZL, it was incumbent upon me to research more qualitatively. 

The first stage of this was a screening survey, to gather data from a larger pool of art industry professionals in my circle, as well as to inquire for in-depth interviews. 


STEP 2, PART I - SCREENER SURVEYS

I sought out friends and contacts of both visual art and music, some artists had overlapping skillsets.

As cover art can come in the form of infinite genres of art, it excited me to hear how opinions correlated over experience in Photography, 3D Rendered Art, Hand Drawn styles and beyond. 


Participants were asked on their visual inspirations for creating cover art, the kinds of discovery methods they connect with their collaborators, and how following projects they may endorse and propagate new potential collaborations. 

Inspirations

 
 
 

Discovery Referring to the chart below, social media pages like Instagram and Tiktok primarily serve as the access point for artists to connect. 

Next in importance, participants mentioned that they are influenced by fellow artists in finding their collaborators.

 
 
 

Referrals

 
 
 

STEP 2, PART II - INFORMATIONAL INTERVIEWS

In my survey, I listed within an option for participants to opt in to interviewing with me to provide more detail about their experiences.

I was particularly enthused to be getting the opportunity to ask questions and learn more about my friends experience’s in the music industry.

These interviews would also highlight the pain points that EAZL would aim to resolve.

I ended up scheduling interviews with three musicians and two cover artists.

Here’s a look at an empathy map where I mapped out how the users I interviewed think, feel, say & do.


Step 3 - User Persona Building

After sorting these insights, consolidating the numerous quotes and points into broad categories with affinity and empathy mapping, I was able to put together my three personas for this project. Catering to these personas would allow me to design for the highest priority features, and come to foster multiple types of collaboration. 

If you’ll allow me to introduce my personas: 

  • Two Musician personas: Prolific Pippa & Seeker Sungwoo 

  • Pippa is experienced, and Sungwoo is a novice. Both are looking for cover artists that will bring their visions to life.

  • One Visual Artist persona: Efficient Erik

  • Erik is a savvy artist that has worked with musicians before, but would like a specialized medium to showcase his work and realize new collaborations.


Step 4 - Low-Fidelity Wireframes

After hearing from my potential users and focusing on tangible Personas, it was time to shape the lofi wireframes!

This would be my first steps at bringing EAZL into the real world, and so I set to make UI that would be self-explanatory as well as offer musicians and artists a fresh but cohesive place to display their work.

Also bolstering my enthusiasm was the prospect of testing my designs and getting user feedback, so I set forth on making the wireframes at breakneck speed!

USABILITY TESTS ROUND 1 (LO-FI FLOWS)

It was awesome to have a structure for my designs now, and at this stage the prototype was clickable. At this low-fidelity stage, a good practice is to not iterate too strongly until after usability tests validate those features.

So as I indicated, scheduling my group of professionals, I conducted four usability tests for my three red routes.

I’ve created a test report for that low-fi run here.

It was encouraging that my participants were able to complete the routes handily without leading, but I did notice through the tests errors and more efficient setups for my design.

My participants were extremely insightful even at this stage, indicating that sign up would be helpful by two different types of users to advertise both visual and musical skillsets. Frequently they also noticed that certain prototype interactions were off as well as aspects of UI that could be more intuitive for them.

I iterated on the notes I took, and feeling confident, proceeded to the high fidelity era of EAZL!



Step 5 - High-Fidelity Wireframes

Having created my Personas, the next stage of my project was to design the EAZL wireframes.

This stage, of course, was incredibly fun, combining all aspects of the user interviews and data I gathered into a tangible device.

 

USABILITY TESTS ROUND 2 (HI-FI FLOWS)

With many aspects of the art discovery implemented, I was to now test my app to participants once again.

I’ve created a test report for that hi-fi run here.

It was wonderful to see how easy the flows became with all the colours and aligned UI, such that the UX seemed very pleasant.

The participants collectively did notice some errors with interactions, such as when the UI elements weren’t fixed upon scrolling in ‘Upload’ and helped me find ways to innovate by remarking at how the ‘Search’ could look more unique.

Their insights helped me increase the ease of functionality, hone the visuals of the UI and understand the minds of my friends.

In this iteration, EAZL utilized a Feed, Explore & Search section, as well as algorithmized home containers. Contained within EAZL are also the familiar instant messaging and library screens to help serve more functions for collaborations as well as help users collect influences to their artistic vision.

My focus was to let the content speak for itself, and to use a clean, positive visual aesthetic to incentivise easy navigation as well as one that would help users feel comfortable.



Conclusion

For such a significant design project, and one where I needed to play all the parts myself - this experience was wonderful.

I really enjoyed getting information around an industry and topic which so greatly moves me, and to iterate it into existence was satisfying.

In understanding how other people think, and how they did in testing my prototype was also humbling as it helped me check myself well.

I’m proud of what I’ve made, its intricacies as well as they work that others have contributed to perfect EAZL.

Thank you to my friends who made all the insights possible as well as Springboard and my mentor Nishant to keep enhancing my focus on this project!


Thank you too for reading, perhaps you’d like to see another work from my portfolio or my resume?