SRHR (Sexual & Reproductive Health Rights) Hubs
…is a grass-roots nonprofit organization that aims to advocate for people to people to have full control over their sexual health while also making informed and healthy decisions relating to their preferences and needs. This project is ongoing and created alongside Oliver Daniel, Tony Todorova and Rae Jardine.
Skills demonstrated: UI Design, User Research | Tools used: Figma, Kardsort
Project Context:
Project Goal:
SRHR Hubs prides itself on providing resources that are low-cost, accessible and LGBTQ+ friendly. Prior to my joining, SRHR Hubs had assembled a large database of sexual health resources but were unsure how to transform that information into a useful tool (an online directory) for sexual and reproductive health resources.
My goal as a UX designer for this project was to build a concise user flow and maintain an organized UI that would allow the organization’s database to really shine. Check out the beta site here.
User Research:
Methodology:
Users had issues splitting cards between the categories “service provider demographics” and “eligibility/target populations”.
To allow for SRHR Hubs’ database of resources to be properly filtered and searched through, it was crucial that a distinct set of categories were created in a systematic, user-informed fashion. I decided to conduct a card sort to understand how users categorize services and resources so that could be mirrored within the site’s information architecture.
n = 20 participants
Task 1: Categorize resource-identifying filters into pre-labelled buckets (closed card sort, view here).
Task 2: Categorize various types of services/resources into groups, and label the groups (open card sort, view here).
Task 3: Categorize various types of care providers into groups, and label the groups (open card sort, view here).
Filter categories and filters themselves were pre-existing from SRHR Hubs. The purpose of the card sorting was to assess the usefulness and accuracy of the filters so that changes could be made to the web app where necessary.
Results and Data Analysis:
Confusing Labels
Screenshot from Task 1. Closed card sort hosted on kardsort.com
Inaccessible Language
Not all users were familiar with the terminology used for certain filters.
“What does ‘sliding scale mean’?” – Card Sort Participant
Designing the Lo-fi Prototype:
To begin, a site map was built, and we decided on which pages were crucial to have developed. We also began thinking about what we wanted the site to look like. In this phase, Figma community templates and Pinterest collaborative boards were used as they allowed for a quick, convenient way to share and visualize ideas. Later, sample Hills Statements were drafted to determine what user flow the prototype was going to demonstrate. Doing so allowed us to understand which pages needed to be designed and which functionalities were going to be shown.
