A Man’s Quest for Better Skin | Concept Mobile App

Bonny Ma
9 min readAug 23, 2020

We all want to look good, and to look good we have to take care of ourselves. Our group looked into problem spaces within self care, did a little topic mapping and discovered an opportunity within skincare, specifically for men.

Time Frame: 2 weeks
Total Size of Group: 4 members

Opportunity Statement: We will improve the experience of starting and maintaining a skincare routine for male-identifying individuals. The user struggles today because many different options on the market are geared towards women, with confusing lingo that makes them unsure if it’s the right product for them and their skin.

Our team chose to develop for a native iOS app as it will allow users to take advantage of different components of a phone, such as a camera. Additionally, a mobile app would be a convenient place to house information needed, whether it’s at the store looking for products, in the bathroom using those products, or when traveling when your skin is acting up. Building an iOS app gives us access to a broader user base and is faster to design due to more design resources. This also creates an ease of use across different platforms within the Apple ecosystem (ie. iPad).

We submitted a project proposal with our opportunity statement and platform selection, and once we were green-lit for development we sent out a screener survey.

Research

Screener Survey

We needed to find the right people to interview in order to get an understanding of what the target user needs. We wanted to know if people had a skincare routine, were they interested in skincare and their familiarity with skincare in general. The two requirements that had to be met in order for people to be interviewed were:

  1. Must be male
  2. Must be interested in learning about skincare

A total of 30 people completed the screener survey and we were able to schedule 10 interviews.

User Interviews

When interviewing men who are interested in learning about skincare, we focused our questions on understanding the how, why and what of their thoughts of skincare, past and current experiences with skincare, routines and overall habits.

Affinity Mapping

We analyzed our interview notes and identified some key statements in order to sort out common trends and insights.

Final affinity map with “I” statements

Some key takeaways are:

  • They want to learn about skincare but feel overwhelmed with how to start.
  • They need a simple 2-step routine that is quick and low maintenance.
  • They don’t want to spend more than $20 for a product, but are willing to pay more if a product has proven results.
  • They need to be motivated and reminded in order to maintain their skincare routine.

With these key points and “I” statements, we were able to create a persona.

Meet Jake

Jake is not your typical guy. He’s interested in learning about skincare but can’t quite navigate this journey by himself. He wants to look good and just wants to be told what to do and what to use. He is reached this point because his sources (the internet and his girlfriend) couldn’t give him the information that he needed to find products that worked for him or how to use them.

Persona

I mentioned his journey earlier, so what was it?

Journey Map
  1. Awareness: Jake becomes aware that his skin is breaking out and the products he has been using are no longer working for him.
  2. Discovery: Jake asks his family and friends for recommendations on what to do and use.
  3. Research: From there, he delves deeper into research about some information he heard from earlier.
  4. Commit: Jake ends up committing by purchasing one product to try out.
  5. Retain: He is unable to maintain his routine after he loses track of his product and just goes back to what he has been doing before.

How might we help improve the experience of starting and maintaining a skincare routine for Jake?

Feature Prioritization

With the problem in mind, our team thought of features that would go into the skincare app and prioritized them on the MoSCoW grid (Must, Should, Could, Won’t) to determine what we need to include in our designs.

Must:

  • Simple account sign up: Jake is already frustrated with how hard this journey has been. We have to keep everything as simple as possible for him.
  • Skin assessment quiz: We have to learn about Jake’s skin in order to offer him trusted recommendations.
  • Routine builder: This will simply outline the exact steps Jake needs to take for his skin.
  • Daily reminders: Jake needs to be reminded in order to maintain this routine.
  • Reward system: Jake is budget conscious and having a reward system available for him to earn points to redeem discounts on skincare products will entice Jake to continue coming back to the app.

Should:

  • Tiered pricing model: Jake is willing to spend more if a product is proven to work. Offering tiered pricing options gives him that choice.
  • Habit tracker: Jake needs to be held accountable to his routine.
  • Chat bot: Jake values 1:1 advice from professionals.
  • Product reviews: Jake trusts those who have similar skin or experiences as him.

Focusing mainly on the Must and Should features, we began our design studio.

Design

We designed 6 screens that Jake would have to interact with in order to complete the main functions that app would offer. Onboarding page, Skin Assessment Quiz, Home Page, Routine Builder, Products/Product Page, and Rewards Page.

