How we redesigned Strawberry.co.uk

Posted on Tags: Web, ExpressionEngine

Anyone who has dealt with us in the past, or even visited this site previously, will have seen our old branding and website. We'd had it a long while and it had served us well but it was time for a change. Dominic, our Creative Director, felt it didn't match what we were about any more. Dominic and Carl (one of our senior designers) set about creating us a brand that we'd be proud of again. 

Dom and Carl presented the finished article to Jonathan and I and we were both blown away. A really modern brand, with some great ideas for how it would work on the web. 

I then presented it to the developers as we'd only have a few weeks in our schedule to build it. One of the developers (who shall remain nameless!) had an interesting reaction:

"I love it - but how do you expect us to build it?!"

Well, they did and it's exactly as we wanted it - this is the brief story of how we did it.

Prototyping

For some of the more flashy bits, we needed to prototype. Adam and Jamie set off prototyping pretty much all the JavaScript calls we'd need. We then spent a good few hours as a development team in the boardroom discussing how we thought the filtering and tagging system should work. We changed our minds several times - in fact, we changed it back again during the build. Prototyping the areas which we knew might cause us a problem was a very necessary step.

HTML5 and CSS3

We decided we wanted to use HTML5 and as much CSS3 as the browsers would allow. HTML5 isn't supported by default by any of the existing Microsoft browsers but by applying some JavaScript, we knew we could fix this. This means the site won't function in Internet Explorer(s) without JavaScript enabled. In fact, JavaScript is relied on heavily throughout the site and testing without JavaScript enabled gave some interesting results. JavaScript is employed by 99.9% of browsers, so we decided we wanted to push the boundaries of what we can currently do within a browser, and not spend as much time worrying about the lack of JavaScript as we do for some of our clients site. 

Ultimately, it was me that decided to go down the HTML5 path, so if you're a web developer reading this and you think we've made a mistake in adopting HTML5, I'd love to hear from you.

Jamie is going to write a full post on the use of CSS3 - it'll be posted in the near future so make sure you've got our RSS feed bookmarked.

Expression Engine

We've opted to use Expression Engine 2 even though it's still in beta. Again, you might call it a "brave" decision and we could have opted to stick with the tried and trusted 1.6.9 version, however this site was about pushing the boundaries of what we are able to do right now and that meant using version 2. It's been stable - our resident EE experts have found it good to work with, which gives me the confidence to at least consider adopting it for clients sites.

Getting the content together

This is always the hard part of any web build - gathering content can sometimes be a long and ardous task. Not this time - Sarah simply got on with it and delivered it to the development team before they needed it and typo free. It's safe to say that we didn't need to employ Lorem Ipsum during this build which is a good thing! Thanks Sarah!

The Next Step

There is more we want to do - we want to do a mobile version of this site. We want to tweak areas of the site already and it's only just gone live. We're committed to ensuring that this site continues to get the love and attention it's had over the last few weeks and we're committed to writing posts about what we're up to.

The last thing is for me to thank the designers, developers and authors - I'm proud of what we've done in a short space of time and they should be too.