Snap Back IOS App — A UX Case Study
Background
Snap Back: a colloquialism referencing a woman’s ability to quickly return to her pre-pregnancy body. (Not to be confused with the baseball cap that snaps in the back)
Project Scope
The “Snap Back” app was created as part of a two week Design Sprint while I attended Ironhack MIA’s UX/UI Design bootcamp. I was tasked with designing a wellness mobile health tool for the National Wellness Institute.
NWI is an organization whose goal is to promote wellness and the adoption of healthy lifestyle habits through its array of resources that it offers.
Established in 1977, aside from its outdated online presence, it has failed to keep up with the times and the growing mobile health tool market (estimated to be a 200 billion dollar market).
Goals
NWI needed an online tool with:
- an updated image
- ability for users to set and track goals
- a feature to share progress with their NWI coach
- PLUS: education
Metrics
Success of the Snap Back would be measured through:
- User Retention (NWI is currently suffering from a drop in membership)
- User Adoption (attract new users with their updated image)
- User Referral (hey friend, check this out!)
Research
For this project we could’ve chosen any facet of wellness. I honestly chose pregnancy because I knew no one else in my class was going to address it, plus, the topic of “babies” seems to dominate the narrative amongst my peers these days (hello thirties).
Competitor Analysis
I began this project by researching and comparing the current pregnancy apps that are on the market. I googled and searched in the app store for the most popular pregnancy apps. I compared the features, reviews, and read user comments looking for pain points. Amongst the top rated, I noticed that they all focused on the baby. They all had the “cute” fruit comparisons: “Today, your baby is the size of a kumquat” (what is that?), had videos and articles, and trackers for things like symptoms, weight, and cravings. Some apps had fertility and ovulation trackers, as well as features for after the baby is born like weight and height trackers from doctor’s visits. All the apps provided quick updates like, “At 6 weeks, you may feel queasy as your body adjusts to the rise of hormones present” or “It is totally normal to experience the baby blues, make sure to keep your support system in the loop.”
Although these apps did a great job at what they set out to do: educate women on the joys of pregnancy; they failed at being honest about the perils of pregnancy. Even when discussing morning (or all day) sickness or Postpartum Depression, it was glossed over, as the focus was the baby. Even the Ovia app, which provided features to support women with alternative paths to pregnancy, overwhelmed their users with the abundance of tools they offered. Women in the app store stated that there were so many features, they didn’t even know where to find them.
Based on what I learned from our competitor’s, I decided to design a tool that focused on the woman. On her experience before, during, and after pregnancy. Since many of the apps tools weren’t meant to be used long after the baby was born, here was an opportunity where NWI could retain their users long term.
Quantitative Data
I surveyed 176 women who were currently pregnant or gave birth within the past 5 years. Why did I choose this screener? I wanted to get women who were up on the newest pregnancy trends currently out in the market. Just like technology, medicine advances rapidly and things change from one year to the next. I have a 9 and 5 year old, and during both my pregnancies, “snap back” still referred to the cap with the snaps, however, as I came to see through my research, issues dealing with weight were a trending topic amongst women planning on having children as well as those women already in the thick of it.
Some interesting takeaways from the survey data was that 89% of the 176 respondents used pregnancy apps, while less than half of the women surveyed had ever used a fitness and diet app. Even more interesting was the fact that although these women did not use fitness and diet apps, almost half said their biggest concern during pregnancy was their weight gain.
Initially, I had planned to design an app supporting women’s emotional health during pregnancy, specifically when dealing or requesting support from their partner. I assumed (based on my own experiences), that the data would help support my assumptions. But I was wrong, women said they were in good spirits and received great support from their partner. (You know what they say about assuming..)
Another fact gathered from the survey and interviewees was that 34% of the women had dealt with health issues such as preeclampsia, high glucose, anemia, and dehydration. All of which could have been controlled or prevented through healthy lifestyle habits. Slowly, what would become , “Snap Back”, began to evolve.
Qualitative Research
Seven women were interviewed that were at different stages in their pregnancy journey: trying to get pregnant, currently pregnant, recently had given birth.
Some of the Interview Questions
- What methods are you using/going to use to get pregnant?
- Tell me about your overall experience?
- Any health concerns?
- What are/were your wellness goals for yourself before/during/after pregnancy?
- Will/did you use pregnancy apps? Why or why not?
- Tell me about any wellness apps you may have used or currently use?
- How do you communicate with your health care providers? How often?
- During your appointments, what sort of advice did/does your doctor give you regarding your wellness?
- What is one thing you fear about pregnancy?
- What are your expectations about your partner’s role when you become pregnant?
It was important to gain insights from women at the different stages, because a successful tool would be for long term use, and would incorporate features they would be able to use well after their goal (the baby) was achieved.
Key Insights
I gathered and organized all the insights into categories like symptoms, app use, concerns, and experience. Once I recognized patterns within these categories, I color coded them to see what stuck out, and definitely saw the women kept referring back to their weight and diet concerns during our conversations.
Define
So now what? I knew that women were definitely afraid of gaining too much weight, and some had even felt the repercussions of not adopting healthy habits. But how could NWI help support these concerns through a mobile health tool? And how could this support be carried out through all stages of pregnancy and well after?
In order to answer these questions, I began by developing our target persona, Focused Faye. By getting to know Faye, and her motivations and frustrations, we could identify opportunities to help her in a meaningful way.
Focused Faye was a young professional who has tried to do everything in her life “by the books”. She dedicated her twenties to becoming a lawyer, and recently married her long time boyfriend. She has the husband and career, and feels the social pressures of having a baby. She’s been trying for months, and is becoming frustrated that this process isn’t going according to plan.
To further understand Faye, I made an Empathy Map, to really dig deep and “get in her head”. The quotes came directly from insights taken from the interviews.
The empathy map helped me put into perspective that the users could be using the app for months or even years before getting pregnant. The process of getting pregnant may or may not be easy, and in a case like Faye’s, the women may be dealing with strong or negative feelings due to their difficulties. How can I help Faye and other women deal with these difficulties and feelings?
I mapped out Faye’s experiences throughout her pregnancy journey. The experiences described in the journey map was a compilation of the 7 women who I spoke to and what they described as successes and pain points.
To dig even deeper, I created a hyper-focused map to help visualize opportunities where the solution can alleviate frustrations for Faye during a day in her life.
In a day, Faye is being bombarded by intrusive peers, pressured to lose weight, and experiencing an overall feeling unwell-ness (is that even a word?).
How might we develop an app that sets realistic goals? How can we help Faye stick to her weight goals without turning to drastic measures like watermelon fasts? How can we support Faye’s journey and let her know that she is not alone and this is common? And how can I keep myself from being tempted to turn this MVP (minimum viable product) into a maximum velocity product where all systems are go and it fails because the users feel overwhelmed and bombarded?
Ideate
Once I knew the problem that was being solved and who I was solving it for, it was time to ideate. I ended up with a lot of could haves, features that would be amazing in future versions but could be left out in the meantime.
Once I was able to prioritize, I found the happy medium between what NWI needed in their app (goals, tracking, coach contact, and updated image) with what the user needs (simple and realistic weight/diet management tool).
The MVP started to take shape. I first sat down and decided on a “happy path”, or the flow that would take users through the main functionality. This path would be through the chosen path for Focused Faye, or the women in the process of getting pregnant.
Through concept sketches, I was able to brainstorm different layouts, and after a couple of rounds, chose features from each set of sketches. These pieces would then come together and become the
Low Fidelity Prototype:
Streak counter to make the woman feel successful
Simple & Easy food, water intake, and fitness tracker to encourage the adoption of healthier habits (decided to take the focus of of weight loss in order to make sure the women were incorporating the habits that would prepare her body for pregnancy)
Daily Journal to jot down the highs and lows of the process
Ability to share stats with NWI coach
And links to resources
Low-Fi
I used the Marvel App to test the first version of the prototype. I learned from users that they were overall confused with the flow, especially when they got to the screen where they are asked to enter information. 3 out of the 5 users tests stated that it needed to be more visual. The usability of the app was not intuitive, users only described it as ‘easy’ once I gave them explanations and basically pointed to where they needed to tap. I would get the, “OOOOH, that makes sense now, this is great”. However, the goal was for it to be so simple that you didn’t even need to think about what you needed to do.
I realized once the first round of testing was done that I needed to backtrack and complete some steps that I overlooked. For the sake of time, I did not conduct Card Sorting nor did I complete a Site Map. But I learned that these two activities would help me hash out the confusions my users were having with the flow.
Through card sorting, I learned about my users mental model and where they would expect to see certain buttons and labels placed, as well as their expectations on how a task should flow. I took this information and ideated some more and revised the screens and the user flow.
Mid-Fi
I applied the revisions to the mid-fi version, making sure to provide labels and more visuals. I used Invision to user test, and retested with some of the same users that had tested the low-fi version. The responses were positive, some users said the pages were “self explanatory”, and that the icons definitely helped on the tracking page. The pages highlighted in yellow were repetitive and users asked if they could be condensed, which made total sense. The homepage with the various access points to resources was condensed to a link that would educate the woman on how her healthy habits were beneficial to pregnancy. I was still grappling with how minimal the MVP had to be, but did not want to take out the education feature from the app.
Hi-Fi
Since this is not your average pregnancy app, I didn’t want to go the conventional route: pink vs. blue, bright kiddie colors, and definitely no fruit references. I felt at the core of what our target user wanted was to maintain her sexy, to “snap back” as one of the users stated, and to hold on to who they are and be flippin’ fabulous! So for the moodboard, that’s the vibe I aimed to invoke: sexy, powerful, fabulous as well as a sense of calm and hope.
Many rounds of desirability testing were conducted. Truth moment: This was my second project while at Ironhack, and although the UX business and research aspect came quite natural to me, the UI part was my biggest challenge. I wanted to push myself out of my comfort zone with this project and really play with colors.
The end result was very dark, and gave me the vibe of a meditation app. However, I was getting positive feedback and the women tested were feeling the deep colors. That or it was the same women being tested and by this point they either were immune and it all looked good to them or they just said it looked good to get me off their backs, lol. Either way, I was not completely satisfied with the UI but kept trucking on.
Out of the 10 users that were tested for V3 of the hi-fi, only one user brought up some key points.
I wondered, do I just ignore what this user said, as she only represented 10% of the results, or do I quickly ideate and retest.
I decided that the feedback that the user gave me was too important to just ignore. So I decided to research some different ways to input and track data, and changed the “Today’s Progress” screen to a vertical scroll screen featuring cards for each set of data entry. I recycled the original screen and utilized it for the “Weekly Stats” screen.
I used Flinto to add some micro-interactions. It was my first time using it, but it was worth the struggle, because the subtle animations really made the app come to life.
When I tested what I thought would be the final prototype, one of my friends brought up another good point,
“Where is that dope picture of the sexy pregnant girl that was on your moodboard?”
Seriously… where was she? That sexy, empowered woman was the inspiration for the whole mood of the app. She was the center of the moodboard and caught everyone’s attention. She was bright and vibrant, but yet she didn’t make the final cut.
For my next steps, I decided to do some more research on current trends in UI, to help me develop a style and figure out what I liked and disliked. All I knew was that currently, the app looked way too dark and I was not feeling it. I was drawn to designs that used a lot of white space with pops of color, and decided to explore this further with the redesign.
Before & Afters
One of the major revisions was the journal feature, which was given its own page. This app is to encourage the adoption of healthier habits, including emotional health, and the journal as a pop made it seem like a less important task while it should be as important as tracking food intake.
Conclusion
The Snap Back IOS App meets the must haves required by NWI while providing their users with tools to support their personal goals.
I learned a lot through the process of designing Snap Back. It definitely solidified the idea of trusting the process as well as failing fast and early to give time to revise and retest. Even after the UI redesign, I still want to test and revamp, especially some of the buttons that aren’t as obvious to the user. This project definitely helped me become comfortable with tools such as Sketch and Flinto, and inspired me to go back to my previous projects and revamp them as well.
Thank you for your time!!! Let’s connect on LinkedIn and check out my portfolio at www.brendamatos.co . I welcome feedback and opportunities to collaborate!
