What is Thrive Out Loud?

Thrive Out Loud is a professional mentorship program created by Sean’s Legacy that connects early-career LGBTQIA+ young adults aged 18-25 with experienced, like-minded mentors who share their identities and lived experiences. 

Client

Sean's Legacy

My Role
 

UX Designer, UX Writer, Content Designer

Tools Used

Figma, FigJam, Slack, Chat GPT, Zoom, Google workspace

My Responsibilities

• Competitive analysis
• Content audits
• Information Architecture
• UX writing
• User research
• Wireframing
• Cross-functional collaboration

Timeline

February 2024 - June 2024

Background

The main goal of the Thrive Out Loud team is to create a safe and inclusive environment for users, with a strong focus on finding the perfect match between mentors and mentees.

A key feature of the platform is its matching system, which uses user information to suggest compatible mentor-mentee pairs.

I joined the project in its fourth phase, where the sign-up flow had already been designed. This flow included onboarding questions to gather the data needed to match mentees with mentors effectively.

What was the problem?

The onboarding process was confusing and lengthy. 

After conducting the user interviews and usability testing, the UXR team found out users struggled with the complexity of the onboarding steps and unclear instructions, often feeling frustrated or unsure of how to proceed.

Users couldn’t find suitable gender identities, sexual orientation, and ethnic background options in the onboarding questionnaire, causing many users to abandon the process before completion.

What could I do?

• Simplify the onboarding process to reduce drop-offs and improve user engagement.

• Conduct competitive analysis and desk research to identify user preferences and unmet needs.

• Develop Information Architecture and a sitemap for clearer navigation and content organization.

Conducting an Audit

I started by auditing the existing screens that had been previously written and designed for both the mentor and mentee flows. I carefully reviewed each screen to assess usability, content clarity, and consistency, making detailed notes on areas that needed improvement. This process helped identify opportunities for optimization.

Opportunities for Improvement

• Make the onboarding questions as short as possible to reduce user dropout while also ensuring that all of the important information for the matching algorithm is collected.
• Allow users to choose more than three responses for each question.
• Explore gender identities, sexual orientation, and ethnic background options to create more appropriate categories to sort mentees and mentors.
• Work on error messages and provide more guidance on resolving errors.

Desk Research and SWOT Analysis

During my time working on an audit, I noticed that a significant number of users were dropping off during the sign-up process, particularly after the initial onboarding flow. The product team was considering removing a few questions from the onboarding, assuming that simplifying it would solve the issue. However, I wanted to base any changes on real user data before making a final decision.

My task was to investigate the root cause of the drop-off, gather insights from users, and use data to inform the product team's decision on how to optimize the onboarding process.

I began by analyzing user behavior data to identify the specific steps where users were abandoning the process. I found that the drop-off occurred when users were asked to select their gender identities and sexual orientation. To further understand the issue, I collaborated with UXR team and conducted a competitive analysis and desk research.

The research revealed that while users were happy to provide information, they felt the gender identities, sexual orientation, and ethnic background options were too generic and didn't reflect their specific needs. Users needed more inclusive and clear wording.

Key Takeaways

• 75% of platforms have options: Prefer not to say, Not sure/Questioning, Not listed above.
• A variety of options helps embrace diversity and inclusivity.
• Having more options provides more accurate data collection.
• At the same time, too many options can confuse users.
• Gender identities may change over time. The list will always need updates.
• Would be good to have a detailed description of all identities to avoid confusion.

Mid-Fidelity Wireframes

Based on these insights, I proposed a solution to the product team: instead of removing steps, we should personalize the user experience based on the input. I worked with the design team to prototype a more dynamic questionnaire that offered more inclusive options.

*Scroll to see all wireframes of the onboarding process

Information Architecture

Users reported difficulty finding relevant content and navigating through the platform, leading to high drop-off rates and low user engagement. Additionally, the lack of a clear information architecture made it difficult to onboard new team members, communicate with stakeholders, and reference past decisions during updates or redesigns.

