Overview

Background

Solution

Process

Impact

Reflection

HackerHelper

Case Study

6 min read

At hackathons, mentorship support often uses inefficient processes. Participants struggle to find the right mentors, communication is disorganized, and many requests are left unanswered. To solve that problem, we created HackerHelper, a ticketing platform designed for organizers to streamline and optimize mentorship support. The solution helps facilitate communication, track help requests, and increase overall satisfaction to drive higher mentor and participant retention. This solution was given to SFU Surge for implementation.

Jump to Solutions

Client

SFU Surge

Role

Product Design, UX Research
Lead, Wireframing, Visual Design,
Illustration, Motion Design

Timeline

July - August 2024 (1 Month)

Team

Christina Raganit (UI Designer)
Gurnisha Rehal (UX Research
Assistant & UX Writer)

My Responsibilities

As a UX designer and researcher, I planned and facilitated all user research activities and synthesized insights to define the problem space. I then led the end-to-end feature design and ideas by visualizing them into user flows and mid-fidelity wireframes for both desktop and mobile platforms.

My Responsibilities

The designs were handed off to our UI designer to develop the design system components. I also led key design iterations post-testing, drew all illustrations in Figma, and led the creation of all presentation materials and visual deliverables for stakeholder communication.

BACKGROUND

What’s a Hackathon?

An event where hackers collaborate within teams over a short period of time, typically 24 to 48 hours, to develop software or hardware projects.

Hackers

Students who form teams and compete to build solutions.

Mentors

Experienced professionals who provide guidance to teams.

Organizers

The event coordinators responsible for planning and managing logistics.

Judges

Experts who evaluate projects and select hackathon winners.

THE PROBLEM

The current mentorship request process in hackathons is error-prone, causing delays and unresolved help requests.

INTRODUCING

HackerHelper

TICKET CREATION

A structured, file-supported request system.

Pain Point

Hackers struggle to describe issues clearly which complicates mentors' ability to assess issues efficiently.

Feature Impact

HackerHelper introduces a streamlined ticketing system that eliminates vague problem descriptions and helps hackers track requests. With clear issue categories, mentors can also quickly assess and accept requests.

ONBOARDING & SET-UP

Introducing new users to the console.

Pain Point

Hackers and mentors are unfamiliar with the dedicated mentorship console and don't understand its purpose.

Feature Impact

To reduce confusion, I added onboarding steps to guide users and designed an 8-second welcome animation to provide a quick visual overview of the platform’s purpose.

MENTOR DASHBOARD

Personalized home page and ticket recommendations.

Pain Point

The current ticket tracking systems are inconvenient and ineffective, causing lost submissions, unresolved requests, and delayed mentor assistance.

Feature Impact

Our platform personalizes the mentor dashboard based on skills and requests status and introduces a filtering system, allowing mentors to assess requests even faster.

MENTOR DASHBOARD

Submit a reassignment request to another mentor.

Pain Point

When a mentor can’t resolve a request, there’s no clear way to redirect it, leading to stalled progress, frustration for hackers, and discouraged mentors.

Feature Impact

HackerHelper allows mentors to refer requests to more suitable peers. This reduces pressure, encourages collaboration, and ensures that hackers still receive timely, qualified support.

FEEDBACK SYSTEM

Improving mentorship quality and the overall hackathon experience.

Pain Point

Inconsistent and low quality mentorship support impacts participant engagement and reduces future retention.

Feature Impact

The immediate, qualitative feedback system fosters a supportive environment, encouraging mentors to improve and feel valued when they get a positive comment.

HOW DID I GET HERE?

Research and design process

Celine sent a message.

Exploratory Research

SURVEY

Identifying the target audience and problem space.

To determine which stakeholders faced the most significant challenges, I designed and distributed separate surveys for three user groups; mentors, organizers, and hackers.

KEY FINDINGS

Mentorship request process found to be the most pressing issue.

Mentorship request process is the only pain point affecting hackers, mentors, and organizers alike and presents the most pressing and viable case for a digital interface solution. However, qualitative insights are needed to further validate this issue and ensure it is the right problem to focus on.

USER INTERVIEWS

Diving deeper to understand why these problems were happening.

Competitive Analysis

As the surveys allowed me to identify what the key challenges were, I still needed to figure out the reasons behind these pain points. To build context, I began with desk research and a competitive analysis of existing tools, then planned and facilitated 8 user interviews with mentors, hackers, and organizers to explore the frustrations they face when seeking help and managing requests.

Pain Point | 1

Requests are hard to track, forgotten, or lost in channels.

You have to ping the channel and hope [a mentor] will come to you. Could be more streamlined cause every time I ping for help I see threads like “Where are you?” or “Has someone helped you?” so oftentimes they get buried.

