Improve new enquiries in a time of lockdowns

Problem
How does a well established but traditional company improve initial sales enquiries during a time of showroom shutdowns and restrictions?

Solution
A holistic site refresh, from site architecture and ux to visual impact, all following the substantial brand guidelines.

Visual review of old website

Type legibility is especially important online, with a combination of size, contrast and font all contributing to whether people can read your the copy that your copywriter has crafted for your brand.

The copy on the old site was lost in dark backgrounds and styling inconsistencies throughout the site.

The old website displayed product categories in an uninspiring grid with images shot on featureless white backgrounds. It needed to be more aspirational an less utilitarian to match their brands premium ambitions.

Exploring ideas in pencil and paper

I use pencil and paper to explore initial concepts which has been my habit since art school. Methodically taking time to examine the problems saves a lot of wasted time in the long run.

I also test ideas for mobile at this stage including menu functionalities.

Wireframes and initial UI design

At this stage I work in grey boxes and a basic sans serif font so that I could concentrate on just the structure of the page.

Wireframes and UI design – refined

I adapted the product section to accomodate the odd number of categories.  I also worked on refining the typography at this stage using the correct fonts and formulating type sizes that would later be used in the site’s new css.

Visual design and prototypes

Now that the interface is mostly worked out, the surface layer is the next stage to focus on.

At this phase I’m ready to include brand colours and images to start creating a design system based on the guidelines. I am also thinking about what areas of the website could be component based to aid with consistency and making the build easier.

In the prototypes linked below you’ll see that I also include design provision for how the dropdown menu would be implemented in each instance.

Don`t copy text!