All designs should undergo:

Phase 2 Designed Features

Feature Recommendation Details
Landing page 1. Updated mentor profile example - The mentor section of the landing page has an example image of the mentor profile.
  1. View more feature for testimonials - Design a way for users to view more details on the testimonial cards | 1. Updated mentor profile example - The PNG image provided as an example of the mentor profile should be updated once the mentor profile has been finalized. The frame should then be exported as a PNG and given to dev.

  2. View more feature for testimonials - Currently, the placeholder testimonials are cut off. There should be a way for users to see the entire review. *Note: testimonials will not be a feature upon first launch of the platform | | About page | 1. Video - provided by Sean’s Legacy stakeholders | 1. Video - could help provide users more clarity about the program's mission etc and quickly help gain users trust in the platform | | Sign up/log in modal | 1. Google option - users that sign up using the Google option should also be certifying via a check box or other method that they are at least 18 years or older.

  3. Forgot password link - should provide a way for returning users to reset their password. | 1. Google option - Phase 2 team was unable to make this iteration to the sign-up modal due to time constraints. (only have the check box for age verification for users that sign up with an email)

  4. Forgot password link - we did not design the steps that follow for this use case. | | Email verification | 1. Resend email - design a screen users see if they click resend email | 1. Resend email - phase 2 did not design for this use case. Users need a screen that serves as feedback that the email has been resent upon their request. | | Onboarding | 1. Error states - design error message users would see if they don’t fill out required input fields (minimum required info & focus areas)

  5. Timezone dropdown menu - design how the active open drop-down menu would look and behave | 1. Error states - serve as feedback to users that their entry was invalid for these required steps. (minimum required info & focus areas)

  6. Timezone dropdown menu - compile a list of up to date timezones in the US to inform the design of this dropdown menu (Create a profile to book mentors, Onboarding screen) | | Two-Factor Authentication | 1. Error states - design an error message that users would see if they input the wrong phone number or code.

  7. Resend code - design screen or tooltip users would see if they click resend code | 1. Error states - serve as feedback to users that their entry was invalid for this required step. (wrong phone number or code)

  8. Resend code - we did not design for this use case. Users need a form of feedback that confirms a code has been resent upon their request. | | User Dashboard | 1. Tool tips - Design tool tips to show users around their dashboard

  9. **Recommended mentors-**separate out the different recommended mentors | 1. Tool tips - There are a variety of different options for tooltips in the design system (noted in the annotations doc). They should be used to guide users to their next step.

  10. **Recommended mentors-**There is recommended mentors for new users based on focus areas and recommended users for users who have taken the match questionnaire. This should be separated and titled differently to reduce confusion. I.e. Recommended mentors & Matched mentors | | Mentee profile | 1. Disabilities section - adding this area as part of identity

  11. Interests section (hobbies) - pre-defined list of common hobbies

  12. Modal error states - design error states for the modals

****4. Explore cultural backgrounds - Collaborate with UXR to explore what cultural backgrounds to include

  1. Location - an optional section in the mentee profile