Pain Point | 2

Hackers struggle to describe issues clearly, making it difficult for mentors to assess the problem.

I went to help and listened, but it turned out there were only minor mistakes. My intervention and asking them to explain wasted both of our time because the issue was so simple.

Pain Point | 3

When mentors can’t solve an issue, asking for help is time-consuming and adds more clutter to channels.

It’s hard to communicate if I want another mentor to take over without spamming Discord.

Pain Point | 4

Low quality mentorship support decreases engagement and retention.

The mentor system didn’t work properly and I’d like to see mentors give more advice than they did, even a briefing or presentation would be good. I don’t go to hackathons anymore because of this.

FRAMING THE PROBLEM

How does this impact hackers and mentors?

Mentorship request process is the only pain point affecting hackers, mentors,

Hackers lose time

Unresolved requests causes frustration for as hackers waste time waiting for help.

Decrease in hackathon satisfaction rate

Low mentorship quality or unresolved requests makes hackers feel unsupported and ignored.

Mentor burnout

The clutter in messaging channels complicates mentors' ability to assess issues and find relevant requests.

Mentors are discouraged

Public referral process is time-consuming and discouraging as it makes mentors feel unqualified.

DESIGN CHALLENGE

How might we connect hackers who encounter issues with the right mentors to ensure timely, effective support?

Celine sent a message.

Solution Development

IDEATION

Mapping out key interactions of the request system.

Mid-Fi Wireframes

I used my research foundation to translate insights into user flows and wireframes. The proposed solution, HackerHelper, is a help request ticketing system designed to streamline mentorship at hackathons.

Ticket Request System

Hackers submit structured help requests, and mentors receive personalized ticket recommendations based on their expertise.

Mentor Referral

If a mentor can’t resolve a request, they can refer it to another mentor with the right skills and expertise.

Feedback Form

After a mentorship session is complete, hackers can provide feedback to improve mentor effectiveness and track resolution quality.

DESIGN SYSTEM

Building the design system for scalability.

Illustration Kit

To ensure consistency across the interface, we developed a comprehensive design system with WCAG accessibility guidelines in mind. I contributed by designing vector illustrations for empty states, onboarding tutorials, and visual markers of content categories to improve the interface’s overall usability.

Celine sent a message.

Evaluative Research

USABILITY TESTING

Refining the prototypes through user feedback.

To validate our designs, I conducted 5 usability studies over Zoom. Each study included 2 hackers and 3 mentors. These sessions provided insights into how each group interacted with the system and identified key usability issues.

Usability Findings | 1

2/2 hackers felt the form was too long and difficult to convey their feedback.

I wouldn’t use this much because I feel like if they were average, i wouldn't give feedback. I would do it if they were exceptionally good or bad. Right now, the send feedback page has a lot of words. I would personally skim this. I prefer a slider like 1 -10.

I prefer to leave a comment on other mentor feedback like the ‘ratemyprof’ website. So this is something other [hackers] can see so they know the mentors abilities. I want to tell other people about my specific experience.

Revision

Simplifying the feedback system with a single input field.

Hackers wanted a more flexible way to share feedback, with one preferring a free-form comment system over structured survey responses. The revised form removes MCQs and replaces them with a text input box.

Usability Findings | 2

3/3 mentors struggled to assign tickets to themselves.

I am confused. Which button do I click to assign the request to myself?

Revision

Simplifying ticket assignment and discoverability.

The CTA was redesigned to improve visual hierarchy, information architecture, and interaction clarity. Secondary actions such as copying the request link or reporting are now housed under a three-dot menu in the top-right.

Usability Findings | 3

3/3 mentors are overwhelmed with the notifications page but didn’t notice our existing filter functionality.

There’s a lot here. Can't tell by just skimming, i have to read to understand because there's a lot of different things.

Revision

Improving filter visibility on the notifications page.

Mentors felt overwhelmed by the notifications page and didn’t notice the existing floating filter icon. The filter was redesigned as persistent tabs to reduce clicks and improve visibility.

Usability Findings | 4

3/3 mentors didn’t find value in numerical performance ratings.

Unless the number is really low, it’s hard to tell what I need to improve on.

I personally think that the actual numbers shown is a discouragement if I don’t do well. When I think I did well but people give me a 3/5, it feels very direct with the numbers and would affect me.

Revision

Shifting from numerical ratings to qualitative feedback.

The feature is replaced with an open-ended text feedback form. This approach not only helps mentors understand how to improve but also creates an opportunity for positive reinforcement, as hackers are more likely to leave comments when they have an exceptionally good experience.

Celine sent a message.

Exploratory Research