Toolkit: Sketch App & Miro (Formerly known as Realtime Board)

Type: Non-Profit

Timeframe: 5 months

MY ROLE

I was part of a design team that was responsible for leading the organization’s website redesign. I worked alongside our Lead Product Designer and UI Designer as the associate from UX Research to UI Designs.

 
Angels+Home.jpg
Fostering+Overview.jpg
 

TEAM & ROLES

 
 
0.jpeg

Jennifer Wong
(Lead Product Designer)

0 (2).jpeg

Michael Kubota
(UI Designer)

JM_Web-F0.jpg

Jennifer Mills (Director of Operations)

0 (1).jpeg

Vallerie Neang
(UX Researcher)

Staceyanderson2019.jpg

Stacey Anderson (Social Worker)

0 (3).jpeg

Holly Carmody (Executive Director)

 
 

PROBLEM

FOSTER CARE IS IN NEED, BUT ANGELS IS HAVING DIFFICULTIES WITH RECRUITING.

My Lead Product Designer (Jennifer Wong) brought me to assist her in this redesign. The main issue that she informed me was the website was currently pushing a high bounce rate of about 60% and Angels was in a dire need of recruiting more prospective families for the coming 2019 year. To get a better understanding for myself, I conducted a website audit of the site and screen record my experience of how prospective parents would go through the sign up process.

 
 
 
 

From the audit, the current website was lacking the following:

  • Poor Navigation: Pages that would take users to a different section of the site.

  • Vague Context: No distinction of how to get started or any source of education on what will the process be for parents

  • Lack of True Content: The site is currently filtered with stock images and executives at the agency, no content shown regarding past alumni with the agency and visual testimonials to ensure their journey.

 

 

USER RESEARCH

HOW ARE THE OTHER AGENCIES ENGAGING POTENTIAL PARENTS?

Vallerie, Michael, and I were assigned by Jennifer to compare adoption agencies around the Santa Barbara county and a few in Los Angeles to see how these companies engage sign-ups. We discovered that a mix between strong visual design and branding pushed an agency’s presence, however all had a similar pattern of showing confusing terminologies, which is overwhelming for prospective parents.

 
 

USER STORY MAPPING TO UNDERSTAND PARENTS AND PRODUCT OWNERS.

Discovering how resource families know about Angels was important for us to understand the end-to-end. Jennifer and I sat down with two of Angels staff members (Holly Carmody & Stacey Anderson) to recreate scenarios to do the user story mapping, which helped us create our research questions for our upcoming physical interviews with previous and current prospective parents.

 
LiveSession2.png
 
 

USER INTERVIEWS WITH PROSPECTIVE/FOSTER PARENTS

Jennifer and I had the opportunity to interview three prospective/foster parents. Each interview, we both immediately noticed how powerful emotions played into their decisions. The goal for this session was to understand the end-to-end journey from learning about fostering/adopting to their execution.

 
DSC_4289.jpg

Matt & Kiel (Same-Sex Couple Looking to Adopt)

“We didn’t expect how fostering can be so emotional, especially if kids get placed back to their biological parents out of the blue. We remembered that moment and it prepared us on how to communicate with our kids and explain what it means to be fostered

Screen Shot 2018-11-12 at 7.51.43 PM.png

Brian & Christine (Looking to Foster)

“We couldn’t have our own kids and discovered about fostering through church and a few colleagues, but it took some time, about a year to be exact in order to make that jump. Figured if we were fostering and planning to not adopt every kid, our goal was to guide their transition into life with ease.”

Screen Shot 2018-11-12 at 8.08.35 PM.png

Wenli Jen (Went through Fostering Process)

“Time was definitely important for me in terms of placing because at that time I wasn’t sure if my lifestyle was suitable for a child. Plus parents and relatives were not supportive of my decision, which made the journey stressful because they’re from a different generation and loving a child that is not yours biologically is a sin”

 

The three biggest takeaways that Jennifer and I learned from conducting these interviews:

Transparency: Parents wanting to know the terminologies and information and difficulty finding the answers to their questions.

Support: Parents wanted to be secured that they would be supported all the way with their social workers during the risky process.

Love: Foster care agencies tend to feel distant, parents want to be able to bring that love to the infants and toddlers.

 
 
 

UNDERSTANDING THE PARENTS

The success of prospective families tend to range between couples ages 30 to 70, including LGBT couples. Vallerie and I created our personas based on our research, in which the goal was to be inclusive to all ethnicities and parents.

 
 
 

