Photo of site shown on tablet

Cleveland Clinic

Strategy and Design for a Global Health Care Leader

Success comes from understanding user needs. For Cleveland Clinic, Palantir led a user-centered strategy and design engagement to create a modular and responsive design that could expand with the organization over time. The design system was backed by user research along every step of creation, allowing the client’s internal team to build the site with confidence during development.

Our Client 

Cleveland Clinic is a multispecialty academic hospital situated in Cleveland that integrates clinical and hospital care with research and education. In addition to its flagship hospital, Cleveland Clinic also operates facilities in Florida, Nevada, Canada, and the United Arab Emirates. The second largest employer in Ohio, Cleveland Clinic attracts 6.62 million annual patient visits and employs more than 3,000 physicians and scientists to create one of the largest and most respected hospitals in the world. The entire clevelandclinic.org site drives nearly 100 million visits a year.

What They Needed

Cleveland Clinic needed a new design that represented the quality and innovation of the brand while serving both its local and global markets. The website needed to reflect the excellent service the organization provides to customers.

As an organization that values research, Cleveland Clinic wanted to approach the design and structure of its new site by first understanding the metrics and goals behind it so all subsequent visual decisions were backed up with data.

The previous site’s labels, links and menus mimicked how Cleveland Clinic was set up internally as an organization, but was not structured for how consumers make health care decisions online. As the internal content team was simultaneously working diligently to revise and consolidate their vast library of content, they wanted the new site to provide multiple ways for their award-winning content to be surfaced across the site more easily and in a more standardized way.

Pie charts showing where do visitors land (85%) and Landing page bounce rate (78%)
Reviewing analytics and site traffic allowed both teams to make informed decisions.

How We Helped

At its core, this project was about bringing clarity and a first-class customer service experience to people trying to improve the well-being of themselves and their loved ones. Simply put, the plan and the website designed from it were meant to help patients connect with Cleveland Clinic and its information. Palantir created a new modular design based on user research and feedback that was meant to be extensible and reusable, while Cleveland Clinic would handle the implementation internally with their Sitecore team and an outside consultant.

Strategy

The organization caters to an unusually large variety of users. In the local Cleveland area there is a large patient population which could be further segmented into several types of patients based on their needs and interactions with the organization. However, as Cleveland Clinic also serves a large national and international clientele, those audience goals and expectations also needed consideration. Beyond the patients were physicians, staff, and general public.

A project is most successful if measurable outcomes are defined at the start. To meet all these user needs, Palantir conducted usability testing using a combination of online surveys, in-person testing, tree tests and heat maps; audience definition via “personas,” which are fictional representations of certain target audiences who exhibit similar behavioral patterns; demographic research; and a review of site traffic to understand how users needed to navigate quickly through the site.

During the strategy phase, Palantir made the following five core recommendations for the next Cleveland Clinic website:

  1. Optimize for multiple devices
  2. Create more accessible pathways to becoming a patient at Cleveland Clinic
  3. Focus the navigational experience on necessary actions and information
  4. Optimize content for search and social visibility
  5. Reduce redundant content where possible

These five goals focused design decisions. We could measure success through Key Performance Indicators (KPIs) that could be compared from before and after launch:

  • Site conversions. Measured by the number of users filling out an online appointment request, accessing help pages and live chats, going to find a doctor, subscribing to newsletters, and downloads of papers.
  • Audience metrics. Measured by sessions per month, page views per session, bounce rates, and exit rates by content type.

We reworked the information architecture so users could quickly get to their destination. The goal was to reorient the focus toward the user in every way — structurally, visually, and with the content itself — and to provide the data to support the reasoning behind the reorientation. Once the testing and research was completed and revealed particular audience pain points, the site was restructured away from the organizational-focus and toward a patient-first focus that offered clear pathways to information.

Usability testing of the reworked architecture was conducted at multiple points throughout the process to ensure users got to information quickly. The resulting content types informed the wireframes and subsequent design portions of the redesign, as we were able to showcase their content by standardizing and streamlining its presentation.

Design

