Ment Homepage

Messaging Interface

Growth Visualization Mode (Mentor View)

My Matches page (Mentee View)

Mentee Profile Page (Mentor View)

Discover Page (Mentee View)

Ment

A mentor-matching platform dedicated to helping women find and establish lasting connections with career mentors they can identify with and relate to.

JUMP TO FINAL Design Highlights

Project overview

My Role: UX Designer

As part of a 10-week Master’s course in Human Centered Design, I collaborated with 3 classmates to design a mentor-matching UX design solution from scratch. While I made hands-on contributions to every phase of the project, I led the visual & interaction design work for all 25 screens included in our final high-fidelity prototype.

My Primary Contributions

Visual design
Interaction design
Prototyping & wireframing
User flows

Usability testing
Information architecture
Survey design
Qualitative interviews

Project team

Xiwen Jin (Project Manager)
Yuhan Xie (UX Researcher)
Haasini Sai (UX Researcher)
Tabby Safari (UX Designer)

Project Type

User-centered design
(Master’s course project)

Duration

Oct–Dec 2021
(10 weeks)

Final deliverable

High-fidelity prototype

Executive summary

Problem space

For many women, the journey to finding career mentors can be overwhelming, intimidating, and anxiety inducing. The lack of underrepresented minority women in leadership positions makes this search especially challenging for women of color, first-generation college graduates, and women from disadvantaged socioeconomic backgrounds who often seek out mentors who can understand and relate to their lived experiences and who have faced and overcome similar systemic barriers.

Our solution

Over the course of 10 weeks, my teammates and I followed an iterative, user centered design methodology to build a mentor-matching platform that takes the stress and intimidation out of the mentor search process by matching women with career mentors based on shared backgrounds, identities, and experiences.

Our process

Research

Methods
Key insights

DEFINE

Personas
Design requirements

ideation

Feature ideation
Storyboarding
Information architecture
User flows

DESIGN & EVALUATION

Usability testing
Final design highlights
Final prototype screens

Click the links above to jump to the corresponding section

Design Question

How might we connect women seeking career advice with mentors they can identify with and relate to?

Research

To kick off the project, we formulated 6 questions to guide our user research phase. We then selected 2 user research methods that would allow us to best address each question in the shortest amount of time: Surveys and Qualitative Interviews.

JuMP To:

Methods

Key insights

6 Guiding Research Questions:
1) How do women currently seek out mentors for career guidance?
2) What qualities do women look for in a mentor?
3) What challenges do women encounter when seeking career mentorship?
4)What are the benefits, limitations, & pain points associated with existing mentorship platforms?
5) What motivates women to become and continue serving as mentors?
6) What challenges do mentors encounter when engaged in mentor-mentee relationships?

Research — Part 1 of 2

Methods

Surveys

WHY: To understand users’ preferences, behaviors, & experiences around mentorship and evaluate whether the qualities one looks for in an mentor vary as a function of individual demographic differences.

Mentee Survey responses (n=52) ultimately validated our assumption that women place more value in identity-based mentor matching than men and gave us insight into the specific qualities, criteria, and career guidance women look for in an ideal mentor.
The sole purpose of the Mentor Survey (n=8) was to screen candidates for follow-up interviews.

Semi-structured interviews

WHY: To gain in-depth insight into target users’ motivations for seeking/providing mentorship and understand the challenges associated with initiating, engaging in, and maintaining mentor-mentee relationships.

We interviewed 14 survey respondents (11 mentees, 3 mentors).
To ensure that our interview findings would reflect the diverse needs, goals, and interests of our target users, we intentionally selected a diverse pool of interview participants with respect to race, age, profession/area of study, mentorship experience level, and years of working experience.

Research — Part 1 of 2

User Surveys

See User Survey Questions

To gain insight into potential users’ behaviors, preferences, & experiences around mentorship (and screen candidates for follow-up interviews), we designed two surveys—one for mentees and one for mentors. The sole purpose of the mentor survey was to screen candidates for follow-up interviews.

‍To challenge our assumption that only women would find value in identity-based mentor matching, we opened the mentee survey up to individuals of all genders and asked participants to rate how important it is for their ideal mentor to share specific identity-based and objective-based qualities with them.

