SEGB_thumbnail.jpg

Smart Energy GB | Responsive Website design

 

I was the creative lead designer / illustrator on the Smart Energy GB website. This was a fun task to undertake as it consisted of creating the entire digital look and feel for the client.

We worked with an outside development company on this project, so I needed to make sure every decision I made was the correct one as the devs were creating a custom CMS for the clients to control, allowing them full access to maintain and build upon the existing site.

The site needed to be AAA accessible, so a lot of thought was put into the best way to create a site which adhered to the AAA rules but still looking clean, fresh and engaging to a vast audience.

The site went under vigorous UAT to make sure it was easy to navigate through and the testers were able to find the information they needed, luckily these test came back positive with only minor tweaks needed to improve the site.

Overall the Clients were very happy with the outcome of the site which is growing from strength to strength every week. Smart Energy GB’s website won a silver award in the Best Use of Digital category in the Energy & Utilities sector of the 2016 Digital Impact Awards

https://www.smartenergygb.org/en

 

 

I think together we have achieved a site that to those in the know is impressively sophisticated, and to those less confident online is easy to navigate and very intuitive. We’ve broken some digital norms and created what I believe will become new benchmarks.
— Gavin Sheppard, Marketing Director of Smart Energy GB

Example Desktop / Mobile pages

Homepage

The homepage acts as a question hub for new/existing users, allowing quick and easy answers to some of the main questions asked regarding what smart meters are, how you can get one and if they are for free etc.

0000_01--cesar.png

About Smart Meters

As this site needs to flexible, the main pages of the site are designed in modules to allow the client to create different page layouts. Each section has a colour associated to it to give clear indication to what section the users are in. 


How to get a Smart Meter

Some sections of the site had a lot more content than others. How to get a smart meter is a good example, there needed to be a large amount of information in this section without creating long scrolling pages. I designed a tabbed module which allowed the user to easily navigate to the sections relating to them and digest the information.


Smart future

There was a need for a third tier navigation on a majority of the pages, this needed to be easy to use whilst not eating into the content too much. The solution solved this with the use of arrows which directed the users eye to the information they needed. 

SEGB-pages_0006_04_SEGB.png

Illustration style

When it came to assets to use on the site, there were none. I had a copy writer who was able to take the information needed for the site from the client and create it into small bitesize bits. However, without any imagery this site soon became copy heavy and slightly off putting. I create a style of illustration to sit along side the copy to break it up a bit, I had to pitch this style to Smart Meters Managing Directer, he loved them. I wanted to make sure the style had character, looked good and assisted the copy.