Responses by Benoît Barnéoud, digital producer, Cher Ami.
Background: This website serves as an innovative communication tool for the Opéra de Lyon in Lyon, France, to promote its 2020–21 season, a season which invites the public to question themselves about contemporary themes, such as ecology, democracy and feminism. The main goal was to show a strong link between the operas and these themes by creating a visual and audial interactive experience.
Design core: In order to illustrate the performances in the making, we used photographs taken by Philippe Chancel and Florent Tanet that show the strong link between the different topics and the six different operas of the season. The website is based on geometry and a mirror effect that visually reflects this very engaging and diverse program, turning the spotlight on the topics tackled by each opera.
Challenges: On this project, the main technical challenge was to create this mirror transition between photographs and to provide a feeling of blending. We also had constraints related to the lockdown situation: As the website is mainly composed of photographs, organizing a photo shoot proved to be a real challenge. However, this particular situation also made the website an essential element to communicate the 2020–21 season, as the opera’s usual toolset couldn’t be utilized.
Navigation structure: We created the sense of reflection through elevating the design with movement: the click-and-hold function generates a great transition and makes the navigation enjoyable. This aspect also gives the impression of having the power to go beyond the screen and appeals to all the user’s senses. Also, very special attention was paid to the sound design as we wanted to create an immersive multisensory experience.
Technology: We mainly used React to create this website. WebGL was employed just to create the geometrical transitions. One of the big challenges was to be able to have the same navigation on different devices. We tried to make a website capable of re-creating the whole experience on desktop and mobile interfaces in a very fluid way.