UX Case Study: How to Provide Education for Pregnant Women through Mobile Apps
SayangAnak is a mobile app primarily to educate young, first-time moms about how to survive the pregnancy period. The app provides essential information according to the mother’s pregnancy period. Starting from the information on how the baby’s situation during the pregnancy in this period, real-time a mother’s conditions, baby size & ideal weight gain, things to know that tell a mother what she should do and don’t, tell a mother when she should check her pregnancy to the doctor, tips and tricks during pregnancy, exercise suggestion and daily digestion recommendation to keep the baby healthy.
Challenge
Maternal mortality (MMR) is still high. Based on data from the Ministry of Health (Kemenkes), in 2015 305 mothers died per 100 thousand people. The maternal mortality rate is high, and many factors cause the situation. One such factor is the lack of knowledge about the risks of pregnancy caused by the low level of education.
SayangAnak wants to participate in government efforts to reduce MMR by providing education for pregnant women through the Android mobile application.
My role
UX Design is my responsibility in building SayangAnak. The main task of a UX Designer is to design app flow in accordance with business goals and also possible to be done by the dev team. This application was made during our time while studying at Binar Academy. There were some obstacles when designing the flow of the application, due to the team of developers who are still in the learning phase, then I had to be careful in determining the design of the application in order to not make it difficult for the developer team and finished within 4 weeks for MVP, but still fulfill the business goal of product owner (PO).
UI Design is also my responsibility. Starting from making wireframes, low fidelity, and high fidelity to the prototype.
User persona
The main users we are targeting are soon-to-be first-time mothers who are currently pregnant and familiar with Android smartphones. Based on our research, we conclude that they have limited information about their condition and don’t know what should they do, so this group of users needs more information about pregnancy because they don’t have pregnancy experiences before.
Development phase
To give a comfortable service to our users, we need to focus on the functionality and structure of our apps. So we get to know exactly what kind of services our users need.
# Flowchart
We use a flowchart to give an initial description of the app’s flow. After that, as the designer, I asked the product manager and the dev team for opinions about what we can do and can’t, do to achieve a win-win solution. Our dev team doesn’t have the trouble to develop applications in 4 weeks for MVP release and our product manager is happy because the app matches the business goal well.
# Low fidelity
We created a wireframe to assist us in designing our app layout so that we could get a bigger picture of what we were going to do next. Next, we design the wireframe. It’s a pivotal and important step because designers need to understand the interaction between the user and the application they make without any distraction from visuals, colors, etc. They need to neglect user interface design at first to focus more on interaction.
# High fidelity
On this project, I was in charge of creating a personalization. Our goal is to increase user engagement by putting us in user’s shoes, to get a perceptive view of what users need and want when they use our apps.
The technical development and business side were both involved in mockup creation. We needed to know the technical difficulties and development obstacles to predict product launch in time.
# Pageflow
Then my next task is to create a page flow, to facilitate the dev team (programmers and quality assurance engineers) in knowing the application flow thoroughly and clearly, ranging from a button that leads to another screen or just a popup, or simply showing toast up, and until how the flow of backlinks. Pageflow will be able to speed up the programmer in developing applications because they already know what will happen next. Then it is also very useful for QA to make testing stories.
# Prototype
This process is intended to make sure that our product is perceived correctly by our users and stakeholders so that we can gain feedback and make some improvements to our design as soon as possible.
I also used Protopie to design the user experience.
The prototype can be seen in the following link: http:bit.do/protosy
Final Design
Below are some pages from our final app design. For a Mother who is pregnant.
