Overview

Rose's Law is fighting for animal liberation through legislative change and an animal Bill of Rights. Their website is intended to be a place for activists to learn, get involved, and stay up to date on the most recent events and news regarding Rose's law.

A Team of 4 Full-Stack Product Designers

The Challenge

Improve clarity, increase user engagement and build trust. Our research metrics helped us identify that because potential and experienced animal activists didn't understand the message of Rose's Law, didn't trust what they were signing up in the newsletter, and they didn't see the steps to achieve the goal of the Animal Bill of Rights they were quick to lose the interest in the website.

The Solution

Connecting animal activists around the world on a single platform with resources, training, and news.

By organizing the content in a more readable and interactive method, the user will be more willing to participate in actions like signing up for the newsletter, taking training to start their own local movements, and even donating to the cause.

Skip to Prototype

In order to begin this design process, we started by meeting the stakeholders behind Rose’s Law; we needed to understand the purpose of the website and what pain points and goals they were already facing. Wanting to create a global platform that communicates their mission to existent and new animal activists, the organizers asked us to figure out how to increase their user engagement.

Survey and User Interviews

We created and sent out a survey and conducted contextual user interviews with volunteers at the SPCASF (Society for the Prevention of Cruelty to Animals of San Francisco) and with animal activists at a protest that helped us gather essential data about Rose’s Law target users, their needs, motivations, and goals.

Two types of users

Based on our research, we found 2 main types of users.

Understanding Users

We learned that only 21% of users find the message to be clear. Users found the website’s message confusing due to content they found irrelevant. This included images from the civil rights movement of the ’60s. Most of the users (79%) want better explanations and information. When the message is not being delivered, users don’t want to engage with the cause. Only 28.4% of users are willing to sign up for the newsletter. Because the content doesn’t provide a clear understanding of what Rose’s Law is about, people don’t trust what they are signing up for.

After defining our user flows and feature prioritization, we ran design studio sessions where we sketched, discussed, and refined ideas for a paper prototype and to run our first usability tests.

Key Takeaways / Lessons Although the paper prototype was a great tool to show our main solution ideas, we discovered that the users would quickly get lost navigating it because of its low fidelity. We then decided to use it to run an "in-house" usability test within the team and we learned that: The global navigation was easy to follow and understand. “Sign for the Newsletter” button was hard to find. Details on what the users were signing up for and what they would get upon filling out the form were missing.

Mid-fidelity Prototype / Wireframes

We focused on making the hierarchy and the language as clear as possible so the user would know where they were at all times. We also reduced the content by nesting it in clickable actions and organized the images in simple interactive sections.

After this, we conducted our second round of usability tests.

Takeaways

Our users found the first section under the global navigation provided a direct explanation of what the website was about. Users now understood what they were signing up for on the newsletter sign-up form. The “Take Action” CTA on the navigation was highly attractive. Users were curious about what it meant and wanted to click on it before anything else. The map section was confusing; the users understood it was an interactive element, but there wasn’t an indicator of what would happen if they clicked on a city and how to find their location easily.

High Fidelity / Interactive Prototype

Next Steps

Website Merge with DxE: Analyzing the pros and cons of combining both websites. Creating a platform for the design library Allowing users to create their own posters and signage under the same guidelines. Research into adding another user profile Streamline the user experience for journalists, politicians, and influencers.

We were delighted to learn that our client was interested on implement our design.