Launch of the Opéra Grand Avignon website with Drupal 9

After the Opéra National de Bordeaux, the Opéra Grand Avignon is the second opera house to ask us for the redesign, hosting, and maintenance of its Drupal website. Today, we are pleased to announce the launch of the new site.

The Renewal of the Avignon Opera

Performing arts are an essential part of the cultural life of Greater Avignon. The major restoration of the Opera has established this historic venue as a state-of-the-art stage. It preserves both the charm of its 19th-century Italian-style auditorium and the modern requirements of comfort, safety, and accessibility. While the Opera remains the flagship of this new cultural identity, “L’Autre Scène,” a modern facility and a place that supports artistic creation, contributes to the project of cultural outreach. The goal is to give various audiences the means to access the works and to develop critical and artistic skills.

Today, both venues offer an ambitious program aimed at diverse audiences.

It is in this context that Opéra Grand Avignon entrusted the redesign of their site to the bluedrop.fr agency, to have an up-to-date website and allow users to access its content and schedule while improving their user experience. The site is set to evolve, with an e-shop and a dedicated area reserved for Opera subscribers.

UX & UI Design

The various workshops made it possible to center the user journeys on the Opera’s target audiences (subscribers / groups, families, students, schools, tourists, patrons, businesses, press, and media).

We carried out:

Exploration workshops (personas, user journeys, and site map);
UX benchmarking;
Design Studio and zoning sessions;
User testing and UX questionnaires.

This approach made it possible to correct imperfections in the prototypes and facilitated the production of UI mock-ups.

Drupal 9 and a Block Library

Development did not require extensive custom coding, except to enhance certain contributed modules. Most of the configuration work focused on paragraphs, as the site features 37 types of paragraphs, making it a true block library.

The content editing experience, enhanced by the Gin theme and field grouping, is subject to a content moderation cycle managed among the 5 configured roles through the Content Moderation module.

The theme, based on Emulsify, allowed the frontend team to work in line with the atomic design principles defined during the design phase. The theme makes it easier to consistently integrate the various components generated with Storybook.

Performance and Accessibility

Particular effort was devoted to accessibility and site performance. Without configuring Varnish cache on the target infrastructure, Drupal’s native optimizations (JS and CSS aggregation, Drupal cache), along with the use of the new .webp image format, ensure excellent display performance. It is worth noting that the webP module for Drupal was integrated into the Drupal Core as of version 9.3, facilitating its deployment.