The prepaid market has been one of the toughest retail battlegrounds in the Philippines. For several years, stiff competition from the two biggest carriers has brought the price of products and services down to make it affordable and accessible to the masses.
I was the creative director and ux designer for the project. My main goal was to try to solve was to revamp the GoSakto app's design to make it easier for customers to quickly create their customized prepaid plan and start enjoying its benefits - whether it's talking, texting, surfing on the net or using their favorite mobile app.
Early user research gave us a little insight of some of the behavioral observations and opportunities of improvement for prepaid users:
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.
With the basic user flow and wireframes approved, the next step was to help my team finalize the overall look-and-feel of the app. We had several design meetings with the stakeholders to fleshed out their goals. Some of the challenges identified were:
We presented the client several mood boards to help us make aesthetic and goal-related choices that would influence our design.
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.
The next step was to conduct a usability test. We wanted to make sure that users are able to complete key tasks based on these new screens to make confirm we’re delivering an effective product design. We mapped out various task scenarios seen below:
The results of that study showed that we still had quite a few issues we needed to fix with the visual design.
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.
