Started in 2007, ‘The Interactive Health and Safety Company’ are providers of high-quality Health & Safety and HR Compliance eLearning courses. Nowadays, their name is shortened to just iHasco. They approached Hicks.design to redesign their logo and create the first identity for the company. There has never been one beyond the logo itself - whenever the in-house creatives began a new project, there was no visual starting point to work from.
Their logo, with it’s ‘pinwheel’ mark has been through a few minor iterations over the years:
Working with Nathan and the in-house creative team, we identified areas to address in the logo:
- The pinhweel device wasn’t quite unique or ownable enough, but the use of triangles to represent Health and Safety is a sound one
- The italicised I at the start meant it wasn’t easily read as word
- The letter ‘C’ ends abruptly, and doesn’t lead the eye smoothly into the next letter
- Incorpoating the strapline made the logo unwieldy
- The logo doesn’t work on multple backgrounds
With logo redesigns, my preference is almost always to evolve the existing logo and keep the equity. While other directions where considered, the final chosen version was indeed an evolution of the existing pinwheel logo:
The main changes I made were to place all the sections together (no more keylines), but move one triangle out of the group to make it more dynamic. This gives the suggestion that the triangle could be either moving out or in, but also highlights the yellow ‘health and safety’ triangle. The colours were also updated, with a new custom logotype that echoes the triangle in the A.
The C also connects better to the O, which is one of those subtle things that helps the logo on a sub-conscious level:
This also meant the logomark was now asymmetrical, moving the logo away from a straight hexagon to give it a more unique silhouette. The 30º angle of the pinwheel became the basic visual element for the identity.
From an early stage, there was typeface that I felt suited this project particulary well, Buenos Airies by Luzi Type. It has all the attributes that I was looking for:
- I specifically wanted a clean, unfussy sans-serif to set a contemporary and approachable tone
- Primary lowercase ‘a’ to suggest simplicity
- Tall x-height and wide character shape for legibility and clarity
- Tails on the lowercase-a and lowercase-l, subtly suggest cursive handwriting
- The terminals of lowercase letters such as e and c point towards the next letter, rather than back at itself, leading the eye into the next letter.
This was then paired with Handsome Pro Bold to create an emphasis style - a way of highlighting key words or short phrases.
Ingredients and Recipes
Not every company needs highly prescriptive identity guidelines, or endless ‘do and don’t’ examples. In iHasco’s case, the creatives in each department needed a large degree of flexibility with colour and typography use. Each of their online courses have their own flavour, and during discussions we kept coming back to Netflix as a metaphor to explain this. A wide range of content to watch, each with its own individual identity, but wrapped up in a design that is unmistakably Netflix.
Essentially, there are four key ingredients that identify a design as iHasco: Logo, Colour, Type and Shape. Instead of being prescriptive, I created a series of thumbnail layouts for different contexts, showing the variety of ways that the ingredients of the identity could be combined. There is never just one solution for a particular context. These ‘recipes’ are a little more involved than a black and white wireframe, but don’t show any specific content.
HTML not PDF
When it comes to providing identity guidelines, I feel strongly that they shouldn’t be in paper or PDF form. A ‘fixed’ document like that means that it’s harder to evolve and update, with some staff keeping outdated versions, not aware that a new version has been published. The web is the perfect medium for this ‘single source of truth’, with Jekyll pages providing the framework, and versioning handled by Git. HTML pages also make it easy to get assets - not just in terms of download links, but specific logo versions can simply be drag and dropped out of the guide.
There’s a lot more to the guidelines than I’ve mentioned here, but the iHasco identity guidelines are publicly available on Github, and in just the few weeks since my part in the project finished, they’re already growing and evolving!