Wiper and True

Our collaboration with the client began with a compelling challenge—to revitalise the visual identity of their site in alignment with their evolving brand. Armed with an already distinguished brand that set them apart, the client sought not just a website makeover but an enhancement that would resonate seamlessly with their well-established customer base. In pursuit of a design evolution, we aimed to create a new store that not only matched their brand's unique identity but also elevated the user experience for their customers.

Keen to evolve the Wiper and True brand, we worked closely with long-time collaborator and brand guardian, Hamish Makgill, in order to bring Wiper and True's visual identity into the digital age without losing focus on the core values and aesthetic trademarks of the brand. After an initial in-depth technical discovery and sitemapping process, we started the creative process by developing a series of initial style tiles that enabled us to explore different aesthetic routes to success. Once completed and reviewed by the client, we then started the task of creating a series of mobile-first core page designs that captured the needs of both the Wiper and True team and their ever-growing customer base. Across all core page designs, we anchored the new store aesthetic with a stroked, grid-based layout that echoed Wiper & True's packaging design to establish a seamless visual experience from can to cart. This grid system then served as the backbone to the structure of the website, enabling individual elements and breaks between sections to be more clear and obvious to the end-user. Spot colour was used sparingly as a method of labelling beers by type, simplifying the process of product discovery for Wiper and True customers.

In the initial stages of the Development Phase, our team meticulously configured the N&O "Super-ECO" starter theme and tailored global CSS files to establish a consistent and polished aesthetic. This foundational setup was critical, ensuring the seamless integration of the brand's identity throughout the entire project. Then, through Shopify Liquid section development, we brought the envisioned designs to life, implementing additional functionalities like a custom Build a Box, and seamlessly incorporating Recharge, Rebuy and Influence.io apps into our theme to offer additional functionality.

During the Testing & QA Phase, our commitment to quality took center stage. Each section, as it was built, underwent rigorous testing to ensure robust performance, responsiveness, and alignment with the specified designs. Addressing code tweaks at this juncture allowed us to be exceptionally thorough in our approach.

In the Drive Phase, the website underwent internal QA scrutiny, ensuring a refined and polished final product. The delivery of a virtual handover session was a pivotal step, allowing us to guide the Wiper & True team through the intricacies of the project and providing the client with a comprehensive, step-by-step guide on how to navigate the new theme. This empowerment facilitated a seamless transition and ensured the client's control over their new theme. Simultaneously, we diligently addressed any bugs, resolving high and medium priority items identified during client testing.

With the site meticulously crafted and refined, the Deploy Phase marked the exciting moment of going live! The culmination of the project, this phase ensured a smooth transition from development to a fully functional, accessible website.