HomeCircle

UX/UI Project

HomeCircle

UX/UI Project

My Role

UX Designer

My Role

UX Researcher, UI Designer

Team

Michael A. (Mentor)

Team

Michael A. (Mentor)

Tools

Figma

FigJam

Lyssna

Optimal Workshop

Otter.ai




Tools

Figma, FigJam, Lyssna, Adobe Photoshop, Optimal Workshop, Otter.ai, ColorMind

Client

HomeCircle is an innovative educational platform designed to empower homeschooling parents by facilitating connections with subject matter experts and fostering a community with fellow homeschoolers. Through a personalized 1-on-1 matching program and an open parent forum, HomeCircle offers homeschooling parents both targeted and broad support, helping them navigate each stage of their children's educational journey with confidence and ease.

Project Overview


We designed a product from the ground up to enable users to seamlessly schedule calls with experts. Our focus was on crafting a smooth onboarding and sign-up process, an intuitive expert search experience based on specific criteria, and a simple, efficient way to connect with experts and manage payments for their time. This project was completed as part of CareerFoundry's UX Immersion Bootcamp, a comprehensive nine-month program based in Germany. The bootcamp pairs students with experienced designers from around the globe, allowing them to collaboratively tackle design challenges spanning from UX research to UI design.

Problem Statement


The rise in homeschooling reflects a major shift in education, with more parents embracing its flexibility and personalized learning opportunities. However, current EdTech solutions have not adapted to meet the unique and evolving needs of homeschooling parents, who must take on new and increasingly complex roles each year. This gap in tailored support presents a critical challenge for parents seeking effective tools to manage and enhance their children's learning experiences.

Solution


Develop a mobile-first responsive application with five core features to enhance the homeschool parent experience:

  1. Robust filter search system, enabling users to efficiently find targeted support to match their educational style

  2. Parent forum for seamless community interaction and exchange of ideas.

  3. Resource library to provide quick access to educational materials and guides.

  4. Payment platform for a smooth and secure transaction process.

  5. 1-on-1 mentor matching program to connect users with personalized, expert guidance.

Methodology

Through the project, we utilized two design methodologies: Design Thinking and Lean Design. Design Thinking divides the workflow into five stages—Empathize, Define, Ideate, Prototype, and Test—and promotes iterative refinement by allowing for revisits to any stage as needed.

Client

HomeCircle is an innovative educational platform designed to empower homeschooling parents by facilitating connections with subject matter experts and fostering a community with fellow homeschoolers. Through a personalized 1-on-1 matching program and an open parent forum, HomeCircle offers homeschooling parents both targeted and broad support, helping them navigate each stage of their children's educational journey with confidence and ease.

Project Overview

We designed a product from the ground up to enable users to seamlessly schedule calls with experts. Our focus was on crafting a smooth onboarding and sign-up process, an intuitive expert search experience based on specific criteria, and a simple, efficient way to connect with experts and manage payments for their time. This project was completed as part of CareerFoundry's UX Immersion Bootcamp, a comprehensive nine-month program based in Germany. The bootcamp pairs students with experienced designers from around the globe, allowing them to collaboratively tackle design challenges spanning from UX research to UI design.

Problem Statement


The rise in homeschooling reflects a major shift in education, with more parents embracing its flexibility and personalized learning opportunities. However, current EdTech solutions have not adapted to meet the unique and evolving needs of homeschooling parents, who must take on new and increasingly complex roles each year. This gap in tailored support presents a critical challenge for parents seeking effective tools to manage and enhance their children's learning experiences.

Solution


Develop a mobile-first responsive application with five core features to enhance the homeschool parent experience:

  1. Robust filter search system, enabling users to efficiently find targeted support to match their educational style

  2. Parent forum for seamless community interaction and exchange of ideas.

  3. Resource library to provide quick access to educational materials and guides.

  4. Payment platform for a smooth and secure transaction process.

  5. 1-on-1 mentor matching program to connect users with personalized, expert guidance.

Methodology

Through the project, we utilized two design methodologies: Design Thinking and Lean Design. Design Thinking divides the workflow into five stages—Empathize, Define, Ideate, Prototype, and Test—and promotes iterative refinement by allowing for revisits to any stage as needed.

# Design Thinking

1

EMPATHIZE

-Understand the User

-Understand the Market

