Do Good (Mobile App & Responsive Website)

Project:  Do Good Role:  Visual & Content Design Duration: 3 weeks 

Project Overview 

Source:  Link

The Problem: 

Only 3% of children who graduate from the foster care system obtain a college degree.  70% of young women end up pregnant by the age of 21 and 20% of all Foster care grads end up homeless. 

Victims of domestic abuse are unable to search for work using traditional methods because they often suffer from PTSD and are unable to create any social networking sites for fear of repercussions from the abusive ex.*

*Source: Link

The Goal: 

The goal of the Do Good app is to provide underprivileged members of the community a simple and clear path to access the help and job search support they need to improve their quality of life.  The app aims to simplify the process of asking for help.


The Product: 

Do Good is an organization designed to support disadvantaged people as they apply and interview for jobs that are more financially stable.  The site allows users to quickly make an appointment to discreetly receive a variety of services to support them in their job search including clothing supply, resume and interview tips and resource assistance.


Responsibilities: 

All elements of UX research, paper & digital wireframes, icon design, as well as the creation of both lo-fidelity and hi-fidelity prototypes.

User Research: Summary  

My research began by considering 2 different populations who struggle when it comes to job search support; domestic abuse survivors and graduates of the foster care system.  In both cases, these people do not have a reliable group of friends and family that can help the users network. 

After finding a series of videos interviewing members of both groups, there were a few insights that presented unexpected challenges.  With domestic abuse survivors, they are unable to have any kind of online presence for fear of being found or targeted by their abuser.  This lack of social presence is often a red flag for employers but it’s an unavoidable issue for the survivors.  For children in foster care, there are often educational gaps as kids are shuffled between homes and schools.  25% of these kids experience PTSD and 70% of young women are pregnant by the age of 21.   Many are removed from their foster homes when they age out at 21 and nowhere to go and now emotional support to guide them into the world.  As a result, 20% of foster kids end up homeless.  All of these users could benefit from an organization whose main goal is to support that transition from victim to champion.

Persona #1: Delia

Delia is a survivor of domestic abuse who needs to find a good paying job because she needs to provide a better life for herself and her 2 children.

Persona #2: Alex

Alex is a graduate of the foster care system who needs support in his job hunt because he wants to start a career that will support himself and his little sisters.

User Research: Pain Points 

Can’t Have an Online Presence 

DA Survivors can’t have a searchable online presence for fear that their abuser could track them down.  Social media job sites like LinkedIn are not an option for these people.

Lack of Education 

Many users have a limited or interrupted education so their user experience needs to be simple and clear with accessibility as a priority since users may have a different native language or a physical disability.

Inconsistent Internet Access 

Many users experience homelessness or live in shelters which means that internet access is sporadic at best.  They aren’t going to be able to spend hours using the site/app.

Embarrassment to Utilize the Service 

Both groups experience embarrassment at their situation, so as much anonymity as possible would encourage usability.

User Journey Map 

Considering the needs of this users were especially challenging.  With a user who is fearful about having an online presence, I have to ensure that user feels as safe on the app/site as the organization wants them to feel in the building.  Additionally, when our users have strong feelings about their situations, we have to be considerate of that.  Providing a virtual check in, allows users to arrive without actually standing in the lobby where others might see them.  We are also serving a population that may struggle with child care, so knowing that they may need help during their appointment will help staff prepare.

Sitemap

Paper Wireframes 

Many of the competitor’s sites were simplistic and felt like a standard template.  The mission of this organization is to make those who are less fortunate, feel as though they are having a unique experience.  In my design, I tried to think outside of the box and create a unique online experience for the user, without over complicating the design.  After exploring sites of high end stylists and styling organizations, I was inspired by their content layout.  For the final design, I combined both inspirations for the final option.

Digital Wireframes 

In designing the variations of this site, I knew it was critical to consider the users’ accessibility. Many who will require these services will likely only be able to use a desktop computer (at a school, library or current job) or a mobile phone.  The mobile applications take into account the fact that users will need to access information quickly and efficiently.  Desktop users have a bit more information and visuals to guide them.  The Mobile site is a combination of both the app and the desktop to consider users who might not have storage on their phone to download the app itself.   

