Sadly I did not win the tender, but the work refreshes my mind on what’s required when submitting proposals for a website redesign.
When tendering for this work, I compile information that I like to term, ‘The Knowledge’. It is based around a few key principles:
- Aspiration – what is it the client is asking for? What is it they want to achieve? I often get sent links to websites that clients find appealing or relevant and often this starts a conversation about the aesthetic they are comfortable with.
- Culture – What does the current website lack in terms of representing the company culture? Is there a mission statement or manifesto that may reveal more about the personality of the company? Armed with this knowledge, I feel more comfortable with proposing a relevant look and feel for a new website.
- Industry – every website needs to showcase key characteristics; in this case, as I am working with a financial entity, I list clarity, trust, stability, and innovation as key tags. I will often keep these tags listed in front of me when I work, always referencing them whenever I need to make a choice on image, typeface and colour palette.
- Audience – who is the intended viewer? Oftentimes is easy to assume that the company you’re working for will have a target audience that fits the industry’s general customer base; however in this case, it’s a UK-based company growing its audience outside of Europe. What does this audience identify with when dealing with an English financial institution and how will they inevitably place trust in the company?
A review of the current website is also going to contribute to the creative concept. Even though the website is lacking, there will be content that remains relevant and needs reworking into the final scheme.
Once I have assembled the knowledge, I tend to start with a stylesheet, compiling a colour palette and typographic concept that starts to harness the essentials of the creative route. The stylesheet organises typographic pairings, scale, and colour palettes. In this case, I chose Kings Caslon from Adobe, paired with Calibre by Klim Type Foundry. Both fonts represent stylistic leanings toward traditional English typeface design. They both offer good contrast for stylistic composition and readability.
Stylesheet
Often I may be asked to look at the company branding and social icons and in this case, both needed looking at to improve the overall presentation and balance within the design. For both logo and icon, I have worked with the chosen typography and colour palette and checked both normal and inverse colour schemes.
In this case, I designed a new logo for Hardington that plays on typography, financial charts and real estate structures within its design language.
Branding
For the colour palette, I have chosen to work with Hardington’s existing colours; pale blue and gold, slightly tweaking them for increased compatibility and legibility across the interface. I use Sip on my Mac and coolors.co to generate compatible colour schemes.
Once I have the stylesheet and revised logo and icons compiled, I test everything by laying out combinations of interface elements, buttons, cards and highlight areas. This will also include social media assets like Twitter and LinkedIn banners.
Interface elements
Once the stylesheet, element exploration and branding all tie together, I start to explore layouts for the homepage.
Homepage header
For the header, I chose an image that reflects the key tags related to the company; finance, real estate and stability and worked this in with the overall layout and colour scheme. The header design indicates a navigational element and starts to set out a structure that is followed through to the rest of the website.
