App design and prototyping

As a project of the course I am undertaking, I was tasked with designing and prototyping an app that I came up with, working from the initial concept of the idea for an app to its prototyping and successful user testing.

Research

I initially came up with three ideas for an application:

  • A travel budget app
  • A restaurant reservation app
  • A pregnancy monitoring app

After pitching my ideas to my peers, I concluded that the pregnancy monitoring app was the most practical to undertake.

I researched a total of five competitors, each with their own application for the IPhone:

  • Ovia Pregnancy Tracker
  • Pregnancy and Baby Tracker
  • BabyCentre
  • Pregnancy +
  • Nurture

I researched each of these competitors extensively, analysing each apps pros and cons and displaying it on a competitor analyse table.

competitor diagram

From this research, I saw that there was an obvious gap in the market, as these were the ONLY five competitors for myself, one of these apps underperformed compared to the others, and none of them implemented every element that I aimed to achieve with my own pregnancy monitoring app into a single application.

User Interviews

As I live in a quiet, rural part of the country, I had some difficulty finding a suitable person to conduct an interview with. I did, however, hold an interview with a person I knew was a mother to several children and who had a brief idea of developing a pregnancy app such as this one, as she experienced an issue during her pregnancy when she was unable to effectively record the number of kicks her unborn made. 

Interview

Q: How have you recorded information previously?

A: Making notes on my phone / on paper.

Q: What information did you record?

A: Own weight, kicks over recorded time, activity dated, what amount of activity (very active, a little active, resting).

Q: What features on the app would you like to be included?

A: Calendar, bump selfies.

Q: How do you feel about being able to link the account with other users, such as your partner or obstetrician?

A: I like the idea of that.

 

Some additional bits of information she mentioned during our interview were:

  • She was frustrated with noting activity and other aspects on her phone / paper, and forgetting about them.
  • She had no way of recording events, dates and notes information on a calendar
  • Information she took was scattered (notes in one place, calendar listing events and dates in another)

From the user interview that I held, I received a greater understanding of what a potential user would look for in such an app.

Target Audience

After researching the primary demographic of pregnant women, as well as others who may be interesting in a pregnancy monitoring app, like the woman’s partner, relatives and obstetricians, I came up with a few points on who my target audience included:

  • Users between 20 – 40 years old
  • Expecting mothers, their partners, relatives and medical personnel (obstetricians)
  • Expecting mothers who may have had issues with pregnancy / fertility previously
  • First time expecting mothers

From evaluating my target audience, I then created three distinct user personas based on the information gathered.

This slideshow requires JavaScript.

 

Sketches

I drew some simple wireframes for the app, so that I had some idea of how the layout each page on the app will look and what functions I need to include.

This slideshow requires JavaScript.

The main features of the pregnancy monitoring app are to allow the user to input daily information on their wellbeing and the activity and wellbeing of their unborn and monitor the relevant statistics throughout their pregnancy, as well as providing relevant information to the user on their stage of pregnancy though articles and information provided on the app about foods and medicines. The device that this app will be developed for is the IPhone. I will need to relay on external services to source relevant articles from. The app will be designed with an IOS tab menu at the bottom of each page, sliding pages, several list menus, and a basic springboard design.

User App Flow

An user app flow serves to provide a basic idea of the user’s journey when progessing through the app. As the prototype I was creating for this app was to serve as a minimal viable product, or MVP, meaning it did not require to be 100% complete, but have enough fuctionality for user interface, experience, design and testing, I made the user app flow in relation to the pages of the app that will be included in the user testing.

app_flow

Design Specification

After carrying out competitor analysis and coming with, app and wireframe flows, as well as the functionality and animations featured on the app, I examined a few of my competitors apps to see how their apps function and the designs that they use.

Benchmark research / Inspiration

Ovia Pregnancy Tracker

 

BabyCentre


Nuture

 

I decided to include a tab menu at the bottom of each of the app’s pages, which is a feature in each of the inovation apps. I included a calendar feature similar to the Ovia Pregnancy Tracker, a home page which featured articles, as was included in BabyCentre, and a record log section similar to one featured in the Nuture app.

Logo and name

App_Logo2

 

I took some time to consider what name and logo would be suitable for the app I was creating. I finally came up with the name “Over The Bump”. This is a play on words of the phase “over the hump” meaning to get past the most difficult phase of a task, and what my app aimed to do, to help the user get through the pregnancy supportively and effectively.

Colour scheme

I decided to choose a green colour scheme for the Over The Bump app. Green is associated with nature, life, renewal, growth, harmony, safety and fertility, with many people feeling relaxed when looking at the colour. As I was creating a pregnancy monitoring app, I believed that using a green colour scheme suited the app well. One of my competitors, Nuture, used a green colour scheme for their app, which I took interest in. I had also used a green colour scheme in previous projects, and was impressed by how well it made specific elements stand out and how pleasing it looked.

Invision prototype https://projects.invisionapp.com/d/main#/projects/prototypes/16927617

For creating a fully functional prototype for the application, I used a service called Invision. Invision made prototyping quick and easy. I simply uploaded the jpegs of the app page wireframes into Invision, selected on the page what elements were interactive, what pages they linked to, and what animation to include when changing pages.

This slideshow requires JavaScript.

User test

After creating a successful prototype of the application, I was prepared to conduct user testing on it. I managed to test my app with three different users, each with widely varying backgrounds.

The tasks I required the users to complete in order to sufficiently test the app were as follows:

  1. Make a reminder on the calendar.
  2. Record 5 kicks on the kick counter tool.
  3. Check that it is safe for a pregnant woman to take ibuprofen.
  4. Make a sleep record.

After the users had completed the tasks, I asked for their feedback on the application. Overall, they were pleased with it. They found a few issues with the design of the app, though.

  • As one of my tasks was to find safety information, which was a sub-category labelled under tools, the users had trouble finding this option, as they did not expect to find it under the “Tools” category, and recommended it labelling more suitably. In contrast, they also stated that it may not be a significant issue, as a lot of people when using an app initially tap every option available to them to see how it functions.

tool error

  • Another issue a user pointed out was that on the home page, the element signifying the week was not clear enough, suggesting that it should read “ Week x out of 40”, or more simply “Week x”, to help other users to know exactly what it represents when they first open the app.

home error

 

 

 

 

 

 

 

 

 

 

 

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s