The amount of necessary information for expectant parents can be overwhelming, confusing and often overly clinical. The goal of this project was to communicate necessary information in a way that would minimize the stress and anxiety that comes with such a life-changing experience. With an easy-to-use website and a custom mobile application, BORN Ontario's goal was to help women feel at ease, supported and well-informed every step of the way.

Challenge
You might assume that creating a website and mobile application for such a niche audience would be easy, but every woman’s journey is different. There are surrogates, women planning to give their children to adoptive parents, women experiencing an unplanned pregnancy and couples who have been planning to have children for years. OMama was designed to offer support and guidance to all of these groups. 

Process
The process involved four key parts:

1. Planning: Stakeholder interviews, research, site-mapping
2. Creative: Consultations, wireframing (creating a schematic representing the skeletal framework of the website and app), concept designs, final designs
3. Development (website and app): Front-end, CSS, coding, quality control, beta testing
4. GoLive: Domain registration, app store submission, ongoing support

Planning

OMama began as a two-year maternity care pilot project with support from eHealth Ontario and funding from the Government of Ontario. The project involved extensive stakeholder consultations and several focus groups and site-mapping sessions to flesh out both the creative design and navigation.

Stakeholder consultations consisted of focus groups, sitemap sessions (one for the website and one for the app), and an online survey of over 1,100 women and maternity care providers in Ontario (potential users of the app). The client had a working committee of about 10 people but they also had a larger advisory group that consisted of nurses, clinicians, physicians, government representatives and experts in obstetrics, family medicine, midwifery, nursing, e-health, technology, health promotion, social work and health policy. The knowledge acquired from these sources helped shape the topics featured on the OMama website and mobile app.

Key points covered at this stage of the project included the preferences of the end users, the type of information they were looking for, how they wanted the information organized and the main reasons why they would use the app over other competing products. From the sessions it was determined that the women were looking for credible, safe, “certified” information. 

Another key point was that the women were looking for health information that was relevant to Ontario mothers. Most of the competing apps are either American, referencing US health organizations and health plans, or do not provide province-specific information. 

Finally, most other apps rely on ads or other revenue generating activities which members of the target user group found annoying. The OMama website and app is publicly funded and therefore does not employ these revenue generating techniques.

Creative

The main consideration for the app and the website was the 'Pregnancy Pathway' which is geared to the stages of pregnancy from pre-pregnancy to post-pregnancy. There are seven segments of the pathway, so the primary navigation of the website was set up to correspond with these same “buckets” of information. Normally we recommend no more than 5 sections for our client’s websites, but in this case it was justified to have the extra sections to align with the content.

Once the sitemap was established we moved to website design concepts which consisted of a home page, interior page and a mobile view. Once the look and feel of the website was established and approved by the client, we were able to develop a design and architecture for the mobile app that was complimentary and consistent with the website. This minimized any confusion for users switching back and forth between the website and the app.

Development / Testing

Wireframes were crucial to this project, as they defined all of the app’s functionality.

Once the app was developed, there was also a private beta test with committee members. Beta testing is not necessary but highly recommended. The OMama application was being built for a specific audience, but it included vetted information from medical professionals. It was important to let the different contributors and audiences see the application and make final suggestions for updates to either content or the interface, prior to launching to the general public. It’s also important to get the application in the hands of some external testers prior to launch in case they find an elusive bug or issues that are only visible once all of the data has been added to the application.

From the initial beta test group we received updates to content, suggestions for changes to the user interface and some bug reports. The most significant change was how the content was grouped and categorized together; it was discovered that there was simply too much content within some of the categories and some categories were too repetitive. The beta test process gave the opportunity for our client to reorganize and restructure some of the information to make it simpler to use.

As creative director, I designed the website interface and oversaw the mobile app's visual appearance, as well as overseeing our four stages of development: consultation, wireframes, concepts and final designs. We began with two homepage concepts, and the client made the final selection: a modern, clean design that evokes a sense of safety and credibility for the target audience.

