This case study demonstrates a new WordPress website and graphic logo created for a midlands-based damp proofing and insulation business.
I was approached by Tom and Gary from Midland Damp Doctor to build a content-rich website to market their Leicester-based damp proofing business.
After several meetings, which included brainstorming and competitive analysis, we agreed a time frame, contractual terms and price.
The website was developed in WordPress and made to be mobile responsive, meaning the design will collapse or expand to fit different device screen widths. As the website took on its identity, an original graphic logo was produced to match the theme.
Early Graphic Logo Ideas
Myself and Lee, graphic designer at Ilkeston Web Design, began developing logo concepts for Midland Damp Doctor.
Meanwhile, I sent the video Design Discussion 1: Graphic Logo Concepts to Tom from Midland Damp Doctor to clue him into the design process.
Within a few days of brainstorming, Lee and I had created five concepts and recorded a short presentation for the client.
It is embedded below:
Final Graphic Logo Discussion
As the website neared completion, and with input from the client, the logo underwent several minor changes. We also decided to create two versions of the logo – one for the desktop PC view and one for the mobile view.
Rather then add a PNG to the site, as is typical for most web design, we decided from now on we would always use the superior .SVG format due to it’s small file size and crisp quality. It can also be scaled with CSS inside the stylesheet.
When a client is supplied with original source files, they can repurpose the logo for every type of media, from websites to business cards to billboards.
Here are our final thoughts on the logo, including tips on how the Adobe Illustrator vector path format offers a future cost-saving advantage over raster formats like PNG or JPEG because the client owns the source file – very handy if they want to take it to a commercial printers for business cards, leaflets, work wear etc.
Final Website Overview
The website was started on February 19th 2016 and completed on March 4th 2016, which was the agreed timeframe.
WordPress “Posts” were used to set up an RSS feed for damp proofing case studies using a category called Examples. The client intends to publish information about each of the jobs they complete – such as Case Study 1 – as part of their ongoing marketing.
A colour scheme was suggested by the client – their preference was to use a green and black palette but a dark grey gradient was settled upon.
Because the idea of the Midland Damp Doctor brand was one of doctors, surgeons etc, the green in combination with white lent itself well to connotations of the medical profession.
A medical symbol was used as an icon in the navigation bar and was designed to change colour when the link was hovered over by the mouse cursor.
This colour scheme was used as part of the creation of the logo.
Green became the website action colour, meaning that the visitor would always know that the colour green is giving a visual cue as to what can be clicked upon.
Featured images of 700 x 400 were used for almost every page on the site. These images were created in Photoshop using the groups and subgroups feature to organise all images into a clear and well labelled hierarchy.
The featured images, along with other image files, have been supplied to the client on a USB stick.
Once the test/preview site was signed off, the task of uploading it to the client’s public server began, including adding and configuring a number of security plugins such as WordFence.
Contact Form 7 was also configured to ensure all mail could be sent directly from the email contact form directly to the client’s email inbox.
Finally, the reverse proxy CDN CloudFlare was added. This is an excellent tool which caches content, improves performance and acts as a protective shield for the website.
It’s helpful for budget shared hosts because it helps conserve bandwidth.
CloudFlare is normally added to all Ilkeston Web Design client websites as standard procedure.
Below is a video that was supplied to the client to fill in any knowledge gaps and ensure they can refer back to any of the ideas mentioned. The video was published here with the client’s permission.
Once the project was complete, all the files were zipped and loaded on a USB stick and mailed to the client.
