Research

I started off this design challenge with a lot of questions, and dove straight into the research phase to start brainstorming and getting a feel for the topic I’d be spending the following week on. My research came from three different sources.

The Survey

First, I posted a survey online asking students who’d previously acted or were currently acting as mentors or mentees to fill it out. The purpose of this survey was to uncover goals, motivations, and most importantly, pain points. Some of the questions I had included the following:

I ultimately received seven responses to the survey, which was sufficient to start noticing some trends about the delights and challenges of mentorship.

The Phone Call

My next stage of research involved calling the director of mentorship for my program of study. The answers I received through the survey were interesting, but often not very detailed. By speaking with the director, I was able to develop a strong understanding of how mentorship currently works on campus. I learned about strategies that had been applied over the years to enhance the mentorship program which would ensure I didn’t reinvent the wheel, and I also took note of some factors that might act as a handicap for me since I was designing a digital experience rather than an on-campus club or program.

The Comparative Analysis

Finally, I took my research online to explore how other companies were approaching mentorship. While some products like LinkedIn were targeted specifically at professional development, others like Big Brothers Big Sisters of Canada were more focused on finding a life-long friend. Along a different but similar grain were friendship apps like Bumble, Hey! Vina, and Meetup, which also provided inspiration for features that may be of use in this new experience I’d be creating.

The Problem

Putting together all the results of my brainstorming session and research, I began noticing something interesting. The common challenges and hesitations that mentors and mentees faced were - in most cases - very similar. The following are some of the key issues that I discovered:

  1. Meaningful Connection
    Many students found it difficult to go beyond the surface level and develop a strong social and emotional connection with their mentors/mentees since their personalities, interests, and goals simply did not align.
  2. Coordinating Schedules
    All seven of the survey respondents claimed that finding a mutually convenient time to meet was one of the biggest logistical challenges of mentorship.
  3. Handling Expectations
    Though it may be clear in theory what your expectations are as a mentor/mentee, it turned out that knowing how to fulfill these roles in real life was a bit more challenging. The mentorship director explained that mentors wouldn’t know what type of help to offer their mentees, while mentees didn’t know what to expect from their mentors.

In addition to these problems, I realized that one of the biggest handicaps of designing a digital experience rather than an on-campus club or mentorship program was that there would be no authority for students to reach out to. For instance, if a mentor didn’t know how to respond to a mentee’s request, who would they ask for help? Alternatively, if a mentor was repeatedly missing meetups or failing to communicate, who would hold them accountable, and who should the mentee reach out to?

Clearly, all four of these problems could be faced by both mentors and mentees. The overarching issue didn’t seem to be drawing students into mentorship programs, but rather maintaining the mentor-mentee relationships, which - for a variety of reasons - often turned out to be too cumbersome or frustrating to manage.

Brainstorming

Having understood and established these as the four key issues, I landed upon my mission statement:

Help mentors and mentees develop lasting relationships.

To begin ideating potential solutions to the issues, I settled on a “how might we” approach, and brainstormed multiple different ideas for each of the problems.

How might we support mentors and mentees in establishing meaningful connections?

How might we make it easier for mentors and mentees to coordinate their schedules?

How might we better equip mentors and mentees to handle their expectations and fulfill their roles?

How might we assist mentors/mentees when they run into issues with each other?

The journey

Completing this brainstorming session enabled me to establish some of the key features, actions, and information I wanted to include in the experience. The next step was putting everything into a user flow to ensure it made sense. I had a lot of ideas, but needed to map them out to determine which ones would fit into a smooth journey, and which ones to maybe raincheck for later.

As I built the journey that a user might take through the app, four clear stages were established.

  1. Sign up
  2. Create profile
  3. Select matches
  4. Follow up

The tasks that each stage consisted of can be found in the following journey sketch.

Sketches

Now that I knew which features I wanted to implement and placed them into a logical flow, I could sketch out some of the essential screens to start bringing the experience to life.

Wireframes

After racking my brain a bit on paper and getting the fundamentals down, I had a rough sense of how I wanted to present my design, so I moved over to Sketch to begin laying out some lo-fi wireframes. A few iterations later, this was what the overall journey looked like in Sketch.

Sign Up

Let’s start from the very beginning with the home page. There is a call to action on this page to sign up for an account, which leads to a separate page where users can continue through Facebook, Google, or other means like email, but this experience is pretty standard. What’s more important about the home page is the instructional graphics explaining how the app is useful for both mentors and mentees. These graphics are for more than just visual delight - they will serve to educate and intrigue users about the purpose of the app as well as convey the value proposition, so that users are convinced to take the next step of signing up for an account.

Create Profile

