The Canadian Society of Hospital Pharmacists (CSHP) supports hospital pharmacy in Canada through advocacy, education, and promotion of best practices. Focused on serving the profession and its members, the CSHP website needs to serve a wide breadth and depth of professional-content in an organized and intuitive way. From publications to events to pharmacist residency programs, CSHP’s website is information-rich. The project brief told us that “the CSHP website is the world’s window to our organization and the first point of contact for most.”

 

The landscape

When Industrial started to work with CSHP, their website was suffering from classic signs of age. A non-responsive layout made the site unusable on small screens, and the challenges they were experiencing with their CMS meant that updating the website was a frustrating experienc for content managers. Visitors to the site were faced with a confusing navigation and no clear call to action.

 

The vision

The vision for the new CSHP website was to create a user experience and visual design that was modern, professional and representative of CSHP’s core values. We knew we needed to increase engagement with key audience groups, communicate complex information effectively and demonstrate leadership in the pharmacy and healthcare fields. We needed to design clear navigation paths and make user interactions with the site painless. The user interface needed to communicate the strength of the CSHP brand through on-brand design and compelling graphic elements. Ultimately, the site had to engage members and volunteers, as well as provide a platform for advocacy, education, and recognition of excellence.

 

Open source CMS

We recommended that CSHP redesign and rebuild the site using Drupal 8. This open-source CMS provides extensive modules and broad customization features, but most importantly would allow CSHP website content management groups to quickly master updating and adding content, ensuring consistency across groups, without requiring advanced technical knowledge. Drupal is well-supported by a large community of developers, keeping up-to-date with the latest in social media integration, direct language toggling, and search engine analytics and monitoring.

 

Great information architecture 

To design the information architecture for the new CSHP site, we needed to develop a thorough understanding of the content. Conducting a high-level content inventory allowed us to design the structure, organization, taxonomy, and labeling for the site. A thoughtful architecture for content means that CSHP is able to prioritize key information and communicate effectively. Furthermore, a thorough review of content when combined with the tools of the Drupal CMS, ensures that the site is using the best practices for Search Engine Optimization.

Clean, human design

Designing for healthcare needs to strike a balance: warm but professional, clean without being clinical, specialized but human. Through careful use of imagery, a fresh palette, and a grid-based layout, we created a design framework that established the appropriate experience for the user. To really tailor the design for CSHP, we introduced a slim feature banner, crisp navigation, and custom icons. 

 

Accessibility

To ensure that the new site design and user experience is accessible to users of varying abilities, the design follows WCAG guidelines for web design and development. These guidelines include techniques for design principles and browser markup.

 

Industrial's impact

The fresh clean look has transformed the CSHP web experience for desktop and mobile users. Information is at the user’s fingertips. Crisp navigation design conveys the information on the site at a glance. Tailored user flows mean that different audiences find the information they need. Also, CSHP content managers are now able to add and edit content and manage publishing workflows.

You can visit the site at cshp.ca.