< Back to Design Stream

Case Study: Fit Bit - Good use of Images

Large photos are a brilliant way to bring impact to a website - They can instantly add the atmosphere and scale of an environment. At the same time, however, they can be distracting.

The Fit bit website contains some good examples of photos that retain impact and atmosphere without distraction.

Home Page

The Home page cycles through these images: Fit Bit Home Page Fit Bit Home Page Fit Bit Home Page

Key features about these images: Good use of white space - The images have plenty of empty space, which is where the product and text has been placed. The product/text stays in the same position through out the slideshow and this is because having them move around would be distracting. However, the downside of this approach is that the product/text doesn't fit the empty space areas as neatly or snuggly as it could do.

Rounded Corners - It's seems like a trivial touch, but the rounded corners help to integrate the image better in the layout. The position the image as a window on another world

Content Pages

The use of the images on the content pages is brilliant. All the distracting elements are clipped out other than a few 'props'. These props are slightly faded. This allows them bring all the atmosphere of the photos without causing distraction.

Other Good Features

The Fit Bit website has strong grid layout. It subtly enhances through the use of scratch line which helps to bring order to the range of images without being overpowering.

Neat little magazine-like icons are used thorough out. These do add a bit of visual clutter, but the overal effect is worth it.

The navigation is sticky. When you scroll down it stays at the top of the page, which is very convenient.

Although, Fitbit has lots of brilliant features, I most note the website as a whole is perfect. There is a lot of visual clutter. For example, the use of the product in the footer on the home page is distracting and unbalances the whole layout. However, as detailed above, it does have some excellent feautres.

Return to Design Stream

Comments

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.