OBJECTIVE
Once the initial wire-framing was completed, three of the app's user flows were brought into InVision to create an interactive prototype. The purpose of this project was to begin testing out the usability and functionality of the application. This, along with help of user testing, would be very important in continuing on to designing the final and full high-fidelity design. This would help find things that need tweaking, allow one to think deeper about the app's overall purpose and make necessary changes.
User Testing Preparation
Before jumping into user testing, preparation needed to be done. An interactive prototype had to be created for the flows and wireframes. Also, there needed to be follow up questions prepared for the user interviews as well as knowing how to describe each flow. Having this prepared would allow for the user interviews to flow smoothly and get the most out of them.
Explaining the three flows to the user:
Flow 1: Log in to app/create an account
You want to sign up/log in to the Ghost App
Flow 2: Add or remove a song from a playlist
You've now logged into the app and want to edit a playlist
Flow 3: Unique flow to the app
- You have a social aspect to this app, so you want to create a new post and send a message
- You want to check out events that your favorite artists may be a part of
- You have a favorite song at the moment and want to pin it to your profile for others to see
User Testing Questions:
- Can you tell me what you think of the bottom nav icons?
- How did you find the experience of using the app to pin/unpin a song from a profile?
- Which of these approaches in regards to where the minimized playback bar lives? On every page or on the music related pages? Near the top nav or the bottom nav?
- What did you think of the layout of the content?
- What did you think about the events process and how much of the music aspect should overlap with the social?
User Testing
After the user test preparation was completed, it was time to interview some users. Tests were conducted in a virtual zoom setting, allowing the user to have control of their screen when using the prototype and discovering each flow on their own. The user test preparation questions were asked following the testing.
Test User Demographic: Early 20s, Graphic Design Students
TESTED FLOW 1: LOG IN/SIGN UP
USER FEEDBACK
- Found the flow straightforward and to the point
- Home screen needed some work as to where the playback bar would live
ITERATIONS
- Added in the playback bar to the home page
TESTED FLOW 2: ADD TO PLAYLIST
USER FEEDBACK
- Opacity and shape of modal not working very well
- Prototyping issues with clicking back
ITERATIONS
- Modal opacity edited and more rectangular shaped
- Fixed prototyping issues
TESTED FLOW 3: A) NEW POST, B) EVENTS, C) PINNING/UNPINNING SONGS FROM PROFILE
USER FEEDBACK
- A) New post flow should go all the way to see what actually posting a post would look like
- C) Too many clicks to pin a song to profile. Should be more accessible and at the forefront
ITERATIONS
- A) Extended whole flow of making a new post
- C) Added pin option to main playback page for easier access and functionality
Data Analysis
The demographics of each user I interviewed were pretty similar as in they were both design students around the ages of 21-24. However, these were users that are very familiar with music applications. Some of the main challenges users had for each flow were less about aesthetics are more about functionality. Flow A and D seemed to work fine for both, but flow K is where the main challenges lied. They felt flow K3 (pinning a song to profile/unpinning) was too long and needed to get to the point quicker. What surprised me in regards to user feedback during the interviews was their agreement in saying that the overall layout was good, but also the particularity in the shape of the modals.
Overall, I learned that user testing is very important in finding out what works and what doesn’t and that unique flows are a bit more difficult to do as there isn’t anything to completely base it on. I plan to improve the functionality of Flow K3, with a more user-friendly solution. I plan to fix how the music player works on the music-related pages and how it works on the social media pages. Also, a bit of the overall aesthetic making sure all things are readable and the modal stands out. These improvements will benefit the other flows of the app because everything is pretty much connected. The music player is on almost every page, therefore the option to pin a song would be too.
