Overview
Problem
Pfizer had two websites serving the same audience and dealing with the same subject matter:
- A branded disease education website focused on efficacy, access, financial support, and side effects.
- An unbranded website focused on finding inspiration and support for living with MBC with over 100 pages of content, author pages, blog, video posts, and lifestyle content.
Due to FDA regulations, unbranded and branded content could not be presented as one, presenting a regulatory challenge.
Outcome
A merged website was fully compliant with FDA's Fair Balance approach.
- Creating a single online destination enabled a more efficient media buy.
- Migrating unbranded content increases engagement on brand.com and shortens the conversion funnel
- Showcasing the total IBRANCE value proposition in a single destination drives brand choice
- Less web properties to navigate alleviated complexity for patients
- Unbranded website name of the community helped the patient feel part of an exclusive and supportive group
Company
Pfizer
IBRANCE® is the first FDA-approved medication in its class. IBRANCE is a targeted therapy known as a CDK 4/6 inhibitor. It is not a traditional chemotherapy. Taken in combination with certain hormonal therapies, IBRANCE works to put the brakes on cell growth in both healthy and cancer cells. This helps slow the progression of cancer, but it can also cause side effects, some of which are serious.
Info
Role
Associate Director of User Experience
Team
Copywriter, 2 UI Designer, Data Analyst, PM, Account
Engagement Length
1 Year
Tools
Axure, Sketch, GA, Hotjar
Understanding the problem
Why are we doing this?
1
Business Side
Empower patients to engage in a proactive dialogue with Heath Care Providers and drive a convicted patient request for IBRANCE
Improve broad awareness of IBRANCE to ensure patients understand the total value proposition
_
2
Customer Side
Patients are overwhelmed with the volume of information/resources and have trouble finding answers to specific questions – especially at the point of diagnosis
Although patients appreciate the content, the amount of resources can be difficult to navigate - multiple types of support, patient programs, financial assistance, brand ambassadors
Approach
Discovery
A full audit of existing properties was conducted to map out all the content types, catalog all drug claims, and ensure that the Fair Balance approach was respected.
Working with a strategist and an account, we were able to advocate for a client workshop to put the key stakeholders into the mindset of their users and create alignment.
Workshop
We organized an in-depth client workshop, incorporating card-sorting exercises and design thinking methodologies to collaboratively define and align the project’s information architecture and overall goals. This process fostered a shared understanding among stakeholders, encouraged active participation, and ensured that both the business objectives and user needs were clearly reflected in the project's structure and direction. By the end of the session, we had a solid foundation for creating a cohesive and user-focused experience.
Wireframing
Taking advantage of existing content
Despite website merger being a massive task, it also provides a number of efficiencies - existing content can be repurposed, and repackaged, to suit the needs of the new product.
Having client approval for the sitemap allowed me to quickly map the content to the right areas, identifying needs for the new content, while modernizing existing, RC-approved content.
Prototyping
Test, Test, Test
After receiving client approval on the initial set of wireframes, it was essential to validate the approach with real users. Using Axure, I transformed the complete set of mobile and desktop wireframes into an interactive, clickable prototype, enabling remote user testing to gather feedback and ensure the design met user needs and expectations.
Would you like to see the prototype in action?
Please use the password: Sergey
Design Process
Working with Design
I was fortunate to work with several talented designers who made wireframes shine. Through close collaboration, we defined CTA loudness, reusable components, global elements, and animation library to provide truly consistent experience for all the users mobile and desktop.
Approvals
Client and Regulatory Approvals
All materials prepared for distribution must undergo evaluation by Pfizer's Review Committee (RC) to ensure factual accuracy and adherence to applicable laws, regulations, and Pfizer policies.
While client reviews may take place in a clickable prototype—such as an inVision prototype—a website must ultimately be packaged as a PDF. This means all text and images must be placed in the final layout, internally approved, reviewed by the client, and then presented.
Errors can be costly, leading to delays, revisions, and extended timelines.
Internal Processes
Improving team's efficiency
Historically, the hand-offs were done via annotated PDFs leading to numerous hours wasted in meetings trying to find a shared understanding of the goals.
I've insisted on using JIRA to create yet another efficiency. I mapped all the global elements and main pages to Epics, while using Stories for details.
JIRA also allowed for better QA, leading to minimizing miscommunication and better direction for the off-shore development team.
Tracking
Measuring the success
An additional advancement was the integration of Hotjar as a primary tool for real-time, 'in-the-wild' tracking across our entire user base. User data was anonymized in strict compliance with Pfizer's privacy guidelines.
Alongside Google Analytics, this approach revealed a 107% increase in visits quarter-over-quarter. Engagement on mobile devices remained lower, as anticipated, given the demographic's preference for conducting product research on larger screens.
