» ,

Somerfield website refresh 2007

Somerfield homepage 2007

Somerfield homepage 2007

Somerfield merged with Co-op supermarket in 2009, and was phased out. I had the pleasure of doing the last design refresh. The homepage was rebuilt from scratch. Additional pages were revamped without changing any of the content. Only the wrapper and CSS were replaced.

This was the agenda:

  1. Modernise the site — The 2005 design was strong, but was flat and looked dated
  2. Make site visitors aware of some of the more interesting content — so much of it was tucked away and the site felt small
  3. Align the site quality with more popular supermarkets — What trends and features were available on these more successful brands?


What other supermarkets were doing

I spent a couple of days looking at what Somerfield’s competitors were doing online. Quality and effort varied greatly. Waitrose and Sainsbury’s stood out as ahead of the game. Here’s what they they were up to:

  1. A multipanel or tabbed feature area to set the tone and convey the friendliness of the brand
  2. Lot’s of boxes with lots of more links. Forget focused and simple. Supermarkets want to look busy and full of stuff to look at (a bit like a portal)
  3. Easy access to the store finder
  4. Online shopping (This one’s out of Somerfield’s reach)


Getting the right look

I lived in Camden for a while and my local supermarket was Somerfield (Yeah, that one on the high street). Inside the store along the top was a big platic sign with the logo on it. It was lit from the inside and had a familiar soft light radiating out from the brand blue. It reminded me of a fridge. This was perfect. The new hamepage was designed with a faint blue glow on white. It’s like opening the fridge door and seeing all the compartments full of groceries ;-)

Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

Post a Comment

Your email is never published nor shared. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>