Digitally transformed wineries

Crafting world-class wine through digital experiences

Design / Development

The Client

Leaders of the world of wine

Accolade Wines are pioneers of the wine world with an extensive portfolio of wineries across the globe and some of the most established brands in Australia. We came on board to help transform their digital presence - rejuvenating their existing brands and bringing new ones to life.

The Goal

Creating premium digital experiences

Accolade Wines wanted to elevate their wineries into the ‘world-class’ tier by creating premium digital experiences. The plan was to begin with 8 of their brands, integrating with ecommerce and pushing the user experience of online purchasing while educating the customer on their products. Their vision was to evolve this solution to be reused across more brands in the future.

The Challenge

8 unique brands,
1 shared library

Accolade Wines is a large company that has over 45+ wineries. All of them managed under different CMS’s, through different brand managers across a global team.
While each brand has its own unique needs and functionality - some with and without ecommerce, some with complicated product structures, others with a rich history to be told. We worked closely with Accolade Wines and their brand managers to recognise these differences but also identify opportunities for consistency and reusability to further help contain and manage the vast variety of wineries. 

Sharing a library of components meant that we could ‘spin up’ sites in a timely fashion and create efficiencies in leveraging off the work of the previous site, but it also came with its own challenges. Not only did the design team have to find ways to visually distinguish each brand, the developers had to create logic that would work for each of them too.

The Approach

Curating the deployment plan

Tackling all 8 brands at once felt like a daunting experience so we began by focusing on the likeness of each brand, what was consistent across all brands and what could be translated across multiple sites - one of the more complex and bigger brands; Hardys became our ‘playground’. This helped us take abstract thinking and pressure test these components and ideas with an actual brand.

Once we were happy with the Ui library our designers spent the next weeks immersed in each brand - understanding what makes them tick and exploring their visual identity using the components as a base.

As we moved through each brand, the design and development teams continually evolved the component library where necessary. This required transparent and continual communication between departments.

The Design Approach

Designing a point of difference

Designing based off a 'template' is not something designers dream of but it was our challenge to let the template enhance our design process, not restrict it. We made subtle but powerful decisions that shifted the look and feel of each brand without affecting the structure of the component. Our toolkit consisted of colours, typography, animation, playing with shape, style and placement of imagery. We also crafted the content and ordering of components on each page of brand’s site so that each better reflected the purpose of the brand and the needs of its consumers.

The Technical Approach

Consolidating into a single CMS

Whilst the designers advocated for the brands identity the development phase for us was to advocate the Accolade team managing the multiple sites via the CMS. We wanted to create an ecosystem that was manageable, intuitive and did as much heavy lifting for the team as possible.

It was important to lean on the work from one site to another. Architecting a multi-tenant application helps reduce further costs, maintenance and rolling out new features across all brands. 
DatoCMS was the perfect tool, being natively headless it allowed us to decouple the content from the frontend implementation.

The Technical Solution

Content is king

We found a good balance of Content Modelling for where pages had layers of consistency, leveraging off a Content Matrix also allowed the design team to continually push the brands unique offering.

Our choice with DatoCMS helped organise and render digital assets allowing the brand managers to build channel agnostic content thats reusable across the business via a Content Modelling approach. It also gives the brand managers the ability to input all their data and let the CMS piece it all together on the front-end creating a consistency in how we represented the product and future proofing changes across all sites.

NextJS was a natural selection as it allows us to create a react framework for building high performance applications, the hybrid static & server rendering also serves as a great tool to creating high web performance.

Together these tools created a unified and powerful ecosystem that allows Accolade Wines focus on content and marketing without having the stress of managing multiple CMS’s, environments and updates.

The Result

A foundation that's future-proof

Alongside creating 8 unique websites that speak to each their brand’s personalities, we created a large library of reusable components that Accolade Wines can use across their brands websites; a consistent CMS for brand managers to use and a great foundational set piece to grow future wine brand from.