The brief
I partnered with LEAP to deliver a new, flexible WordPress website for their client, North South Wines. Like many collaborative projects, I was brought in during the design phase to ensure the build could be delivered on time and within budget. As well as to discuss how certain features may affect the sustainability credentials of the final website.
As part of the project I provided:
- Support and advice on digital sustainability throughout the design process
- Technical guidance on search, filtering and content migration
- A lower-carbon custom WordPress website build
- Inclusive cross-browser testing and website launch
An offset grid create a subtle but striking layout for the blog content
The outcome
The designs were broken down into components, with 19 unique content and layout blocks accompanying the location-specific Hero areas at the top of every page. Every aspect of the website is amendable by the client directly, with a customised WordPress backend. A few custom templates supported the content-led areas such as the Journal and Producers area.
Data migration
Simple data migration was important to the client, with this purpose in mind, I made it as easy as I possibly could. I utilised a simple system to export, organise and migrate data from the old website to the new one. The result was a very smooth transition of the Wine Producers.
Wine producers automatically broken down by country into collapsable accordions
Balancing performance and visuals
While the homepage hero is heavier with a full scale image, it is balanced by other areas of maximum width. Together this helps to stabilise the weight of media on the page, resulting in fairly high performance scores and solid core web vitals.
A horizontal carousel showcases North South Wines company timeline, whilst parallax imagery leads the eye down the page
Subtle animation, interaction and parallax
The design team were keen to include some interactive elements, as well as some parallax. Opting for a less-is-more approach, only certain content blocks and types included these type of interaction. This helped to keep the website lightweight, whilst interesting and engaging to use.
Conclusion
Balancing visual appeal, image-led design with carbon impact is a tricky one. But this website does quite a good job of it. With planning throughout the design and build process, the website operates smoothly, serves it’s audience well, and doesn’t have too large an impact on the planet. Just like the wines the businesses distributes.