User Survey Finding 1: Compared to male respondents, female respondents showed a significantly stronger preference for having mentors with shared identities.

Finding 1: Compared to male respondents, female respondents showed a significantly stronger preference for having mentors with shared identities.

Finding 3: When asked whether they would use a mentorship platform, service, or resource that matched them with mentors based on criteria similar to those included on the survey...

41 responded Yes (all of whom identified as female)
10 responded Maybe (1 female, 9 male)
1 responded No (male)

Finding 2: Compared to non-BIPOC women, BIPOC women demonstrated a significantly stronger preference for having mentors with shared identities.

Research — Part 2 of 3

User Interviews

See User Interview Questions

Overall, mentee survey responses (N=52) revealed that women place significantly more value in identity-based mentor matching than men, thereby justifying our decision to move forward with our concept of a mentor matching platform designed specifically for women.

To gain more in-depth insight into our target users’ motivations for seeking and/or providing mentorship, we conducted semi-structured interviews with 14 women survey respondents (11 mentees, 3 mentors).

Research — Part 2 of 2

Key insights

Our user research revealed 6 key insights regarding users' motivations, needs, preferences, and goals in seeking/providing career mentorship as well as the challenges and pain points associated with initiating and maintaining mentor-mentee relationships.

Qualitative interview feedback further confirmed that there is, in fact, a clear need for an identity-based mentor matching solution designed specifically for women, validating that the problem we set out to solve was actually a problem.

Insight #01

The intersectional challenges associated with being a woman and belonging to an underrepresented minority group makes BIPOC women more inclined to seek out mentors who have faced and overcome similar systemic barriers.

My experience as a woman of color [at work] is inherently different ... When you constantly find yourself in a room full of people where you're the only person who looks like you, you need to work harder to gain respect and maintain that respect. I look for mentors who understand that. — Mentee 1

Insight #02

Socioeconomic background is a largely invisible but important factor that influences mentorship needs & preferences.

I grew up extremely poor. Most of my imposter syndrome comes from my SES... It would be so inspiring if my mentor grew up the same way I did and still managed to find success. — Mentee 5

Insight #03

Having mentors who identify more generally as ‘underrepresented minority’ or ‘BIPOC’ is more important than having mentors who share one’s exact racial, ethnic, or cultural identity.

[My mentors] don't have to be Black or Middle Eastern or biracial specifically. They just need to be a minority or person of color... [The film industry] is very white, and it's a male-dominated industry. I want mentors who understand how to navigate that type of landscape. — Mentee 3

Insight #04

Mentors are intrinsically motivated to support their mentees because they derive a genuine sense of joy and satisfaction from watching them grow & succeed.

One of my love languages is service. I love helping people and seeing [mentees] through to the next phase of their careers. It's part of my DNA, and I get a lot of positive feedback myself. — Mentor 1

Insight #05

Mentees strive to build long-term connections with their mentors, seeing these professional relationships as the basis for enduring friendships built on a foundation of mutual respect, trust, and transparency.

Insight #06

Women are more inclined to engage with a mentorship platform or service designed specifically for women because they value creating and contributing to a culture of women supporting women.

Mentor Pain points

Time management and setting boundaries are the most salient pain points.

Difficulty managing limited free time and finding amenable times to meet with mentees due to busy work and personal lives.
Not knowing mentees’ expectations or needs up front leads to wasted time for both parties.
Difficulty saying “no” and setting boundaries leads to stress & burn-out.

MentEE Pain points

Pain points arise at 3 stages: engaging, scheduling, and following up.

Not knowing where to look or how to search for mentors.
Feeling too insecure/intimidated to initiate a conversation with potential mentors.
Lack of female leadership and role models at current job and/or toxic workplace environment.

Define

Personas

Design requirements

DEFINE — Part 1 of 2

Personas

After completing our user research, we used affinity mapping to identify common behavioral variables within each target user group to create our two primary user personas.

Mentor persona

Mentee persona

Attribution: Persona illustrations from storyset.com

Choosing a Medium

DEFINE — Part 2 of 3

