Door of Clubs

Door of Clubs needed to introduce new features to their platform to streamline experiences for their Company users and internal team. I was approached to help take user feedback and use it to create two new features: 1) a club directory and 2) a new sign-up experience.

SERVICES: UI & UX, Wireframes, Product Design, Application Design
YEAR: 2018-2019

About Door of Clubs

Door of Clubs is a student club management and on-campus recruiting platform connecting students and companies. Students use the platform to earn club sponsorships and to receive full-time and internship opportunities. Companies use the platform to recruit targeted students- specifically diverse, technical, and business -from the clubs they’re a member of.

Door of Clubs already had a number of platform features built out when they approached me to help expand the Company side of their platform.

Project 1:

Finding the Perfect Club

Door of Clubs had been working on aggregating information for student clubs across the nation, they now needed needed an intuitive search engine feature so that Company users could find and connect with the clubs they’re interested in.

The high-level goals of this project were to:

  1. Allow companies to quickly search through clubs
  2. Filter through 10+ criteria to narrow in on the perfect club
  3. Show the difference between clubs with verified and non-verified contact information
  4. Allow for discoverability via adjacent searches

My role

I led the design of the project working closely with DoC co-founder Adam to understand current user pain points.

The Process

Research

The search engine project was fairly heavy on the research and wireframeing portion, a lot of time was spent on the different design possibilities for the search page and what it means down the line. Because this was an MVP feature and I had fewer attributes to work with, this design needed to allow for growth.

I started the by looking into job board sites, this was a process that closely matched what DoC was looking for.

This resulted in 3 different potential layouts for the new club listing screen:

Wireframe 1

Wireframe 2

Wireframe 3

The Design

Match Companies To Students

While everyone really liked the third wireframe, we agreed that we weren’t there yet in terms of desired content needed to fill up the design. It also did not fully support the top goal of searchability. So we went with a close second of Wireframe 2.

Selected Design

The stacked layout of the cards allowed for easy readability, a user just has to scroll rather than scan.

It was important to allow the user to always see what they’re filtering on, so even when the filter accordions are closed the search terms are always visible.

When a Company user saves a Club, it appears in their My Clubs section. DoC works on a tiered membership (more on this later) so different users have different export caps. Since a user only gets so many downloads a month, the user has to deliberately download the Club’s contact information.

Design Postmortem Critique: Reflecting on this design now (~4 months after the designs were delivered), I would change the design a little bit so that it’s more obvious that this page is different from the Club Directory.

Next Steps

After Search

This project was solely focused on the discoverability of clubs. Could recruiters find the clubs they’re looking for? Was this type of tool useful enough to iterate on? If the answers turned out to be yes, then the next steps would be to add in minor improvements and start to think about DoC as more of a CRM then just a search engine.

The plan would be to interview current users to understand how they’re using the platform:

  • Describe how you typically use the DoC platform?
  • Where do you spent the most time?
  • What frustrates you about DoC?
  • What works well?
  • What do you wish you could do on DoC?

Without speaking to users directly to understand how they use the platform it’s hard to know what to focus on. But a number of potential features could include:

  • Ability to save searches
  • Ability to receive notifications when new clubs are added
  • Ability to receive notifications when new members are added to Saved Clubs
  • Ability to collaborate / share Clubs with fellow recruiters
  • Ability to message Club members directly

Project 2:

No More Manual Signups

The Door of Club’s sign-up process for new company users was very hands-on up until this point. DoC wanted to take a step back and allow for company users to create their own accounts and understand how to use the platform with minimal effort from the team.

The main goal of this feature was to take their current manual sign-up process and digitilize it so that DoC could quickly bring a new user onto the platform with no hands-on effort needed from the sales team.

My role

I led the deisgn of the project working closely with the DoC co-founder Adam to understand current team pain points.

The Process

Sign-Up Flow

Let’s be honest, people have written ad nauseum about the perfect sign-up flow. I used the following principles to get started:

  • Break down the steps into their most simple form
  • Have a user create and pay for an account quickly
  • Nudge the user to complete their profile, but give them the ability to skip non-essential steps
  • Always let the user know where they are in the process, and how much they have left to complete

The Design

Quick Sign-Up

The sign up process starts from DoC’s front-facing website site, a user is given the option to choose between 3 tiers of membership.

A number of phycological sales tactics are used in this design:

  • Only 3 options are shown
  • The user is nudged towards the larger middle option
  • Each option shows the benefits and what the user is missing out on
  • The highest tier option invites the user to Contact the sales team

Design Postmortem Critique: The first two options look like they’re offering the same benefits after a quick glance. I’d focus on visually showing the differences: I’d start with differing bolding the words, and if that doesn’t work then I’d see how I could add in specific icons.

Account creating is broken apart from payment so that there isn’t too much going on at once. I also decided to do a split-screen view, this version shows a carousel of testimonials from students to further reiterate the value of DoC.

The payment screen takes the user’s initial choice from the Pricing screen so that the selection isn’t redundant. It’s also one less step between the user submitting their credit card information.

Design Postmortem Critique: I’d be curious to see how the payment screen does. How many users end up going back in the process to change their tier selection? I’d consider adding the option to change the membership type on this screen. I’d also think about adding the tier benefits, though I’d worry that there might be too much going on. 

Finally, I’d turn the “Switch to yearly payment” to a button to make it more obvious. I’d also add in language to highlight the discount a user would be receiving if they switched.

 

These next two screens are optional though strongly suggested.

In the final step of the sign-up process the user is prompted to select club types that they’re interested in so that when they land on the dashboard they’ll already have clubs to sift through (no empty screen!).

Next Steps

What do the Analytics Say?

Next steps on this design would be to make it live for a few weeks to establish a baseline set of analytics and split test from there. The primary goal is to sign up paying users so the Pricing page would be the focus of the first tests.

I’d also look at the drop-off rates for each page to understand where there is friction in the design. For example, are people inputting their account information but not making it past the payment screen?

Finally, I’d look at what questions new users are asking Support and consider preempting those in an onboarding sequence.