Emma Lawton
boldee_icon_197.png

Energy Saving Trust

CLIENT: ENERGY SAVING TRUST
PROJECT TYPE: WEBSITE
ROLE: DESIGNER


The Energy Saving Trust are a treasure trove of knowledge and advice, but their cluttered, dated web presence was drowning out their voice. 

The challenge

The Energy Saving Trust came to us to give their site the shake up it sorely needed. They wanted to feel confident walking into a room knowing that their digital presence matched their physical one, sharing knowledge in an authoritative, easy to understand manner. Their imagery felt dated and staged and made it hard for users to relate to information that might be useful to them. The homepage was satisfying a huge amount of business needs at once but with every item shouting nothing was being heard.

Getting to know their brand

As there seemed to be such a huge disconnect between the organisations positioning and tone of voice and the look and feel of the website we decided to run a brand persona exercise to get a hold on who EST really are.


Our brand persona report.

Our brand persona report.


A design briefing revealed that they preferred character and warmth to their design, favouring illustrations, icons and interactive maps to flat, simple layouts. They mentioned that finding imagery was difficult for them as users expected to see real people but the reality of photographing someone in their home was a challenge and often not visually interesting or on brand. They felt more comfortable with illustrations and diagrams. We challenged that there should be some photography as users often find it difficult to relate to and engage with illustrations and facts and figures. 


estmoodboard2

Their current image treatment involved using a set of bright coloured gradient triangles and sitting them over the photograph. The edges were blurry and felt like an old fashioned vignette in garish tints. We knew this had to be retained in some way as users recognised them as being EST branded and of the same family as similarly styled marketing materials.



The solution

We started by looking at the navigation as we knew this had to contain a tall logo, an audience switcher and tailored audience options as well as all the standard menu items. By making this a neat self contained bar the user has everything they need to navigate the site in one place.


Large tabs which filter the content that sits below them.
The 3 navigation states, Home, Domestic and Business, controlled by the audience switcher.

The 3 navigation states, Home, Domestic and Business, controlled by the audience switcher.


Next we tackled image treatments. We knew it was important to lead the 3 home pages (EST Corporate, Domestic and Business) with images the audiences could relate to and wanted to update the image treatment they'd previously been using. We took the coloured gradient triangles and sharpened the blurred edges giving them a fresher feel. Overlayed over the imagery at large scale they provide an area of clarity to the centre of the photograph. We suggested this area should always have a person in it, suggesting people are their main focus. The imagery should show real, natural people doing the things they love, carefree, while EST worry about saving them money. The message; 'EST help save you money so you can get on with life.'



The three homepages sit as a set but have slightly different imagery styles and use of colour to make them appropriate to their audiences.


The EST Corporate homepage.

The EST Corporate homepage.

The Domestic homepage.

The Domestic homepage.

The banner of the Business homepage.

The banner of the Business homepage.


Streamlining their content

To make sure their most useful content could be surfaced more easily we broke their lower pages into content blocks and sets of tips.



A prominent blog helps cement their reputation as a source of reliable knowledge and expertise and gives them propagateable content.



Simplifying their tools

EST have a large amount of calculation tools which sit on the site and are aggregated across various comparison and advice sites. These were in the main quite unwieldy flash based items which were slowing down the site and felt inconsistent as a set. We simplified these down to their component elements and made them form based.


est_checker