By the age of 45, one in every four women has had an abortion. Despite its prevalence, public knowledge remains limited due to the politicalization of the topic, leading to challenges in accessing safe abortion care.
In Phoenix, Arizona, where abortion care access faces unique barriers, Camelback Family Planning (CFP) has been a vital resource since 1999.
Camelback Family Planning Location
Despite its critical role, CFP's previous website fell short in providing essential, easily digestible information, leading to an overload of repetitive inquiries to their front office.
Previous Camelback Family Planning Website
Recognizing this issue, the clinic owner reached out about a redesign. Our goal was not just to revamp the site but to make it a powerful tool for clarity and patient empowerment.
Given Arizona's specific restrictions—like the requirement for two separate appointments at least 24 hours apart—it became imperative that the website communicate regulatory hurdles and care processes clearly and comprehensively. This would help prospective patients better understand what to expect, thereby alleviating some of the logistical and emotional complexities involved in accessing care.
To ensure a user-centric approach, I conducted research that involved first-hand observation and interactions with patients. Over a two-month period, I engaged in phone and in-person interactions, addressing questions, and assisting with check-ins and check-outs. This process revealed that the current website's information was not effectively accessed or absorbed, leading to repetitive inquiries from patients.
To gain first-hand data, I distributed a survey that inquired about how easy information was to find on the previous website. The survey received 91 responses and provided valuable quantitative and qualitative insights. The survey results highlighted areas where users struggled to find vital information, shaping the redesign's direction.
Approximately 1 in 2 (51%) struggled to find information about financial assistance.
Approximately 1 in 4 (23%) struggled to find information about the abortion process.
Approximately 2 in 5 (41%) struggled to find information about abortion fees.
Abortion care is not common knowledge
Information on the current website is either hard to find or outdated
People seek reassurance on the legitimacy of abortion clinics
People have abortions for a variety of reasons
A diverse set of individuals seek abortion services
Content Audit & Inventory
To assess the existing website's design, I conducted a content audit and inventory. Among the 22 pages, 19 contained outdated material, and 10 were not easily discoverable through the main navigation. This audit exposed critical issues with navigation and content organization.
Complex nested secondary navigation made it challenging for users to find certain pages, while excessive text and limited formatting hindered content skimming. Additionally, inadequate whitespace affected visual clarity and readability, detracting from the overall user experience.
Previous Website Site Map
For contrast, below is the redesigned website site map.
Updated Website Site Map
Early Designs & Iteration
Armed with an understanding of the challenges, I embarked on designing a solution that prioritized accessibility and information retention. Low-fidelity designs, sketches, and wireframes were explored to conceptualize the redesigned website's vision. These early-stage designs lay the groundwork for creating an intuitive user experience.
Initial Mobile Wireframes
To validate and refine the design concepts, I organized usability studies with a group of end-users. This feedback-driven process allowed me to identify areas for improvement and fine-tune the website's functionality. By actively involving users in the iterative design process, I ensured that the final product would resonate seamlessly with their needs.
Usability Artifacts: Script, Plan, and Key Observations
The full website can be viewed on the Camelback Family Planning site. Explore the examples below to understand the noteworthy design decisions that were made.
Based on the findings from the content audit and inventory, streamlining the website's navigation was essential to enhancing accessibility. Redesigning the navigation system focused on eliminating unnecessary content, consolidating related topics, and adopting semantic labels for each category.
In the previous version, pages were nested within navigation items, and essential high-traffic pages, such as pricing details, were tucked away in the footer. The new navigation ensures that critical information is front and center for the user.
Redesigned Website Navigation
The new website has a total of 7 pages, compared to the previous site’s 21. Note that the clinic owner requested that two additional pages be added to the website: Miscarriage Management and Fetal Abnormalities.
Previous Website Navigation
With 85% of users visiting CFP's website from mobile devices, I utilized a mobile-first design strategy. This consisted of starting all of the designs on mobile screen sizes and incorporating drawer components to allow users to customize the content they saw. Additional design decisions were incorporated to improve readability and navigation.
Finalized Mobile Designs
Despite reducing the content by over half, a significant amount of essential information still remained. However, with limited horizontal space on mobile devices, I wanted to avoid excessively long pages while retaining necessary content. To address this challenge, I introduced a drawer component that allowed users to expand specific content based on their preferences.
By tapping or clicking a button, users could reveal the container's contents, and when expanded, they could easily compress it, hiding the content. This design empowers users to customize their experience to focus on the details that are most pertinent to them.
Expandable Content GIF
To ensure users could quickly find and retain essential information, I focused on creating a design that made scanning easy and optimized content accessibility. I incorporated visual elements that established a clear visual hierarchy and attracted attention when necessary.
There was certain content on the site that, if missed, could negatively impact the user's experience at the clinic. For this content, I implemented a UI element I refer to as "warning boxes". Warning boxes were yellow containers used to highlight critical content. These were used sparingly to ensure that they were rare and stood out prominently to users.
Warning Box Design
Complementing the warning boxes, comment bubbles served as a subtle yet effective way to draw attention to specific user questions while they navigated the site. The comment bubbles offered valuable clarifications and insights without overwhelming the users.
Comment Bubbles Design
Following collaboration with stakeholders, I built the website using Webflow, and it was launched on January 1st, 2022, remaining in use by the clinic today.
The redesign successfully increased user engagement, reduced repetitive questions, and improved the overall site experience. All of which positively impact CFP's mission to provide accessible and reliable information on abortion care.
As CFP adapts to changes in abortion laws, I look forward to evolving the site and making a continued positive impact on people's lives. I am immensely grateful for the opportunity to work on this project and deliver a finished product that positively impacts people's lives.