Quick Links

<aside> 🤝 Design Files Phase 2 Phase 2 Final Demo to Client

• This is a high level overview presentation to the client about our work contributions and collaborations during Phase 2 which led to our final MVP.

Phase 2 Design FigJam

• This is a collaboration document used during our working sessions and for recording our thinking throughout the research part of this phase. We switched to the Figma file linked below about halfway through the phase.

Demo Presentations

• This document includes all of the sprint demos we’ve done, excluding the final demo

ANT Design System

• This is the current design system we are using.

SL UX Design 2

• This file includes all the mentor-facing screens so far.

Sean’s Legacy Handoff Document

• This is our final demo slide deck in Figma where we presented our progress and next phase suggestions to our client. </aside>

Phase 2 Designed Features

<aside> 💡 Our recommendation: Work on existing designs before moving onto new features!

</aside>

Features primary CTA at top and bottom of page, should push 1) impact of mentorship or why it’s valuable 2) steps to becoming a mentor (including BG check cost! we didn’t do that this phase, and imagine it’d be a deterrent) and 3) how it works / what mentorship entails

Safety is also something that should be highlighted here — mentors info will be displayed to mentees only, unless they’re okay with being featured on the landing page | | Mentor onboarding (email input, minimum required info) | Sign up → email verification → input minimum required information | | Mentor onboarding checklist | Includes:

• background check
• privacy agreement (mentors should read through this) that we’ve yet to design
• filling out the profile
• community guidelines that we’ve yet to design

Two pages that we’ve not yet designed require a lot of client input! | | Background check | Mentors need to complete a background check on an external site, this page informs mentors why this is requested, average timeline and cost, and directs them there. This page could use more content — looks kind of blank right now, and leaves some questions unanswered imo… | | Mentor profile | Ran out of time to get to high fidelity screens for editing the mentor profile, but the flow for filling out the profile + viewing the final profile has been done. Completed profile screen needs to be synced with the mentee’s completed profile screen. |

Designs from Phase 2 should undergo these tasks

⭐️ 1st priorities

• Consistent spacing revisions on high-fidelity screens

  Context: Spacing is inconsistent across UXD 1 & UXD 2 designs, but generally follow a 4pt system.

  • Should be consistent across both mentor and mentee screens (UXD1 worked on mentee pages)
  • Documenting spacing guidelines after they are implemented for future designs

• Sync up UI for mentor and mentee screens

  Context: The Mentor experience does not include a ‘matching quiz’ because mentors are already going through so many other steps to onboard. Devs will build the algorithm to match mentees to mentors using congruent matching fields from info inputed in the profile.

  • Make decisions on the nuances for matching including:
    • how they will show up on each mentor profile pages
    • how a profile will be edited

• Accessibility audit

  • Decide whether WCAG Level AA or Level AAA should be implemented across all designs
  • Fix color/contrast ratios across on all designs and components
  • Update changes in Design System (DS)
    • Subtask: Clean up DS ⚠️  Important note: There’s a Phase 1 DS file separate from the existing ANT DS - the Phase 1 DS should be archived and these should not be combined. Context: There are lots of components from ANT DS that both UXD 1 & UXD 2 did not end up utilizing.

⭐️ 2nd priorities

• Auto-layout implementation
  • Most screens have this already, but should double check

⭐️ 3rd priorities

• Responsive designs (mobile & tablet)
  • Big task, but it has to be done :-(

Phase 2 Out-of-Scope Features → Potential Phase 3 Features

Resources should be visible to mentors while waiting for approval and have a permanent home within the mentor’s dashboard so they may refer back to them at any point. This should include the items in the onboarding checklist and SL’s “onboarding kit”. | | Availability | Using Calendly API - need to ask Dev how this would be implemented | Not certain what needs to be designed, define these screens before starting! Check this out

For mentors to have more autonomy over their schedule, we thought of having mentees request to view mentor availability before scheduling themselves in, since Calendly automatically creates the meeting (doesn’t require mentor approval of it, which feels a little loss-of-control-y) | | Match requests | Mentee sends request to mentor, mentor can choose to approve or deny | Content will be important in this - think carefully about how rejection could be handled. Maybe mentor inputs why they decline? | | Mentoring Resources | Need more information from MPH interns on what is included in the mentoring resources. This will include training programs, videos and how-to’s, articles, goal setting info, etc.

| Resources should be visible to mentors while waiting for approval and have a permanent home within the mentor’s dashboard so they may refer back to them at any point. This should include the items in the onboarding checklist and SL’s “onboarding kit” along with other resources. | | “Onboarding kit” AKA Mentoring Resources | Need more information from MPH interns on what is included in the mentoring resources. Name needs input from UXW- for now we’ve used “mentor resources” | MPH / SL should be working on this. They are determining if this will also be sent via email. This should be a checklist on the mentor dashboard page because some will be required. The resources that are not required can live on the “resources” page. | | Mentor Community | Mentor support where mentors can check-in, ask questions, share ideas and tips with other mentors. | Mentor-to-mentor cohort support. Potentially using other community building tools such as Slack or Discord | | Mentee progress | Consult research | What are tangible milestones that would encourage mentors to continue mentoring? Number of minutes mentored, number of mentees helped, etc… | | Mobile and tablet designs | For future screens, do mobile first! | | | Mentee Cards | Similar to the Mentor cards, there should be cards for Mentees with their image, name, preferences, interests, etc.

These would be visible under match requests or under a mentor’s existing mentees list — can click on card to see full profile | These would serve as a snapshot of the mentee so mentors can easily identify them in their list of mentees who have scheduled time with them, and have a quick overview available before heading into a mentoring session | | Onboarding checklist: Community guidelines checklist item | Design a page for the Community guidelines Team: Content, design, SL | This needs to be a visual guide of what the community expects from its mentors and mentees. Reference insights from UXR interviews. | | Onboarding checklist: Privacy policy checklist item | Design a page for the privacy policy. Team: content, design, SL | This needs to be be a visual of the privacy policy determined by SL and content. It can show a confirmation of agreement and users can continue to refer back to it from the “resources” page. | | Design Iterations | Moderated and Unmoderated Usability results | Take time to understand insights from UXR affinity mapping and their recommendations. (CTA to becoming a mentor from the main landing page is not super clear, plus it means that users are essentially clicking “become a mentor” then “sign up” back to back. Can we also make it more clear what the commitment is like for becoming a mentor. This information could live on the mentor landing page and also the onboarding pages. |

Collaboration and Team Structure Reflection

• Having a smaller team
  • The UXD team size increased drastically between Phase 1 and 2, and it was tough to keep track of everyone’s work, especially when UXD1 and UXD2 had to sync up on (mentee and mentor profile should look similar).
  • Recommendation is to create one team (2 leads, 6 apprentices) and all work together
• Have a clearer and more defined list of recommendations (it was tough for phase 2 new apprentices to understand the goals)
  • Make these documents easy to read for new people to the industry.
  • The easier we make it for teams, the faster we can get up and running.
• Hitting the ground running
  • High-fis will take longer than you think — there’s always something to be fixed. Get started with design work sooner rather than later!