PARENTSPACE.

Designing an End-to-End Application

Project Overview

Project Background

The project was aimed to create a social network application that would help people going through the changes in their lives related to becoming stay-at-home parents to remain socially active and keep in touch with their community as well as lessen the stress of being one-on-one with the daily challenges of their new role.

Challenge

·         Design a product that would meet the social needs of stay-at-home parents.

·         Create an inclusive social platform for stay-at-home parents of all genders.

·         Keep in mind the target user’s privacy concerns.

Role

UX Designer (UX Research, Interaction Design, Product Design, Usability Testing).

Tools

Figma, Whimsical.

Time Allocated

74 hours.

Project Phases

1 - Research

 UX RESEARCH PLAN | COMPETITIVE RESEARCH | PROVISIONAL PERSONAS | USER INTERVIEW | RESEARCH DEBRIEF | USER PERSONAS

Research Plan

As always, I started with a detailed research plan, which you can read if you hit the button below.

The goal of my research was to find out if and how a mobile app could help stay-at-home parents cope with social isolation and other related problems.

My plan was to gather information via competitive benchmark study and also get first-hand opinions from stay-at-home parents directly.

Competitive Research

I began with competitive research in order to learn what some of the already existing popular stay-at-home parents app had to offer. Turned out, there were already quite a few of such apps, but none of them were gender inclusive. They were more of stay-at-home moms oriented rather than acceptant of all the stay-at-home parents regardless of their gender. Gender inclusiveness was something unique and important our app could offer.

Another important thing I discovered was that there was quite a bit of negative user feedback about personal data privacy when joining/using those apps. People normally didn’t want to share location and other sensitive info publicly. Users also complained about bullying and harassment. People wanted to feel safe, especially since their children were in a way involved in it too. So, users’ privacy was another important thing to keep in mind.

Provisional Personas

Next, I drafted four provisional personas – I tried to take into account the needs of different types of parent-users since I aimed for an inclusive social-network that would treat people equally regardless of their gender, sexual orientation, life situation or the way they came into parenthood.

Of course, I could not cover everything under just those four examples, but they already were a good representation of the diversity to cater to. If it were a real project, I would have probably dug deeper and created twice as many provisional personas to take into account more differences.

User Interviews

My primary research was based on user interviews since the subject was very personal and a dry survey would not suffice. I wrote a detailed list of empathetic, insightful interview questions, recruited 5 stay-at-home parents and interviewed them via Zoom. I recorded our conversations with the participants’ permission.

Among other things I found out from my user interviews, I learned that extraverts and introverts dealt with social isolation differently and had different needs with extraverts needing to spend more time around other people and introverts suffering from lack of peaceful and private me-time while still needing to keep in touch with community.

Some parents spent 8+ hours a day alone with their children! A few admitted to have meltdowns. One - depression.

No parent said they were fine with their social isolation.

At the same time, parents worried about keeping their children safe and any information about them - private. So, creating a social app for such a sensitive group was a tricky task.

Research Debrief

All that was left to do now was putting together a research debrief to summarize my UX research findings.

All in all, the research was fruitful.

It proved that a more inclusive app could really make a difference as there were only apps for traditional female parents. The users had different needs our app could try to satisfy: some parents needed more communication, others - more reasons to get out of their homes and hang out with like-minded people who were stay-at-home parents as well.

User Personas

I created two user personas, as one really didn’t feel like enough even though it was only a student project.

Despite the stereotype that a stay-at-home parent is normally a female, I made one of my user personas female, and the other one – male. I also made one of them introvert, and the other – extravert: like I mentioned above, it influenced greatly how they dealt with isolation and what social needs they had.

I based my user personas on a combination of data from my user interviews and provisional personas.

I’m showing only one of them here though - just to give an example.

2 & 3 - Information Architecture & Interaction Design

UI PRODUCT REQUIREMENTS | SITE MAP | TASK AND USER FLOWS | SKETCHING | MID-FIDELITY WIREFRAMES

UI Product Requirements

This time, I started my information architecture phase with a raw draft of my future UI Product Requirements document as it made more sense to me having some sort of a plan to base my further steps on. I could foresee there would be a need to add more detail to it down the road while iterating on my site map and task/user flows until it covered all the necessary features.

