Skip to main content
Case Study

UX Tree
Mentorship

This was my final college project. I redesigned a version of the UX Tree website that was live at the time — the site has since changed significantly, but the UX problems I found and the process I followed are what this case study is about.

UX Tree app mockup on mobile phone

UX Tree

2023

UX Researcher UX / UI Designer

Figma · Maze · Miro · Google Docs

UX Tree is a mentorship platform connecting early-career UX designers with industry professionals. When I worked on this project, the site had two problems that kept getting in the way — users couldn't navigate it confidently, and the mentor profiles weren't giving people enough reason to apply.

Focus Area 01

Homepage Navigation & Clarity

Users struggled to understand what the platform offered and where to go next. The navigation lacked hierarchy and the homepage messaging was ambiguous — particularly for its primary audience of early-stage designers.

Focus Area 02

Mentor Discovery & Profile Depth

The Mentors page failed to surface the details that actually drive decisions — career backgrounds, skills, mentoring approach, and social proof. Users left without enough information to feel confident applying.

Project Details

Defining the Problem

Problem Identification

User research revealed a consistent pattern: visitors arrived with genuine interest in the UX Tree mentorship program, but left confused. The site navigation was unclear, mentor profiles lacked meaningful detail, and it was difficult to understand what joining the program would actually involve. Key information — such as mentor experience, career trajectory, and mentoring style — was either buried or missing entirely.

Defining Scope

The research made it clear quickly. Users needed more context about mentors, a simpler path to applying, and a page structure that actually made sense. On top of that — contrast, layout and information architecture all needed work.


Methodology

Design Thinking Framework

Design Thinking Framework

Reference: nngroup.com — Design Thinking

I applied the Design Thinking framework throughout the project — moving from empathy and research through ideation and prototyping to validated solutions. Each iteration was informed by real user feedback, ensuring that design decisions were grounded in evidence rather than assumption.


The Key Problems

What wasn't working — and how to fix it

Problem 01

Mentor profiles didn't build trust or drive action

The "Our Mentors" page presented mentors with insufficient detail. Career history, skills, and personality were largely absent, leaving users unsure who to connect with — or even how to view a full profile.

Design Improvements
  • Surface key credentials on mentor cards for at-a-glance evaluation
  • Redesign the profile structure for clarity and visual hierarchy
  • Display information in a more engaging, scannable format
  • Make the path to a full profile obvious and inviting
Problem 02

The program itself was hard to understand

Users found it difficult to grasp how the mentorship program worked, what the benefits were, what would be expected of them, and whether they could have any say in choosing their mentor.

Design Improvements
  • Restructure navigation labels for clarity and intent
  • Create a dedicated page explaining how the program works
  • Clearly communicate expectations and commitments for mentees
  • Explain the mentor-matching process transparently

Research

Understanding users before designing for them

I conducted user research to uncover the real friction points — not just the surface-level ones. This included reviewing how comparable platforms structured their mentor information and communicated their value propositions.

Through competitive analysis, user surveys, and moderated usability sessions, I built a clear picture of what users expected, what was missing, and what would give them confidence to apply.

Research Overview

Competitive Analysis

I analysed three direct competitors — MentorCruise, My UX Academy, and ADP List — to identify design patterns that build user trust, support mentor discovery, and clearly communicate program value.

Competitive Analysis
🧭 MentorCruise

Clear mentor/mentee distinction, visible CTAs, and detailed profiles with mentee reviews create a high-trust environment. Customisable packages signal flexibility and personalisation.

🎓 My UX Academy

Specialised UX focus with a practical, portfolio-driven curriculum. Blended online and in-person offerings signal credibility and accessibility.

📋 ADP List

Visually rich mentor listings filtered by skill, with prominent mentee reviews. The layout makes it easy to evaluate a mentor's fit at a glance.

💡
Key Insight

Users need credible mentor information and visible social proof before they'll commit to applying. Platforms that surface this clearly see significantly stronger conversion from visitor to applicant.


Survey Findings

The majority of survey respondents had not previously joined a mentorship program — not due to lack of interest, but limited awareness of the available options. Once introduced to UX Tree, participants responded positively, expressing confidence that mentorship could accelerate their career growth.

Respondents prioritised mentors with strong industry experience, senior-level expertise, and clear communication skills. They wanted mentorship to support practical skills: user research, usability testing, portfolio development, and career direction.

Survey Findings

Usability Study

I ran a moderated usability study covering three key tasks: locating information about the mentorship program, finding a mentor's full profile, and accessing the application form. The sessions surfaced recurring confusion around navigation labels and homepage messaging — users weren't sure where to click or what the platform was for.

Improvements focused on clearer navigation labels, a restructured mentor profile layout, and a prominent "Our Mentors" call-to-action on the homepage.

Pain Point 01

Users are confused about who this program is for — the homepage title and information were unclear.

Pain Point 02

Users want clear navigation and more organised information about the mentorship program.

Pain Point 03

Users want more information about mentors in a visually appealing and trustworthy layout.

Personas

