top of page
Cover Page.png
Lined Up Books
Project Overview

The accessible mentorship tools will be used by students to find alumni mentors and resources on the school’s website. The students and alumni access only page will also assist faculty in organizing information and reaching out to alumni who wish to give back to school by being a mentor to the next generation.

Project Duration

15 Jan 2022 - 05 Feb 2022

Three Weeks

 

Course

Google

UX Design Specialization

My Role

Designing a responsive website from conception to delivery including the mentorship hub that is specifically designed to the needs of the not-for-profit school

Responsibilities

Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, iterating on designs

Project Overview
Web 01.png
Tablet 01.png
Phone 01.png
The Problem

Finding mentors for community service and internships at the Pre-Collegiate Program of Yangon means relying on a faculty alone. It takes a lot of time back and forth to onboard the students and mentors every year.

The Goal

The mentorship tools are to provide students with resources and directions in finding mentors who are committed to share their knowledge and experiences. These tools and resources, managed by the program’s faculty, should save time for everyone. They will help onboarding students and mentors to the mentorship program. The students-only page will become a resource hub for sharing and discussing about mentorships.

User Research

Interviewing the program director helps me understand the needs of the program management, students and mentors. As a non-profit organization, lean faculty and resources put a lot of pressure on the program. Although there are tools like google drive and excel sheets that the program uses to organize data to share, access was not easy since there are troubles with students losing the link to the shared drive or lost in the emails, etc.

 

The research interview points to the need for a hub or a tool where students and faculty can organize their mentorship finding process. The most useful tools would be a forum where students and faculty can discuss issues, facilitate the onboarding process and orientation, organize and search mentor profiles and share links to become the school's resource collections, ensuring the continuity of institutional memory.

User Research
PERSONA:
Naw Phaw

“I would like to become a lifelong learner and give back to my community through what I learned.” 

Person 1 Book_edited.png
Demographics

Age: 

Education: 

Hometown: 

Family: 

Occupation:

16
High School
Hpa-an
5 (3 siblings)
Student

User Story

Naw Phaw comes from a family of 5 and as the eldest daughter, she will be the first in family to go to college. She is learning English so that she can apply to colleges in the United States or Australia. She joined the pre-collegiate program in Yangon to experience liberal arts education. Being away from home is challenging but she is determined to succeed.

While the faculty and school is resourceful and supportive, she has to rely on them to find mentors and alumni. She wants to be more proactive herself in finding them that she wishes there is some sort of access to school online database where she can look at their profiles and connect with them.

Goals 

  • Finish high school with good grades

  • Learn about colleges abroad and connect with a mentor to get advice from

  • Go to a college in the US or Australia

  • Do a community service while in school

Frustrations 

  • Do not know any platform where I can connect with mentors

  • Relying on faculty to find a mentor

  • School database is not easily accessible

  • Finding alumni to talk means walking in the dark

Personas
PERSONA:
Molly

“I am passionate about educating young adults and helping them achieve their full potential.” 

Person 2 Book.png
Demographics

Age: 

Education: 

Hometown: 

Family: 

Occupation:

38
MA Education
Palm Spring
2
Teacher/Admin

User Story

Molly is a teacher and a school administrator who keeps everyone on their toes to be top of their game. She also share counseling duties with other faculty members. Managing day-to-day operations on top of teaching is time-consuming but a rewarding experience.

 

Molly wishes the school has a system to do these things more efficiently. For example, a central database and communication channel where current faculty and students can have access will be helpful. Then, onboarding new teachers and students will not be as time-consuming yearly. Moreover, it may help run the counseling session more efficiently because students would already have researched on possible connections ahead of time.

Goals 

  • Teach students to think critically and nurture their collaborative spirits

  • Connect students with alumni and possible mentors for their community service work

  • Provide them with resources to prepare for college

Frustrations 

  • Managing school database and communicating with students is time consuming

  • Alumni outreach and mentors search could be more efficient

Wooden Bookshelves
Problem Statements
Persona 1 Laptop.png
Person 1 Book_edited.png
Person 2 Book.png

Molly is a busy teacher who needs an easy tool online to manage mentors for students because onboarding many students and mentors efficiently and effectively will help her save a lot of time.

Naw Phaw is a hardworking student who needs to find mentors for her community service and internships because she wants to gain experiences and knowledge.

Problem Statements
Crazy8s.jpg
Ideation
Ideation
Paper Wireframes.jpg
Paper Wireframes

I did crazy 8s exercise to understand different users need and come up with a few ideas to address the gaps identified in the competitive audit and the program’s need. How might we exercise also helps me come up with potential solutions. My focus was specifically on onboarding students on mentorship program and finding mentors.

