← Back

The Kitchen Depot

Year Built: 2022

Technology Used: WordPress, PHP, Laravel Blade, JavaScript, SCSS, HTML

Designed by: Emma Cathie

Other Developers: Rush Johnstone , Drew Reilly

The Kitchen Depot Hero Image

This was the first project I worked on as part of a team bigger than 2 during my time at Cole AD. This project came to us just after Rush joined the team and we opted for the divide and conquer approach to building.

Each of us had a section of the site to complete, but each helped each other when required so got our fingers sticky in each aspect. This project was easily the biggest one undertaken by this point in my career, so I was grateful for the learning opportunity for both my skills and working as a multi-person team.

The site was designed by one of the designers at Cole AD, Emma Cathie. Initially, the work was for the design team to create exterior signage but quickly became a website redesign and build. If you are interested in seeing more about her design process for this site, you can read more about it here.

Picture showing different examples of responsive mobile design on the Renfrewshire Chamber of Commerce site

Once we had the site design, the base of the site was created by Rush using the blank template Sage by Roots.io. Working with Sage gave us an already structured theme which is easy to follow, as well as the already configured setup of Laravel Blade which makes templating much easier.

My role within this build was to create some content blocks, configure blog posts with styling, and to customise their kitchen planner. The kitchen planner is an online tool to configure your dream kitchen from the options provided by The Kitchen Depot. It features two styles of kitchens with two different views, and a range of colour and material options for door styles, door colour, handles, floor, walls and worktop. Once you are done creating your dream kitchen, you can view a summary of your choices and are then presented with two options: book an appointment with the design team at The Kitchen Depot where your choices from the kitchen planner are sent through automatically, or to download your choices as a PDF which include a list of your choices as well as the rendered images of your kitchen.

GIF showing the different options and views of the Kitchen Planner on The Kitchen Depot site

There was some other complex functionality integrated to this site by the other devlopers, including a custom Postcode lookup and the creation and filtering of the kitchens on the display pages. Whilst I did not create this functionality myself during this build, this is something I was able to learn by seeing what my fellow developers created and reading through their code.

Multiple custom post types were integrated into the site. Each of these custom post types have their own custom archive page as well as individual layout. Also added into the site was slick for use of custom carousels, and Gravity Forms for creating custom forms.