I pulled everything together using affinity diagrams and empathy maps. Two clear personas came out of that — and I used them as a reference point for every design decision that followed.

Maya

Recent UX Graduate
Maya persona card

Maya needs comprehensive, clearly communicated information about the mentorship program before she'll feel confident applying. She wants to understand the format, the commitment, and what she'll actually gain.

James

UX Designer with a CS background
James persona card

James wants to evaluate a mentor's education, work history, and expertise before committing. He's specifically looking for someone strong in user research and usability testing to support his transition into UX.

Problem Statement

Both personas pointed to the same core gap on the Mentor page: not enough detail to make an informed, confident decision. This became the anchor for the redesign.

Problem Statement — James

James, a UX designer transitioning from a computer science background, needs a mentor with proven expertise in user research and usability testing because he requires structured, personalised guidance to build the practical skills and confidence needed to fully transition into UX design.


Ideate

From insights to design decisions

With a clear problem statement and two grounded personas, I moved into ideation. I used Crazy 8 paper prototyping to rapidly explore layout directions for the Mentor page and profile view — keeping the focus on how information could be structured to reduce friction and increase confidence.

Crazy 8 Paper Prototyping Sketches

Mentor Page — Before & After

Original Original Mentor Page
vs
Redesigned Redesigned Mentor Page

Changes to the Mentor Page

  • Page Title Added "Our Mentors" heading with a supporting hero image — reduced in size to prioritise content
  • Navigation Retained the original menu structure, adding dropdown indicators to subcategory items for clarity
  • "Full Profile" Button A clear CTA on each mentor card signals that more information is available
  • Core Mentor Info Name, current job title, and tenure with the program displayed prominently on each card
  • Card Structure Each card now contains: photo, short bio, key skills, and a "Full Profile" button
  • Skills Highlight Each mentor's strongest areas and areas of expertise are surfaced at card level
  • Visual Consistency Colour palette and design language kept consistent with the rest of the platform

Mentor Bio Page — Before & After

Original Original Bio Page
vs
Redesigned Redesigned Bio Page

Changes to the Mentor Bio Page

  • Header Mentor photo, name, and job title presented prominently at the top of the page
  • About Me A personal introduction written by the mentor — covering professional background, interests, and approach
  • Skills A clearly structured list of the mentor's key skills and areas of expertise
  • Case Studies Selected examples of past mentoring work, adding credibility and context
  • Experience & Education A clear career and academic history to support informed decision-making
  • Mentee Reviews Social proof from previous mentees to build trust and transparency

Testing

Prototype 1 — Testing & Findings

View Prototype 1 in Figma

An unmoderated usability test was run in Maze with six early-stage UX designers. Participants were asked to navigate to a mentor's full profile and share qualitative feedback on the layout and content.

While all three tasks were completed successfully, the feedback surfaced clear improvement areas for the next iteration.

Prototype 1 — User Flow & Test Results
33%

of users spent too long on individual screens

42%

average misclick rate across tasks

6/6

participants completed all assigned tasks

User Feedback Themes


Iteration

Prototype 2 — What changed

View Prototype 2 in Figma Prototype 2 — Revised Screens

Final Design

Live Prototype


Additional Findings

Homepage messaging was excluding the target audience

A significant finding emerged beyond the Mentor page: the homepage was inadvertently communicating that UX Tree was for experienced designers. Early-career users — the actual target audience — felt the program wasn't meant for them.

Renaming the hero headline to "Build your UX career" and refining the supporting copy immediately improved comprehension during testing. Additional structural changes included:

Homepage Before & After Changes

Reflection

What I learned

🎯

Start with empathy, not assumptions

Sitting with users early in the process — before designing anything — saved significant rework and led to solutions grounded in real behaviour.

🗂️

Structure is a UX decision

Information architecture choices directly affected whether users felt confident or confused. How content is organised matters as much as how it looks.

🎨

Visual design earns trust

Improved mentor profiles — with consistent hierarchy, skill tags, and reviews — increased perceived credibility and user confidence to apply.

💬

Clarity converts

Transparent messaging about program expectations and mentor matching removed friction. When users understand what they're signing up for, they're more likely to act.

🔁

Iterate with intention

Each round of testing revealed something the previous iteration missed. Shipping fast and learning quickly is only valuable when feedback is applied with discipline.


What's Next

Next Steps

01

Further Usability Testing

Validate the latest design iteration with a fresh cohort of early-stage UX designers to confirm improvements and surface any remaining friction points.

02

Mobile-First Optimisation

Audit and refine the experience across all screen sizes, ensuring navigation, mentor cards, and application flows work seamlessly on mobile.

03

Behavioural Analytics

Implement event tracking to monitor how users navigate the redesigned pages, identify drop-off points, and prioritise future improvements with data.

04

Continuous Feedback Loop

Establish an ongoing mechanism for collecting mentee and mentor feedback post-launch to adapt the experience as the community grows.

05

Content Expansion

Develop additional resources — FAQs, onboarding guides, and program explainers — to support mentees at every stage of their journey.