Philly FIGHT

Role: UX Researcher, Information Architect, & Designer

Timeline: 14 weeks

This project aims to redesign the web experience for a non-profit organization based in Philadelphia dedicated to ending the AIDS epidemic alongside an innovative product proposition.

The non-profit was founded in 1990 and offers comprehensive health services to low-income individuals, people living with HIV/AIDS, and those at high risk. The organization provides a range of services, including primary care, consumer education, mental health therapy, substance abuse programs, re-entry services, advocacy, social services, and access to advanced clinical research.

Philly FIGHT Background

Project Background

My team (Dhwani Trivedi, Akshay Kenjale, and I) came together to redesign the web experience for Philly FIGHT. Our primary focus was to enhance the user experience by streamlining navigation, ensuring visitors can easily access accurate information, and reducing the cognitive load on the website.

Screenshot of Philly Fight website

Research Overview

Upon receiving this project, our first step was to thoroughly familiarize ourselves with the existing website and the organization it represents. This involved conducting

  • A comprehensive content audit,

  • Delving into both secondary and primary research avenues

  • And engaging in stakeholder interviews to gather crucial insights.

Findings

To address these issues, we meticulously analyzed user personas and journey maps, representing the distinct goals of patients, volunteers, donors, and grant writers. This exercise exposed common pain points and needs that needed to be alleviated. Armed with these insights, we posed pivotal "How Might We" questions to guide our design process.

  • Effective Donation Page: The donation page has been successful in its design and functionality.

  • Concise Case Statements: The case statements offer relevant and succinct information to users.

  • Well-Organized Global Navigation: Global navigation demonstrates a clear, structured approach with easily understandable labels.

Strengths

  • Layout and Placement: There is an issue of redundant and inconsistent layouts and placements throughout the website.

  • Information Overload and Misplaced Content: Excessive information and misplaced content confuse users during navigation.

  • Cluttered UI/Visual Design: The website's user interface and visual design appear cluttered and need enhancement.

  • Navigation Tracking: The absence of effective navigation tracking results in users becoming disoriented within the website.

Areas for Improvement

We were confronted with these significant questions, how might we…

  1. Enable users to navigate the website easily and access the desired information?

  2. Enhance the website's content and improve its credibility to incite trust in users'?

  3. Avoids misleading users by restructuring the website content?

Information Architecture Overview

We used the content audit to clearly understand Philadelphia FIGHT's website content, location, and ownership. This allowed us to evaluate the content's accessibility, usability, and strategic significance on the website. We noticed recurring redundancies, content mislabeling, and structural confusion as we progressed through the audit.

Our analysis prompted us to rethink content organization from our target audience's standpoint, aiming to simplify information structure and reduce confusion.

To ensure comprehensiveness for our audience, we devised a strategy where each page effectively:

  • Conveys the non-profit's mission and vision.

  • Channels user traffic across different avenues.

  • Facilitates clear navigation to the desired information.

Throughout this process, we adhered to essential content parameters for web presence.

Card Sorting: current information architecture and website labels.

75% of participants found categorizing "Programs & Services" labels challenging.

50% of participants were uncertain about placing the "Research" label correctly.

Our findings shed light on how specific labels can mislead and confuse the information structure, especially when viewed from the audience's perspective.

Card Sorting: new information architecture and labels

75% of participants found it intuitive to categorize the "Programs & Services" labels.

Home Page:

  • Removed the "Home" tab from global navigation.

  • Added a banner carousel for visual communication.

  • Limited quick link icons to essential actions.

  • Included a comprehensive "Fat Footer" with a sitemap.

25% of participants continued encountering confusion when deciding where to place the "Research" label.

We validated the revised labels and information architecture using a card sort activity.

Design Recommendations

After thoroughly analyzing the information architecture, which involved content audits, card sorting exercises, and comprehensive research, we pitched a set of design recommendations to enhance the overall website experience.

