Responses by Angus Gastle, managing director; Anton Kozhevnikov, development director; Brandon Levesque, art director; and Josh Posty, creative director, CUSP.
Background: Matthew Fisher is an incredibly talented artist based in New York. His Art Objects were made available as part of his public collection in early March 2021 to coincide with his feature in the New York Times’s famous T: The New York Times Style Magazine. His audience consists mainly of high-end art collectors in New York and around the world.
Favorite details: Matthew is an amazing artist and human being. For us, the entire site was a labor of love, filled with small details and little surprises that took hours to perfect. Key navigational elements like the Index and the Menu are examples of our attention to detail with this project. Hidden gems like the Inspiration Gallery provide visitors another layer of understanding into Matthew’s unique process and point of view. It’s these small additions—and the possibilities they unlock—that make us so passionate about designing for the web.
Design core: Some of the core features of the site are the Index and Product inner pages. These two pages allow for interesting dynamic functionality with UX of browsing the products. The design style of the site takes cues from classic editorial-style layouts: keeping things in a grid and complementing the images with interesting typography.
Challenges: The product landing page design, which combines 4K images, HD cinemagraphs and a minimal UI that surprises and delights visitors. Combining Cloudflare’s CDN and a host of other optimizations, we were able to get it working smoothly on most devices. Given our target audience likely does not own “last year’s iPhone,” we were intentional with pushing the performance to the limit even on the latest devices.
New lessons: We have identified the rendering limitations of some browsers, ways to optimize animations for different devices, and have also explored the specifics of shader technologies and PixiJS, in particular.
Navigation structure: The thinking behind the navigation structure was to create easy accessibility to the product from anywhere on the site, while also enabling the user to browse the products quickly from the Index page to create a fluid easy to use experience.
Technology: The site is a front-end React Web App that is powered by the Shopify Storefront API for e-commerce logic, products and most content.
Special technical features: Our Inspiration Gallery and most of the sliders on the website are built using PixiJS for WebGL rendering with custom shader animations. That gave us flexibility in terms of animations we wanted to use and helped us to achieve excellent performance across all types of devices.