The team at Cycle Technologies has spent the past 12 years hard at work with their data statisticians, creating an algorithm that predicts a person's percent chance of pregnancy. The algorithm empowers the user to know their exact fertility status on any given day, so that whether they are trying to get pregnant, or want to prevent pregnancy, they'll always know their fertility status.
The team at Cycle Technologies came to ISL with an exciting request: to bring their new algorithm to life in a physical product. After extensive research and concepting, our team recommended an iOS app as the first product to house their smart fertility tracking algorithm.
Dot is a simple but robust app; it allows a user to see what their chance of pregnancy is each day of the month, and all they have to do is input a period start date. Our team created the app from scratch, with a couple throwbacks to our client's previous application, and brand new code, predictions, UX, and interface design.
Our team decided to build an app because it would allow people around the world to plan and prevent pregnancies with a device already in their pockets, instead of having to purchase something new. The app would need to be flexible, to accommodate many languages, robust, to compete with other fertility apps, yet simple and easy to use for people of all educational backgrounds in many countries.
What sets Dot apart from other cycle-tracking apps is its simplicity and approachable nature. With this in mind, we wanted to develop a name and identity that encapsulated these core principles with effortless and subtle elegance.
We tried a wide range of diverse explorations before reaching a mark that met our goals. Clean, sans-serif type was ultimately chosen, the small dot in the “O”, a subtle reference to the cycle-tracking feature of the app, as well as an allusion to the app's namesake. We felt this minimal approach was a strong way to represent the app's purpose and functions.
Within the interface, we mixed approachable, easy-to-read interface type (Benton Sans) with a beautiful display font to create a more personal, luxurious feel (Playfair Display).
The app requires just one piece of information from the user to create fertility predictions: the user's period start date. With that data, the following month's predictions are calculated, as well as the user's next six predicted period start dates.
We wanted the app to be easy to use — almost foolproof — because of the steep consequences of interpreting predictions wrongly. As a result, all of the core features of the app can be accessed via the Today view, which is the main view. From that screen, the user can see their fertility status for the day as well as add a new period start date.
When building something so interactive and personal, testing frequently is essential to the user experience. We conducted three rounds of in-person user testing throughout the build, as well as focus groups and lots of informal consults with our internal team.
One area of the app that changed drastically as a result of user interviews was the informational screen that the user sees as they first open the app. We thought education around the method and how the algorithm works would be essential to use of the app, but in testing, our users didn't retain the information we were hoping for. So, instead, we went with a more general educational screener about the benefits of using Dot, which worked beautifully.
Our goal was to create a visual language that is friendly, yet sophisticated, and feels like a personal fertility confidant. Just because the app's algorithm is based in science doesn't mean it has to feel like a soul-less textbook!
The color of Today view changes based on the user's fertility status to tweak the mood of the app and guide the user in the right direction for their own family planning goals. When unprotected sex should be avoided, such as when the user is preventing pregnancy, but they are very fertile, the app will glow red with a danger symbol.
Building Dot wasn't easy, but it was a challenge to be savored. Our designers did a lot of research and exploration, which resulted in an array of very custom user interface elements that are not provided by Apple. We chose to start the build with more complex views, such as the calendar, and end with more straightforward features, like the FAQ.
Dot started off as a Objective-C application but Swift was introduced partway through the development process. We ended up with an 76-24 split between the two languages. Gradually introducing Swift into the app was a great way for the team to get familiar with Apple's new programming language.
The user interface heavily relied on animations so we made the decision to use POP, Facebook's animation framework. It did a great job providing animations that felt natural to the user and allowed the team to focus on core functionality.
Throughout the entirety of the build, development and design worked closely to make Dot as perfect as possible. There was no traditional handoff, rather the design team remained deeply involved in the process up to and post launch.
After a successful launch along with a few key press features across the digital space, Dot shot up the iTunes chart, practically overnight. In early September, Dot hit number 12 on the top charts in the Health & Fitness category with over 11,000 downloads. Furthermore, Dot ranked at the top of the trending searches during that time period, which made for a very happy client.