< Back to Design Stream

Case Study: Mix of Clean and Wood

Westokes Westokes Advertising mixes two web trends: clean and wood. The trends themselves are overused, but the combination creates an somewhat unusual look.

Interesting Features

Style and Atmosphere

The mix of wood and the clean trends helps to create a spacious and upmarket atmosphere. It suggests that use is an open plan, luxury design agency (which generally have wood panel flooring and clean white walls).

It's an effective way of communicating the type of agency that Weststokes is without over-dominating the site.

Contrast and Priority

The wood area houses a one line summary of the page. Against the white, the wood carries the most dominance and so is will be the first to draw attention. Placing a summary in this area is therefore an effective way to quickly communicate the contents of each page.

Shadows are used to create the impression that the white area is layered above the wood. This allows the wood to integrate with the design, by giving it a sense of placement.

The logo is at the top of the screen in its own white area, allowing it to standout. Normally this would seem wasteful. However, the wood area is where the users eyes will be drawn to first, so the logos needs the white space to maintain presence without over dominating the wood area.

Colour and headings

The site draws on the colours of the logo for its headings. Against the white, these colours standout without the need for heavy rules or other devices which maintains the clean look.

Interesting Imagery

The site site contains some interesting imagery, particularly the businessman/creative coupling on the front page. This photo is not only a great way of illustrating Westokes unique team, but, as the two subjects contrast with each other and provoke curiosity, the photo will encourage the reader to engage with the content to discover why the business man is coupled with the creative type guy.


The navigation is the only element of the site that makes uses of dark greys and blacks. In theory, this should allow it to stand out. However, in practise, it causes the text in the navigation to receded. As the whole unit is placed at the footer of the white area, it blends in with shadows of the white panel causing it to become less noticeable.

Some pages have a secondary navigation bar (such as the "Featured work" above). This secondary bar uses greys and blacks in an attempt to standout without over-dominating the site. However, as the bar comes after a paragraph of content it feels awkwardly placed and should have really been positioned directly below the wood panel.

Return to Design Stream


Post new comment

The content of this field is kept private and will not be shown publicly.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Web page addresses and e-mail addresses turn into links automatically.

More information about formatting options

By submitting this form, you accept the Mollom privacy policy.