Site Map

In my site map I covered the app’s future pages and the most important features I could think of (given that it was a student project and I had to limit myself to only a certain amount of screens to design).

I put the Create Profile flow as one whole thing here, but later on I was reasonably pointed out that it was too long. My solution was to break it in two parts and save the second part for optional after-registration completion to make the sign up flow shorter and easier for a new user to complete.

Task Flows and User Flows

I created two different task flows and user flows to cover all the possible steps for the scenarios I had on my mind. However, I’m only sharing an example of one of my user flows here to save space on the page - the Registration Flow.

For this one, I tried to make it so that the user had the freedom to go back to the Sign In screen at any point of profile creation – in case, for example, they changed their mind and wanted to sign in with an alternative option (Google or FB).

Mid-Fidelity Wireframes

After having sketched a couple dozens of screens for my flows, I created my mid-fidelity wireframes based on them. You can see a few examples of the end result below.

Besides the Sign In flow I designed a Find Friends flow and a few other screens like Home and Profile. For Home my plan was to make it so that people could share things there as well as ask for advice from other parents.

I also planned to add such features as:

• Ask Community (where you can see other parents’ requests for advice or post yours; or simply seek moral support in a challenging situation);

• Events (where you can share events info, initiate get togethers and invite people to join in);

• Groups (communities users could create and/or join);

• Croup Chat (a possibility to create and/or join group discussions);

• Privacy (where you can choose for yourself what info you are willing to share and with whom, as well as opt to keep your account private);

• Support (where you can report bullying and/or harassments).

4 - UI Design

BRAND LOGO | UI KIT | HIGH-FIDELITY WIREFRAMES

Brand Logo and UI Kit

My logo (you can find it below on the hi-fi screens) was symbolic: the two big dots stood for two unrelated stay-at-home parents seeking to find ways to stay in touch with society, the smaller dots around them – their children, while the circle connecting them all represented the ParentSpace app bringing them together.

If you’re curious to see my UI Kit, please hit the button below.

High-Fidelity Wireframes

I designed 22 screens in total – to complete the flows of my choice, but, of course, I could only include a few of them here.

As I mentioned before, at this point, I decided to divide the profile completion flow in two parts as well as made more of the steps skippable – to lower the bounce rate.

I also added a Complete Profile button to the profile page: after completing the Sign Up flow, the user would have an option of adding the rest of the information to their profile any time they felt like it while already having access to every part of the app.

Some steps, like location and information about children, I made hidden by default as my previous research had shown that other similar apps’ users had expressed concerns about sharing that kind of private information publicly. It could be changed later on by the user in their Profile Settings, of course.

You can also see a few examples of the Find Friends flow screens in the image below.

5 - Iteration and Implementation

PROTOTYPE | USABILITY TESTING | REVISIONS

Prototype

The prototype was pretty easy to put together. I used Figma for doing that and only made clickable the options that were part of the flows planned to be tested. If you’re curious to see it, please hit the button below.

Usability Testing

As my prototype was ready, I wrote a usability testing script, found 5 people willing to participate and conducted my testing. It went smoothly and only one small thing proved to be requiring optional correction - the checkboxes I used for the apps friends matching system.

As for the usability results summary, please hit the button below to find a copy.

Revisions

Since there was only one small thing to be corrected – namely, replacing check boxes with more modern-looking tags, I didn’t find it worth creating an affinity map and a priority revisions matrix. I just went straight to iterating as it was not going to take much time and effort and could add value to the user satisfaction

CONCLUSION

While working on this project, I learned how to approach creating an app from scratch. I practiced interviewing users in person and understanding their pains and needs.

I believe I managed to solve the problem of creating an inclusive app that would work for all stay-at-home parents, not only the traditional female ones.

The usability testing proved that the users were content with the way I had approached sharing private information, which was a win too.

If I had more time, I would work more on the aesthetical part of the design, maybe created some cool graphic elements for the background or a unique set of icons. However, with the time limitations I had, I made UX my priority and focused on the usability of the product I was creating.