John Cullen Lighting

Inspect Site View the John Cullen Lighting website

Laravel, API, VueJS, WordPress (Themosis)

John Cullen Lighting provides bespoke interior and exterior lighting. The project required a new API, new front-end, and CMS. I was the Primary Developer on this project focusing mainly on the Front-end build and WordPress CMS configuration.

Languages/Technologies used: HTML, CSS, JS (ES6), VueJs, PHP, MySQL, Blade, Eloquent, Axios

Framework(s): Laravel, Themosis

Methodology: Agile Development

01. Homepage

The homepage needed to be the hub that directs all traffic around the site
John Cullen Lighting Homepage

02. Product Journey - The Archive

To start the product journey the user is brought to the archive. The archive had to be powerful to handle the growing numbers of products that John Cullen produce. To handle this job we decided to use VueJS with VueX for state management (Preferred HTTP client: Axios)
John Cullen Lighting Product Archive
John Cullen Lighting Product Archive

03. Product Journey - The Individual

The product individual pages are as you'd expect - a gallery and some applications of the product. But, John Cullen required a rather unique piece of functionality; they required a place where the user could configure the product to their specification and save it their account, in case they wanted to come back at a later date - This is where the good buddy, Axios, came in handy.
John Cullen Lighting Product Enquire Form
John Cullen Lighting Product Configuration
John Cullen Lighting Product Overview

04. Projects - The Archive

Ah the Projects - The place that we chose to show off just how great John Cullen Lightings' products really are. For this page it was simple. Four categories leading the user to their desired showcase choice. Space was in abundance, so who doesn't like big images?
John Cullen Lighting Projects Archive

05. Projects - The Categories

Here we were asked to create a great looking archive projects that really show off the picturesque work of John Cullen. We opted for a modern masonry design that adds to the look and feel of the site.

We opted to not use any JavaScript plugins to help us style this template and chose to use standard PHP and CSS, well... SCSS, to create the layout; as size was a consideration for the client.
Projects Categories Archive
John Cullen Lighting Projects Categories Archive
John Cullen Lighting Projects Categories Archive

06. Projects - Individual

For this page we opted, or "cheated", to use a WordPress plugin to handle the functionality of this page. We needed something that'll allow us to map hot points on an image which illustrated where each product was. Once clicked, there would show an information window providing a link to the product.
John Culen Lighting Individual Project - Linked Products
John Culen Lighting Individual Project - Showcase
John Culen Lighting Individual Project - Showcase

Other Projects

Sea Containers

Sea Containers

Laravel, API, VueJS, WordPress (Themosis)

Almero Holdings

Almero Holdings

Laravel, API, VueJS, WordPress (Themosis)

Almero Student Mansions

Almero Student Mansions

Laravel, API, VueJS, WordPress (Themosis)