OVERVIEW

SHEchange enables consumers to make ethical buying decisions and collectively influence companies to change unethical policies and behaviors. Users can search, browse, and compare personal care and fashion companies to see how they perform in areas such as animal rights, gender and ethnic diversity, or environmental sustainability. Users can also activate the SHEchange Chrome extension while shopping online in order to quickly and conveniently view company data on the products they are considering.
‍
I collaborated with a team of designers to restructure and redesign the existing SHEchange website and Chrome extension. Our goal was to enable users to easily find, understand, and act upon company data.

ROLE

UX Research, Information Architecture, Interaction Design, UI Design

TIMEFRAME

November 2018 -
January 2019

Challenge

People want to support businesses that are aligned with the values they care about and boycott the ones that don’t. Unfortunately, consumers often don’t have access to reliable information regarding a company’s ethical performance or know how to influence companies to implement policy changes. SHEchange’s mission is to eliminate these barriers and empower users to demand that companies respect all people and respect the earth. In order to achieve this vision and grow their user base, however, they needed to address some usability issues in their existing product.

Our high-level objectives (which we further defined based on research insights) were to:

Increase user engagement and conversion by improving comprehension of the company's brand, mission, and UVP
Allow users to quickly and intuitively find companies that are relevant to them
Allow users to easily evaluate displayed data to determine which actions to take

Research & Discovery

Because of the nascent nature of the product, our team had limited data regarding users and their engagement with website and Chrome extension. In order to uncover and prioritize the most salient user needs and usability issues, we employed the following research methods:

Card sorting and tree testing, in order to improve and validate the website's information architecture
Comprehension/usability testing and heuristic evaluation, in order to identify and address usability issues
Competitor and comparator analysis
User interviews and jobs-to-be-done analysis

Through our directed interviews we learned some key insights about ethically-minded shoppers who might be inclined to use a product like SHEchange:

They are often more motivated to boycott unethical companies than to actively support ethical ones
They use word-of-mouth, social media, and news sources to gather information about companies' behaviors and ethics, but lack a singular source through which to reliably look up this information and view how companies measure against each other
25% of interviewees had searched for or were currently seeking a product with data about ethical companies in order to help them make shopping decisions

Scoping & Ideation

Our research led us to prioritize several main issues that needed to be addressed in the existing product:

Unintuitive navigation. We needed to overhaul the information architecture of the site to ensure that users could find the information and features they were looking for. We hypothesized that this would result in increased exploration and engagement with the product.
Low comprehension of company mission and UVP. The landing page was not effectively communicating what SHEchange does, or why someone would want to use it. It was essential that we improve the content, copy and messaging throughout the site in order to increase comprehension and conversion rates.
Ambiguous data. Users were confused by how the data was presented, and were not sure whether a certain rating was relatively bad or good. Some users expressed skepticism about the trustworthiness of the data. We needed to clarify the terminology used and leverage heuristics and best practices to develop a clear rating system that would appear credible and easy to understand at a glance.

We first addressed the navigation issues by using our card sorting and tree testing results in order to construct a new site map.

With a better understanding of our users and the main issues we needed to address, our team began generating wireframes for each page of the website to explore potential solutions to these problems.

Colllection of wireframe sketches taped to a wall

From this stage forward, my personal focus was the user profile. SHEchange users have the ability to search, browse, or compare data on companies without signing up for an account, but are encouraged to create an account for a more personalized experience. My goal for this feature was to provide as much value to the user as possible during their logged-in experience to help retain active users despite the lack of a community feature, which was forthcoming, but not within the scope of this project.

The user profile in the context of Jane's user journey.

We determined that this new user profile would include:

Favorited companies. This would allow users to track or save companies for future reference and give SHEchange metrics on which companies were popular or trending amongst users. With the addition of a community feature, users would be able to display the collection of companies they support on their public profile to encourage others to shop from them as well.
Blacklisted companies. In the same vein, users could save the companies they have chosen to boycott.
Favorited products. Because SHEchange generates revenue from affiliate links, it was essential that we allow users to easily save and locate the products they were considering for purchase at a later time.
Improved ranking of causes. A logged-in user would see personalized ratings on a company profile based on their most valued causes. Although we wanted users to identify all of the causes they were interested in, we also wanted them to select their top three causes in order to display those ratings on the Chrome extension, on which there was limited real estate. This presented the unique challenge of designing a two-tiered rating system. This would also allow SHEchange to track which causes are the most popular among their users.

Iteration & Testing

The myriad weaknesses exposed in the previous round of testing gave me a lot to improve on. I explored many more possible solutions for the cause ranking system, a few of which are shown below:

Ultimately, a decision was made by the PM to only prompt the user to select a total of three causes, however, the client was presented with some of the more promising solutions for possible future implementation.

Evaluating Success

From a usability standpoint, our final prototypes proved successful, recording improvements across the board in UVP comprehension, ease of navigation, and interpretation of data. On the user profile,

7/7 of users tested correctly identified the purpose of selecting their top three causes and were able to describe how it would change their experience elsewhere on the site
6/7 users were able add a product to their Favorite Products in one attempt
7/7 users were able to remove a company from their Favorite Companies in one attempt

This project has not yet shipped, but after release I would track the user profile with metrics that include:

% of signed-up users who complete the Causes that Interest Me section
# clicks per user on affiliate links from the Favorite Products section
% users who engage with the Favorite/Blacklisted companies feature
# of favorited/blacklisted companies per user

Lessons Learned

The challenges I encountered during this project helped me develop my product thinking, gain experience with new research methodologies, and grow significantly as a designer. In addition to being an advocate for the user and trying to maximize the value provided to users given our limited scope, I learned new methods and best practices for:

Future-proofing and allowing for as much flexibility in my designs as possible for features that will be added later in the product roadmap.
Thinking through and designing for all possible states and edge cases. What will the page look like if the user has no favorited companies? What if they have 200? What will happen when a company's rating changes?
Creating scalable, flexible components. I collaborated with teammates to ensure that we maintained consistency in our visual design elements and UX patterns, both for the benefit of the user and to reduce engineering cost. In an ideal world, I would have liked to collaborate closely and frequently with engineers throughout the design process to ideate on solutions to some of the problems I was solving (e.g. ranking causes).

SHEchange