2

DEFINE

-Define the user & their tasks

-Observe user's emotions

3

IDEATE

-Structure the product

-Brainstorm solutions

4

PROTOTYPE

-Draw wireframe prototypes

of key solutions

5

TEST

-Get feedback

-Make improvements

# Design Thinking

1

EMPATHIZE

-Understand the User

-Understand the Market

2

DEFINE

-Define the user & their tasks

-Observe user's emotional journey

3

IDEATE

-Structure the product

-Brainstorm solutions

4

PROTOTYPE

-Draw wireframe prototypes

of key solutions

5

TEST

-Get feedback

-Make improvements

HomeCircle

UX/UI Project

HomeCircle

UX/UI Project

My Role

UX Designer

UX Researcher, UI Designer

Team

Michael A. (Mentor)

Michael A. (Mentor)

Tools

Figma

FigJam

Lyssna

Adobe Photoshop

Optimal Workshop

Otter.ai

ColorMind


Figma, FigJam, Lyssna, Adobe Photoshop, Optimal Workshop, Otter.ai, ColorMind

Client

HomeCircle is an innovative educational platform designed to empower homeschooling parents by facilitating connections with subject matter experts and fostering a community with fellow homeschoolers. Through a personalized 1-on-1 matching program and an open parent forum, HomeCircle offers homeschooling parents both targeted and broad support, helping them navigate each stage of their children's educational journey with confidence and ease.

Project Overview


We designed a product from the ground up to enable users to seamlessly schedule calls with experts. Our focus was on crafting a smooth onboarding and sign-up process, an intuitive expert search experience based on specific criteria, and a simple, efficient way to connect with experts and manage payments for their time. This project was completed as part of CareerFoundry's UX Immersion Bootcamp, a comprehensive nine-month program based in Germany. The bootcamp pairs students with experienced designers from around the globe, allowing them to collaboratively tackle design challenges spanning from UX research to UI design.

Problem Statement


The rise in homeschooling reflects a major shift in education, with more parents embracing its flexibility and personalized learning opportunities. However, current EdTech solutions have not adapted to meet the unique and evolving needs of homeschooling parents, who must take on new and increasingly complex roles each year. This gap in tailored support presents a critical challenge for parents seeking effective tools to manage and enhance their children's learning experiences.

Solution


Develop a mobile-first responsive application with five core features to enhance the homeschool parent experience:

  1. Robust filter search system, enabling users to efficiently find targeted support to match their educational style

  2. Parent forum for seamless community interaction and exchange of ideas.

  3. Resource library to provide quick access to educational materials and guides.

  4. Payment platform for a smooth and secure transaction process.

  5. 1-on-1 mentor matching program to connect users with personalized, expert guidance.

Methodology

Through the project, we utilized two design methodologies: Design Thinking and Lean Design. Design Thinking divides the workflow into five stages—Empathize, Define, Ideate, Prototype, and Test—and promotes iterative refinement by allowing for revisits to any stage as needed.

# Design Thinking

1

EMPATHIZE

-Understand the User

-Understand the Market

2

DEFINE

-Define the user & their tasks

-Observe user's emotions

3

IDEATE

-Structure the product

-Brainstorm solutions

4

PROTOTYPE

-Draw wireframe prototypes

of key solutions

5

TEST

-Get feedback

-Make improvements

# Design Thinking

1

EMPATHIZE

-Understand the User

-Understand the Market

2

DEFINE

-Define the user & their tasks

-Observe user's emotions

3

IDEATE

-Structure the product

-Brainstorm solutions

4

PROTOTYPE

-Draw wireframe prototypes

of key solutions

5

TEST

-Get feedback

-Make improvements

Developing Hypotheses to Guide Research

Generative research for the project was launched with preliminary interviews with homeschooling parents. Through our field research and preliminary interviews, 4 hypothesis emerged that provided guideposts for the project:

Parents feel isolated and wish they had a place to share what they’ve learned and mentor others.

Homeschool parents of children with special needs feel alone because they don’t know any other parents in the same boat.

Homeschool parents don’t have time without their kids to attend in-person support groups or mentor meetings.

New homeschool parents feel overwhelmed without a mentor to guide them.

Analyzing the Market