Health Centers Page:

  • Added breadcrumb navigation

  • Adding a map for location reference.

Health Centers Page Improvements:

  • Provided contact information, including email addresses and physical locations.

Screenshot of Philly Fight website

We applied these design recommendations to transform the organization's website into an intuitive and user-friendly platform. The ultimate goal is to facilitate seamless navigation, bolster content credibility, and reduce cognitive load for visitors seeking critical information about the organization's efforts.

Web Redesign & Testing

In the design and testing phase, our focus was on enhancing user understanding and patient engagement through streamlined content presentation.

We meticulously structured the landing page sections for the organization, ensuring they communicate the intended information effectively and transparently. We outlined the importance of leveraging authentic images from FIGHT's programs and events, complemented by event/program details to reinforce value propositions.

In terms of testing, we collaborated with our instructors and proto-stakeholders to validate the landing page's efficacy. We explored the feasibility of gauging success by tracking specialist appointment bookings within FIGHT’s programs.

Key Insights from User Testing

During user testing, the revamped Philadelphia FIGHT website garnered positive feedback. Users described the design as minimal and crisp, greatly aiding navigation and preventing feelings of confusion or disorientation.

The health centers page content resonated with users, imparting a sense of empowerment due to the comprehensive information available. Notably, users were able to swiftly locate the health center, highlighting improved navigation. Overall, the redesign's impact was praised for its elegance, reduced chaos, and enhanced exploration.

"The content and information on the health centers page make me feel empowered as a user to have all the tools at my disposal, and I don't feel lost or confused looking for specific information." -User Quote 1

"The new redesign is classy and less chaotic which is everything the current website is not. It's fresh and easy to explore." - User Quote 2

Proposing a New Product: ChatBot

To enhance the website's unique value, we explored a product recommendation for the non-profit organization. Our goal was to ensure that this solution aligned closely with users' needs, aspirations, and concerns. As we delved deeper, we investigated various potential avenues, which included:

  1. Non-Emergency Medical Transportation Service: This solution aimed to streamline healthcare access by integrating location maps on the website, facilitating easy navigation to healthcare centers.

  2. Chatbot Integration: The introduction of a chatbot was considered for centralizing program and service information, acting as a filter system, and optimizing appointment scheduling.

  3. Mobile Testing Van: Another potential solution involved deploying a mobile testing van to offer doorstep medical assistance.

Strategic Choice

After careful consideration, we chose to implement the chatbot concept.


This decision was driven by its ability to swiftly provide essential information, catering specifically to our patient persona's needs – encompassing details about doctors, appointments, telehealth, locations, and commute services. The chatbot is also seamlessly integrated with our other proposed solutions – the mobile testing van and the commute service – serving as the primary point of interaction for users seeking these services.

Several key considerations guided the decision to implement a chatbot for Philadelphia FIGHT, each addressing specific needs and challenges:

  1. Versatile Information Access: A chatbot's capability to cater to the information needs of all user types aligned seamlessly with Philadelphia FIGHT's diverse audience, ensuring a tailored and efficient user experience for patients, volunteers, donors, and grant writers alike.

  2. Evidence-Based Decision: Insights from annual reports underlined Philadelphia FIGHT's commitment to enhancing patient information management. A chatbot emerged as a proactive tool to gather this vital information firsthand, aligning with the organization's data-driven approach.

  3. Resolving Content Issues: Misleading content on the website, such as crucial information about booking dental care appointments being listed under "Office Policies," underscored the necessity for improved navigation. The chatbot's capacity to guide users effectively would mitigate such issues, ensuring important links are discovered without confusion.

The implementation of a chatbot thus emerged as a strategic solution, unifying user-centric information delivery, data collection, and addressing content-related challenges.

So how can Chatbot enhance the website experience at Philly FIGHT?

We evaluated various options and concluded that a chatbot aligns seamlessly with FIGHT's website, effectively addressing user needs and stakeholder concerns. The chatbot solution centralizes information and ensures an uninterrupted and swift user experience, addressing the pain points while fulfilling the wants of both users and stakeholders.