Once sign up is out of the way, users can begin tailoring their experience, starting off with indicating whether they intend to be mentors or mentees. A brief description of who should sign up to be a mentor (experienced students) and who should sign up to be a mentee (new students) aims to clear any confusion users may experience when making this decision. Though in other cases it might be necessary for the mentor to have certain qualifications or field expertise to make them eligible to support mentees, since the purpose of this experience is simply to get new students acquainted to the school environment, anyone can be a mentor as long as they are familiar with the ins and outs of campus life.

Next, it’s time to start adding personality to their profile. The user is asked to add a profile picture, as this will assist in building trust and rapport with the other user group. The user can optionally add more photos to their profile to show off their personality, but the profile photo is a minimum requirement.

From there, users can begin adding personal details to their profile. Aside from the basics like their name, gender and birthday, users are asked to input their program and year of study. This can be beneficial for those who are looking to match with individuals that are pursuing a similar path academically. Users are also asked to describe their ideal mentor/mentee, as well as the #1 thing they want out of the mentorship experience. So if a mentee is to read these details on a mentor’s profile, they can quickly understand what the mentor might expect from them, and also what the mentor’s goals are to determine whether they’re aligned with their own. Finally, individuals can connect various social channels to their account - coming from a generation that lives and thrives off social media platforms, this can help students connect on a more personal level, and potentially discover common interests.

The final stage of creating the profile, also designed to support meaningful connection, is the personality quiz. A series of ten questions aims to assist the algorithm in learning more about the individual, such that it can filter down and recommend matches whose personality and interests are aligned with theirs. A progress bar at the bottom of the quiz makes filling it out less cumbersome, and the simple multiple choice format makes it easy to breeze through the questions without investing too much effort.

Finally, there is a loading animation displayed on screen as the algorithm gathers the quiz results and pulls profiles from the database to recommend to the individual. Rather than causing impatience, the loading animation serves to build anticipation, and validates the effort that the user has spent creating their profile. If matches were to be shown right away, the user may question whether or not the app has actually taken their responses into consideration and filtered down the results.

Select Matches

The much-awaited matches are finally presented to the user. A familiar swiping gesture enables the user to skim through their options and narrow down the filtered list even further by selecting the candidates that they are most interested in partnering with. A brief message on screen indicates to users that even after they have swiped left (“rejected”) a candidate, they may go back and swipe right on them, so that they can comfortably take a look at all the available options.

If an individual swipes right on a user who swiped right on them, the two will match. At this point, based on the common interests of the two individuals, recommendations will be presented for places and events around campus that the two can meet up at. For instance if they both happen to be fans of archery, the algorithm may recommend they attend the campus archery club meetup together. These recommendations make it easier to coordinate the time and date of the initial meetup since these details are pre-defined, and also give the mentee the opportunity to explore campus offerings with their mentor, which is one of the key objectives of the experience.

After matching, the mentor and mentee can start a conversation to get familiarized and plan their first meetup. An individual’s messages and matches are stored on the same page, as the intention is that matches will develop into messages, and if the user is low on messages, they can flip back and skim through more matches.

Another key part of the matching experience is notifications that alert a user anytime a new match is recommended for them. Notifications ensure that the user is periodically reminded to check in on the app and the status of their matches. So even if a user doesn’t receive any matches of interest initially, they will continually be notified of new options as long as the app is installed. This is also great for new users who sign up for the app, as their profile is essentially advertised to all the individuals they’ve been matched with as soon as they enter into the system.

Follow Up

Once a user has successfully met up with their mentor/mentee, if everything went smoothly and they are interested in getting together again, they can share their calendars with one another to make it easier to coordinate future meetups. The calendar can be shared without any specifics so that the pair can simply check one another’s availability. This tackles the challenge that users are currently facing of coordinating schedules.

Users can also rate one another following the meetup based on their punctuality, communication, and overall quality using a five-star system. Knowing that their mentor/mentee can rate them will serve to hold users accountable, and encourage them to invest genuine effort into maintaining the relationship. Ratings also serve the dual purpose of vouching for “good” users, and flagging “bad” ones. In addition to a poor rating, if an individual has a particularly traumatizing experience either before, during, or following the meetup, they can simply block or report the user altogether.

Sometimes, it’s possible that either the mentor or mentee will run into a situation that they are unsure of how to deal with. For instance, say a mentee asks their mentor if they can support them financially. Though it may be clear to the mentor that this would be overstepping a boundary, they may not know how to handle the request without hurting the mentee. This is where The Cloud comes in. Both mentors and mentees have access to separate portals referred to as “The Cloud”, where they can start conversation threads that other mentors/mentees on the app can respond to. In this case, the mentor could start a thread asking for recommendations on how to handle the situation, and other mentors on the app could reply with suggestions for how they might deal with the request. Using the collective knowledge of the app users in this way helps overcome the handicap of not having an authority or organizer to reach out to for help. The Cloud would also have articles, FAQs, and advice available for mentors/mentees to refer to whenever needed.

