Creating the Karbon website –
the designer’s perspective

by Tim Condrick

 

To begin with, it was vital to gain an understanding of Karbon the company and the people who worked there.  What drove them?  What brought them together?  Where did they want to be?

 

Karbon’s personality was clearly young, uncomplicated, a confident upstart. Driven and capable of achieving any desired result, no project would be too large or too complicated. Whatever the problem encountered, they would find a solution, and they had the attitude to match. 

 

The next step was to establish a site that reflected these bold, confident and pragmatic values.  The look and feel needed to be unapologetic yet approachable - a brand that said here we are, let’s do this together.

 

With inspiration drawn from Swiss design, a little bit of molecular science, and funnily enough an office building, we arrived at the core elements for the brand.

 

• A Swiss inspired bold san serif no nonsense typographic style 

• A canvas of dynamic isometric cubes, inspired by the carbon building blocks from which anything can be built 

• A secondary sophisticated serif font for the finer details of information

• Accessible language 

• And lastly, two colour palettes - one of sophisticated blacks and greys, and the other of radical clashing hues

 

These elements were brought together online in a dance of colour and motion. The cubes acting as the canvas on which this act is played create a dynamic surface (like a fluid surface, a drop here can cause a ripple there). Through their repetition and isometric relationships, these hypercolour combinations embellish the bold topographic messages. Strong linear movements created by information safe areas that form at the centre and extend seamlessly outwards accentuate the theatre of the site. 

 

The end result is a carefully choreographed performance in which all the elements have a part to play without competing for attention -rather they work in unison to present a modern, young, confident and digital savvy agency.

 

Of course, in bringing this vision to life, we encountered a few challenges on the way. As the colour palette is quite radical in its use of clashing hues, we had to explore numerous combinations to make sure we didn’t end up with a terrible mess. Surprisingly, it was often the case that the more the colours clashed the better they worked.  We also needed to establish the contrast of sensibilities. The stern typographic style and the euphoric mix of colour had to counter balance each other.  This was helped in no small part by the unique ability of the cubes surfaces to distribute three clashing colours into a generously bright gradient.

 

Then we had to get the movements right. More experimentation was required with the gradients that dictated direction and speed. It was vital to get the right number of cubes rolling at the right times not just to achieve a smooth animation, but also from a processing power standpoint. Playing with percentage values of the gradient and its shape eventually led us to a number of gradients which provided the perfect combination of speed and direction.