Friends of the Children
Web app tool that bridges connection between children and their mentors
TIMELINE
TEAM
ROLE
DISCIPLINE
CONTEXT
Friends LA breaks the cycle of generational poverty and supports families by providing full-time, salaried mentors (Friends) for 12+ years.
PROBLEM SPACE
Organization & Efficiency
They currently rely on mentorship staff to deliver survey deadlines, upcoming events, news, etc to caregivers via word-of-mouth, text, call, and/or email.
Engagement with father figures
They want to improve on championing father-hood through a family engagement portal. Their community partnerships and reources are located on the website, but they are not easy to find nor digestible.
THE QUESTION
How might we design a user-friendly and streamlined communication system to improve collaboration and information sharing between mentors, administrators, and caregivers, while ensuring ease of navigation and access to relevant resources?
PROPOSAL + GOALS
Before we kick-started the app development, the project leads hopped on several scoping calls with the organization to come up with a proposed solution for a mutual acknowledgement of the commitments, responsibilities, privacies, and communications of both parties in order to create the most successful project:
This website will further Friends of the Children-Los Angeles’s goal in aiding underserved youth such as those in foster care, supporting caregivers in their two-generation approach, and raising awareness for the mental health of youth! As such, we keep the following considerations in mind for the extent of this project:
Accessibility and Ease-of-use
External side: website must be easily navigable for mentors and caregivers
Internal side: efficient management large amount of files from admin
Prioritizing usability and upkeep by FOTC after handoff.
FOTC has one person as an IT Manager, so designing a flexible and thoroughly debugged system is critical to ensuring the apps enduring usefulness
COMPETITIVE ANALYSIS
Based on the goals, we conducted an analysis of five competitors which offer services similar to that of FOTC’s desired module system: Blackboard, Google Classroom, Canvas, Notion, and Google Drive. We were then able to identify commonalities between them which suggested features we should incorporate in our own product, as well as things that stood out and that we’d like to avoid doing.
✏️ Teacher / Admin part
👩🎓 Student part
We noticed 4 prevalent feature details across the different apps:
1. Calendar feature links documents and users have the ability to add and edit event information.
2. Various types of files can be embedded and viewed.
3. Direct messaging = easier access and old messages can be accessed by scrolling
4. Nested modules are important to organize and navigate through a pile of files
USER INTERVIEW
What would the end-user want?
To truly understand what could be the underlying pain of users, we interviewed with 5 FOTC Members including admin (Program Director, Family Engagement Assistant), mentors, and caregivers.
For example, we asked the following questions:
What is your current main platform for communication?
Are there any problems with this current system?
How could a message wall improve communication?
How would you want resources to be displayed?
What are the main problems currently faced when teaching?
How do you organize events and provide mentors and caregivers with specific information?
Participants said:
MAIN INSiGHT
Manually sending and sharing resources is not the most reliable way of communicating and organizing.
USER PERSONA + USER FLOW
Based on the key insights from the user interview, we created a user flow and user persona to better understand their specific needs and solve through feature ideas.
TESTING + SETBACKS + IMPROVEMENTS
3 Major Improvements based on User Feedback
Before we finalized our hifi designs, we conducted usability testing interviews with 6 participants. After speaking with a few FOTC mentors, caregivers, and administrators, we were faced with an unforeseen challenge that had to be iterated multiple times.
FINAL SOLUTION
Sign up and log in as an admin, mentor, or caregiver based on the region
Browse dozens of resources. Click, upload, and customize.
Manage event details in one place and export to your own calendar to never forget!
Maintain Security & Privacy
Approve new users and delete unnecessary accounts to ensure only FOTC members sign up
Have all your messages and announcements compiled in one place instead of manually checking all the emails
Manage your youth with personalization
Have all your youths organized in one page and easily access them
Style Guide
REFLECTING BACK…
Empowering my team
As a project lead, empowering the team to take ownership of their work was crucial. Delegating tasks and providing autonomy allowed team members to thrive, grow, and contribute their unique strengths to the project. Trusting them while fostering a culture of learning and support was key to productivity! I made sure to support my team by hosting fun dinners or socials to chill :)
Iterate, iterate, iterate!
Leading a web app project reinforced the idea that iteration is key to improvement. Regularly seeking feedback, conducting usability testing, and being willing to iterate led to a better product. Embracing a growth mindset and acknowledging that not every design will be perfect from the start helped me continuously refine and enhance the user experience.
Rename and Organize
It was important to work "smart" especially in a Figma file with multiple pages and frames. Maintaining an organized file with appropriate frame names and components was important to save time and make it easy for the developers. I wish I started organizing a lot earlier as it a huge chunk of our time during our work sessions, but now I know to be aware!