After defining the problem more clearly, we embarked on a competitive analysis to better understand what similar products were on the market. We looked at other mentor apps to compare features and get a sense of other possible design solutions. A competitive analysis of two leading mentorship apps (Mentor.Social and BetterUp) was conducted.

The analysis consisted of an an evaluation of overall strategy, market advantage, marketing profile, SWOT analysis, and UX analysis (usability, layout, structure, etc.).

User Stories Guide Feature Prioritization

By analyzing competitors, we developed a strategic plan to differentiate the app in the marketplace. Leveraging insights from user research, we brainstormed app features designed to address the challenges faced by homeschooling parents, then created user stories to guide the development of each feature.

From Interviews to Personas

As we refined the product vision, we consistently referred back to the problem statement to ensure a user-centered approach. To achieve this, we conducted user interviews to gain a deeper understanding of the specific challenges homeschool parents face when seeking expert advice, identify pain points and areas of insufficient support, and explore their preferences for how they receive guidance. We interviewed three homeschool parents, organized their responses using affinity mapping, and identified six key themes.

Overwhelming consensus that interviewees distrust the advice of so called “experts.”

Interviewees all suggested the use of filters to find other parents with specific values or expertise.

Interviewees easily thought of unique situations in which they need the help of an expert.

Interviewees want an experienced mentor with similar pedagogy to lean on for support.

Interviewees expressed hesitancy of trusting someone online when they had a network of trusted friends they already leaned on for advice.

Interviewees differentiated between kinds of experts- subject matter vs. parent questions.

Following the interviews, the next logical step was to create personas to consolidate our understanding of the user. Throughout the conversations, participants often alternated between two roles: that of a novice, seeking guidance, and that of an expert, ready to share their knowledge. The personas we developed reflect both the novice and experienced homeschool parent, while also acknowledging that an individual may switch between these roles at different times. This dual perspective would need to be carefully incorporated into the design.

Mapping the User’s Journey

We used these personas to create user journey maps, outlining how users would accomplish their primary goals—the reason they downloaded the app. For the novice, this meant contacting an expert and scheduling a call, while for the expert, it involved creating a mentor profile, setting up a call, and receiving payment for their time. Building these journey maps was a highly rewarding process, as it allowed us to identify potential pain points and uncover new opportunities for improvement through a structured, research-driven approach.

Next, we analyzed specific tasks to determine each persona’s entry point into the app and their key success metrics. For the novice, this involved understanding how they would first engage with the app and what defined a successful experience, such as successfully finding and connecting with an expert for guidance. This task-based analysis allowed us to better tailor the user experience to each persona's unique needs and goals.

Using the Feedback Loop

After designing the sitemap, we conducted a closed card sort to test its structure, leading to significant adjustments. Despite having category labels, participants interpreted the cards inconsistently. As a result, nearly all card titles were revised for clarity. For example, “On-Call Help” was renamed to “Available Now,” and “Favorites List” became “My Short-List” to provide clearer guidance for users.

Original Sitemap

Closed Card Sort Results

Revised Sitemap

Using the Feedback Loop

After designing the sitemap, we conducted a closed card sort to test its structure, leading to significant adjustments. Despite having category labels, participants interpreted the cards inconsistently. As a result, nearly all card titles were revised for clarity. For example, “On-Call Help” was renamed to “Available Now,” and “Favorites List” became “My Short-List” to provide clearer guidance for users.

Original Sitemap

Closed Card Sort Results

Revised Sitemap

Leveraging Usability Heuristics

Before sketching paper wireframes, we reviewed common usability heuristics to ensure the designs aligned with best practices. Using Norman Nielsen’s 10 Usability Heuristics as a framework, we aimed to create a design that was usable—learnable, efficient, memorable, error-tolerant, and satisfying. To further understand how top apps excel in usability, we evaluated the app Clockify against Nielsen’s 10 Usability Heuristics as part of our analysis.

We integrated these usability heuristics into the wireframes, starting with low-fidelity designs for the app's key flows: onboarding, making a call, processing payments, and searching for a mentor. Low-fidelity wireframes offered the flexibility to explore a variety of design ideas without getting bogged down by details. Once the direction was clear, we transitioned to mid-fidelity, and ultimately, high-fidelity mockups to refine the design.

Rapid Paper Prototyping Call Flow

Rapid Paper Prototyping Call Flow

Design began with 3 core flows of the app based on our feature prioritization (calls, payments, and profile).

