Responses by Margot Gabel, designer; and Derek Limbus, developer, Build in Amsterdam.

Background: Foam Talent 2020 is a digital exhibition platform that showcases the work of exceptionally talented visual artists under the age of 35. This project is an addition to the annual talent issue of Foam Magazine and the touring Foam Talent international exhibition. It acts as a showcase for extended portfolio work, including video art, accompanying soundscapes or music, audio voiceovers, and video interviews. Free to access, the exhibition addresses everyone curious about contemporary photography.

Design core: On Foam Talent, content is the main eye catcher. Therefore, we minimized the interface to only support the artwork, even disappearing when necessary. We never cropped any images and made use of the whole screen’s width and height to do justice to the visuals.

Favorite details: Each page layout and image-reveal animation are unique. We worked on the design and motion in close collaboration with the Foam team and the artists themselves to ensure the results were in line with their work and expectations.

Challenges: Accommodating the atmosphere and tone of each artist’s project. We had to express different ambiences and feelings through the limits of layouts, colors, reveal animations and captions, among other elements. Some projects have a documentary, research-based approach; others follow one sequential storyline; and others still have a combined body of work.

Navigation structure: Our guiding principle was to bring emotion to the browsing experience. This means we embraced randomness in order to foster discovery. Each time you open the website, a different artist’s work will be featured on the digital cover introductory page, enabling you to navigate from another starting point.

Our target audience is varied, and we wanted a navigation that feels familiar and natural for everyone while still retaining an element of surprise. We were inspired by the operating system everyone uses daily for vertical ‘switching’ page transitions, while the horizontal scroll on projects emulates the walls of an exhibition space.

Technology: The site is statically generated with Next.js.

Special technical features: Compared to the conventional site, which goes vertically, this site has different layouts. The artists’ pages are fullscreen, while the project pages go horizontally. Therefore, the ordinary responsive design strategy did not apply here. The designer and developer worked closely together to find a solution for scaling. In the end, the site looks nice at any aspect ratio.

Another interesting setup is the project pages. We wanted each project to have a different layout and animation, which was almost impossible considering the number of projects and the time we had—if we wanted to make them separately. Our solution was to create a structure that allowed projects to be configured statically. That way, different layouts and animations could be generated efficiently while having their own identity.