mamaskin

Mobile app

MamaSkin is an all-in-one self-care app for expecting mothers, addressing skin-related issues during pregnancy using personalized routines and trusted, high-quality skincare products.

Timeline

4 months

My Key Contribution

Process

Analysis

Problem

Solution

Research

Ideate

User Interviews

User Persona

Initial Sketch

Design

Style Guide

Information Architecture

Lofi Wireframe

The Final Outcome

Final App Pages

Clickable Prototype

Problem Statment

Many women experience a number of skin problems, ranging from skin discoloration and stretch marks due to changes in hormone levels occur while pregnancy, which led to discomfort, itchy, and skin irritation.

While it can be tempting to try to deal with it using anything in the skincare section, it’s better to be aware of products safety and keep your skin from absorbing any ingredients that could be harmful to fetal development.

Target Audience

Make for pregnant women, moms, anyone with skin issues

Solution

To help pregnant women live at ease during pregnancy by providing a trustworthy, comforting, self-care application designed to address skin challenges during pregnancy.

It support you wherever you are in your pregnancy journey by analyzing your skin condition, and then linking you to helpful skincare, scanning skincare products for safety, and customizing your routine to keep your skin healthy.

Research

What are common skin conditions during pregnancy?

Some women don’t get any symptoms. Some get worse than other. It depend on the individual body condition.

Market Research

In my finding, I notice there are barely any app that help with skincare issues for pregnant women. Therefore, I gather information from online research, about pregnant women, and skincare app, and then tied the two ideas together.

Key Finding

For my research process, I conducted primary research with 1 on 1 interview to better get to know what our users need. I got to understand user on broader scale when it come to maintaining their skincare during Pregnancy.

The most important findings from the interviews are:

Infromation Architecture

The overall flow of the site from beginning to all the feature in the app.

App Stretch

To construct the app, I begin sketching out several direction to Translate information into visual interpretation, from layout text to graph diagram.

Low-Fidelity Wireframe

From sketch, I move to adobe XD, creating the main screen flow of the app. This is for first time user so there’s a get stared. I put how I want information to be as well as the overall look of UX.

User Testing on Low Fidelity

Some of the comments and questions from the user testing conversation.

Branding

I stared out coming up with a several name such as skin for mama, expecting, mom to be, myPregnancy. Finally, I landed on MamaSkin because it show the impression the meaning for this app which serve as a supporting skincare application for moms.

Aeonik Typeface

Typeface was chosen to show information in a clear and easy to read manner.

The color plate are to represent women. Adding in a skin color to boost the idea that it’s about skin. As well as giving some light blue for contrast.

Opening

First time user will learn about what MamaSkin application offer. A short description to give background on feature in the app.

Scan Skin

One of the main feature of MamaSkin app is the scanning function. Users’ can use scan their body part. It will automatically generate skin issue and identity redness, pigmented, dark spot, and wrinkles.

Skin Health

Track and analyze your healh indicators in each trimester by daily, weekly, or monthly. Thanks to the graphical presentation of data, each user can easily analyze changes in dynamics and determine weather the current skin health is within the average range.

Scan Skincare Product

After scanning a skincare product, it can give detail about the product such as safety, ingredient compatibility, and product attribute. It also show information rather if it’s safe for pregnant women. Give deeper detail on each ingredient for user to learn about.

Supporting Screens

These supporting screens are very imporant to giving user to learn what they can and can’t do during pregnancy such as facial treatment. Set ing up a routine will also help users to boost their skin condition and keep track of which product to use.

Final Thoughts

This project was an incredible learning experience for me as I delved into designing a mobile app from end-to-end. It was a tremendous opportunity to expand my design skills and gain an in-depth understanding of the principles of mobile design. As I navigated the iOS Human Interface guidelines, I was amazed at how much there is to know about designing apps that create more pleasurable and desirable experiences for users. During my research, I learned a great deal about the skincare challenges pregnant women face and how technology can be used to assist them. I am so grateful to have had advisors who have provided me with guidance and support as I learned through this journey. This project has enriched my understanding of app design and pregnancy skincare issues, and I am excited to integrate this knowledge into my future endeavors.

Special Thanks to My Advisors

Chang Kim
SJSU Graphic Design Lecturer
Anthony Viviano
Senior Interaction Designer/Design Lead at Bloomberg NY & Design Mentor at ADPList.org
Connie Hwang
SJSU Graphic Design Professor