With our research findings and user personas in mind, we decided that the best medium for our proposed mentor-matching solution would be a website/social networking platform for the following reasons:

Convenience

The vast majority of interviewed mentees and mentors expressed a preference for remote mentorship meetings, which would require integration with a video conferencing application like Zoom or Google Meet.

Accessibility

A web-based design solution would ensure that our platform remained accessible to as many users who could serve to benefit from it as possible.

Scalability

A web-based solution would allow us to keep membership free since and still be profitable by opening avenues for licensing deals with universities, companies, and organizations who could use our system for internal mentor matching.

Define — Part 2 of 2

Design requriements

With our user personas in mind, our team collaboratively formulated 6 design requirements to articulate the qualities that our solution would need to embody in order to satisfy our target users’ needs.

Communication

Our solution should facilitate proactive communication of boundaries and expectations between mentors and mentees.

Community

Our solution should foster a sense of togetherness and enhance users’ sense of belonging by leveraging community power for career advancement.

Connection

Our solution should facilitate healthy, long-term connections between mentors and mentees.

Engagement

Our solution should motivate users to support and empower one another by recognizing, rewarding, and celebrating individual and collective achievements.

Personalized

Our solution should provide users with the freedom and flexibility to tailor their experience around their specific needs, preferences, and goals.

Easy to use

Our solution should be intuitive and easy to use for users with varying degrees of technical skill and expertise.

ideation

Feature ideation

Storyboarding

Information architecture

User flows

ideate — Part 1 of 4

Feature ideation

My team came together for a brainstorming session to discuss the core features and functions we would focus on during our project.

We created a total of 24 sketches (6 per person) to represent our ideas then completed an affinity diagraming exercise to group our sketches into categories based on shared concepts.

Screenshot from our MURAL board. Click to expand.

Concept sketches

After discussing the strengths, weaknesses, and feasibility of each idea, we converged on the top 4 features that would deliver the most value to our users.

Communicate

Connect

Personalized

Mentee Onboarding: Identity & Objective Based Matching

Differentiate Ment from existing mentorship platforms by offering identity-based matching in addition to objective-based matching.
Allow mentees to tailor their mentor matching criteria around their specific needs, preferences, and career goals.

Community

Connect

Encourage

Growth Visualization Mode For Mentors

Encourage mentor engagement by making the value of the time they invest in mentees more salient.
Celebrate individual and collective progress by visualizing the growth of high-quality connections made through the platform.
Implement a gamified badge system to recognize and reward mentor contributions (i.e. earn a badge after hosting 10 sessions).

Easy to use

Encourage

Personalized

Mentor Time Management System

Help mentors exercise more control over their busy schedules by allowing them to set caps around the number of mentorship sessions they host per month.
Allow mentors to disable certain engagement features (i.e. messaging, matching, etc.) and auto-decline mentorship session requests as needed.

Communicate

Easy to use

Personalized

Proactive Communication of Boundaries & Expectations

Prompt mentees to communicate their mentorship needs, expectations, and goals up front when they send mentorship session requests.
Mentors can accept or decline requests on a case-by-case basis.

ideate — Part 2 of 4

Storyboarding

My teammates led the effort to construct 2 narratives around key use case scenarios to demonstrate how our solution might address the needs and goals of our target users.

Mentor storyboard

Our mentor storyboard illustrates how the Ment platform (a) helps mentor users manage their mentorship session schedules with ease and efficiency, and (b) facilitates lasting connections between mentors and mentees.

Created on storyboardthat.com. Click to expand.

Mentee storyboard

Our mentee storyboard illustrates how the Ment platform helps mentee users connect and establish relationships with mentors they can identify with and relate to.

Created on storyboardthat.com. Click to expand.

ideate — Part 3 of 4

Information architecture

Since our target user groups would play different roles on the platform, we defined two separate sets of information architecture (IA): one for mentors and one for mentees.

NOTE: Screens corresponding to labels appearing in gray would not be included in our final prototype due to limited time and scope.

Mentee IA

Mentor IA

ideate — Part 4 of 4

User flows