Goals

  • Centralized Information Hub

  • Enhanced User Support

User Needs

  • Availability 24/7

  • Quick Access to Information

  • Seamless Interaction

  • Enhanced User Support

User Frustrations

  • Time-Consuming Processes

  • Information Overload

Designing Taylor

Building an Intuitive Information Hub

Recognizing the importance of relieving users from the task of information hunting, we initiated the creation of an information site map within our chatbot. This strategic move entails the meticulous amalgamation of existing Fight website information, thoughtfully structured to align with our redesign efforts.

Taylor: A Human-Centered Virtual Assistant

Our chatbot's development went beyond mere AI functionality; we aimed to evoke the sense of a healthcare professional guiding patients through clinics and hospitals. With this vision, we sculpted our chatbot to embody the persona of a virtual assistant – Taylor.

Taylor is more than technology; it's resourceful, empathetic, and friendly, reminiscent of a trusted healthcare provider.

To imbue Taylor with resourcefulness, we meticulously categorized information sought by users, patients, and healthcare professionals. Insights gathered from secondary research, stakeholder interviews, and annual reports allowed us to construct a comprehensive taxonomy database. This database spans from General Information encompassing locations and donations to Health Information covering EMRs, EHRs, Telehealth, and COVID-19 updates, extending to doctors' contact details and their specialties.

Taylor's Conversational Paths: Success, Challenges, and Adaptability

Our exploration of Taylor's conversational intricacies begins with the successful path, where users' needs align with the chatbot's knowledge, leading to desired outcomes. We also evaluate Taylor's responses when faced with unfamiliar queries, refining it’s understanding and assistance.

Further, we address the bad path scenario, where a user inputs "VACCINE LOCATION" on the welcome screen. This illustrates Taylor's adaptability, redirecting users effectively.

These conversations showcase Taylor's dynamic ability to guide users to desired services, handle varied interactions, and adapt to challenges.

Inspiration: Drawing from our comparative study encompassing existing chatbot implementations in healthcare organizations like New York Presbyterian Hospital and the Mohalla Clinic, we integrated visual elements into our design. As depicted, suggestions now adopt an icon-based nesting structure, offering interactions to reveal detailed information.

Preserving our re-designed visual language, we introduced clear distinctions between active and inactive button states. This empowers users to discern their available options intuitively. Continuing the narrative of a user with a toothache, we observe their interaction with the improved information-finding process. This experience encapsulates the essence of conversing with a healthcare professional or a receptionist, albeit digitally, within the website framework.

We've synthesized lessons from these insights to heighten visual engagement, streamline interactions, and ensure a seamless, informative, and personalized user journey. Taylor's implementation fosters efficient access to services, mitigates user frustrations, and aligns seamlessly with Philadelphia FIGHT's mission to make healthcare accessible and user-centric.

My Thoughts

Engaging in this IA project was a journey both invigorating and demanding. Within our team, each member brought unique strengths to the table. Akshay showcased prowess in UI design, and Dhwani adeptly helmed product management while I embraced the role of the researcher. In this collaborative endeavor, we all assumed the roles of content strategists and UX designers, weaving together multifaceted expertise. This dynamic blend allowed us to thrive in interdisciplinary collaboration – an aspect I enjoy as a UX designer and researcher.

Wearing multiple hats empowered us to shape various facets of the project. Our teamwork was a testament to adaptability, allowing us to communicate and rationalize design choices collectively. Navigating stakeholder interactions and internal deliberations was challenging, but these experiences enriched our understanding and finesse in articulating design intent.

Looking back, the sense of accomplishment is tangible. Witnessing how our concerted efforts enhance Philadelphia FIGHT's capabilities is incredibly gratifying. This endeavor reinforces the profound impact of well-rounded teamwork, interdisciplinary collaboration, and user-centered design principles in shaping meaningful solutions.