LA FUERZA
DE FAMILIAS
Redesigning the user experience for the
Latinx community
La Fuerza de La Familias is a non-profit organization with a mission to inform, educate, and assist the Latin X community in early childhood development. Their services include workshops for parents, educational courses for teachers, and free educational multimedia.
THE PROBLEM
How can we make the La Fuerza De Familias website easier to navigate in order to attract low-tech Spanish-speaking caregivers and program partners?
My Role: UX Research/ UX Design
Project Goals:
-
Create a multi-media library for Latinx parents and caregivers to access
-
Provide engagement tools for educators, community organizers, and non-profit institutions to empower Latinx parents and caregivers to participate in early child development
-
Convey the mission of La Fuerza visually and textually
USERS & AUDIENCE
In order to understand the users, the design team had a discussion with the LF stakeholders to learn about La Fuerza’s users and goals as well as define business needs for the website.
La Fuerza De Familias has two main users accessing their site:
PARTNERS
Organizations or individuals who partner with La Fuerza
to facilitate workshops and other services
PARENTS
Families who utilize free workshops and materials offered by La Fuerza
RESEARCH
In order to learn more about La Fuerza's user audience and competitive landscape,
I did some behavioral and market research. The team collaboratively performed a Heuristic analysis of the previous website as well as researched competitors with similar missions and user behavior. We also tested users and surveyed their likes and dislike when accessing resources on the site.
For schools and community partners with whom La Fuerza assist, they find it difficult to connect with Latinx parents because:
-
Latinos don’t use tech the same way as ’Los Americanos’
-
Hispanic immigrant parents don’t really use the common tools such as e-mail, fb group or website, that schools use to communicate with other parents.
-
Liaisons minimize the information load to help with parents’ lack of familiarity with processing excessive information. They do this by using WhatsApp, SMS text messages, and printed material
-With the work of bilingual parent-education, 2018
What are Latinx parents struggling with when obtaining information online?
74%
of Latino parents said that they “strongly agree” or “agree” with the statement, “I would like more information from experts about how to find good TV shows, games, and websites.
-Digital Media and Latino Families, 2015
Limited literacy, even in Spanish, and lack of familiarity with online searching complicated their possibilities of accessing other options.
-With the work of bilingual parent-education, 2018
A heuristic evaluation found that
the website has three underlying issues:
Architecture
The website lacks clear information architecture. There are moments when you are unsure how to get back to a previously visited section or where the current page lies.
Call To Actions
The colorful palette of the website makes it hard to determine which items are clickable. Furthermore, the call to action buttons are not consistent in colors
Social Media
It was difficult to share resources available for parents through social media.
Surveys responses from over 20 potential partners, parent leaders, decision-makers in the school districts, headstart programs, and community organizers helped the team get an in depth understanding of :
-
What would motivate them to sign up and/or pay for programs such as La Fuerza
-
What kind of information and statistical sate they relate to
-
How resources are shared in their community
Usability Testing before the redesign also provided
great feedback for the redesign:
User Testing Results:
-
Users appreciated a Spanish and English version of the site since they don't want to abandon their Latin culture.
-
Parents and providers generally understood the mission of LF
-
Page navigation and wording were confusing as they found the menu was hard to find.
-
People liked that the read-aloud, tips, and videos were on the home page.
-
Users wanted more real-life pictures of families since it would create an indicator as to what type of organization LF is.
-
Sharing resources was an issue for most participants. When asked to share resources, 4 out of 5 clicked the share by copying the link since many parents don't use the web version of What's app. Sharing to Whats app in mobile needs to be implemented asap since most Latinx consumers are heavy WhatsApp users.
-
Users loved the bright colors of the site but thought they were a bit distracting. The redesign would focus on keeping colors vibrant but remain close to the focal point of the content on the page.
-
3 out of 5 users did not navigate to more than two pages. They waited for instructions before moving on.
CHALLENGES
User Experience VS Client Compliance
While managing multiple stakeholders’ needs and requests, deadlines and scope changes, there were also a few more things to consider throughout numerous phases of project.
-
Language/cultural barrier: Build clear Information Architecture for both two distinctive different user groups. Stakeholders would need to have a clear English and Spanish version of the website as well as design that is simple yet vibrant enough to engage with the Latino culture.
-
Multiple Stakeholders: La Fuerza is a non-profit organization built through the partnership of different organizations such as Too Small to Fail, Literacy Partners, and Univision. Each stakeholder had different requirements that we needed to comply with. Our task was to make each requirement as user-friendly as possible.
-
Bi-lingual & cultural gap: While an ally to the LatinX community (growing up in NYC), my high school level of Spanish did not help me much with remote user testing and interviews with spanish speaking parents. The team was collectively able to overcome this hurdle by having a dedicated spanish-speaking La Fuerza partner who participated in every interview that needed translation.
-
La Fuerza’s Business Model: La Fuerza is a fairly new organization. We wanted to build a website for the organization that it will become. To do this, we needed to understand how the website fits into not only it’s mission, but it’s business model. After multiple discussions, we were able to create a website that is accessible to parents, but also leave room to provide add-ons to any additional pay wall needs.
DESIGN INSPIRATION & ITERATIONS
LA FUERZA REDESIGNED
Showing Impact and Increasing engagement
La Fuerza De Familias thrives on the participation of the community so ensuring site users would be best served with a site that fits their needs would show that La Fuerza understands the Latino culture, and is willing to meet its community where they are. The also focused on the following main objectives:
Showing the impact partners can bring to their community by partnering with La Fuerza.
Increasing parent participation through website engagement and encouraging them to utilize all the resources La Fuerza offers. (i.e., videos and online courses)
Homepage- Before Redesign
Menu hidden on the right side of the page.
No value in the repeated resources on the homepage
No cohesiveness in
visual elements
Expansion of the footer for added site navigation as well as a way to engage with La Fuerza through email sign and a Contact Us CTA on every page
La Fuerza has a lot to offer, yet on the previous site, the homepage didn't give this impression. The redesign would expand on all La Fuerza's offerings as well as highlighting the support they bring by partnering and joining them. Expanding on the content on the homepage was especially important since there was a need for users to navigate to more than two pages across the site.
Homepage- After Redesign
Resources were kept on the home page and were given more real-life visuals that appealed to users.
Clear call to action within the hero that is attached to La Fuerza's mission.
Access to Spanish translation of the site while breaking apart from the rest of the navigation.
Insightful data that shows La Fuerza's is trustworthy and impactful in the community.
A Megamenu was introduced to enhance navigation and wayfinding and give users a clear path to access all the different types of educational resources. As users click through different pages, a page underline would show in the top navigation as well as a breadcrumb trails.
Mega Menu (mobile)
Being able to share resources seamlessly across desktop and mobile was a usability issue, so sharing on mobile was implemented since the Latinx community are heavy Whatsapp users
Sharing resources on Desktop
Sharing resources on Mobile
OUTCOMES & LESSONS LEARNED
All stakeholders were extremely satisfied with the redesign. Based on the data gathered from Google Analytics shortly after the redesign, La Fuerza observed a 4.6% increase in event rate per session and a 40% increase in engagement time.
Lessons Learned:
-
Communication is key! With stakeholders in a highly complex and culturally orientated project, having a healthy cadence of meetings and check-ins was necessary to update on progress and address any constraints.
-
Universal design is extremely important and necessary, especially when dealing with foreign language users (text is always longer).
-
Approaching with a content-first design mindset will allow for a better determination of your scope of work. La Fuerza has a lot of resources, and ......
-
Design with a hybrid approach of user input and objective data (Google analytics & usability testing etc), to ensure the most viable outcome.