WHAT IS THE FOSTER JOURNEY AS A WHOLE?

Combining the data from our research, our team created this mental model diagram to give us a much stronger understanding and thought process going into fostering based on various tasks. We tied back to this chart to validate the understanding.

 

 

DESIGN PRINCIPLES

CREATING AN EXPERIENCE WHERE PARENTS FEEL SUPPORTED

Based on the user research, my lead and I drafted our core design principles:

Streamline Way-Finding: Parents should be able to easily navigate through pages.

Transparent Content: Information about fostering should be educational and not confusing. The process should not be sugarcoated.

User Assistance: Having quick access to contact to insure security.

BRANDING PRINCIPLES

WHAT SHOULD PARENTS FEEL AND SEE WHEN THEY ENTER THE SITE?

Understanding the negative reflection of fostering, Jennifer and I wanted to push the brand to convey the follow: empowerment, support, knowledge, and warmth. Michael, Jennifer, and I generated family photos by having a few Angels alum and our mutual friends to participate in the photoshoot session. I was in charge of drafting tones and moods that evoked our themes.

 
Shot by Michael Kabota

Shot by Michael Kabota

Shot by Michael Kabota

Shot by Michael Kabota

Edited by me.

Edited by me.

Edited by me.

Edited by me.


 

Information Architecture

HOW DO WE MAKE FOSTERING SIMPLE TO UNDERSTAND FOR PARENTS?

The team and I conducted a card sorting exercise with 5 participants from the physical interviews to gauge their understanding of finding information within the context Angels. Some takeaways I learned from DOING this exercise:

Parent Program: Some parents were confused if it was a training program or support program.

General Overview vs. In-Depth Answers: Parents were more adaptive to general overview.

Prioritized Education: Parents wanted to be informed and educated about the information at first-hand, then learn about the company later.

 
 

From this last spec of our research process, I designed the I.A. site map as a starter. We later used this to tie back to our mental model diagram to jump forward our design process.

 

 

IDEATION

DESIGN STUDIO & WIREFRAMES

After two months of critical research, I chimed in with Valarie and Jennifer on ideating our designs. The main question we had to ourselves “does this design support our prospective parents thought process?” I developed my own sketches and asked Jennifer for feedback on what could’ve worked. Together as a team, we drafted all of our site pages within a 6 hour total timespan. After sketching, Jennifer combined all of our designs and drafted a full high-fidelity wireframe to overcast our visual design phase. Vallerie and Jennifer conducted a usability test with these wireframes and we received very positive feedback on a usability rating of 5/5.

 
 

 

VISUAL DESIGN IDEATION

HOW DO WE MAKE OUR KEYWORDS INTO LIFE?

Michael and I ventured with the branding terms and created our own moodboards in order to solidify a selection of colors that tied into our themes. We selected a multiple amounts of photos that explored various colors and selections, which gauged us to our design styles and colors.

 
Created by me.

Created by me.

Created by Michael Kabota

Created by Michael Kabota

 
Option 1: Too much visual contrast and less emotional connection.

Option 1: Too much visual contrast and less emotional connection.

Option 2: Poor visual contrast, but can be developed with the white negative space.

Option 2: Poor visual contrast, but can be developed with the white negative space.

Option 3:  More emotions and a range of soft and warm colors.

Option 3: More emotions and a range of soft and warm colors.

 

I drafted a few visual designs on my own and I presented my designs to Jennifer. We both agreed that the visual contrast in both Option 1 and 2 were conveying back to our theme and our research, but wasn’t close to our theme. Jennifer, Michael and I collaborated and created Option 3 for our final decision as it evoked a welcoming tone and a sense of family, which was crucial to let our users know that they would be supported.

 

 

Final Designs and Style Guides

A WELCOMING EXPERIENCE FOR PARENTS TO BE EDUCATED AND SUPPORTED ABOUT FOSTERING

This project was one of the most rewarding and challenging ones I’ve taken on with a team. We learned how much research was needed to drive branding, content, and design. If I had to go back and do things differently, I would first ask about the data that was causing the bounce rates, then start the design process forward in order to make a solution based on data.

We received a lot of positive feedback about the redesign and our stakeholders are excited to see the launch. We’re anticipating the site launch in late 2019.

 
Created by Michael Kabota and Jennifer Wong

Created by Michael Kabota and Jennifer Wong

Colors by Michael Kabota

Colors by Michael Kabota

 
Angels Home.jpg
Certification To Foster.png
Fostering Overview.jpg