Feedpage Redesign - Case Study

Company: Diversity.io
My Role: UX/UI designer
Responsibilities: User Research, UX (User flow, Site Map, Wireframes and Prototyping)
Deliverables: Web and Mobile page
Project Overview
Divercity's mission is to connect minority professionals with job opportunities in tech. When a user registers with Divercity, the feedpage appears as the main page. The website features new job opportunities, the ability to interact with other members, and the ability to read posts.
Problem to solve
In the old feedpage, users did not have enough opportunities to interact with jobs or general posts. As a result, there wasn't a lot of traffic from new users and that contributed to not many companies registering to post their job opportunities with Divercity. With a new Design system we also had to implement the new brand into the new design.
The Process
01. Research
User Test

As part of this redesign, we wanted to address the individual needs of our two types of users (Recruiters and Candidates).
Since we already had an old version of the site live, a User test would be most practical because we could observe how they interact with it and learn about their needs and pain points. We held two different sessions, one for recruiters and one for candidates.
02. Define
User center canvas
Based on the research results, I developed a User Center Canvas to list and prioritize the needs and goals of the user with solutions we may be able to provide with the product.
03. Ideate
Ideation session (Miro)
Sitemap

As part of the ideation phase, our team brainstormed and gathered ideas on how to better organize, remove, add, update all the features the current design had to meet the users' needs and goals.
We used Miro as our tool to facilitate the collaboration for our team during this session. As soon as the sections of the feed page were defined I updated and created a new sitemap.
Sitemap

In order to better compare the different feeds between recruiters and candidates, two sitemaps were needed.
04. Design
Wireframes

After the ideation brainstorm session, we identified the sections that needed to be updated or some of them needed to be added. Here are some initial wireframes I've created.
05. Prototypes
Interactive wireframes

Prior to moving into high-end prototypes, I wanted to ensure my design was functional and covered all of the necessary workflows. A low fidelity interactive prototype was created to facilitate the user testing.
6 people were tested (3 recruiters and 3 candidates) who were asked to go through a series of tasks that would allow them to experience the entire feed page.
06. Iteration

User test
As a result of the user test, minimal changes were required to the design. Following the completion of these fixes, I developed a high-fidelity prototype.
Final Design

With the new feedpage, recruiters have access to all the tools and features they use on a daily basis.

Among the new solutions for recruiters were:
● A quick way to access the Staffing Dashboard to look for candidates
● A shortcut to Company profile section
● Quick way to Post a job, Company post or Create a company
● Easy access to the recruitment tools
● Access to creating Company post for announcements and news
Candidates
Version

In the candidate version, some of the new solutions included:

● An Overview section that facilitates the access to Job applications, Connections and Companies of interest
● A recommended jobs section that is more clear and more visible
● Job post that are easier to understand and have the information that candidates are looking for (salary, location, diversity score, etc)
● Ability to create a quick post
● An Apply button on each Job post
● New diversity spotlight that features the best Diverse companies
● An easier way to network and connect
● Ability to like and comment on a post
07. Recap
& future steps

This new version uses the new Design system which made it easier for Designers as well as for Developers. The design system eliminated the random colors being used, duplicated assets, incorrect used of fonts and overall a more consistent look and feel.

Our user test showed 90% approval for the new Diversity page feed, which we expect will increase traffic to it.
In return, Divercity will generate more revenue by providing more value and solutions to the users, which in turn will encourage recruiters to pay for memberships with the company.

A few metrics that will help track the process are: Sign-ups every week and month, Returning users, Job applicants, Recruiters posting jobs, and Job applications, just to name a few.