Darkland Brewery

Web design, development and branding for a Halifax based Micro Brewery

Requirements

Darkland Brewery are a new brewery based in Boothtown, Halifax. I was asked to design and build their website and create the company logo and identity and design some pump clips for their beer. I started with the logo design, identity and branding then pump clip designs, before moving on to the website design and build.

 
Darkland Brewery web design and development
 

Logo Design and Identity

Rather than just come up with logo designs, I approached this in from a different angle. The name Darkland Brewery suggested there is some meaning behind it. After speaking to Gav from Darkland Brewery it was agreed a Viking theme would fit in with the brewery's ethos. Knowing this I researched Viking runes with the idea of using one in the logo. After a few attempts I settled for the Othala rune. The client loved the logo and so I moved on to designing the letterhead, business cards, some pump clips and T-Shirt, before moving on to the website design.

 
Darkland Brewery Business Cards and pump clips
Darkland Brewery T-Shirts
 

Website Design

It was decided to create a one page static website with a contact form to give the brewery a web presence. This could be converted to a dynamic website using a CMS at some point in the future. The first stage of the website design was to create a hand drawn sketch. I then created a wireframe from the sketch, to show the position of key elements on the page.

 
Darkland Brewery - Desktop wire frame
 

Website Visuals

The next stage was to create the visual mockups. I created various versions using different background images for the header and various images in the sections. After presenting the visuals to the brewery, the visual mockup below was chosen for the website design.

 
Darkland Brewery website visual
 

Final Result

The final stage was the website build. Like most of the websites I build, I used the Zurb Foundation 6 responsive framework to provide responsive functionality with some CSS and Javascript customisations for the image breakpoints and menu interactions. I used ASP.NET to handle the Contact Us form submission and JQuery to provide micro interactions on the Contact Us form.

 
Darkland Brewery - desktop image
Darkland Brewery - mobile image
 

View the finished website: http://www.darklandbrewery.co.uk

View the finished website: http://www.darklandbrewery.co.uk