Sector(s)
Team Members
Visit the site
Visit the siteOrganizations Involved
Community contributions
Various Patches. Any issues were reported to Drupal module maintainers.
Migrating and redesigning two entities into one for a cohesive brand experience.
Humane World for Animals (formerly the Humane Society of the USA) is a non-profit organization whose main focus is to end suffering for animals. Striving to end harmful animal practices through rescue, response, sanctuary work, and various hand-on animal care services, Humane World for Animals seeks to build a stronger animal protection movement through policy change and passionate activism.
Back to topThe Challenge
Before the recent brand refresh to Humane World for Animals, the organization was split between two entities — Humane Society of the USA and Humane Society International — and were maintaining them via two separate websites. To make things more complicated, one site was on Drupal while the other on WordPress, so content editors were navigating content on two completely different systems with no cohesion between them.
From the user perspective, another main challenge was that they found that both internal and external users had difficulty understanding their message when visiting the original site; rather than being an organization that was focused on animal protection and tackling the root causes of animal cruelty and suffering, they were commonly misconstrued as an animal shelter or a resource for pet owners. Other issues included users having difficulty finding content, a poor mobile experience, an uninspiring design that didn’t help gain new audiences, and no streamlined way to allow users to sign up to volunteer or donate.
It was time to consolidate the two websites and present a unified global brand experience to users worldwide.
Contact Kanopi about your project
Back to topAbout the project
The Solution.
Working in tandem with an outside PR agency who was managing the brand rename and refresh, Kanopi worked in three phases to consolidate the two sites.
The first phase was to focus on the Humane Society of the USA’s Drupal site as well as their blog. We did extensive discovery and research, including content strategy work (including personas and audience research), a technical review, sitemaps, user testing, and wireframes. The second phase was to then repeat the same efforts with Humane Society International’s WordPress site. Both phases 1 and 2 took about six to eight months to complete.
The final phase was then to amalgamate the two onto one platform and rework the design to accommodate both. The design was improved in several areas:
- We created a mega menu that allows for media-rich blocks inside the menu as well as easy management of menu links.
- To make form submissions easier, we migrated to a more best-in-class forms module called WebForm.
- Accessibility was improved
- We streamlined their entities, cleaned up the admin experience, and deleted a lot of cruft. Using Kanopi’s Saplings work, we made their content editing experience component-based to make it easier to manage and more flexible.
- Visual data (numbers, maps and charts) are included throughout to better demonstrate what they do.
- The imagery was reconsidered to tell a fuller and more complete story of how animals were being affected in each geographic location.
Because their timeline was aggressive due to the rebrand’s firm launch date, we made the decision to upgrade their existing Drupal site rather than building from scratch. As they were already on Drupal 10, it became a matter of simultaneously migrating the international WordPress site into the Drupal one to bring the entities together into D10. All content and media from past years was kept intact so the end viewer would have access to it in the new website regardless of which initial platform contained that content.
Back to topKey Features
Domain Access
By using Domain Access, Humane World can create subsections and landing pages for different regional areas of the site, as well as present block content that’s customized to the different regional audiences. This allows those regions or countries to share and control their own content while not affecting the larger brand.
Translation Capabilities
To meet the language needs of their global users, the site can be translated into multiple languages (11 languages are currently available), with flexibility to add languages as needed.
Localization
The new website uses geolocation so it can serve up a different sign-up footer block tailored to the location or country of the visitor
Back to topThe Result
Kanopi provided Humane World for Animals with a full fledged digital experience with both desktop and mobile designs tailored towards their demographics, giving a UX experience that focuses on showing users important content and delivering clear messages. Because the two brands were merged into a single entity, content editors gained all the efficiencies of managing only one instance.
The micro-site functionality allows the separate regional offices the ability to control their own content without giving them the keys to the global umbrella site. Additionally, with the clean up of the extraneous content types, components, unused modules, and technical debt, the site is simply leaner and more streamlined.
The Humane World website also scores 100% on accessibility tests, and has won multiple awards. Read more here.
Back to topWhy Drupal was chosen
They were already on Drupal 10, so it was a matter of migrating the two organizational entities into one. Most of their staff were already familiar with Drupal, and they had a significant number of custom modules to support their complex workflow and SEO requirements. Lastly, they knew Drupal would be able to support their translation and localization needs.
Technical Specifications
Drupal version:
Key modules/theme/distribution used:
- Domain - This allows Humane World to organize and present information for each of their worldwide locations; they can display different content on different regional landing pages, but also share content across regions when needed. It streamlines support for regional sub menus and allows each region to configure different enabled languages.
- Domain Microsite - This allows the client to make each regional domain a subpath of the site, rather than a top-level domain, greatly reducing the overhead of maintaining numerous top-level domains.
- Migrate - Kanopi created two separate migrations for this project: one to migrate the hsi.org WordPress content & assets and another to migrate the hamensociety.org content & assets. Using the core Drupal Migrate module and related contributed modules (migrate plus, migrate tools, migrate files, etc.), Kanopi engineers created scripted, repeatable migrations, and successfully migrated legacy content to the new site.
- Paragraphs - The legacy Drupal site made extensive use of the Paragraphs module to enable rich, flexible editing experiences for editors, so we embraced this paradigm for the new site as well. We were able to streamline and extend Humane World’s library of Paragraphs-based components, and update their styles to conform to the new branding and styles.
- Sitewide Alert - Humane World employs a sitewide alert banner to notify visitors about local conflicts or animal welfare issues around which they are trying to organize. This module allows them to do either global or regional level alerts as needed.
- This site build was also a complete re-organization, re-design, and re-branding effort. Kanopi created a brand new custom theme based on the contributed UI Suite Bootstrap theme and ecosystem. The theme is responsive and meets accessibility requirements.
