THE CHALLENGE
Ava Women, a fertility tracker, has a basic calendaring and activity logging interface and wanted an interface that is more updated, tracks more variables, and is in line with other fertility trackers on the market.
APPROACH & KEY INSIGHTS
The client gave us a few design specs and we went ahead and carried out extensive competitive analyses, informal user interviews and iterated over usability studies which revealed that people liked tracking interfaces that:
-
Provided an uncluttered calendar interface that showed at a glance when is her expected period and ovulation time frame
-
Have new interaction design
-
Many logging variables
-
Easily navigable
THE SOLUTION
We designed the user flows, interaction design, and low and medium fidelity wireframes for the calendar interface and the logging interface. We also sketched an alternative calendar interface that allows users to see trends over time.
CONTEXT & CHALLENGES
There are many apps available that help women track their ovulation cycle, whether for the purpose of conceiving or for the purpose of birth control. Ava is the first that comes with a wearable tracker that takes biometric readings while she sleeps. Ava has found that while their customers like the wearable, they still use other apps to supplement their Ava wearable because the user wants to track more non-biometric variables than Ava allows the user to log.
Ava needed assistance thinking through and creating a calendar that are easy to understand, aesthetically pleasing and interactive. They also needed a logging system with interaction design recommendations.
Our client’s business objectives were to:
-
become the elegant, helpful, older-sister that users would turn to for ovulation advice
-
promote brand recognition
Design constraints specified by our client include:
-
ensure the look and feel is in line with a highly-educated elegant app design
-
we were dissuaded from performing primary research
DISCOVER
We performed an extensive competitive analysis on other ovulation trackers. We evaluated their calendaring systems for ease of use, aesthetics and content efficiency. We also analyzed what logging items each tracker recorded and evaluated how the most popular logging items were recorded.
While the client clearly stated that they didn’t believe research/interviews were useful, we disagreed and believed it useful to at a minimum perform informal interviews to determine what women wanted and expected to see in a fertility tracker.
Questions we were interested in include:
-
What information is perceived to be the most valuable to the person using a fertility tracker?
-
What calendaring format is the most clear to them?
-
What information do they require to view on the calendar layout?
-
Which logging items are the most important to the user?
-
What are the most popular ways of inputting the logging data for the important logging items?
COMPETITIVE ANALYSIS
We reviewed 8 fertility trackers to evaluate their user flows, calendaring layout and interaction, and their logging screens. and variables.
INFORMAL INTERVIEWS
While we were dissuaded from performing interviews, we felt it useful to gauge how women might use fertility trackers (and other trackers) and what primary features they expect to see on a fertility tracker app.
SYNTHESIS
From our competitive analysis and informal interviews, our findings included:
Calendar
-
Women cared most about when they are expected to be at peak fertility
-
Women cared secondarily about predicting their period
Logging
To determine what variables to log, we created a list of logging variables that appeared in at least half the fertility applications we reviewed and found there were 13. Finding that to be still too many variables, we further restricted the logging items to the top 70% and came up with the following list of items:
-
Basal Temperature
-
Intercourse
-
Medications
-
Notes
-
Ovulation Test
-
Period
-
Pregnancy Tests
-
Symptoms
We looked at these 8 items and analyzed how they are currently being logged in other apps and what new ways we could log these variables.
IDEATION & ITERATION
Sketches galore > selection > wireframe > usability testing > iterate
We brainstormed various layouts and each of us ideated 10 sketches of the calendar and logging page. Based on Ava’s branding guidelines that Ava is to be elegant and sophisticated, we each picked our top 1-2 sketches to present to the client. Ava picked which sketches they were most interested in pursuing and from there we began our low-fidelity wireframing and usability testing.
Our usability tests focused on aesthetics and clarity of the information being presented in the calendar. It also focused on clarity of the logging screen. Could users intuitively understand the calendar? Were users able to easily find items on the calendar and logging screen?
Learnings from the multiple rounds of usability tests include:
-
Users wanted to clearly see a graphical representation of their ovulation cycle. They wanted to see exactly when were their peak ovulation days (in addition to their general ovulation days).
-
Users wanted minimal icons on the calendar. They felt more than 3 icons tested their cognitive load.
-
Universal icons and standards work best. Users don’t want to have to needlessly memorize Ava-specific notations or icons.
IDEATION & SKETCHING
We each ideated 10 layouts with the key features and sketched how they might be displayed, then brought together each our top ideas to present to the client. From our sketches, the client chose the direction they were interested in pursuing and from there we began our rough wireframing and usability studies.
USABILITY TESTING & ITERATION
We tested and iterated a number of different designs. We looked for if the user could easily understand the calendar, the icons and graph within the calendars and we wanted to test if the user found the logging layout to be self-explanatory.
SOLUTION & DELIVERABLES
We made our final design decision based on the iterative usability testing. Some findings drove our design decisions.
Calendar
Some tests were performed on the calendar and based on usability tests we found that
-
It was challenging for users to remember more than three different icons; more icons means heavier cognitive load. While Ava wanted to use more icons, we suggested a simpler approach with no more than three icons, and each with near-universal meanings (teardrop for period, heart for sex, circle for ovulation)
-
What the users truly cared about in the calendar view is to see when is their projected menstrual days and when is their projected ovulation days. For their projected ovulation days, users wanted to see a differentiation between regular and peak ovulation days. The solution we proposed was a textured half-stripe across projected period days and projected ovulation days. On the two peak fertility days, the entire day is filled in with the texture. Texture was chosen over color due to design restrictions given to us by Ava.
Logging Screen
After trying a number of layouts, we came up with some features:
-
A top left/right scrolling calendar that displayed a week at a time. The day in the middle of the scroll is the day we can edit the data for.
-
With the input of Ava and users, we suggested an accordion card-layout that automatically opens the top two logging items (period & sex) and hides the rest (as requested by the client).
-
Users like icons and with an international audience, we agree that icons are internationally more user-friendly. Since Ava is marketing themselves as sophisticated, we decided on simple yet friendly line drawings.
-
Users like feedback and knowing if they have missed any of the eight of the logging items. Our solution was to fill in the logging icons and add a checkmark in the upper left corner of the card once data has been entered for the logging item.
-
Logging items are selected with a single tap and deselected with another tap. Depending on the option, multiple items may be selected (example: a lady’s mood may swing from happy to sad on the same day or may have cramping and headache symptoms on the same day). For logging items that can have only one option, we used a slider bar.
Our deliverables included
-
User Flows to show the different ways users can switch between the calendars and the logging screens
-
Mid-fidelity wireframes for
-
Three fertility calendars for the client to choose from
-
Activity logging screen
-
-
Sketch for
-
A trends calendar
-
-
Research Report with the results of our competitive analysis
-
Usability Testing Report that summarized our findings
LEARNINGS
Design
-
Users don’t like interfaces that are radically different from accepted standards. Good UX should be invisible and information-dense
Client communication
-
Set expectations on the first day. We are UX researchers and designers and research is a key driver of our designs.
-
Be thorough in determining what the client wants. Do they already have an image in their mind about what the product should look like? Even if they say they don’t they probably already have biases and preconceived notions that can be sussed out.
-
Prepare to state how important research is to the design process. Lack of research means a lack of insight into the core audience which leads to a poorer product-market fit.
-
Instituting feedback policies with the client. For example, not providing feedback for 72 hours, even after follow-up emails and then suddenly providing feedback six hours before the final presentation is not acceptable.