Redesigned Merck's website

Client
Merck & MSD
Date
2019-20
Design Role
Lead UX Designer

For over a century, Merck (known as MSD for countries outside U.S. and Canada) has been inventing for life-  they have been at the forefront with medicines and vaccines for many of the world’s most challenging diseases in pursuit of saving and improving lives.

Scroll Down

project breakdown

Merck & Co Inc.  is one of the world's leading pharmaceutical health care companies. In 2019, they took a strategic approach to redesign their existing website with the ambition of positioning the company as leaders who took bold actions to prevent and treat the most challenging diseases that threatens people around the world.

The business goal: To create a positive company reputation by unifying the corporate narrative using three (3) reputation drivers:

  1. Innovation: show legacy of discovery that developed novel solutions that protect all life against the threat of diseases.
  2. Performance: show how the company overcame formidable challenges to improve the health of patients and how they tackle the threats of the future
  3. Citizenship: show how the company unites partners and empower employees to invent new ways to serve.

My Role:

I worked alongside another UX designer and took on the project as the lead UX designer. We collaborated closely with our Strategists to define content strategy and how that is translated onto the new website redesign. We had bi-monthly meetings with the client to define deliverable timeline, as well as present the new information architecture, wireframes, mockups, and prototype.

I was responsible for the following:

  • Information architecture and navigation for both Merck.com and MSD.com
  • Patients & Caregivers section
  • Investors section
  • creating a prototype for user testing

research

The design team worked alongside our Strategists to learn more about the website's users. We utilized the following research methods to gain insight on the existing website and strategize what the trajectory is for the redesign:

  • Competitive and comparative analysis
  • Usability testing on existing website (conducted by Ipsos in 2019)
  • Data analytics
  • End User interviews (conducted by Merck)
  • Stakeholder interviews

I sat in stakeholder interviews with Merck's Patients, Careers, Investor, Research & Innovation teams to understand what the user context and needs are. This was a crucial part of the research because it helped inform how information should be laid out for the different user journeys.

Decision journey maps were created for 4 general types of users:

  1. Media
  2. Investors
  3. Patients & Caregivers
  4. Job seekers & Employees

The usability testing on the existing site provided content insights that should be considered for the new website:

  • All stakeholders expect to see detailed information oncurrently available products (e.g. availability, efficacy, safety, cost, drug interactions, and dosage) and the company’s history, mission, and reputation.
  • Patients and caregivers also expect to find information onpatient assistance programs
  • Investors also expect to find financial reports for their in-depth understanding of the company’s health and product pipeline
  • Members of the media also expect to see media contact information and press releases
  • Job seekers also expect to find detailed information on career opportunities and salary and benefits

Design solution

With the new content strategy, it is important that we redefine how information is presented to the different personas. I was responsible for mapping out the information architecture for the entire Merck.com and MSD.com websites. Several information architecture workshops were held with the client and our internal team- this produced tremendous insights on how content should be grouped.

As an output of those workshops, I developed a sitemap and updated navigation that would address the needs of the users and meet the goals of the business.

In addition, content hierarchy on individual pages was extremely important to consider as it must align to different user journeys defined during the research phase of the design.

Information architecture & navigation

The existing sitemaps for both Merck and MSD website was poorly organized. The old menu displayed a long list of pages, which made it extremely difficult for any user visiting the website to find the information they were looking for. Navigation issues identified during customer interviews:

  • Lack of organization of topics
  • Overwhelming links; hard to locate
  • Naming of pages are not clear; user would either disregard it or click on it to only click "Back"

I underwent multiple iterations of the sitemap and presented to the different stakeholders (Patients, Investors, Research & Innovation, Media teams) to align on the grouping and hierarchy of information. This later heavily informed the navigation menu design. The key considerations I needed to address:

  • Streamline the sections of the website based on user group and needs
  • Categorize topics and use terminology that is clear and concise
  • Navigation needs a consistent system while giving the user control

The Merck and MSD sitemaps are fairly similar, with the main difference being MSD website cannot show the following:

  1. Product information (countries outside of U.S. and Canada have different drug regulations
  2. Investor Relations information
  3. Patient Support Programs

navigation iterations

I designed 4 iterations of the navigation. Most of the iterations was due to naming of website sections and page names. However, the signicant change was the decision between having an exposed menu or a hamburger menu. This was later A/B tested in user testing.

Patients & Caregivers

The Patient & Caregiver persona describes people with an information need that relates to a condition they have, suspect they have, or is trying to protect themselves from. This includes consumers that are not necessarily diagnosed with a disease, but are (potential) users of Merck and MSD products.

Their key tasks include:

  1. Manage, or protect self (or others) from, a condition
  2. Manage medication financials and review options for funding support
  3. Explore clinical trials and review eligibility
  4. Explore and compare different treatment options, and review eligibility
  5. Investigate products, availability, efficacy and safety profile
  6. Find support programs for specific products
  7. Find support groups for peers with same condition and/or using the same product

designs

I presented 3 iterations of wireframes to the stakeholders to align on design before working with the Visual Designers to carry out the new brand guidelines and look and feel for the new redesign.

outcome

Both redesigned Merck and MSD websites went live Summer 2020.

Browse more projects