Designing an end-to-end Career Membership Portal website that supports women of color transition into tech.

Industry

Technology/Professional Development

Role

UX Designer

Timeline

May-August 2024

Constraints

Short turn-around

Final Wireframes Lacked User Testing

Context

Representation drives innovation in tech. So, you launch a community to empower women of color with resources to break into tech and thrive. But the reports tell a different story—new members aren’t benefiting as expected.

Specific Contributions

I had the opportunity to contribute to Tech Fleet and Baddies in Tech’s partnership, where I collaborated with five UX designers to build a membership platform from 0-to-1.

I worked on the Resources dashboard of the Baddies in Tech project.

Problem

Baddies in Tech reported that their current membership platform requires very little engagement after signup, leaving some visitors and members feeling lost, disengaged, and unable to fully benefit from their resources. ⬇️

Their Resource Database 🗂️ is outdated and overly detailed resources

Discord is a valuable resource but can be overwhelming to navigate and difficult to keep track of information 💬

Discord - Baddies in Tech

Solution

A membership experience that guides Baddies in making informed decisions and benefit from the available resources.

What do these screens solve?

Familiar layout:  The design mirrors competing platforms and job/community boards, which gives the Baddie a familiar experience.  

Easy navigation: Features include simple findability, navigation pills, clear labels for user orientation, and industry-specific filters to help Baddies quickly locate relevant resources.  

Bookmark/save feature:  Baddies can save resources to revisit later if they don’t have time to fully engage immediately.  

Who are we designing for?

Discovery

Baddies in Tech’s Discord community has approximately 5,320 active members.

To better understand our target users, the team leads conducted a customer journey mapping workshop, which helped identify three key user groups.

What did I takeaway from this?

  • Early career women of color feel overwhelmed by the abundance of resources available to them, leading to burnout.  

  • Mid level career women of color struggle to find mentors they can connect with.  

  • Senior-level women of color in tech want to give back but don’t know where to start.

Brainstorming the structure

Ideate / Information Architecture

We had a tight deadline because our client wanted to launch a preview of the portal before a tech conference in August. To meet this, my team and I prioritized the early career group, Baddie 1. We used the client’s list of must-have features to brainstorm an initial sitemap. 

Here’s a screenshot of site map ↓

Users want a Personalized Job Hunting Experience

User Testing Analysis

To make sure the features aligned with user expectations, we analyzed insights from a Google survey conducted with 20 individuals who are already a part of a career community. The survey explored what users liked, disliked, and expected from a career-focused platform.

Here’s a summary of what we found ↓

Wireframe Evolution

V1

V2

Low-fidelity Wireframes

After reviewing the Google Survey results, I analyzed the card-sort data from the User Research team to understand what Baddies expected in the 'Resources' section. The key categories identified were a database, scholarships, career resources, mentorship programs, and community guidelines.

Additionally, I researched existing membership platforms like WATBD and job boards as inspiration. 

Clarifying Resource Sourcing

Back to Research / Chatting with the Developer

I needed to clarify whether the resources provided to users would be sourced from Discord's existing resources (organized) or gathered freely from the internet. To find out, I scheduled a meeting with the developer, who confirmed the resources would be sourced from the web. I also wondered about whether users could freely share resources or if a verification process would be implemented to ensure their quality and reliability—but that was out of scope.

Final Screen

What I Learned 🌱

  1. Get comfortable with ambiguity. We spent more time understanding and dissecting the problem than any other part of the design process. Embracing ambiguity is far better than staying in stuck-mode. 

  2. Remember who you’re designing for and let data guide your decision making. Your design solutions should always point to data & be backed up by data.

  3. Design Systems get things done quicker. Having a design system made designing/exploring different layouts so much easier.

If I Had More Time ⏳

I would…

  1. Collaborate with the UX Research team to conduct A/B testing.

  2. Work closely with developers to understand technical constraints, consider how the UI would look in both light and dark modes, & ensure accessibility.

Thanks for making it this far!

Check out Poll and Go: An end-to-end mobile app for group travelers to plan trips effectively.