We created 3 user flows to define the pathways our users would take to accomplish their goals on the Ment platform. Completing this step before jumping into on to the design phase helped me stay focused on core user tasks and avoid building out screens that would be “nice to have” but ultimately unnecessary for illustrating core functions.

Flow 1: User Onboarding to Attending First Mentorship Session

This flow outlines the steps new users take to create an account and attend their first mentorship session. The mentee (top) and mentor (bottom) onboarding flows demonstrate how our platform (1) helps mentee users find and connect with mentors who meet their identity- and objective-based criteria and (2) facilitates proactive communication of expectations and barriers between mentee and mentor users.

Flow 2: Mentee User Connecting with New Mentors

This flow outlines the steps mentee users take to search for additional mentors on the platform, demonstrating how our solution gives users the freedom to connect with any mentor on the platform, even if they weren’t matched.

Flow 3: Mentor User Adjusting Time Management System Settings

The above flow outlines the steps mentor users take to manage their mentorship session schedules with ease, flexibility, and efficiency by enabling/disabling certain engagement features (i.e. messaging, matching, profile discoverability, etc.) and setting caps on how many mentorship sessions they host per month.

Design & Evaluation

With two sets of screens to build and only 2 weeks left in our class, we decided to skip mid-fidelity wireframes and jump straight into high-fidelity prototyping.

For our first iteration, I was responsible for building all screens included in the mentee flow, the onboarding screens for the mentor flow, and any screens that would be included in both flows (i.e. homepage, login and registration pages, messaging interface, etc.) while Yuhan built the calendar interface, time management system, and growth visualization screen included on the mentor flow.

Usability testing

Final design highlights

Final prototype screens

Design & Evaluation — Part 1 of 3

Usability testing

We conducted remote moderated usability testing with 8 users (4 users per flow) who identified 13 unique issues across both flows. Below are some of the iterative changes I made in response to the 3 most pervasive issues.

01. Mentee Flow: Onboarding

Optimizing form functionality

V1 (Before)

Mentee Onboarding Flow V1: Drag and Drop

V1 Feedback

Mentee users found the original "drag and drop" interaction on the final page of the mentee onboarding form unnecessarily cumbersome and unintuitive.

V2 (After)

V2 Changes

I simplified the design to allow for a more straightforward interaction by using familiar form field UI elements like radio buttons and checkboxes.

02. Mentor Flow: Time management system

Clarifying time management system controls

V1 (BefOre)

Time management system controls: design iteration 1

V1 Feedback

Mentor users were immediately redirected to the ‘My Calendar’ page after onboarding where they can start posting mentorship session time slots on the platform.
With no prompts or explanations, users were understandably confused about the purpose of the time management system controls, what each setting meant, and how changing the settings would effect their experience.

V2 (After)

V2 Changes

I added a Calendar Orientation Tour to walk users through the functions of each setting, how to post mentorship sessions, and how to navigate their Calendar page.
Users could also hover over the blue help icons next to each setting label to trigger a tool tip pop-up that explains what happens if they switch the setting ON or OFF.

03. Mentor Flow: Growth visualization mode

Improving usability & utility of 'Growth Visualization Mode'

V1 (Before)

Growth Visualization Mode screen: Iteration 1 design

V1 Feedback

The original Growth Visualization screen (included exclusively in the mentor flow) only displayed mentees’ profile pictures and reviews.
While users shared positive comments about the concept of using a tree represent mentees’ growth over time, they found our visual design inconsistent with some of the imagery used in previous screens.
Because mentee profile pictures were not attached to their reviews, users had no way of knowing who left each review.

V2 (After)

Growth Visualization Mode screen: Iteration 2 (after)

V2 Changes

In addition to visual design updates, I attached timestamped reviews and job promotion updates to each mentee's profile picture to add clarity.
I included a timeline to help mentors recognize how their support has helped mentees grow and excel over time.

Design & Evaluation — Part 2 of 3

Final design highlights

Identity-based mentor matching

Mentee onboarding flow

Mentee Onboarding Flow

Mentee Onboarding Survey:Work and Education History screen (step 2)

Mentee Onboarding Survey: Mentor Match Criteria Screen 1 (specify objective match criteria)

