Role
Ux / Ui designer
Tools
Invision; Adobe Illustrator; Adobe Photoshop; Miro; Adobe premiere; Figma; Microsoft office;
Teammates
Silvia Silva
Year / Duration
2018 / 1,5 month
Context
The briefing was to create an app music. In response we started to analyze and research in order to understand what is the real problem for the users in different apps from this kind. If we have so many music apps on the market, why don't they respond to user needs? In a world with so many music platforms, one of the most common problems is not to be able of listening to music while we access its content.
Challenge
Create a great platform with quality artists information. In this platform we could listen to music, find and buy tickets to the shows, discover facts about the artists and give the user the possibility to find new artists, music and their stories.
Strategy
The strategy to understand the problem was starting with the research - Analysis - Design. In each step we had to understand what was important to user and how could we achieve it. In the research part we started with the user observation making some interviews and direct and indirect benchmark. On the other hand, for the analysis, based on the first part, we created cenarios, personas and started to organize architecture of the information. Finally, the last part of the design, started with the creation of workflows, wireframes and prototypes of low and high fidelity, both are tested. This process was iterative based on user feedback.
Research
To explore the user needs, in the first part 10 guerrilla interviews took place in natural ambience. This way we could understand the relation of the users and the music apps who were most relevant, based on their favorite, best features, pain points. At this first phase the questions were related to content. In the second phase we made 6 interviews with a new guide whose point was to understand how they find and what type of information they want to find.
The results of the first part of interviews:
- Music apps used for the users: Spotify, Youtube e Soundcloud.
(Google was used to, but only to search content);
- 3 app’s used at the same time for different reasons: Spotify offers a large variety of music; Soundcloud gives exclusive content and Youtube is easy to access and immediately find content.
- The importance of seeing exclusive and specific content.
- The way of user search: first search for the music and then go for the artist and consequently the new music.
The results of the second part of interviews:
- Guarantee access to a variety of music.
- Complete information (curiosities, music year/album, band, artist)
- Discover new music through recommendations and related list (different search)
- Loop of recommendation list or playlist (today the apps have this but are boring and without interest)
- To access complementary information the user needs to use different apps.
- Visual confusion / Content mix push users away.
Persona
Nick is a city boy who shares a house with two friends. As an IOS developer he spends much of his time at the desktop, so in order to feel more concentrated he listens to music.
The music is part of his days. When it’s possible he goes to concerts, we can tell this is one of his hobbies. For that reason he searches about new artists and music. Can we tell this is important? Yes, it is. He read music blogs, magazines and random websites. To be surprised is one of his goals.
User stories
As a music lover
I want receive suggestions of new artists
To discover new musics
As an enthusiastic
I want discover new music facts
To increase my musical spectrum
Benchmark
We decided to do investigation based on direct and indirect competition, and some inspirational app.
This information can be seen here: https://projects.invisionapp.com/boards/ZF3QT2TBDAR/
Features definition
Our key feature will be the S’witch. This feature is dynamic, funny and intuitive. The user could discover new content when “tilt” the mobile. Our main point was to guarantee that the user wasn't stuck on the related music loop. Random facts was the chosen feature to give the user new content and music.
- Music - With the Player, the user can select the music and play;
- Discover new musics - Identify the music through microphone;
- App customization (create playlists, likes, share, save music) only in this option the user needs to log in;
- Feed and facts - the user see the information and history facts belong to the past, present and future;
- Concerts and events - the user can find the next concerts, and buy the ticket if he wants to.
Wireframes
To create a connection between the content map and the visual design we started with the paper wireframes.
For that we defined a flow to understand the user difficulties, and how can change that before turn it to digital.
After that, we used all the information collected by the users and passed to digital. The “shake” feature was important to test for understanding the user reaction.
However, the other features could be tested as the different flows.
The reaction of the users was good giving us the confidence to turn the information into digital.
App flow
For the first time the user will see the onboarding process, then he has free access to the features until the customization content. This feature only works with Sign up.
User Journey
How is a regular day for Nick? How could this app be the best option for him?
Friday 12, Nick goes out with friends. For that he needs to catch the bus to the city center. He remains 10 min waiting for the bus, so Nick decides to install the S’witch app. In all the ride he discovered the app features. When he arrives, shows the new app to his friends.
Visual Design
In this part of the process we made some A/B test to guarantee the best option for MVP. The hot color and the contrast with the dark background was felt by users to be the best option due to the ease of reading and willingness to explore.
The Icon
Visual Board
The main feature
