Andi Best Freelance Designer

Fighting Cocks Website Design

Freelance commission for Fighting Cocks
Client: Fighting Cocks

Client: Fighting Cocks Objective: Execute a website audit to identify how a redesign would overcome weaknesses in the current build. Solution: Design and build a device-responsive website that addresses each of the audit's criteria on modernisation, improved user experience and content hierarchy.

In a northern corner of the Kent countryside, set against the picturesque landscape of the River Darrent is The Fighting Cocks Riverside Pub and Restaurant - an impressive dining and drinking venue whose reputation across the borough is highly regarded. The current owners of the business have spent their seven years renovating the property and refining the service, but hadn't yet focused on their website which had been largely untouched for the duration. The client commissioned me to rectify this.
Website audit carried out for Fighting Cocks

Website audit

I began by carrying out an audit of the Client's site to identify what it lacked and how I could improve it. Among other things my audit found that the site was not device responsive and therefore compromised the experience for mobile users, potentially losing trade from online bookings. From an SEO perspective a non-responsive site also counted against the business. Additionally, a lot of the user experience and layout was counterintuitive, requiring multiple clicks to arrive at pages and sifting through walls of text to find information.
With the full user experience criteria established and signed off by the Client I began drafting layouts for the site redesign - a process that sought to utilise the refreshingly vast collection of photographs the Client was able to supply.
There are three key conversion areas to the The Fighting Cocks website: table reservations, menus and venue hire. Each needed significant consideration in their design and position within the overall site hierarchy - two areas where these pages fell short in the audit. The table reservations page is now more easily accessible via a featured panel above the fold on the homepage, and no longer takes multiple clicks/page-loads for users to arrive at the booking form thanks to a new booking widget.
The various food menus were previously segregated to their own pages accessible only by passing through a central compilation page - an unnecessary step in the user journey. In my redesign I've built each menu into a single sliding interface that the user can navigate with ease. Additionally unique URLs suitable for social sharing anchor each menu, complete with full SEO conventions.
Sliding menu design for Fighting Cocks Riverside Restaurant
Table booking page for Fighting Cocks
Video content on the Fighting Cocks website
Interactive video playback of Fighting Cocks venue

Digital video

Video plays a major role in this website design, inspired by woefully underrated footage the Client had created for the venue previously. A four and a half minute video shot using a drone as it soared in, over and around the restaurant, beer garden and grounds was previously buried in a text link to a third party hosted drive, and was in no way getting the exposure it deserved. I made it a goal for this project to make the video work much harder, so as well as prominently placing it in a dynamic player on the homepage, I also created a segmented teaser video that plays silently on a loop as wallpaper to the homepage.

The video aspect of this website redesign was particularly tricky to get right. I had to find a delicate balance between third-party hosting and self-hosted native handling to ensure the videos and their presentation looked and functioned adequately across the broad variety of web browsing clients.
Great client supplied photography
Great client supplied photography
Great client supplied photography
The wealth of imagery the Client had on hand was staggering and too good to ignore, so rather than simply bury it all in an interactive gallery I chose to give it more presence, and centre the entire site layout and design around it. With photography at the forefront the comprehensive aesthetic is measured, blocky, and sympathetic to the "dark tavern" quality of the original design, albeit with gold and olive tones introduced to soften it up.
To this day the Client still expresses how happy he is with the new design.