Our Client:
AcademyHealth brings together health services and policy research professionals to transform the future of health services research (HSR). ​Health services research is the science of study that determines what works, for whom, at what cost, and under what circumstances. HSR studies how our health system works, how to support patients and providers in choosing the right care, and how to improve health through care delivery.

As an objective broker of healthcare information, AcademyHealth offers HSR practitioners access to leading health policy publications, course syllabi, research funding, networking opportunities and training programs. They also provide policymakers and the media the necessary tools to navigate and address key issues related to the delivery of health care and the development of health policy.

Project Highlights:

  • Creating a modern design for a research organization
  • Emphasizing the value of membership
  • Building a custom Drupal module for GatherContent
AcademyHealth homepage on cell phone
Why Drupal was chosen: 

AcademyHealth needed a robust, extensible platform that features strong taxonomy handling and could integrate with multiple external services. Because the project scope is likely to grow after initial product launch, Drupal 8 was the obvious choice for building a flexible platform for their current content and future needs.

Describe the project (goals, requirements and outcome): 

Goals and Direction
AcademyHealth was looking for a strategic design partner to help define their web presence and effectively demonstrate the value of AcademyHealth membership. To do so, they needed to make it easy to find and explore relevant HSR research and topics drawn from a variety of sources.

The primary high-level goals for the redesign were to:

  • Create a strong experience for multiple audiences. The primary purpose of AcademyHealth’s website is to convey and promote the breadth and impact of health services research to a broad audience of users. The redesign needed to enhance the visibility and accessibility of key information produced by AcademyHealth and its members and partners.
  • Implement a streamlined design system. This design system needed to be cohesive and user-focused for users both internal and external, as well as member and non-member.
  • Improve internal user experience. The editing experience needed to provide better tools for managing the flow of copy as editors created new content.
  • Improve navigation through topic-centered information architecture. The hierarchy of the navigation needed to support the topic-centered approach of the new information architecture and improve users’ findability of content.
  • Convey diverse offerings of AcademyHealth membership. Member-exclusive opportunities that further the professional advancement of HSR practitioners needed to be prominent to make the value of membership obvious.
  • Embrace current web design best practices. The new site needed to utilize responsive design and follow best practices for accessibility.

A Fresh Design
The new site required a responsive design, so that all users could have a positive experience no matter the size of their screen. Responsive design prioritizes content differently based on the device users are using to access the website. With mobile web usage surpassing desktop, we adopted a mobile-first design approach. Because of the limited screen size of mobile — and the distractions inherent to mobile device usage — design must be focused on the actions most important to users.

Another requirement was that the design convey an immediate sense of brand identity that allows AcademyHealth to stand out. Our design team began by researching the competitive landscape to gather ideas for what kind of mood the AcademyHealth site should portray.

With the goal of increasing membership in mind, our designers knew it was important to create a feel of belonging with the new design. Our design team created a skyline image for the homepage that represents the different elements of their member base: healthcare practitioners, university researchers, and government policymakers. The prismatic skyline also represents the breadth and scale of the healthcare community.

After incorporating a round of feedback from the AcademyHealth team, the design direction was finalized and we began prototyping the site and building its style guide. The style guide is a set of interactive HTML and CSS components that form the design for a CMS implementation.

The Importance of User Testing
While development was in progress, our strategy team conducted both virtual and in-person usability testing. When implementing virtual testing of the navigation, we focused on terms that were used by key audiences to discuss health services content. Building upon the research conducted during the navigation testing, in-person usability testing with a group of prominent health services researchers focused on evaluating stakeholders’ ability to successfully complete key tasks that relate directly to key performance indicators and business goals. Having conducted research and holding conversations with key stakeholders, our strategists’ deep subject knowledge of AcademyHealth’s audience and content enabled them to craft questions and tasks for user testing that aligned specifically with AcademyHealth’s business goals.

