Trade Oak

Website Design & Development


Trade Oak are a flat packed oak garage company, delivering a wide variety of sizes and types with thousands of potential configurations, as well as offering a bespoke service.

Their Requirements

Website Development, Website Design, Research

Visit Site Get a Quote
Trade Oak Device View

From Request To Completion - Case Study

01. The Request

We'd like a website that allows users to easily browse our products and that features an intuitive process for them to request a quotation.

Also, we'll need full process automation and integration into other services.

- James & Edward Harringman, Trade Oak Directors

02. The Preparation

Past Data, Brainstorming & Research

Trade Oak have a clear marketing strategy - have interested potential clients land on their website and keep that interest until they request a quote.

Who will be landing on this website?

As the main marketing funnel is through paid advertising, this question can be answered more accurately than usual. The average customer seemed to be married males older than 40, who owned their own properties. We devised a full persona for this average customer, in order to build out a website format that would directly appeal to this type of person.

Buying a garage is a large purchase for most. Surely it's a family decision?

This is something we discovered while pouring over the data from past sales - while the website and product is initally (on average) found by the type of person we built a persona around, they often won't immediately request a quote. We found that usually, (and presumably) the partner of this person will then investigate before a quote is finally requested.

What does this mean for the website?

We knew then that we needed to be sure that the website wasn't overly geared towards our persona, nothing too masculine as it also needed to appeal to a female audience.

With our preparation fully in place, it's time to move forwards.

03. The Visuals

Colours, Layouts and 3D Models

The main design phase began by choosing rough layouts and ideas for the most important pages.

From here we built a full site structure, working together an intuitive funnel that customers could use to filter down the type of garage they required, consider their options and not be overwhelmed by choice.

The colour scheme had to somewhat match Trade Oak's existing branding, so we took their green and made it a little lighter, before mixing in a bright orange as a full complement.

In order to really made Trade Oak stand out from their competition, we decided to make good use of their modeling resources. As they have each of their 2000+ products available as a digital model, we asked them to export these for use on the website. Each of these are then displayed as fully interactive models, allowing customers to see an exact representation of their garage from any angle and to zoom in close enough to see where each nail will be located.

04. The Development

Automation, Integration & Managing Thousands of Products

Trade Oak have over 80 top level products, each with a multitude of variations, which in turn each have a set of images, a 3D model and a set of product descriptions - overall tens of thousands of media items and content snippets.

This of course posed a major management challenge, how do we organise all of this without spending hundreds of hours setting up and maintaining?

The Solution

To handle the media issue, we created a file naming system that would only require that each item is named correctly. These could then live in their own folders and would therefore not require many hours of adding individually to each page's image collection.

The text content required a little more work, but the end result is a system that will save a lot of admin time from now until the end of this website's lifespan. We created a code based template system, which automatically builds out the description for each product, depending on its features. If it has a gable end roof, then we use a line describing that within the body of text. The lasting advantage of this is that we can now make just one quick update to this system, which will then alter the description of thousands of products.

5. Post Launch

Analytics, Hosting & Marketing

We continued to monitor the Trade Oak website after launch, which gave us some interesting metrics, most notably that the average time that a vistor stayed on the site increased by 30 seconds.

The website was moved onto the Lightspeed servers, allowing for lightning fast loading times which in turn acts as a healthy SEO boost.

Ongoing paid ad marketing was continued with their original supplier, who expressed to us her gratitude in producing a website that is devoid of technical errors and is so easy to work with.

How would a website like Trade Oaks's help your business?

How can we help you?

Web Design

Custom designed exactly to your requirements, your website will look amazing, unique and beautiful.

Web Development

Coded from the groud up with nothing unnessessary on top, your website will be created with the skill and attention the design deserves.

Website Hosting

Offer your website to the world with our world class hosting service, offering dedicated servers and light speed.

Content Management

Log in and edit your own website. With our easy to use content management systems, you'll be in full control with complete ease.

Full Ownership

You own your new website. Once it's finished you will get full possession of all the code that powers it.


Made with SEO in mind, every page will be created with search rankings as a top priority.

Contact Us

Please include your email so that we know where to respond.

Please add the message you'd like to send us!