Feb 27, 2020
MUA MBAYU, Find Beauty Nearby You — a UX Case Study
Overview
Nowadays, the trend of makeup is growing rapidly because makeup is not only used for important event but becomes a daily needs. This makes people are interested in exploring deeper into the world of make up even make it be a business. But there is a problem, not everyone able to and want to do self-makeup moreover for important event. Fortunately, there is now a Make Up Artist service or commonly abbreviated as MUA that provides makeup services.
But did this solve the problem? Not Exactly
It’s not completely end. The main problem is “How can people find MUA based on their needs in effective ways ?”
Generally, people searching for MUA by social media, for example Instagram and usually using hashtag make it easier. Unfortunately, for some situations this is not effective and efficient ways because it takes a long time and then the information that we obtained can also be less specific in terms of budget information, location and portfolio of the MUA. Even though this information is the most priority for people who looking for MUA so that people can adjust with their needs. Caused lack of available information, people have to contact MUA by another media like phone number, Whatsapp, etc and this is make it more complicated order process.
Goal
The goals of this case study is users will be able easily to find MUA that suits based on their needs in terms of budget, location, and portfolio.
Our Proposal
By making MUA MBAYU application, we tried to solve this problems. MUA MBAYU will help user to find MUA and also they will get information clearly in terms of budget, location and portfolio. This information will help user to adjust with their needs.
Design Thinking
This case study is using Design Thinking such as :
- Empathise — Research User Needs
- Define — State Users Needs and Problems
- Ideate — Challenge Assumption an Create Ideas
- Prototype — Wireframing and Prototyping
- Test — Usability Test
Empathise — Research User Needs
Research was conducted to find out how the habits and user experience in finding and using existing MUA. For the research, we interviewed 8 women who had used makeup services. In this interview we want to know the needs and problems faced by users when finding MUA.
How do people find MUA currently
- From friends or relatives
Potential User Interview
We interviewed 8 women who had used makeup services. In this interview we want to know the needs and problems faced by users when finding MUA.
Define — State Users Needs and Problems
With those information and insights that we collected, we use the Affinity Diagram to help in gathering large amounts of data and organise them into group based on their relationship.
Affinity Diagram
Key Quotes directly from user:
- “Hard to find MUA around my location”
- “When finding MUA, I want the MUA has good portfolio”
- “The more portfolio the more experience”
- “I just have small budget for Makeup”
- “Communication with MUA is very difficult, even I just ask the price list”
Synthesis
The next step is to synthesis these findings through affinity diagram, a method to gain a complete picture of the research process.
After that, I also need to define user persona for representation of our ideal user.
User Persona
We make a user persona to give an illustration about our user. For this case study we use Andrina as our persona.
Ideate — Challenge Assumption an Create Ideas
We come up with application concept which can help users search for MUA according to their needs.
User Journey Map
Before jumping into the design, I create the user journey. User journey is a visual representation of the customer experience and a tool for designer to look at your application from the user ‘s point of view.
User Flow
By referring to the existing flow, it will be easier to create user flow for the application to be designed. The following is an overview of the user flow application:
Design Principle
After our research and user interviews, we have come up with a set of design principles to admit while designing.
1. Simple
This app is simple to use. The user don’t need to learn new flow so the user can focus to content.
2. Variety
The app has design that create visual interest to use the apps.
Prototype — Wireframing and Prototyping
As UX Research is our foundation of making prototype and design, we also believe that the UI is part of those design as the digital body language. Therefore, we choose the Laws of UX to support our UI design with these reasoning:
- Aesthetically pleasing design can make users more tolerant of minor usability issues.
- Aesthetically pleasing design creates a positive response in people’s brains and leads them to believe the design actually works better.
- Aesthetically pleasing design can mask usability problems and prevent issues from being discovered during usability testing.
One of the most used Gestalt Design Principle is Laws of Proximity, where the objects that are near each other seem to be grouped together.
Proximity principle helps designers to make content more comfortable to perceive by users. Place related objects close to each other to create a connection such as the design in some Cards which contain many information made into a group.
As rounded corners evoke warmth and trust, all designs have friendly impression by consistently using such ellipse style. It is also a derivative of the rounded logo. On the other hand, the design is friendly because there is no sharp edges at all. Not only giving a negative image for the user, a rectangle with sharp edges takes indeed a little bit more cognitive visible effort.
—
Homepage
Homepage is divided into two section that consist of two categorise Make Up Artist curated based on user habit.
- Popular MUA, list of cards consist of the most favourite MUA.
- Best for you, categorized based on user’s location and curated specialized for user by system.
Millers Laws “The average person can only keep 7 (plus or minus 2) items in their working memory” is implemented on the home page.
Information given in the homepage is limited under seven items, even in this case the items is limited only three items. This would easing the user for receiving information, they would remember what information was provided, and it would reduce confusion for the user.
—
Profile page
The profile page contains information about MUA, such as a brief overview and review of MUA.
Overview
The function of the page is to be used for the showcase of Make Up Artist portfolio and information like location, available date, and rating. This showcase will help the user to choose which Make Up Artist is the most suitable for their inquiry.
Review
Consist of comment and rating from user that already used the Make Up Artist service. The features will help both party, for Make Up Artist to gain more fame and for the user to get more insight of the Make Up Artist.
—
Budget
Budget is one of user requests when looking for MUA. So in this case study we add a budget filter to make users find MUA according to their budget easier.
—
Search Nearby
Beside the portfolio and budget, we also got a request from the user to find the nearest Make Up Artist. We placed “Search Nearby” button in the middle of the Bottom Navigation Bar. The placement purpose is to simplify user on accessing the “Search Nearby” without putting any filter or additional setting on searching their preferred location of Make Up Artist.
—
Booking and payment
As Tesler’s Law also known as The Law of Conservation of Complexity, states that “for any system there is a certain amount of complexity which cannot be reduced”.
Therefore all the data information need to be filled, so the process of booking could be done. At least to make it feel easier and faster, the design is made as simple as possible — using only one or two button.
Test — Usability Test
Usability testing shows you if something is usable. Beta testing shows you if people will actually use it — Rachel Decker, UX Researcher a HubSpot
Session dates: : 14 February 2020
Participants : 3 People (3 women who often use makeup artists )
Session duration : 15 Minutes
Method : Usability Testing
—
Study Goals
- Participants look for MUA from search Bar, MUA Popular, the best MUA for you and MUA nearby you
- After searching for the MUA, participants check “available date”, Select Service, Order, and Payment
Top Priority Issues:
Other findings:
After this usability testing, we know what needs to be iterated, perhaps by making the title clearer and also marking clickable objects. First iteration finished, then we will do another usability testing to ascertain whether the design is easy to use or not. The purpose of usability testing is to look for problems in the flow / main flow of a product. Finally until the main flow doesn’t have any significant problem whatsoever, then there is no need for usability testing furthermore.
Stacks
During the process of working on the MUA MBAYU project, we used several tools such as Adobe XD, Adobe Illustrator, Miro, Slack, Trello. Some of these tools are used to create wireframes, prototypes, system designs, logos, and others. In addition, it is also used for communication between members, the division of tasks of each member in the team, to organizing project work in collaboration and online so that all work is neater and organized.
MUA Mbayu: a group project by passionate students!
This application design was created by Ayu Permatasari, Michael Van Den Broek, Faris Rakha Adi, Ridwan Setiadi, Grace Naomi Damanik, Wira Santana, Muhammad Zaidur Iman Tarigan and I. The brief was given as an assignment for UX Design class at Purwadhika Startup School. As our first project, we did all the process together as a team.
I hope you learned something as well. If you enjoyed reading this article, please leave and any feedback on the comment section. Thank you.