With the strategy work well underway, we were able to move quickly to wireframing, which were black and white layouts that explored content prioritization based on Cleveland Clinic’s strategic goals. The wireframes were where the functionality and design started to come together, as our designer was able to work in tandem with the development team to show how the content would be visually displayed.

The design team next created style tiles in order to explore the visual aspects of the site’s final design. Each style tile acts as a sort of “mood board.” These were not indicative of layout, but rather an exploration of color, typographic combinations, imagery, and other visual elements of the site’s design in order to understand the personality Cleveland Clinic wanted to portray.

Which tile “feels” most like Cleveland Clinic? Which typographic combinations are working best? Using Cleveland Clinic’s existing branding assets, Palantir was able to create a mood for the site of simplicity and sophistication.

Three style tiles were created to capture the right tone for Cleveland Clinic.

Style tile
Style tile option 1: sophisticated, minimal, focused.
Style tile
Style tile option 2: driven, community-oriented, energized.
Style tile
Style tile option 3: established, trustworthy, caring.

Once a style direction was chosen, we moved into static designs. Our designer created a modular system to provide a distinct yet cohesive approach across the brand. The design provided autonomy for the main Cleveland Clinic and other related clinics and institutes, as well as providing for enough customization to address specific needs for the unique populations visiting each site. A modular design approach also allowed for alerts, ads, reviews, or events to be publicized in key places throughout the site without disrupting the rest of the content. Having a modular design system also made it easier for the Cleveland Clinic team to add and adjust pages as required during development.

Each page of the site was packed with information. Because the content had been been thoroughly considered by the internal Cleveland Clinic team and the content types and taxonomy determined, the design team was able to approach the hierarchy and placement of the content in a thoughtful way so that the design never made the information appear overwhelming. Particular attention was given to health information pages and doctor biographies, since the reorganization of the content itself had an impact on the architecture. The team kept the personas in mind as they crafted the visuals to create the functionality and calls to action that provided the easiest user experience possible.

 

Screenshot of doctor bio from old site
Doctor bio from the previous site.
Screenshot of doctor bio from new site
Doctor bio on the redesigned site with improved hierarchy and cleaner navigation.

Once the design was finalized, we expanded into additional templates and pages which were built in HTML/CSS as a working prototype, with all code meeting WCAG accessibility standards of AA grade or higher. All templates, typography, and modular components were consolidated in a comprehensive style guide, which provided detailed documentation for the Cleveland Clinic development team as well as recommendations on how to maintain and improve the code optimization during development. This style guide created a solid foundation for an easier hand-off, and allowed for a smooth transition into the build phase.

“Palantir handed us an organized style guide package of designs and code that we could take and move forward for development. Additionally, we were able to adapt the style guide for internal needs that are more stylistic without altering Palantir’s designs. Our team didn’t have to worry about the technical side [of the style guide code], it just worked.” — Brian Gresh, Executive Director, Digital & Content Marketing

The Upshot

So how did the site perform after launch? Some initial metrics show the site is performing well.

  • There was a huge increase of 92% in the viewing of “Find a Doctor” profile pages compared to the same time period for the previous year. In addition, users are now looking at multiple profiles, which means that visitors are now “comparison shopping” for doctors — a key goal for this content.
  • The sessions per month increased by 15% compared to the same time period for the previous year, hitting a high of 10 million in March 2017. That lift translated to a 4 million difference in number of users.
  • The internal client team was able to use our style guide create a new section for finding contact information with a call to action that more than doubled the usage. It’s created a new challenge since the call center is getting contacted more often than anticipated, but they are tracking conversions to see if there’s a corresponding lift in admitted patients.

Palantir’s strategic approach detailed the design and content components within an overall framework necessary for Cleveland Clinic to support a vibrant, dynamic, yet coherent web presence that offered exemplary customer service while being flexible enough to accommodate the needs of varied audiences.

Our process helped amplify and focus the talents of Cleveland Clinic’s web team, who best understand the site’s potential and challenges. Together we were able to realize the vision of the stakeholders into an actionable implementation roadmap, and create an easy-to-use site that improves the health care experience for all.