Mentee Onboarding Survey: Mentor Match Criteria Screen 2 (specify identity-based match criteria)

HOw it works

New mentee users complete an Onboarding Survey to specify the qualities and criteria they're looking for in a mentor so the system can match them with mentors based on their individual preferences.

Connect

Easy to Use

Personalized

Orienting new users to the platform

Mentee orientation

New mentee users are introduced to the platform with a tour of their “My Matches” page to encourage exploration and show them how to establish connections with their matched mentors.

Mentee Orientation

Connect

Easy to Use

Encourage

Mentor orientation

New mentor users are introduced to the platform with a tour of their "My Calendar" page. Google Calendar integration and customizable Time Management System settings allow mentors to exercise control over their busy schedules.

Mentor Orientation

Easy to Use

Encourage

Personalized

Facilitating proactive communication

Mentee user: requesting a mentorship session

When mentees request to book 1:1 sessions with mentors, they’re prompted to communicate their needs and expectations up front so that mentors can anticipate the kinds of questions that might come up during the session.

Communicate

Connect

Personalized

Encouraging mentor engagement

Mentor user: growth visualization mode

The "Growth Visualization" setting provides a unique and engaging way for mentors to celebrate individual and collective progress by showing them how their contributions have helped their mentees grow and succeed over time.

Community

Connect

Encourage

Facilitating connections

Mentee: Messaging Interface

The "Discover" page allows mentee users to connect with any mentor on the platform, even if they weren’t matched. If a mentor doesn’t have any open sessions, mentees are encouraged to send them a message to establish a connection.

Communicate

Community

Connect

Design & Evaluation — Part 3 of 3

Final prototype screens

Click on a mock-up screen to view the page in full size

Demo our final prototype

Outcome & Reflection

Weeks

Iterations

Unique screens

100%

Final Grade

Peer feedback

Love the concept! I really want to find a mentor who really matches with me and it’s so difficult to find and contact. I’d like to use this personally.

– MS HCDE Student

I can really see this becoming a real platform. The need is clearly out there and your team did a great job building something truly meaningful.

– MS HCDE Student

I love the idea of bringing change within the system, especially in STEM. Fantastic job!

– MS HCDE Student

If this were a real service, I’d be using it! Love how you really embraced the concept of women supporting women.

– MS HCDE Student

Things I would have done differently

01. PRIORITIZED ACCESSIBILITY OVER AESTHETICS

Looking back on this project, I realize that I've come a long way as a visual and UX designer. While I’m certainly proud of myself for managing to do almost all of the visual and interaction design work despite having no prior experience with Figma, I was completely oblivious to all the usability and accessibility violations that I made.

From low color contrast ratios and vague, non-descriptive CTAs (“Learn More”) to the lack of typographic consistency among H1s, H2s, etc., it is now painstakingly clear that I prioritized aesthetics over accessibility and therefore usability. If I could go back, I would have:

Used higher contrast colors for buttons, hyperlinks, etc.
Used descriptive CTAs for buttons and text links to give users a clear idea of where they’re being redirected.
Increased the size and weight of our body font (and other fonts) to 18pt, regular (400)
Used auto layout to standardize margins, padding, and element spacing, etc. and establish visual consistency across screens.
Relied less on icons overall and used descriptive labels for any icons that were necessary to keep.
Simplified the visual design of several pages.

02. Designed in Mid-Fidelity First

Due to our tight 10-week timeline, we ended up skipping mid-fidelity wireframes and going straight from concept sketches to high-fidelity prototypes. Designing in high fidelity right off the bat not only hindered our ability to make quick design modifications between iterations, but also contributed to visual inconsistencies across screens.

Testing in mid-fidelity would have allowed us to assess how well the overall structure and layout of the design supported core user tasks and ensure that we were heading in the right direction before investing time into full mockups complete with colors, images, and dynamic interactions.

Thank you's

Thank you first and foremost to my teammates, and to Daniella Kim (Professor and Senior UX Researcher at Google) and Mania Orand (Assistant Professor and UX Researcher at Amazon) for all your support, guidance, and feedback! And special thanks to Daniella for allowing me to interview you for our project!

NEXT PROJECT: Optimism Brewing