Responses by ED.

Background: The Art Gallery of Ballarat (AGB) is Australia’s oldest regional gallery. Despite its age, the original motto of the gallery—“not for self, but for all”—is just as important today as it was 135 years ago as the institution moves into the future, acknowledging and respecting the past.

The gallery’s new website aimed to further its mission of championing audience experience and the accessibility of art, particularly for the community of Ballarat. This project commenced amid COVID lockdowns that heightened the need for a brand new digital complement to the positive change that had already been underway at the gallery.

Design core: The flagship design element that greets people when landing on the site is the interactive Salon Hang. In 2018, AGB undertook the mammoth task of rehanging the staircase that faces the main entrance as part of a wider transformation of the gallery. The salon hang was a major step change with floor-to-ceiling works clustered together, displaying a wealth of stories and artists unique to the gallery itself.

The most significant design element is the interactive Salon Hang feature that greets users upon entering the site. We created various arrangements in the back end that mirror the silhouette of the staircase hang, both drawing a direct connection to the physical space and, more importantly, extending an invitation to users to engage with a treasure chest of content. From collection artworks to school program activities, online exhibitions and shop products, the interactive Salon Hang became a hyper-flexible tool for AGB to constantly adapt and communicate changes while enabling users to explore at their own discretion as they would in the physical space.

Favorite details: Amplifying the Salon Hang in a digital setting. We’re proud of how we were able to take something so incredibly unique to the client and amplify its qualities in a digital setting. Rather than approaching design choices with the typical aesthetics of most gallery sites, we took a distinctive AGB characteristic and translated it into an immersive digital experience where users can interact with or observe any piece of content they see fit. The added benefit of viewing the salon hang works digitally is that you can click on a piece and learn more about it instantly.

We’re also proud of the design sensibilities and measures we took to retain the true ratios of every artwork displayed across the site. Rather than being cropped and masked to fit within a content block, the artworks appear just as they would in a physical gallery and are accompanied by the correct crediting sequence.

Technology: WordPress anchors the content and is used as a headless CMS. The front end is built on Next.js with React, utilizing GraphQL to interact with the database.

With an outstanding collection of more than 11,500 works, AGB faced a major pain point with speed and performance. The site not only needed a fully searchable image library linking directly to its collection management system but better usability with creative ways to explore and discover, all while striving to meet We Content Accessibility Guidelines 2.0.

Speed is addressed through Next.js’s page and query caching, with the external Vernon collection management system integrating to deliver search results.

Another integration between Shopify, Retail Express and Next.js was achieved using Shopify’s Storefront API and GraphQL Admin API.

Special technical features: One feature we’re proud of, both from technical and conceptual points of view, is called “Help Us Hang.” Embracing the gallery’s motto, we created Help Us Hang as a way for the community to vote on what gets put up in the gallery every month.