ABOUT

After a six year refurbishment of the Heckfield estate, the launch of Heckfield’s first ever website marks a truly exciting, much-anticipated occasion. Matter Of Form were approached by Heckfield via Made Thought, a brand agency ethically aligned with MOF’s own value driven digital innovation, to support their creative concepts with tech delivery.

Nick Marshall, MD at Made Thought, identifies the site’s target audience as broad but “discerning thought leaders” - people who enjoy the best things in life but also appreciate places and businesses with a progressive thought leadership agenda: “Like all hotel sites, the site has to showcase the best of the hotel and entice people to book a stay. It also has to be a gateway for people looking to visit and dine or use the facilities including the spa and the cinema. The hotel also has an unusually active events series which are a crucial part of engaging that audience.”

To work alongside Made Thoughts branding, MOF focused on the wonderful photography to ensure the beauty of the estate was truly reflected in the site. From a layout perspective, our Design Director, Anna Jehan, explains how we wanted to give nuggets of information to gradually tell the story (while also leaving some intrigue for the surprises you might discover when you arrive). “We focused on the of the elegant finesse of animations and interactions, to ensure the user flowed seamlessly from one area of the house to the next. Colour also played a huge role in imitating the atmosphere one would experience within the hotel, online. The beautiful tones of each offerings’ branding flowed naturally as you would expect as you walked throughout the building.”

Heckfield has a host of wonderful features and facilities and could have easily become quite a complicated structure. But, through story telling on the pages with clear signposting throughout the journey we were able to keep it simple. Heckfield is a growing eco system with a constant release of new offerings and surprises and so this structure needed to be flexible enough to allow for these items to be gradually added in.

The MOF tech team, led by CTO Chris Wilcox, built the site on a custom project boilerplate using hybrid webpack/ gulp build task. For module-module communication, we made use of a pub-sub system whilst vue.js was used for more interactive sections of the site. In terms of back end technology, we platformed the site on Kentico EMS with a MVC approach towards the build. In regards to challenges we faced, Chris commented, “we paid particular attention to responsive images: each image required up to eight variants to deliver the most appropriate size for each device or screen pixel resolution. There also existed a complex interaction with the navigation and varied across each breakpoint.” Nevertheless, we managed to achieve a single navigation to work for all and ultimately deliver full templates and a library abundant with modules in time for the much anticipated site launch.