The major task for the app is to allow users to make an appointment to meet with a stylist who will help them find an outfit appropriate for their job interview.  This requires a few questions to prepare for the appt.  In the responsive site, questions were kept above the fold on the desktop so users did not have to scroll.  In the mobile site, scrolling is more natural so we were able to spread the questions out vertically.  In the mobile app, questions were separated into pages with clear “NEXT” and “BACK” buttons to facilitate the navigation.  Once users have completed the task, they receive a confirmation page.  Questions have been broken down into the basic information necessary for a consultant to be prepared & maximize the users time in a fitting.

Dedicated Mobile App

Mobile Site

Desktop Site

Lo-fidelity Prototypes

Dedicated Mobile App

Desktop Site

Mobile Site

Usability Study: Findings  

Overall users were happy with the functionality of the app in the usability studies but ran into a few stumbling blocks.  In Round 1, many users were unsure of the completion of their tasks so we were able to add a confirmation notification.  In many cases, users struggled to know exactly what to do because english was not their first language so incorporating imagery and icons will be helpful. 

Round 1 Insights



Round 2 Insights




Mockups (Desktop Site) 

Based on the usability study, we’ve used different containment values to lead the user through the different sections of the questionnaire since the information extends below the fold.  We knew that we needed to create a confirmation that the user had completed the necessary task.  We created a pop up with information confirming the action and notifying the user that they would be contacted by phone.  Once they receive this notification, they are directed back to the home page to encourage them to make additional appointments for other services.

Before Usability Study 

After Usability Study 

Services - Main

Donate - Main 

Clothing Services

Mockups (Mobile Site) 

Because this product is geared toward users from a variety of different cultures, there was a lot of consideration of accessibility beyond English speakers. Colors and shapes were selected for their contrast to help users recognize the important elements of interaction.  Imagery was specifically chosen to guide users to the pages of which they are in need.  The use of circles is a theme throughout the site because it is a common symbol of community, unity and new beginnings.  As a result, the circle is used to draw a user’s attention through the processes required on the site.

Before Usability Study 

After Usability Study 

Home 

Navigation

Clothing Services 

Profile 

Mockups (Mobile App) 

One of the things our users mentioned in the research process was that anonymity online is vital.  In many cases, people escaping an abusive homelife can be found online by their abusers.  Because of this we wanted to highlight the Privacy Policy, both in writing and through the use of a video in an effort to boost accessibility for all users.  By connecting the video thru Youtube, users may apply captions to the video in their most comfortable language.  They also receive the important information verbally.  This puts a face to the company and encourages the user to feel like they are being spoken to, directly.  The use of comforting imagery is intentionally applied to ensure that users feel valued, welcome and safe.

Before Usability Study 

After Usability Study 

Services - Resources

Events

Languages

Services (Spanish)

Accessibility Considerations 

Iconography

Pages were designed with iconography and imagery that was consistent across platforms to ensure that users would be able to follow the flow with the help of the visual design.  Additionally, each site has provided users with the ability to translate the site into their most comfortable language.

Hierarchy

Typographic hierarchy and containment shapes and colors were applied to help users understand similar information or questions.

High Contrast

Application of high contrast has been applied throughout each design to bring attention to action items for the users.

Takeaways 

Impact: 

As a public school teacher, I’ve seen the direct impact on young people who come from an unsteady homelife.  The lack the support from struggling parents to accomplish their own goals, contributes to a cycle of stress & challenges.  A service like the organization detailed in this project can streamline and simplify that initial step of finding a new job.  I would hope that a site like this could allow those in need to receive the help and support they require to better their lives and find a fulfilling career.



What I learned:

In addition to the personal challenges the potential users face in their process of finding a job in a predominantly online society, I have learned a great deal about the consideration of the user’s time and efficiency in this app’s design.  Many users have very limited access to internet services, so creating a streamlined flow and confirmation of the completion of a task ensures confidence that these users have taken the first step to improving their quality of life.



Next Steps  

Thank You...

for taking the time to view my design.  I welcome you to explore my additional work on the rest of my site.