Website Design Analysis: Nike

This week I’ll be analysing the web design of one of the world’s largest footwear and sports clothing brands, Nike. As one of the most recognisable brands in the world, design is an essential component of the brand functioning. They are reliant on their products being attractive to customers and the website can be no different.

The Nike homepage is a leading example of the ever evolving design of the web. With a focus on striking graphics, the page is dominated by a photo of a new product. The use of the pattern illustration in the background is bold and very effective in capturing the attention of viewers, helping the site rise above competitors with more simplistic sites. The use of an illustration as the primary image adds a customised style rather than just using the plain product image, a trap many eCommerce sites are guilty of falling into.

The illustration itself appears quite intricate, but it is rather simple, using neutral colours and free flowing shapes that allow the product image to stand forward and becoming the centre of attention. If you pay attention to the background illustration, you will notice a weathered effect has been applied by the designer. Why? By making the background appear weathered, the designer has in fact made the product look cleaner, and therefore more attractive to the consumer that is after the perfect product. But don’t be surprised, techniques like this are used constantly to make products appear more appealing.

Homepages are often more design focused, rather than content, that’s what the subpages are for. For example, it’s not as common for the main feature of a subpage design to stretch across the whole width of the browser window. As a homepage, this full spread design makes a clear and bold statement, emphasising the product in question. This is also the case with the components that form the full spread image. The contrasting colours highlight the shapes in the product, and the use of the bold sans serif typeface is also very effective. Bold titles can sometimes overpower a design, but due to the football boot’s positioning in the centre of the page, this is not the case.

In terms of layout, the design of the homepage is actually rather simple. Rather than have a long, busy homepage with lots of product images and text, the body contains just the full spread image and a strong call to action, enticing customers further into the store. While the wireframe may be quite basic, it’s a clean cut, professional design, allowing the product to stand out and be the hero.

It’s all well and good having a strong homepage design, that links the viewer to the subpages, but only if these pages follow suit.

Take a look at the Men’s page. Now, earlier I said it isn’t common for the main features of subpages to spread across the browser window. Nike is an exception to that rule. Sometimes this can make a web page look cluttered, but this is not the case here. The use of white space or blocks of colour allow the design to have definitive edges and spread the content out. Take the red and blue images for example. The images are bold and eye catching, they cannot be missed. If you resize the browser window, the content resizes itself accordingly as well, ensuring the images, or split banner as it is, continually fits the viewing window.

I must admit, I hardly ever visit Nike’s website, not surprising when you see some of their price tags, but the design deserves a lot of credit. Yes, it may be simple, but sometimes simplicity is overlooked. It ensures the content, and more importantly the products, become the forefront of the design. And I must say, I do like the use of repetition down the page and across the website, proving consistency is key to a successful website design. Whether it’s the use of a split or a full width banner containing three products, there is something about the page designs that feel familiar.

If I were to criticise the site design, it would be difficult to know where to start. However, I would say the buttons could have been ‘designed’ a bit more. Fair play, they are consistent with the rest of the site with a sans serif typeface and neutral, yet contrasting colours that are present elsewhere. However, I’d have liked to have seen buttons that are a not as flat. Maybe they could have been 3D, a gradient could have been used, or even a drop shadow, but of course, for all we know, the designer may have tried this and it may not have worked with the rest of the design, you don’t know until you try.