Sector(s)

Team Members

czunigaco, thejimbirch, dbeyer, Rook162

Project Team

Kanopi Studios

Visit the site

Visit the site

Organizations Involved

Community contributions

Various patches

Back to top

Creative website upgrades that practically sing.

The San Francisco Conservatory of Music provides a comprehensive education that prepares graduates to navigate through the world of adulthood and find the balance between their intellectual, artistic, professional, and individual goals. An education at SFCM transforms students as an artist, intellectual, professional, and individual.

Back to top

The Challenge

The San Francisco Conservatory of Music is committed to providing an extraordinary education for its students, and their website needed to convey that same level of exceptionalism.

SFCM worked with Kanopi in 2017 to create a functional and streamlined Drupal 7 website that had a strong school identity and an online experience that showcased the Conservatory’s unique mission and offerings. But it was time to upgrade to Drupal 9 (and then to Drupal 10 in post-launch support) and more specifically to tighten up their content strategy.

There was a lack of a coherent story and clear messaging, particularly on the home page; there was no clear call to action and it was unclear to whom the home page was targeted. The copy throughout the website also didn’t reflect SFCM’s bold and joyful personality.

However, the site could boast having the best SEO of its competitors. So it was imperative that the SEO strengths stayed intact throughout the project and post-launch. Additionally, the site was in need of a tune-up in order to improve its overall performance.

The main goal became to make a website that leveraged SFCM’s strong brand, photo library, and offerings to tell a story fitting of their organization while enhancing functionality and speed. So it was critical to refine the content, drive conversions (such as an increase in applications and donations) and to improve performance.

Contact Kanopi about your project

Back to top
Describe the project (goals, requirements and outcome)
Back to top

The Solution

With the goals in place, we started with deep discovery work that included competitor analysis, analytics, UX audits, and stakeholder workshops before we dove into the user experience work such as wireframes and site maps.

We uncovered that the most common reason for visiting the site was for the performance calendar. While users showed affinity for the visual presentation of the content and the grid-based view, they also identified the performance calendar as an opportunity for improvement with an expressed need for robust filtering and organization of information. So the calendar was given a particular focus.

Content was reviewed for key messaging around their state of the art facilities, large community, and the school’s desire to support each student’s goal of becoming a successful musician. It was determined that action-based headings with concise copy using current language and words would best resonate with and engage students (for example: Study, Learn, Play). Copy used elsewhere was reworked to better reflect the SFCM’s bold and joyful personality and use current, more concise language to engage future students.

Back to top

The Process

Optimized Information Architecture

The main navigation was narrowed down to three very focused areas, with sub navigation created to dive in deeper.

Personas

Six personas were created in order to assist and inform the user journeys as well as content needs.

Back to top

Key Features

Flexible Layouts

New layouts offered more flexibility than before, with new components created in order to build different layouts.

Actionable Content

Top navigation was edited to ease the user journey with action-based one-word nouns, for example: Study, Discover, Experience.

Improved Performace Calendar

The most visited spot on the website, the calendar was improved with robust tagging, filtering, organization of information, and live streaming.

Back to top

The Result

Building on the foundation we created when SFCM first became a client in 2017, we were able to strategically and successfully upgrade the site to Drupal 10 with impactful design and strategy improvements to better engage with students and audiences and enhance the SFCM brand.

Some metrics: 

  • 88% increase in how to apply pages views
  • 84% increase in application status page views
  • 24% increase in scroll depth
Back to top
Why Drupal was chosen

The previous iteration of the site was built on Drupal 7. As the client team appreciated Drupal’s flexibility and scalability; building the new site on Drupal 10 was the logical choice.

SFCM website on multiple devices

Technical Specifications

Drupal version:

Key modules/theme/distribution used:

Why these modules/theme/distribution were chosen

  • The Migrate suite of modules, including cores, Migrate Plus, and Migrate Tools, provided scaffolding for us to migrate from the former Drupal 7 site.

  • The Paragraphs module was used to create a flexible layout of components that could be placed interchangeably on the page. The Paragraphs Library submodule allows content editors to create a paragraph once and reuse it across different website sections.

  • The Search API, Search API Solr, and Facets modules power the main site search to filter through multiple different types of content, using Apache Solr as the Search API backend.

  • Scheduler allows content editors to schedule nodes to be published and unpublished at specified dates and times in the future.