A learning and networking web app for home visitors

Institute for the Advancement of Family Support Professionals (the Institute) ︎︎︎

7 months and ongoing
User Research, Wireframing, Branding, Design System, Prototyping, Design QA

2 UX Designers (including me) and a Project Manager

Knock tackles the dual challenges of staff shortages and diversity gaps in home visiting by empowering aspiring professionals with a dedicated learning and networking app. 


Home visitors are trained professionals who provide support to families with young children

The Institute is an organization that supports home visitors. They have collaborated with us to develop a learning and networking web app for aspiring home visitors.


The home visiting workforce struggles with staff shortages

︎ Local agencies across Region X, found an average turnover rate of 23% over a 12-month period

This means that nearly a quarter of the staff either left their positions or were replaced within that year, according to the Home Visiting Career Trajectories Report.


Knock empowers future home visitors to learn, connect, and grow professionally

Our main goal is to develop a tool for aspiring home visitors to learn, connect, and further their careers.  Features to help realize this goal include:


User interviews revealed roadblocks to home visiting: Proper education, mindset, and community

To gain insights into the home visiting landscape and confirm client’s prior research, our team interviewed 10 home visitors. Using affinity mapping, we were able to group the interview data into common trends. The exercise revealed main challenges when getting into the field include:
  • Having proper credentials and/or training
  • Being prepared and open-minded
  • Not having a community for professional development and support

MVP Focus: Career readiness quiz, training library, networking, and job board

Our client provided a list of potential features for the app. Working with the client, we’ve refined and prioritized app features based on impact and feasibility

Collaborating with a third-party vendor to develop the career readiness quiz

We teamed up with the Center for Certification & Competency-Based Education (C3Be). C3Be was responsible for creating the quiz content and scoring mechanism, while we focused on incorporating the quiz seamlessly into the app’s interface.

Crafting a trustworthy and friendly visual design that harmonizes with the client’s branding

Through brand positioning, we identified “formal” and “friendly” as key attributes for our app’s branding identity in relation to other networking apps. We complemented this with a list of characteristics and attributes to avoid.


How might we incorporate inclusive features to attract diverse talents?

  • African American and Hispanic families make up 30% of home visiting clients in Iowa, but only 6.7% of the staff 1
  • To better understand and serve these families, our client aims to recruit a more diverse workforce
  • We introduced inclusive features to attract a wider range of candidates, such as:

Inclusive name fields and language options

Accessibility-first color palette

that complies with W3C’s Web Content Accessibility Guidelines (WCAG)

Footnote:  Family Support Workforce Study

Three major improvements

Based on our research and the feedback of our client, we continually iterated our design with three major iterations:

1. Replaced forum feature with Slack integration

  • Client initially suggested having in-app groups and chat functions
  • Feedback and research favored Slack integration, a common community app
  • This change avoided feature overload and duplicating existing solutions 

2. Two-way connection request over One-way

  • We considered a one-way connection for friend requests, similar to following on Instagram
  • Based on client feedback, we opted for a two-way connection
  • This change avoided an influencer-focused model by requiring users to actively accept friend requests.

3. Standardized the quiz format

  • Our partner (C3Be) initially presented diverse question types for the quiz (multiple choices, drag-and-drop, slider, matching, etc.)
  • We simplified by standardizing the quiz format to only multiple choices
  • This change addressed accessibility issues with more complicated interactions (drag-and-drop and matching) while expediting the development process



Career readiness quiz prototype

UI style guide

Built with Bootstrap, our UI incorporates custom components throughout the app. Here's a snippet of the UI style guide.

Tracking outcome

While the app haven’t launched yet, we would have monitored the following KPIs to track success and impact:
  • Increased web app usage, implying more aspiring home visitors are seeking a pathway into the field
  • Growth in new sign-ups, reflecting more home visitors discovering the web app
  • Low error rates and high task completion rates, ensuring that the navigation structure is intuitive and logical for users

Other projects ︎︎︎