Wireframes
Digital Wireframes

After ideating and drafting some paper wireframes, I created initial designs that focus on four main uses identified by the interview with the program director. These designs focused on delivering tools to users for understanding mentorship process and finding mentors.

Top half of the home screen gives four main tools to help students onboard the mentorship process and find mentors.

Forum tool is featured below to encourage students to discuss and get help among each other as well as with faculty.

Wireframe
Wireframe02.png

Create new post button is featured prominently on the top to encourage students to be active in the forum.

Depending on the topics, students can find information related to specific mentors or opportunities.

Low-fidelity Prototype

To prepare for usability testing, I created low-fidelity prototype that connected the user flow of the mentorship onboarding process as well as finding/researching about potential mentors.

 

View low-fidelity prototype:

Mentorship Hub Low-fi Prototype

Low-Fi Prototype_edited_edited.jpg
Low-fidelity Prototype
Usability Study: Parameters
Study Type

Unmoderated

Usability Study

Location

US and Myanmar

Remote

Participants

5 Participants

Length

30 Minutes

I conducted unmoderated usability studies remotely with 5 participants. Each study took about 30 minutes. Using affinity diagramming, I filtered out three main issues to focus on as design develops.

Usability Study
Affinity Diagram.jpg
Findings
Clear Tools

The big buttons are appreciated, an insight is: bright appearances and iconography can be used to accentuate them.

Forum Engagement

Features in the forum were not clear and might be not engaging, an insight is: the buttons and engaging features could be added to increase clarity in function and engagement.

Mentor Profiles

While finding profiles is easy, there is no filter available nor it is grouped by interests, an insight is: users want to filter according to their goals, needs and interests.

Mockups

Based on the insights from the usability studies, I applied design changes that made the tools prominently popped with program branding colors that differentiate them from the forum pages below.

Mockups
Filler.png
Wireframe
Phone 01.png
Filler 2.png
LowFi Profiles.png

Additional design changes included adding an option to “filter by” to allow students to choose what reasons they are finding mentors for with a drop down filter to help narrow down the list.

HighFi Profiles.png
High-fidelity Prototype

The high-fidelity prototype followed the same user flow as the low-fidelity prototype incorporating the design changes made after the usability study.

 

View high-fidelity prototype:

Mentorship Hub High-fidelity Prototype

High-Fi Prototype.jpg
High-fidelity Prototype
Design System
Design System 1.jpg
Design System
Interactive Buttons
(Hover to see in action on web)
Interactive Buttons
High Contrast

High contrast colors are incorporated into the final high-fidelity prototypes for users with visual impairments.

Accessibility Considerations
Labels

Clear labels for all the tools in addition to iconography so that users can read as well as screen-readers.

Icons with text

Major iconographic buttons are accompanied by texts to ensure readability and understanding of the interface for all users.

Accessibility
Sitemap

With the app designs completed, I started work on designing the responsive website. As the mentorship tools will be embedded within one of the school’s website menu, the organizational structure ensures that it delivers cohesive and consistent experience. Nested within “resources” for students and alumni, the mentorship tools will be accessible for students and alumni looking to make connections.

Information Architecture.png
Sitemap
Responsive Designs

The designs for screen size variation included mobile, tablet, and desktop, I optimized the designs to fit specific user needs of each device and screen size.


Tablet: High-fidelity Prototype

Desktop: High-fidelity Prototype

Web 01.png
Tablet 01.png
Phone 01.png
Final Mockups
Responsive Designs
Mockups
Colorful Notebooks
Mobile 04.png
Mobile 03.png
Mobile 02.png
Mobile 05.png
Mobile 01.png
“The mobile and website works seamlessly. It is good that the tools are mobile-friendly because I can use in on the go without the need to be with my laptop.”
Tablet 02.png
Tablet 01.png
Tablet 04.png
Web 01.png
Takeaways
Result/Impact:

Users should be excited about mentorship opportunities as they can take advantage of the resources made available to them by the school. Rather than a daunting task, the mentorship should be enlightening experience because there are tools for students and mentors to nurture an engaging atmosphere.

What I learned:

I learned that even though the problem I was trying to solve requires successful participation of many different stakeholders, the tools were thought out and created along the design process to align with different users needs, mainly focusing on the needs of the students, that they became the focus user group who will most benefit from this.

Takeaways
Next Steps
  • Conduct research on how successful the mentorship tool is in reaching the goal of providing useful resources in finding and connecting with mentors.

  • Add more educational resources for users to learn more about mentorship and building a strong supportive community.

  • Provide incentives to students to engage in the school’s private forum and share resources with each other for present and future waves of students.

Back to Top

Home

Next Project

Next Steps
bottom of page