By asking very specific questions, we were able to make sure topics were tagged correctly and content was filed in a way that makes sense to users. Our strategy and development team then synthesized the results of testing into recommended improvements to the site’s structure.

For teams familiar with working within their organization’s structure, there can be a desire to list all options within the site navigation. After all, it’s how the team thinks of itself. But in this case, we found that listing all options was overwhelming to people just beginning their interaction with AcademyHealth.

As a result, the main navigation was streamlined, and the list of special interest groups is displayed within the context of topical areas. When thinking about a redesign, the ability to step outside your own organization is critical and can be done quickly through the smart application of user testing. Working in native HTML and CSS allows cross-browser and mobile testing to be introduced immediately, which greatly aids the design process.

Editorial training and workflows:
While the editorial team was working with their content during the strategy engagement, during development they needed to become familiar with Drupal 8 and how the new CMS would affect their workflows. Since improving the internal user experience was a key goal, we built editorial training into the project schedule, which allowed the development team to iterate on specific improvements.

Most significantly, working with the editorial team uncovered new workflow efficiencies. Using Drupal 8’s improved editing screens and the Workbench Moderation module (now in Drupal 8.2 core as Content Moderation), we developed a custom approval workflow based around member and non-member content. Since each content type can have a custom workflow, editors with different specialties can adopt a workflow best suited to their publishing needs.

While creating content, editors can also select related content elements to promote discovery and increase visitor retention. The site uses a combination of automated and curated selection for related content, which ensures relevant content appears in each context.

The Results
In many ways, this was an ideal project. By setting up GatherContent early, our development team was able to effectively build a site that organized and showcased their content. Once development was complete, the extensive amount of user testing performed allowed us to make strong recommendations for future iterations of the site.

We want to make your project a success. Contact us.

Technical specifications

Drupal version: 
Drupal 8.x
Key modules/theme/distribution used: 
Why these modules/theme/distribution were chosen: 

Content editing experience:
Many of the contributed modules used helped to provide an enhanced content editing experience. For example, the WYSIWYG editor was extended to provide more functionality when adding links through editor_advanced_link. Additionally, draggableviews afforded content editors with a drag and drop interface to reorder custom sections of menus built with views. The rabbit_hole module allows for editors to hide pages from view and sharethis provides automatic sharing capabilities to popular social media networks. The Workbench suite of modules provided editors with multiple publishing states and content governance tools.

ckeditor_iframe, draggableviews, editor_advanced_link, entity_browser, entity_embed, field_group, file_browser, workbench, workbench_moderation

Content migration:
AcademyHealth built out content through GatherContent in parallel with the site’s development. Using modules like gathercontent_migration and migrate_plus, content could be continuously migrated while the site was being built. Rather than using placeholder information, the site could be built with the final content in place.

Community contributions: 

GatherContent:
When planning for a website redesign or relaunch, the content is more important than the technology. Yet, because of the effort involved, it can be easy to neglect this critical step in project planning. As an organization with a dedicated editorial team, AcademyHealth understood the challenge and used GatherContent during the Discovery and Strategy phase of the project. GatherContent is a content development tool that allows content to be prepared and reviewed before publishing to Drupal and other content management systems.

Because AcademyHealth could begin preparing their content so early in the process, all of their baseline content was ready before development even began. Having real, production-ready content greatly enabled our team to develop a site that matched exactly what they needed, and we were able to do all of our technical demos with real content.

In order to migrate AcademyHealth’s content from GatherContent to their new Drupal site, our development team wrote a Drupal 8 migration source plugin for the GatherContent API. Using this module and Migrate Plus, YAML migration configurations can be written to import content from GatherContent to Drupal content, including nodes, taxonomy terms, and menu items. Once development was complete, the use of GatherContent facilitated a quick launch, since moving content into Drupal had been automated.

Organizations involved: 
Project team: 

Amanda Downs, Carl Martens

Faceted search page
microsite event page
Sectors: 
Healthcare
Non-profit