I thoroughly enjoyed creating the illustrations for last year’s (R)Evolution Conference so I was pleased to be invited back to do the same again this year.
Last year’s illustration brief pushed my drawing style outside of its usual parameters and gave me an excuse to create something completely different to the usual make-believe cartoon characters and imaginary worlds that I’m more accustomed to drawing. I was looking forward to hearing what was in store for 2014’s website and if it’d be a similar story again – which it was.
I was brought into the project at a point where the front-end design was on its way to being finalised. The style direction had been agreed so Martin and Kirsty were clear about what was needed.
The brief was to bring Shrewsbury’s picturesque architecture to the forefront, in a clean-cut, line art style, to fit with the elegant look and feel that Martin had achieved with the website. The first step was to create a composite of Shrewsbury’s architecture and landmarks, followed by a series of smaller images and icons to use elsewhere on the site.
It was important for the buildings to have a certain level of accuracy to ensure they were recognisable to Shrewsbury’s landscape. Whilst I’d visited the town on a number of occasions, I didn’t have very much local knowledge so made sure I carried out some preliminary research into the area’s architecture and history, with Kirsty’s help picking out a few key landmarks that are iconic to the area. Wikipedia, Flickr and Google Street View were particularly useful here.
The placement and dimensions of the illustrations were still being decided at this stage so I started with a series of (very) rough scribbles, which I placed within chopped up screenshots of the front-end for Kirsty and Martin to approve. The purpose of these mock ups was primarily to map out placements and figure out where to leave gaps for things like text, so I didn’t spend much time on the aesthetics before presenting them. I knew Kirsty and Martin had a good enough imagination to look past the embarrassingly messy scribbles and visualise the end result in place!
Once the dimensions and overall composition was agreed, I jumped straight into Adobe Illustrator, set a few guide lines and started drawing up the buildings.
I usually spend more time refining sketches before importing them into Illustrator but decided to do things a bit differently this time. I approached it almost like I would with a technical drawing – building up the elements using lots of geometric shapes and precisely measured angles, as opposed to digitally tracing free flowing lines on a hand rendered sketch as I’d done with last year’s illustration. I didn’t even look at the initial sketches again after measuring out the guide lines – my main reference from this point on was a set of moodboards that I’d printed out during the research stage.
Drawing with vectors was particularly important for this project as it allowed the image to easily adapt to any format for print and web use. The finished graphics were to be converted to .SVG files for the website, in order to retain a strong and clean-cut look when rendered on a variety of screen resolutions.
After finishing up the buildings, I went on to create the accompanying spot illustrations to be used further down the homepage and within the footer, following the same process as I’d done previously with the architecture.
The feedback from the team was positive and everything seemed to be coming together nicely with the overall design. I couldn’t wait to start showing off our work on Twitter and when I did, the feedback was even better.
I’m often my own worst critic (particularly after the buzz of a site launch has worn off) but I still feel genuinely pleased with the results. As with the 2013 illustration, I’d been pushed to go in a style direction outside of my comfort zone and it’d worked out well.