I was the lead designer for the Tesco Direct web design project. The design of the site had to reflect the catalogue that was being created. The design of the catalogue was clean simple and used category specific colours for each are of the site/catalogue. The majority of the products would be on a plain white background apart from 1 or 2 lead features that would be shown in a room layout. I used this same style in the website design whilst also only having one red ping on the page to increase the emphasis of the main offer. All the category pages had the same structure and only the products, offers and main colour strip banner would change. This was to help the user become familiar with the site to enable the shopping experience to be easier for them.

I designed all of the back end pages as well as the front end designs. So I was able to keep a consistency from the homepage > category page > product list page > product page > basket page.

Usability research showed that the customers like the graphical style of navigation on the category pages. Also that the large feature banner with the red ping grabbed most of the attention. The homepage with the category colours present allowed the user to see what Tesco Direct had to offer and what the main offers were.

The designs

Original concepts

Live version