Responses by Anton Kozhevnikov, head of creative development; and Brandon Levesque, art director and designer, CUSP.
Background: Erin G. Wesley, a Los Angeles–based cinematographer, values connectedness and firmly believes that through storytelling, our shared experiences emerge. Her commitments are to provide inclusive, boundless imagery that represents who she is and depicts the world we share. Wesley’s portfolio site was designed by CUSP with development by Salt & Pepper.
Challenges: “The most challenging tech aspects of the site were the shader gallery on the homepage with videos inside and the Easter egg infinity gallery,” says Anton Kozhevnikov. “The main challenge here was to revise and optimize our approach of working with videos to make them load fast and play smoothly.”
New lessons: “From the technical perspective, we received great experience working with WebGL and videos in PixiJS,” Kozhevnikov says.
Technology: “We used the React framework Next.js to build the website,” says Kozhevnikov. “To create interactive experiences and key visual features, we used GSAP, WebGL shaders and PixiJS. For the content management system, we used Strapi, which was completely customizable and enabled us to build the site according to the project needs.”
Special technical features: “We’ve developed our own custom scroll and integrated it with PixiJS,” Kozhevnikov says. “To provide users with a 3-D experience in our interactive features, we use a 2-D WebGL renderer to extend PixiJS’s potential.”
Navigation structure: “The thinking behind the navigation was to create a fluid, easy-to-navigate structure that enabled the user to cycle through multiple projects in a quick, dynamic fashion,” says Brandon Levesque. “Also, adding motion into the thumbnails and microinteractions to generate visual interest ties in with the creative nature of what Erin does for a living.”
Special navigational features: “The features we’re proud of on the site are the z-space image Easter egg and the ability to change the aspect ratio on the homepage thumbnails,” says Levesque. “The z-space is a visually interesting way to view all of Erin’s work in one place. For the aspect ratio change, it’s a subtle element that makes the homepage function tailor-made for the nature of Erin’s work.”