Responses by Anaïs Blanc, project manager; David Guillemin, chief executive officer; Louise Margueritat, art director; Melissa Martin, creative technologist; and Guillaume Tomasi, creative technologist, Kffein.

Background: Designed by Women is a website that explores the international contributions of women in design from 1930 to the present. The website was launched at the same time as the exhibition Parall(elles) at the Montreal Museum of Fine Arts, which exhibits the collection of the Stewart Program for Modern Design, a foundation that collects objects from international designers and makes them accessible to the public. The website aims to valorize the foundation’s collection of objects even after the exhibition ends. We wanted to highlight the women behind the work as much as their work by showcasing their portraits and stories.

Favorite details: The art direction was based on the brand guide created by Paprika to convey and evolve the universe of Designed by Women in the digital world. Paprika also created specific typography for the project that gives a unique character to the website.

Also, working with the Stewart Program was a great collaborative experience. The pictures of the artists and artworks provided are of high quality and help to showcase the talented artists of the exhibition.

Challenges: The most challenging aspect of the project was to create a navigation that conveys a museum-like experience. Our strategy was to create different types of navigation to encourage discovery and curiosity. Sometimes vertical and sometimes horizontal, the navigation also offers user interaction with different “views,” inviting even more exploration.

The interactive nature of the temporary exhibitions and the transition effects of the detail pages were technically challenging to implement because we wanted to bring smoothness to the user experience.

Navigation structure: We chose to alternate between vertical and horizontal navigation. The vertical navigation is dedicated to the main sections, such as the homepage, the listings and the history section. The artists’ details and artworks are available through horizontal scrolling to underline a gallery-like experience.

Temporary exhibitions are displayed through an image grid where the user can freely move around and have a global view of the selection before visiting specific works. Each viewing is kept in memory to guide the visitor through the exhibition.

Technology: We used our usual stack including Craft CMS, Figma and VueJS. For the animations, we first prototyped them in After Effects, then remade them in programming via the GSAP animation library and three.js.