The new eSterling website has been a labour of love for myself for just over 18 months now and the result is so far removed from the original ideas and sketches I created back in the winter of 2015.
As we know everyone’s a critic so I knew my ideas had to be solid and without doubt, the right way to go. So with that in mind I set about tearing through the old eSterling website to find a more streamlined sitemap which focussed on three main elements:
- Who are we?
- What do we do?
- Evidence of our success
Once I got a defined page list I was able to begin sketching out the main pages which were to make up the bulk of the new website.
It quickly became evident that the copy from the old website did not have the tone I wanted for the new website – it was stuffy and very formal. So with the help of the beautiful people from our SEO department we were able to come up with more relaxed, engaging copy which reflected a more friendly approach.
After sketching out the layouts of all the main sections of the website and confirming the UI elements, I finally opened Photoshop to address the design’s look and feel. Once I’d selected the right design elements according to our branding guidelines and created some concepts from within Photoshop the home page began to take shape.
The home page dictates the style of the whole website and therefore, at that stage every design decision was pivotal in the make-up of the new site. Now, I would be lying if I said that this stage took a couple of days, it in fact took 3 months! The structure, layout, typography, imagery and individual elements had to flow and with this in mind I began to obsess over every little detail.
I had to draw a line in the sand and when I saw that my revisions were not as good as what I had originally designed I realised I had to move forward or risk the whole project going stale.
Decisions, decisions…
I then had a home page which I was (generally) happy with, the mobile and tablet versions were created alongside the desktop version using Photoshop’s lovely Art board feature.
So, do we need a CMS? If so, WordPress? What responsive framework do we use? Maximum grid width? Which font repository do we use?
In short I went with the following:
- No CMS – More light weight and we’re web professionals – we shouldn’t need a CMS to update our own website!
- A much scaled down version of Foundation – Light weight and simple to use
- Fluid grid system of 100% & 1200px – Why tie yourself down to just 1?
- Google Fonts – They have the right fonts and in the right weight
It’s these decisions that we make daily that are vital for any website we build, not just our own.
…It’s off to work we go
At this stage I was fully entrenched in Sublime Text trying to create the best website I’ve ever made. Beautiful, fast, informative, responsive, easy to follow, the list goes on! It was very challenging and a lot of fun!
I would often ask my fellow designers for their input and something which kept coming up was imagery. We lacked high quality images of the staff and premises so I scoured the web for Birmingham based photographers who could come in to eSterling Towers and take some beautiful pictures of the staff at work.
The name that jumped out was Ross Jukes. He was only in the office for what felt like 10 minutes but he produced some really amazing pictures for the new website. We hope you like them because we certainly do! Ross is available for commercial work so visit his website here.
The Launch
When taking on positive/negative criticism it is important for any designer to keep the initial vision and aim of the site firmly in mind. If any advice or criticism deviates from the original plan, discard it with a polite ‘Yea, I’ll look into it’, but it is just as important to accept criticism when it works towards your original goals. Don’t be too stubborn to accept it with a ‘Yea, that’s a good shout’.
Once the team had taken a good look at the website and decided it was ready, we then set about launching eSterling.co.uk v3.0.
The website launched on Thursday 4th August 2016 and I really hope you like it.
Special mentions: Richard Locke, Wave White & Antoniya Darova for glorious PHP and copy that makes sense!
