When applying for a UX design position, an online retail store challenged select applicants by designing a mobile app that helps live music goers track and document the artists and bands of the concerts or festivals they attend. Their requirements were to provide a detailed description of my solution, a low-fidelity overview of the proposed idea, and a high-fidelity deliverable of the solution.
Music festival and live music season is in full swing! Great times are had and many memories are made, but sometimes it’s hard to keep track of all the great music & acts you were able to experience. Some questions that typically arise for concert goers are “Have I seen this band before?” or “When was the last time I had the pleasure of this sweet music tickling my ears?”
The approach I took in order to get relevant data is that I employed several design thinking techniques to help me understand user issues, find creative solutions to these issues, and build and test a prototype for how these solutions would look in my app. For this challenge, I wanted to make sure that the assumption of tracking the concert goer’s experience is true by interviewing representative users.
My first interview consisted of questions that directly tackled the issues regarding my documenting past concerts attended by the participant. But as I probed further, the participant started to describe her entire concert going experience from how she hears about the event, the issues in buying tickets, and what she does before, during and after the concert. This made me realize that there are other pain points in the concert goer’s experience that is worth exploring. In order to capture these experiences, I had to revise my interview script.
The succeeding interviews were more structured and gave the participant the opportunity to really delve on their entire concert experience. I first interviewed two of my close friends who loved going to concerts and festivals on a regular basis. They in turn, referred me to their friends who also go to concerts consistently throughout the year.
In total, I’ve interviewed 7 representative users varying in different experience levels ranging from selective users who only go to specific concerts depending on the artist and “hard core” concert goers who never want to miss an opportunity to go to a concert or festival several times a month. Their ages ranged from 21 - 42 years old consisting of 3 ladies and 4 men. The interviews lasted around an hour in their places of work or a nearby coffee house. It was a definite win-win scenario - I had my precious data and they each had a $25 Starbucks gift card.
Early wireframes were then created and applied to the Create Your Own (CYO) prepaid plan user flow.
I then started to conceptualize the structure of each screen by creating low-fidelity wireframes in Balsamiq. I was constantly consulting with the team for early feedback especially with regards to any technical limitations in the design. It was also good to get the team involved in the early sprints so that there is a common understanding of what we are looking to build.
Right after an interview, I would write down each important information from my notes into a sticky note and would start to build a chronological structure of each participant’s experience.
Doing this exercise allowed me to get a clear picture of the concert goer’s current user experience. Most of the yellow stickies on the wall are direct quotes. These could either be the user describing their goals or pain points. Some of the yellow sticky notes describes more the user’s attributes rather than observations about specific tasks which I would use to later create my personas.
Because the experience map shows the user’s current experience and where their problems or pain points are, my next step was to highlight these pain points and prioritize which are the most important ones to fix.
With the help of a few colleagues and family friends, I assigned them sticky dots so that we can all dot vote directly on the experience map on what we think are the biggest issues.
Normally, this is done by the development team of an organization but since it was necessary for me to do this step with input from others, I simply just improvised. What’s important was that this a data-driven exercise with real issues from actual users. I now have concrete input that I’m basing my design on real problems.
By simply inverting the pain points derived from the experience map, I was able to create a list of goals that the app must address. Since there is a direct relationship between the pain points and the goals, I am confident that I’m staying true to the user data that was gathered.
It’s also interesting to note that the goals are a little bit different from the goal set by the design challenge. From the list of pain points and goals, I ended up looking for a solution which helps concert goers with their entire concert experience.
Often times I’ve been on projects that deliver solutions but then have no way of measuring how well the solution actually works. This is why even at this early stage it is important for me to give each goal some metrics for success.
For the design challenge, I concentrated more on metrics that focus on efficiency and satisfaction. I ran into a lot of gaps here because since we’re creating this app from scratch, the current measures are still unknown. Therefore, I couldn’t add actual quantifiable metrics to the goals and I also didn’t know by how much these metrics should improve by.
After selecting which direction the stakeholders wanted to pursue, we had many iterations on the chosen option. There was still a lot of debate on the right look and feel internally within the team so I reached out to research to conduct a desirability study. The goal was to understand how well the new visual designs conveyed the target brand attributes. The method we used was an online survey via Globe Collaborate among Prepaid users (n=408) in July 2016.
The results show that Design 1 is significantly preferred over Design 2, although preference among 18-25 years old is almost parity. 7 out of 8 nominated design descriptors were attributed to Design 1 with the exemption of “Simple” which was attributed to Design 2.
While the overall winner is Design 1, there seems to be a need to deep dive among the 18-25 years old demographic who are the core targets of Prepaid. Given that this age segment appeared to have no strong preference over the 2 designs, there is a need to know if they are looking for something more that was not delivered by either of the options presented.
Through the data gathered from the experience map, I was able to use the user attributes from the different interviewees to create believable users for the product I’m designing.
To create these personas, I looked at what attributes my users shared as well as what qualities differentiated some from others. From here I was able to create 3 personas with varying degrees of experience, goals and concerns. I categorized them into three basic groups: selective, avid and hard core concert goers. These form the basis of all my design decisions moving forward.
The next step of the process is to create scenarios that would take the best ideas from the ideation session and combine them into workable solutions. I start off with sticky notes so that it’s easy to add or rearrange scenarios based on the pain points I’m trying to address. Many of the ideas that I’ve come up with are not viable solutions because it cannot be built for whatever reason.
The next step I took was to create paper prototypes of the user interface my scenarios describe. Once I’ve created the necessary screens, I got in touch with the people I initially interviewed and have them go through the screens to make sure that what they’ve envisioned at the beginning of the process is what I’ve delivered in my design.
In my experience, working with paper prototypes is great because I get more and better feedback from the users compared to a digital prototype. The data gathered from this round of usability testing is what I’ll use to create the high-fidelity mockup designs.
The final app I created is called Grüpie.
Grüpie allows you to discover when and where your favorite artists are going to play, buy tickets with your friends, and archive your entire concert experience.
There’s so much more to discover with the new Grüpie app — it’s live music made better.
With the data from the desirability study, we were able to tweak the design and came up with a revised layout.
The revised layout was well received by the team and stakeholders. I then created an interactive prototype so that the interaction design can be clearly communicated to the developers.
This has been a very exciting experience and quite a challenging one because I’m used to collaborating with a team on UX projects. I was able to use my past experience by following design thinking techniques to meet the user’s true needs. There are still a few gaps in my design but with additional user testing I believe I was on my way in creating a product that users will truly love.
I was really happy with the way the app turned out especially with the short development time of 10 weeks. My only main regret is that we didn’t do any usability testing during the early sprints to validate our design decisions.
After launch some users said that there were too many clicks to get to the content they needed. This feedback would’ve helped me greatly as I could’ve designed the home screen with this in mind. The app didn’t last too long though since shortly after SLS did a rebrand to the Sahara Las Vegas and our app was then discontinued. But it was a great experience and I had a lot of fun working with the team.
The next iterations based on the usability test results really help the team refine the design. For most of the screens we needed to make it clear for the user where to find key elements that would help them complete their task. That meant we had to design for better affordances and remove clutter. This was most important for the home screen.
Testing out different color and animation options for the home screen.
After providing different color options and interaction concepts to the stakeholders, they chose the UI concept that matches Globe primary blue hues with pink as the contrasting color. Gradients were also preferred vs solid colors that resonated more with their 18-25 core demographic. For design elements, we used circles and spheres to mimic Globe’s current brand guidelines.
This project really championed user-centered design. It was amazing to have users constantly consulted throughout the build cycle. I know not all projects I will work on will have the budget to involve users early and often but the final product really shines with an app the prepaid users truly love.