****6. Editing modals - designing the function of editing/add more

  1. Prototyping - the step by step process from onboarding to editing profile.

  2. AntDS - adding missing components

  3. View More- how does it look like when mentee writes a really long bio? How do it look like for multiple work experiences/education

  4. Skinny Footer/No footer

  5. Align Mentee/Mentor profiles | 1. Disabilities section - Phase 2 Content team had a great idea to add a section to include disabilities since it is a big part of identity and SL is an inclusive platform. Confirm with client and UXR.

  6. Interests section (hobbies) - predefined lists of common hobbies are needed to inform the back-end database and allow users to input these as tags that are clickable. (collaborate with dev team)

  7. Modal error states - We were unable to create error states for the edit profile modals. This feature should be ideated upon. I.e. Error message for when mentee enters or selects more options than allowed

  8. Explore cultural backgrounds - What are the most inclusive terminologies we can use?

  9. Location - add an area on the profile and modal (or include it in an existing modal) for city and state- (it is kept optional

  10. Editing modals - explore what the editing modals would look like, should the mentee be able to add more info? We were unable to explore this.

  11. Prototyping - designing all the screens and modals for prototyping (testing) and for dev.

  12. AntDS - adding the avatar with pencil button, adding mentee card (header/bio/ex., interests, and identity), resizing avatar in AntDs.

  13. View More- we did not add how it looks like when a mentee writes a really long bio or multiple work experiences. Suggest looking at the phase 1 mentor profile in final mockups and implementing ellipse for long bio and view more links for more experience

  14. Skinny Footer/No footer- depending on footer decisions of Phase 3, a skinny footer or no footer is recommended for the mentee profile (use cases LinkedIn, Facebook, ADPList)

11. Align Mentee/Mentor profiles - depending oh usability testing from mentor point of view and usability testing for mentee pov in Phase 3, the future design teams should come to a unified profile look. | | Match Questionnaire | 1. Define what a “great match” and a “good match” means

  1. Side navigation sizing - AntDs’ “steps” component is used and framed to create a side nav - Collaborate with Dev to implement the design using the existing component or a similar solution

****3. Explore cultural backgrounds - Collaborate with UXR to explore what cultural backgrounds to include.

  1. Additional Tag Entry Input - Explore usage of input fields present on certain questions to allow more convenience to the user

  2. Error state- for when user enters more than 3 options


  1. Match questionnaire results- WIP as mentor booking is still currently to be decided and refined. | 1. Define what a “great match” means and what a “good match”- How is a great match calculated? Will there be multiple levels of match criteria? ie. great match, excellent match, etc. How does that get weighed? -Generally, we recommend to define what it means and then from there work with dev to establish those metrics

  2. Side navigation - width should be consistent throughout the platform -coordinate and decide on side nav width following AntDs’ side nav formula of 200+8(n) and have it be the same for search and filter side nav and anywhere else that needs side nav

  3. **Explore cultural backgrounds -**What are the most inclusive terminologies we can use? Should the cultural backgrounds listed mirror the background that mentors on the platform identify with?

  4. Additional Tag Entry Input - The input field below some questions in the questionnaire is not available for all screens or questions that utilize a tag system answer format and is recommended to be used on an as-needed basis as platform scales.

Important note: How tags will show up from this input after being entered has not been fully built out and will most likely require consideration in the future between UXD and Dev

  1. Error state- for when user enters more than 3 options, an error message should pop up to tell users they can’t select more than 3

  2. Match questionnaire results screen will need to be updated to reflect the booking process once that gets decided and designed. | | Search/filter | 1. Update mentor cards - to accommodate 1 or 2 lines of text for job position

  3. Revisit copy on mentor cards - “Available this week / Available ASAP / Available now” -Update new focus area tags

  4. Preference test of mentor cards - There are multiple options that could be used for the mentor cards. Test to see what version users prefer.

  5. Create a user story for the applied filters

  6. Explore how the results are sorted - after the user has completed their questionnaire, and applied filters | 1. Update mentor cards - Currently, when there is one line of text for job title & company, the tags fall below the text. They should stay consistent, no matter how many lines of text there are.

  7. Revisit copy on mentor cards - The current iteration shows tags of mentors available in a timeframe of the near future as “Available this week.” We initially had “Available now” but received feedback that “now” was confusing—were mentors online for a call right that second? Could mentees speak to them within the week? Or does it just indicate that they have open, bookable spots in their calendar?

-Mentor card components also need to be updated across platform to accommodate new focus areas

  1. Preference test of mentor cards - The different versions are located in the design system next to the mentor card component. Currently, we’re using the version with focus areas tags, but depending on user preferences, more tags could be used to offer more info upfront. We have also ideated a hover state option, which shows more tags upon hovering over the card (also located in the design system).

  2. Create a user story for the applied filters - The applied filters should follow a user story so the final prototype aligns with user research

  3. Explore how the results are sorted - after the user has completed their questionnaire, and applied filters. Will the user still see mentors with a great match tag, or should this be only accessed through the questionnaire? |

Phase 2 Out-of-Scope Features

Feature Recommendation Details
Notifications Adding a notifications link or icon with a drop-down in the nav bar. Adding notifications will allow users to keep track of certain activities such as a mentor approving them to view their calendar of availability. etc
View & re-schedule sessions with a mentor Design a way for users to view and reschedule sessions with mentors How can users do this from their dashboard? Is this possible using the Calendly API, collab with dev
Date of upcoming session Design a way for users to see their upcoming session dates Collaborate with dev, how can this be achieved using the Calendly API?
Save a mentor feature Users should be able to save mentors of interest to a list. Users will search for mentors and might not necessarily be ready or want to book a session with those mentors yet. They need an area to refer back to that has their mentors of interest saved.
Refer a mentee link Add a link to the top nav bar/menu dropdown that lets users refer mentees This link would be implemented and displayed on the landing page in the top nav bar, the link would redirect to a new page that goes into more detail about referring someone the user knows as a mentee
Refer a mentor link Add a link to the top nav bar/menu dropdown that lets users refer mentors This link would be implemented and displayed on the landing page in the top nav bar, the link would redirect to a new page that goes into more detail about referring someone the user knows as a mentor

This webpage would display options for recommending a mentor or for a mentee aka this would be the same webpage that both the mentor and mentee referral links would lead to

The page could be split offering links for both routes, I’d recommend exploring where the link would take the user (initially to onboarding for the potential new user but leaving that up to interpretation) | | Badges & gamification | | | | Prompts to answer before a session to help structure the meeting | | | | Messages | Design a messaging system for mentees and mentors to communicate with each other within the platform | Establishing connections is very important to users and a messaging system integrated within the platform could help with user retention and help mentor/mentee connections | | Resources | 1. FAQ page 2. Links to job boards | | | Mentor reviews | Design a way for users to leave mentor reviews | Reviews can help gain mentee users trust in the platform and validate what the landing page and about page market | | Growth & goals tracking | | | | Request to book a session | | | | Reporting | Figure out what the reporting process looks like and where it should be implemented (i.e. on the profiles) Also if mentees can also be reported and if that process differs between mentor and mentee | |