Rckt are working with the Health and Safety Executive to develop their website from the ground up. In our second post in the series we’re looking at how rckt brought all our design experience to the challenge of communication.
The HSE website holds an almost unimaginable wealth of information. Everything from cutting edge scientific papers on the management of nuclear material to videos showing care workers how to safely remove latex gloves. The website contains almost 50,000 pages of material all of which needed to be carefully and simply presented.
Here at rckt we believe in intelligent design, we consider every colour, every line, every word of our design. As a result our design process is iterative, with concepts and solutions created through an evolution in design. Our designs have a beginning, middle and end.
The evolution of the HSE homepage design
In the first iteration our focus was on adding content and beginning to organise it into logical areas on the page. This exercise quickly showed us that the main challenge was to convey the variety available on the site, without confusing people. By the next version things were beginning to feel more organised. Columns of similar content had been created and background colours were being used to group content together. By the final version a highly usable solution had been created. The home page has a hierarchy and the main areas of the site are obviously displayed. The design handles the variety of content in a clean unambiguous manner.
Simplicity increases intuition
By looking at rckt’s design approach to the header of the HSE website it’s clear to see our belief in intelligent design. Here simplicity is the key. When faced with too many options a web user will quickly get confused. Originally the HSE header contained 21 elements all competing for attention, we reduced this to 10, without compromising usability.
Subtle, but necessary design choices were also made to improve the presentation of the head. These include a new approach to the navigational tabs, a new treatment of the HSE logo and the introduction of a gradient that emphasises the tabs.
The old version of the header offers too much choice
The new cleaner version presents distinct options for the user
Keep up to date with the ‘Transforming HSE’ series with the rckt rss feed and be the first to know when part 3 goes live. Part 3 is all about how we created a developers toolkit which allowed five teams across the UK to work on migrating the site.
simon