The wireframing process highlighted the importance of starting with low-fidelity prototypes and progressively developing to a functional design. We fleshed out each main flow. Shown here is the Call flow, which proved to be the trickiest to design.

Lo-Fi Wireframes of Call Flow

Lo-Fi Wireframes of Call Flow

Skipping ahead to visual details, such as colors and final aesthetics, can undermine the effectiveness of the design. In mid-fi wireframes, the “My Calls” screen was not fleshed out sufficiently.

Mid-Fi Wireframes of Call Flow

Mid-Fi Wireframes of Call Flow

When designing the "My Calls" screen, insufficient attention to the low-fidelity design led to confusion in the high-fidelity mockup. Revisiting the initial research flows and iterating on the low-fidelity design proved necessary. This experience underscores the importance of thorough iteration and the understanding that the design process can be complex and iterative.

Version 1

Version 2

Version 3

“Calls” Screen Progresses Throughout Design Process

“Calls” Screen Progresses Throughout Design

Reducing Cognitive Load

Wherever possible, common design features and user interface elements have been incorporated into the HomeCircle design. The platform’s layout draws inspiration from Facebook, given that both are social platforms at their core, with a similar layout and feel for the user profile page to facilitate ease of use. The payment flow is modeled after Venmo’s streamlined process, while the notes feature is designed to resemble Android’s note-taking app. This approach aims to help users quickly adapt to HomeCircle by leveraging familiar design patterns.

Design System

A well-defined design system ensures that the app remains clean, organized, and consistent. For instance, users become accustomed to dark blue buttons indicating primary actions. The predominantly white interface, accented with strategic brand colors, maintains a clean and simple aesthetic, which helps reduce cognitive load and enhances user experience.

A Clean, Modern Look

HomeCircle’s brand personality is approachable, knowledgeable, and inclusive. Bright colors and playful graphics help users feel secure and comfortable, and since HomeCircle connects customers with reliable mentors and resources, the brand needs to communicate knowledge to ensure families feel confident in their homeschooling journey. The interface is clean, polished, and professional to reflect an elevated knowledge base. Throughout the product experience, users can filter results to reflect their homeschooling taste, but care is taken so that no one philosophy is portrayed as a favorite. HomeCircle respects diverse educational philosophies and caters to a wide range of homeschooling styles and needs. The brand guide is up to date with WebAIM’s accessibility standards.

Testing for Usability

Testing for Usability

Usability tests are an essential evaluative research method used by UX designers to assess the usability and effectiveness of a design. Following the creation of the first HomeCircle prototype, a usability test plan was developed to outline the goals, objectives, and methodology for the evaluation. In this instance, six participants with varying ages, occupations, technical skills, and experience with digital mentor platforms were tested in a moderated remote session via Google Meet.

Male

40-50yrs

Data Analyst

former homechooler

very techy

former teacher

Female

20-30 yrs

UX Designer

no homeschooling

online mentor app

experience

Female

30-40 yrs

homeschool parent

medium techy


Male

30-40 yrs

sales

no homeschooling

very techy

builds apps in free time

Female

23-25 yrs

insurance PM

no homeschooling

using care.com to find

childcare matches

Female

25-35 yrs

school admin

former homeschooler

not techy

not sure she’d use service

Male

40-50yrs

Data Analyst

former homechooler

very techy

former teacher

Female

20-30 yrs

UX Designer

no homeschooling

online mentor app

experience

Female

30-40 yrs

homeschool parent

medium techy


Male

30-40 yrs

Sales

No homeschooling

very techy

builds apps in free time

Male

30-40 yrs

sales

no homeschooling

very techy

builds apps in free time

Female

23-25 yrs

insurance PM

no homeschooling

using care.com to find

childcare matches

Female

25-35 yrs

school admin

former homeschooler

not techy

not sure she’d use service

The test recordings were analyzed and organized in a rainbow spreadsheet to identify common themes across all six participants. Issues highlighted by only one or two participants, such as a major change in the payment flow, were noted, while recurring issues, like horizontal scrolling, were recognized but deemed outside the current scope. These insights informed research-driven modifications to the prototype.