High fidelity prototype

With the UX and interaction flows of the app fully thought out, I wanted to spend the last little bit of the week designing the UI and establishing the look and feel of the experience. Inspired by the material design guidelines, I opted for a minimal, bright look, aiming to design interactions that users could pick up on without any explicit instructions. Rather than designing every screen in high fidelity, I opted to focus on the screens included in the flow of creating a profile, and spend the remaining time establishing a strong visual identity for the app.

For the colour palette, since the prompt had mentioned that the ecosystem in which this experience would live would be my school, I decided to use my university’s trademark navy as the primary colour. I felt this would be relevant to all the students at our school, mentors and mentees included, and create a sense of belonging for them within the app.

Iteration 1

For the first hi-fi iteration I produced, I stuck relatively closely to the wireframes I had designed in terms of the layout of the app. Perhaps too closely, because once the design was finished, it still looked very much like a wireframe. I felt that the design lacked character, which was disappointing since this was one of the first interactions that users would have with the app. If I was unable to build engagement early on in the journey, dropoff rates would be high.

Iteration 2

In an attempt to create greater contrast and a more attractive visual experience, I inverted the colour scheme, replacing the bland and boring white colour with more of the navy colour. I quickly came to realize that this navy iteration really just resembled what the app might look like in dark mode. Some quick user testing showed that the preferences were split directly down the middle - those who typically kept their smartphones on light mode preferred the first iteration, while those who were partial to dark mode preferred the second. The original problem still remained - how could I add more character to the design, and make it look less wireframe-y?

Iteration 3

After another crack at the drawing board, I finally came to a design I was satisfied with. One of the key changes I made was replacing a few of the standard icons with images of real students to create a warmer look within the app and inspire users to develop mentorship relationships of their own. I also made some minor adjustments to the colour palette, adding an accent colour to break the monotony of the navy and white screens. This accent colour was a slightly duller shade of the navy and I applied it to incomplete interactions, or interactions that I wanted to discourage, such as the “Maybe later” option for filling out the personality quiz since the sooner the user fills out the quiz the sooner they can start being matched up with other users in the system.  

In addition to revamping the design visually, I made some changes to the overall onboarding experience such that it would less taxing on the user. In the initial screen where the user selects whether they want to be a mentor or a mentee, I realized that the text in both buttons was extremely similar, which could slow users down and potentially lead them to make the incorrect selection. As such, I reworked the layout of this interaction to make the two buttons more distinguishable.

For the profile details, though I’d initially put all the questions on one page so that users could quickly hammer out their responses, I realized that seeing such a long screen full of questions right off the bat could be daunting for users. Thus, I made the decision to split the questions up, with generic questions on the first screen, and questions that required a bit more thought on the second for the user to answer once they’d gotten warmed up. Now that all the questions weren’t on a single page, I made sure to indicate what page users were on so that they knew not to expect too many more questions.

Next, before getting into the personality quiz, I put an interstitial describing the purpose of the quiz for two reasons. First, in the old layout, the description was present in every screen of the quiz, which added unnecessary clutter since users only needed to read the description once to understand what it was for. The second reason for having this interstitial was to give users the option to come back to the quiz later without worrying about losing their progress, since the onboarding process is a bit lengthy.

Finally, I redesigned the screens containing the quiz question such that each question is presented on its own in large, clearly visible text. The screen will auto-slide each new question into view once the previous question is answered, reducing the amount of effort required by the user, but arrows are also available in case the user wishes to go back and edit a response. Icons have also been used to make the questions a bit more engaging, and a status bar at the bottom of the screen keeps users informed about their progress.

A Lesson learned

All in all, I had a fantastic time working through this design challenge. It certainly shook up my day-to-day routine, as I found myself thinking about the problem space and potential solutions at random points throughout the week, continuously mentally iterating on my ideas as I gathered inspiration from the world around me.

As great as an exercise as it was to get my UX gears turning, this challenge truly renewed my appreciation for user feedback. I sincerely believe that iteration is the only way to build great products, but despite the many versions I went through to reach a final design solution, the key ingredient that was missing throughout was user feedback. Talking to users in the initial stages of my research enabled me to establish a strong understanding of the problem space. However, when it came to actually coming up with a solution, knowing that I was only allowed to consult users for feedback upto a certain extent limited my design potential. As I kept iterating with little user input, my designs were not able to surpass my own personal opinions and biases.

Therefore, though the solution I’ve presented may be a reflection of my abilities, it does not necessarily reflect the full potential of this product, which I strongly believe can be capable of so much more once we incorporate user feedback into the process. I’m glad to have reached this realization through the challenge, and extremely thankful to Google for the opportunity. Looking forward to more thought-provoking exercises like this in the future!

Powered by coffee and users like you.