I focused on creating a well-structured information architecture and organizing the website’s pages to improve navigation and help users find content more easily. As a bonus, the sitemap would not only highlight gaps and opportunities for improving the content strategy but also serve as a valuable tool for content planning and management.

Content Audit

I first conducted a deep dive into the existing content, assessing its organization and relevance. Based on these insights, I strategically grouped pages into logical categories.

Sitemap

I established a content hierarchy, determining which pieces are top-level (main navigation) and which are sub-level (nested under main categories), and created a first draft of the sitemap.

After analyzing the user journey and defining how users will navigate through the content, it was easier to notice confusing navigation paths.

My new goal was to ensure that the most important and frequently accessed content is easy to find.

Supporting Documents

In addition to developing a sitemap, our team created a page inventory to catalog all website content. Each page was assigned a unique ID, making it easier for team members to discuss and coordinate tasks efficiently. The inventory also included the status and purpose of each page, providing clear insights for content management and future updates.

Feedback and Iteration

After gathering feedback from other teams regarding the site's structure and making adjustments accordingly, I kept working on the information architecture and sitemap.

Additionally, after analyzing the results of the T-shirt sizing exercise conducted by the Product team and considering MVP requirements from the client, I updated the sitemap and page inventory to align with our current plans for the MVP.

I also designated pages that are not within the scope of the current phase in grey to provide clarity.

You should never underestimate error messages!

They are an important part of the onboarding experience!

Designing error states with accessibility in mind

An important part of the sign-up process improvement was working on the error states. My goal was to provide clear error messages explaining what went wrong and consider accessibility guidelines. 

The decision was to use a supportive tone in error messages and let users know that errors are a normal part of the process and that the TOL team is always there to help them resolve any issues.

Login Page Before

Login Page After

Error States 

I worked on the copy of the error messages across the entire platform. Below are examples of the error messages specifically designed for the login process, addressing common issues such as incorrect credentials, missing information, and account restrictions.

Results

Throughout the process, I collaborated closely with the development and product teams to ensure that the new flow aligned with the technical criteria and the company’s goals.

At the end of the sprint, all onboarding questions were updated with the list of more inclusive terms.

After implementing the new personalized onboarding flow, we saw an increase in sign-up completion rates and a significant improvement in user satisfaction during the onboarding process.

Additionally, users who completed the new onboarding were more likely to engage with the app regularly, as they felt it was more aligned with their personal preferences.

If you're curious about how the onboarding process looks on mobile devices, here’s a complete walkthrough with screens of each step. These visuals highlight the user journey, showcasing key interactions, UI elements, and design considerations optimized for a seamless mobile experience:

*Scroll to see all wireframes of the onboarding process

What our users say

After conducting user interviews and usability testing of the redesigned onboarding process, I saw that feedback from users was overwhelmingly positive, especially regarding selecting multiple options and the opportunity to type in their own option.

Here is what our users say about the updated sign-up process and gender identity options:

What our UXR team says

During user testing, the UXR team tested the usability of the onboarding questions with potential mentors. They completed interviews and usability testing with 7 participants identifying as LGBTQIA+.

The goals of the research in this phase were to:

• Identify key elements that contribute to a welcoming and intuitive experience for potential mentor users.
• Uncover potential usability barriers encountered by new mentor users during the sign-up process.
• Explore the perspectives and preferences of mentors in the matching process.

Here are their findings:

What have I learned?

• On-time cross-functional communication and collaboration is crucial.
• Following industry standards is a must. As mentioned in Jakob's Law, users spend most of their time on other sites. This means that users prefer your site to work like all the other sites they already know.
• It's important to write error messages in a user-friendly way and tell users what went wrong in the language they will understand.

Redesigning an e-commerce platform

Improving engagement and accessibility for finEQUITY.org