One notable change involved updating the splash screen. A preference test, conducted using Lyssna, surveyed 15 participants to determine their preferred design. The results guided the redesign of the splash screen to better align with the app’s overall feel and existing onboarding screens. Additionally, peers were invited to provide feedback on the Figma design file through a peer review process. Key issues identified during testing included:

Absence of back buttons limited user’s utility.

Profile button was not in the expected location.

Profile button was not in the expected location.

Users expected to pay calls at the time of scheduling instead of after placing the call.

Directory results didn’t have enough information to allow users to make an informed decision.

Users misunderstood the term “directory”

Users misunderstood the term “directory”

Testing results in a better product!

Testing results in a better product!

Testing results in a better product!

Reflection

Throughout this project, several challenges arose that shaped the final design. Integrating Web Content Accessibility Guidelines towards the end of the project presented a challenge, as accessibility considerations were introduced late. Moving forward, incorporating accessibility from the start will streamline future designs.

The importance of early and frequent iteration became clear. The temptation to skip rapid prototyping delayed development. Refining wireframes based on feedback will ensure smoother transitions from low-fidelity to high-fidelity designs. Addressing user pain points proved essential for identifying effective design solutions, and thorough research played a key role in guiding the app’s development. This approach ensured that user needs and feedback remained central throughout the process.

Interact with the Prototype

Thank you for reading! Can't wait to work together on our next project!

Testing for Usability

Testing for Usability

Usability tests are an essential evaluative research method used by UX designers to assess the usability and effectiveness of a design. Following the creation of the first HomeCircle prototype, a usability test plan was developed to outline the goals, objectives, and methodology for the evaluation. In this instance, six participants with varying ages, occupations, technical skills, and experience with digital mentor platforms were tested in a moderated remote session via Google Meet.

Male

40-50yrs

Data Analyst

former homechooler

very techy

former teacher

Female

20-30 yrs

UX Designer

no homeschooling

online mentor app

experience

Female

30-40 yrs

homeschool parent

medium techy


Male

30-40 yrs

sales

no homeschooling

very techy

builds apps in free time

Female

23-25 yrs

insurance PM

no homeschooling

using care.com to find

childcare matches

Female

25-35 yrs

school admin

former homeschooler

not techy

not sure she’d use service

Male

40-50yrs

Data Analyst

former homechooler

very techy

former teacher

Female

20-30 yrs

UX Designer

no homeschooling

online mentor app

experience

Female

30-40 yrs

homeschool parent

medium techy


Male

30-40 yrs

Sales

No homeschooling

very techy

builds apps in free time

Male

30-40 yrs

sales

no homeschooling

very techy

builds apps in free time

Female

23-25 yrs

insurance PM

no homeschooling

using care.com to find

childcare matches

Female

25-35 yrs

school admin

former homeschooler

not techy

not sure she’d use service

The test recordings were analyzed and organized in a rainbow spreadsheet to identify common themes across all six participants. Issues highlighted by only one or two participants, such as a major change in the payment flow, were noted, while recurring issues, like horizontal scrolling, were recognized but deemed outside the current scope. These insights informed research-driven modifications to the prototype.

One notable change involved updating the splash screen. A preference test, conducted using Lyssna, surveyed 15 participants to determine their preferred design. The results guided the redesign of the splash screen to better align with the app’s overall feel and existing onboarding screens. Additionally, peers were invited to provide feedback on the Figma design file through a peer review process. Key issues identified during testing included:

Absence of back buttons limited user’s utility.

Profile button was not in the expected location.

Users expected to pay calls at the time of scheduling instead of after placing the call.

Directory results didn’t have enough information to allow users to make an informed decision.

Users misunderstood the term “directory”

Users misunderstood the term “directory”

Testing results in a better product!

Testing results in a better product!

Reflection

Throughout this project, several challenges arose that shaped the final design. Integrating Web Content Accessibility Guidelines towards the end of the project presented a challenge, as accessibility considerations were introduced late. Moving forward, incorporating accessibility from the start will streamline future designs.

The importance of early and frequent iteration became clear. The temptation to skip rapid prototyping delayed development. Refining wireframes based on feedback will ensure smoother transitions from low-fidelity to high-fidelity designs. Addressing user pain points proved essential for identifying effective design solutions, and thorough research played a key role in guiding the app’s development. This approach ensured that user needs and feedback remained central throughout the process.

Interact with the Prototype

Thank you for reading! Can't wait to work together on our next project!