Through this process we were able to create and deliver a unique application and website which has been a total success since its launch in December 2015.

GoLive / Ongoing Support

In our organization, ongoing client support takes several forms. Because we also host the website our firm takes care of technical support; ongoing operation and security of the website, maintenance, software upgrades etc.  Product support is provided to the client’s content team in the form of additional training and assistance with any questions they have regarding content updates.  We also provide ongoing development and design services for future additions or changes to the website or app. The only significant challenge we encountered was a slightly longer than usual approval time for the iOS version of the App.  We typically allow two weeks for Apple to approve the app once it is submitted and in this case it took closer to three weeks which could have been attributed to the proximity to the Christmas season.

Result

The entire project took a little over a year. The needs analysis/consultation phase was about 3-4 months, design of website and app was another 4-6 months in total and beta, final testing and launch of the website and app in the Apple and Google app stores comprised the final two months. The content was developed and populated to the website by the client’s content team and the app was set up to pull the content from there. This activity happened concurrently with the development and design process.

The OMama app and website were developed in a way that considers the experience of each and every type of user, not just the target audience. This ambitious goal makes OMama a one-of-a-kind, user-focused project. Beyond ease and convenience, our goal was to create an intimate relationship between the user and the OMama brand.

Using an interactive, colour-coded timeline, both the website and mobile application guide users through the milestones of pre-pregnancy, early pregnancy, mid-pregnancy, late pregnancy, labour and birth, postpartum and the newborn stage. OMama delivers key information to the user throughout, including tips for choosing a birthing place, details on medications, discomforts, complications, violence and abuse, healthcare and even how to count your baby’s heartbeats. A uniquely ad-free environment also meets OMama’s goal of delivering trustworthy, unbiased information. 

The key to the project was for women using the website and app to feel safe and reassured that they are doing everything possible to ensure the well-being of themselves and their babies. The design supports these feelings through appropriate imagery, soft colours and branding from credible healthcare organizations such as BORN, CHEO and eHealth Ontario. From concept to launch, our creative team designed materials to communicate and promote the OMama app and website in an appealing and welcoming way for all end-users. Users can now find trusted information on over 150 topics related to pregnancy, birth and early parenting.

BORN Ontario’s knowledge and expertise helped us to consider and explore a variety of different scenarios for a broad range of users. Through this experience we developed options that would address any type of situation, even the unpleasant ones. Imagine using a pregnancy app for a few months and then having a miscarriage - the last thing you’d want is to continue receiving updates or notifications from your mobile app about the pregnancy. Adding an option to quickly and easily change a user’s pregnancy status on OMama’s mobile application addressed this sensitive issue. 

One concern of the client was that the website and mobile app be easy to use and welcoming in contrast to the cold, clinical format through which this type of information is often communicated. By introducing personalized features such as colours and avatars, we helped the client achieve this vision. To ensure that the content would resonate with the audience, we provided writing services and writing for the web training to the content writers on the project, including the web management team and working committee.

Designer Takeaways

1. Extensive wire-framing is integral to success when designing a mobile app.
2. Communication is key when dealing with multiple stakeholders with varied opinions. Actively listening to each of their concerns and finding creative ways to solve and deal with issues will set you on the path to a truly inclusive and successful project you and your client will be proud of.

Client Takeaways

1. Don’t underestimate the volume of work required to review and verify third party content; the working team for this project found this to be a much bigger job than anticipated.
2. Concepts and user feedback at the beginning and throughout the process can be crucial. Offering a beta version prior to full launch is beneficial.

Credits
Agency: eSolutionsGroup
Creative Direction: Marc Trudel RGD
Project Management: Peter Gingrich, David Gray
Project Coordination: Emilie Lew, Lisa Tougas
Front-End Programming: Kevin Gray, Alicia Vincent
Development: Jordan Aaron, Kimkhoa Tran

Interested in submitting a case study? Download 'Guidelines for Contributing Content' and email .