Some ideas that came out of this design studio were:

  • Include a swipe animation on the account sign up page that takes Jake to the skin assessment quiz to delight.
  • Having cards on the homepage for the most important aspects of the app so Jake doesn’t have to search too hard for them.
  • Separating products out by price categories since Jake will only buy more expensive products if it was effective in solving his issues.

Collaborating this way was important to create the strongest idea for our product in order to create mid-fidelity wireframes for testing.

Testing

Once the mid-fidelity wireframes were built and prototyped, we constructed a usability test to see how practical our app was to users. The test consisted of 5 scenarios and tasks.

  1. Log the completion of a step in your morning routine.
  2. Add a budget product to your cart.
  3. Add the moisturize step to your night time routine.
  4. Edit the morning reminder time.
  5. Redeem a reward of your choosing.

Overall, 4 out of 4 users completed all tasks successfully. There were a few minor issues such as adjusting the size of buttons, placement of titles, and adding icons to make certain areas for noticeable for the user. Users also wished to see more information about the routine on the home page such as notification times and the products used. We also originally had “Tips of the Day” on the home page but users said these typically don’t present relevant or personalized information.

Design

As all users completed all tasks successfully in the mid-fidelity prototype, there weren’t any major changes that had to be done in the hi-fidelity wireframes.

Hi-fidelity wireframe (Right: Quiz Results Page, Left: Home Page)

Quiz Results Page

  1. Confetti was added as a moment of delight.
  2. The routine is shown right away so users can see the outcome of their skin results.
  3. Users are budget conscious we we added dollar signs to show the different price points. Also the “View Product” button was moved to its own line to show a more pronounced call to action.
  4. Rather than having skin information at the top, we moved it to the bottom as users felt the routine and products are more important information.

Home Page

  1. Warm and friendly greeting that changes based on the time of day.
  2. Reminder time added to the home page under My Routine to prevent toggling back and forth to the routine builder page.
  3. Checkmark box bigger and more distinct so it is quick and easy.
  4. “Tip for You” removed. Replaced with “My Products” to make it easily visible as to what products are in the user’s routine.
Hi-fidelity wireframe (Right: Routine Builder, Left: Rewards Page)

Routine Builder

  • The words “Morning” and “Evening” were added to make it more obvious and easy identify the sections. We also moved it to the center and made it green to bring more clarity.
  • Our original plan was to use product images next to the steps but it would be too small so we made it into icons instead. We also placed it on the left to reflect the natural line of sight.
  • Plus buttons were enlarged.
  • The edit button was made larger and green so that it stands out more as a call to action.

Rewards Page

In additional user research, we found that games were one of the most used apps on users’ phones and what keeps users coming back to an app are deals and discounts. Based on this, we introduced the point system in our app to provide deals and gamify the experience to provide an emotional and monetary reward.

  • The points circle was made thicker to draw more attention.
  • The rewards and points are enclosed in one box so the card can changed smoothly when the user interacts with it.
  • We created more hierarchy with the text showing the discount and reward in the cards.
  • A countdown timer was added to create a sense of urgency.
  • Information in Quests of the Day was re-arranged to emphasize the amount of points the user can get by completing a task.

Testing

With the hi-fidelity wireframes completed and prototyped, we tested it on users once again. The same scenarios and tasks from the mid-fidelity usability test were used again. We added one more task to test out the onboarding screens which led to the quiz results page — Find your routine.

5 out of 5 users completed each task successfully.

  • 2/5 users expected the routine on the results page to be clickable.
  • 2/5 users expected the “My Products” photos on the home page would bring them to the Products page to view more information.
  • 2/5 users expected to edit the morning/evening routine from the home page cards.
SkinQuest general screen lineup

Next Steps

To continue Jake’s quest, we have some next steps to further develop the SkinQuest app.

  1. We will further research and design the chat feature as well as add micro interactions. Our users seek 1:1 help from skincare professionals and the chat feature would allow them to do so.
  2. Introduce levels for the user to advance his skincare. If the user completes certain milestones in rewards, he can unlock a new step in his skincare routine.
  3. Determine the app shopping experience. Build out a physical locations map so the user can see places to buy in their location or partner with e-commerce sites such Amazon.

--

--