Wynk’s Music mobile app is used by a wide range of users. Due to this large number, their users range from people who live for curated playlists  as well as people who hesitate from adding and listening to new songs that they might like. After seeing the research insights from the UX Researchers and data from the PMs, we realized that the current information architecture does not cater to the personal needs of the users. Instead of mirroring needs of users, it presents a cognitive overload and does not prioritize personalized content.

How Might We create an IA that mirrors the needs of users to create a memorable experience?

To solve this problem, I partnered with the design team and the product managers to draw insights from user data that were given by the product managers. I realized two key points:
1. Personalized categories such as recommended songs, top charts, and recently played have the highest amount of clicks an views.
2.  Even though users have to scroll a lot to reach ‘top searched category, ’ the CTR for it is three times higher than that of the categories directly above and below it.

I collaborated with the team to breakdown the probelm area and brainstorm our known challenges.

Brainstorming, helped me see that the home page could be improved. I decided to rethink the primary navigation. In order to reframe the IA, I conducted a hybrid card sorting test.

I conducted a hybrid card sort with 6 participants and 15 representative pages.   I had one user that fit each target persona. Participants were told to group the cards into the given categories and were also allowed to create their own groups if needed.

KEY INSIGHTS:
‍ 1. All  participants placed your activities and recommended categories above explore music.
2. 2 Participants questioned about where they could find recent searches.
3. 5 participants were confused by Recommended Tags category.
4. Recently played, songs based on user’s recent listening was placed at the top by the majority.

I designed two sitemaps, one of the existing app structure and the other that reflects changes based on the user insights gathered above.  Both sitemaps represent primary levels of navigation.

After creating several iterations and using the research insights above, I redesigned three aspects: Interaction Design, Brand Identity, and Implementing the new information architecture visually.

SPEED DATING NEW MUSIC:
Speed dating new music helps users who are hesitant about listening to a whole new playlist. Here, users can view a recommended song for the first 20 seconds and decide whether they like it or not. If they don’t like it they can click the subtract button and move to the next song. If they like it they can click the add button and add the song to their playlist. This solves the problem of users not knowing what’s inside a playlist and also helps us suggest recommended music while constantly knowking the user’s preferences. This would help mirror the needs of the user and adapt to the user’s constantly changing  music taste.  

BRAND IDENTITY:
Wynk Music’s album artwork doesn’t have a consistent visual language. As you can see below,  It was presented in shapes ranging from circles and rounded squares to bigger rectangles and there was no consistent typography. The album covers didn’t feel like it was a part of the UI and didn’t convey much about the mood they were setting.

To solve this, I kept in mind, the visual language used throughout the existing app, and ensured that the album covers felt like it was a part of the UI and conveyed the mood they were setting.

MOOD AND TOP ARTISTS:
Here, I stuck with Wynk Music’s gradient and color palette to help harmonize with the UI. I also used SF Pro for IOS to list the type of mood and the name of the artist to keep everything consistent. The images used and the white wave motif on top  describe the mood that is set by the playlist.

CURATED PLAYLISTS:
Next, for curated playlist, I decided to show the vibe created by the playlist through images, and the test fading into the gradient but sitll visible. I wanted to keep this consistent with the mood and top artist playlists. I decided to feature the artists present in the playlists, with a circle at the bottom so users know what they are going into.

POPULAR RIGHT NOW:
Lastly, for everything that’s trending, I used a simple geometric pattern that can be recreated in different forms automatically.

HOME PAGE PRIMARY NAVIGATION – RETURNING USER:
The main complaint from users was that the home page focussed a lot on what’s trending and that they could not find music recently listened to or that was personalized for them.  Also, the data we received showed that the highest number of clicks received were for personalized categories such as  ‘recently played’ and ‘recommended songs.’

Hence, I decided to begin the home page redesign with ‘speed dating new music’ to helps users find music they love.  In the card sorting test, majority of the users placed ‘recently played’ as the top card , so I decided to follow ‘speed dating new music’ with ‘recently played’  .

After you scroll below, you’ll find playlists based on your mood. Using the day, time, and your location, the app will recommend playlists based on your mood. For example: If you entered a cafe to work, Wynk Music will recommend work playlists.

Scrolling below, you’ll see ‘Made For You’ playlists. These are curated playlists that mirror what the users have listened to in the past and what genres they like. After ‘recently played,’ ‘recommended songs’ was the second most clicked category. Hence, I decided to place it as the second rail.

Below that, users can find ‘Artists You Love’ category. Since most of the feedback received was that users struggled to find music that was personalized for them, I decided to replace ‘Top Charts’ with ‘‘Artists You Love.’

Scrolling below, you’ll find a ‘Popular Right Now’ category. Since Wynk’s users listen to music they love over what’s trending, I decided to prioritize personalized content over trending music. Instead of having four rails for what’s popular right at the beginning, I added a ‘Popular Right Now’ category towards the end.

Lastly, users can explore more by selecting what genre they like by tapping the add icon. This will
give them access to playlists in their favorite genre.

HOME PAGE PRIMARY NAVIGATION – NEW USER:
The current IA does not adapt to the needs of a new user. Instead, it has a plethora of categories that leads to a congitive overload.  In the redesign, I changed that. Here, I  replaced music  the ‘recently played’ category,  with the ‘explore’ category. Through this, we can recommend music based on the user’s favorite genre. Next, there’s ‘Wynk’s Top Artists’ instead of ‘Artists You Love’ and ‘Popular Right Now.’ Since the user is new, these categories will help users easily find music they love and help us  mirror their needs faster. This order will eventually scale to the returning user IA as we get to know the new user better.

SEARCH
The search page had three main pain points:
‍
1. Users were unable to find what they had recently searched for. Instead they were shown what’s most searched for by other users they don’t know. To solve this, I replaced ‘Top Searches’ with ‘Recent Searches.’
‍
2. Secondly, users were confused by,‘Trending Songs.’ Users who are searching for something are looking for something specific and were not interested in what’s trending.  Hence, I replaced ‘Trending songs’ with ‘More from Wynk Music.’
‍
3. Lastly, there was no way for users to search for things in their existing library. Hence, in the redesign, I decided to add an ‘In Your Library’ section. Here, if the user has searched for something that’s in their library, they’ll be able to see it here.

MY LIBRARY
In ‘My Library,’ the main feedback we received was that users who had a lot of playlists had to scroll a lot to reach artist they follow. I solved this by removing by giving users acccess to all three – playlists, artists, and albums right at the top. Users can easily switch between these three categories without having to scroll down and hunt.

There was also no way of filtering their library based on recently added. In the redesign, I decided to add a filter option through. Here, I clubbed recently played, downloaded and recently added. I did this by removing the notifications icon on the top left which was not of use here and replacing it with a filters icon.  Since users didn’t come to visit their library to see the plan they purchased, and had access to notifications on the My Accounts page, replacing it with the filters feature would only be of benefit.

Working with a team taught me to consider the business aspect which made this experience more realistic as opposed to a no consequence and constraints class project.

1. Make sure user tests can be generalized to a large population: understanding different types of users we were designing for is key. While evaluating our designs, striving for a varied sample population helped generalize our designs to a representative population.

2. Research and insights to the rescue! researching in detail helped not only help fasten the design process but also helped resolve challenges and team conflicts as we always had insights to go back to.
‍