CASE STUDY / RAINN / 2024
RAINN
website redesign
RAINN Desktop Site Before/After
EXECUTIVE SUMMARY
RAINN Mockups
Prototype
Our team redesigned a website for RAINN, the nation's largest anti-sexual violence organization. We created both desktop and mobile prototypes.
Goal
To combine user experience (UX), user interface (UI), and front-end development (FE) skills to execute a high-fidelity clickable prototype and code three responsive webpages.
Role & Responsibilities
As a UX/UI Designer, I contributed to all aspects of the work but particularly influenced the following:
- User Persona
- User Insight
- Problem Statement
- Value Proposition Canvas
- Business Model Canvas
- Card Sorting
- Site Map
- User Journey Map
- Low-, Mid-, & High-Fidelity Prototypes
Timeline
This project took place over 3 weeks.
Tools
EMPATHY PHASE
Proto-persona
Our user is an aspiring model who works bottle service at a local club. She was recently sexually assaulted in the workplace and doesn't know where to turn for help.
Research
In this project we developed a survivor-focused survey that contained nine questions and received five responses from potential users. We asked, "If you were to go to an organization for help, what would you need?"
Findings
Users preferred that a site clearly lay out available resources such as referrals to therapeutic services and legal help.
The assault has brought up confusing, sometimes even conflicting, feelings for our user. Part of her wants help, and yet part of her believes she should push through the pain on her own.
Empathy Map
DEFINE PHASE
User Insight
Jessica works bottle service at a club where she was previously sexually assaulted. She disclosed the assault to club management, but they were not helpful. As a result, she feels mistrustful of others but still believes she might benefit from talking with someone about her available options. She needs to feel emotionally supported and find resources to help her.
Problem Statement
Jessica is looking for someone to confide in about her experience and get support. She wants to feel assured that the person she is speaking to will be empathetic and that her conversation will be kept confidential.
UX Hypothesis
Jessica will likely be anxious about reaching out to a stranger via call/text about this sensitive topic and want to make sure her disclosures are private and the staff is trustworthy and empathetic.
Jessica would be less likely to use RAINN in the absence of reviews, survivor stories, and a confidentiality guarantee.
Jessica needs validation, services, and other resources to cope with her experience, especially as she is working in the same environment where the assault happened and that appears to promote the conditions for similar incidents to occur.
User Persona
IDEATE PHASE
Competitor Analysis
A few of our main competitors are Take Back the Night, The Joyful Heart Foundation, End the Backlog, and the National Sexual Violence Resource Center. Unlike the others, RAINN actually provides direct services to survivors in addition to doing education, policy, and consulting/training work.
Heuristic Evaluation
We noted clashing colors, a dense and somewhat disorganized site, and missed opportunities to put critical information “above the fold.” We also thought the UI could be more visually appealing to survivors of sexual violence and their allies.
Unsurprisingly, Jessica may need external confirmation and validation about what happened to her. Jessica also will be in the difficult position of having to find resources while in active crisis.
I Like, I Wish, What If...?
Crucially, Jessica identifies safe space, confirmation/validation, and financial resources as things she needs right now.
How, Wow Now 2x2 Feature Prioritization Matrix
Jessica is in danger of having a mental breakdown if she can't get help quickly. Luckily, RAINN offers 24/7 support.
Value Proposition Canvas
Although RAINN engages in several key business activities, we wanted the website redesign to position survivors and their allies as the priority customer since they are likely to need RAINN on an emergency basis.
Business Model Canvas
Storyboard
User Scenario
User Journey Map
We realized after card sorting that many pages could be combined. Rather than having a section of the site in Spanish, we wanted to offer users the option to have the entire site translated into their preferred language.
Card Sorting
New Site Map
PROTOTYPE PHASE
User Flow
Our user flow focused on the ability to access the live chat in order to obtain a counseling referral.
Moodboard
Our color palette included soothing purples and blues. We wanted our users to associate RAINN with healing. We chose the Montserrat font for its readability and elegance.
Style Tile
Low-Fi Wireframe - Mobile Homepage
Mid-Fi Wireframe - Mobile Homepage
High-Fi Wireframe - Mobile Homepage
Clickable High-Fi Mobile Prototype Demo
Clickable High-Fi Desktop Demo
TEST PHASE
Usability Testing
We wanted a user to show us how they would access the live chat feature on the site. We performed a remote, moderated test over Zoom. Our user successfully located the live chat feature on both the high-fidelity desktop and mobile prototypes. Our user expressed appreciation for having two ways to access this feature on each prototype.
A/B Testing
We had some inital difficulty deciding on the appropriate primary button color so we decided to perform an A/B test (see image below). The left landing page is the control, and the right landing page is the variation.
As it happens, the user preferred the control because it they believed it offered better color contrast.
CONCLUSIONS + FUTURE OPPORTUNITIES
We were able to code our site. See the coded site here. Due to time constraints, we were unable to run sessions with users that would give us heatmap analytics so that we could further validate our user flow and find out more about other aspects of the site users found important.
Overall, we believe we were able to build a re-designed prototype that allowed users to get to the live chat feature in less than three clicks.
In the future, we are interested to do a deeper dive into the literature on differences in help-seeking behaviors among a broad cross-section of survivors and the implications for how these survivors might use a resource like RAINN.
Selected Works
Need another design warrior for social good? Reach out!
SITE MAP
CONTACT
Location: Brooklyn, NY 11221
Phone: (646) 271-9623
Email: domcbradley@gmail.com
Copyright © 2024 Dominic Cinnamon Bradley. All rights reserved.
