Insight into a Website Design Project: Froggybank.co.uk. Part I
Posted by Azam Editorial Team as Web Design
Ather Mehdi, Director of Design and Development at Azam Marketing, presents the first in a trilogy of articles which go through the steps involved in designing a major website. We hope these will be of benefit to up-and-coming designers.
I am excited the time has finally arrived for me to write my first article discussing web design. We have worked on over 200 websites at Azam Marketing and Froggybank.co.uk was one of our most challenging, but also most rewarding.
Froggybank.co.uk
Our first design case study is Froggybank.co.uk. I have tried to summarize the entire design process including first thoughts, evaluation and final approval to allow our readers a comprehensive insight into the evolution of Froggybank.co.uk’s design over a period of several months.
Foggybank.co.uk – The Brief
Our client eDealsUK, an established online cashback operator, asked us to work with their hugely-talented internal team to design a website for their 100% cashback project, froggybank.co.uk. The brief was a site that would positively engage users, clearly explain what the concept of cashback, and be perceived as a pleasant brand to visitors. It was a challenge we relished.
Step 1 – Identify Competitors
Whereas carefully analysing competitors can often be a valuable use of time, it proved to be somewhat of a fruitless experience in this case.
Some of the sites I came across lacked visual flair. They could have been strengthened from a design and brand development perspective.
Step 2 – Review Market Position
I conducted a detailed market review with the eDealsUK team and my Manager Nadeem. Cashback sites appeared to be succeeding because they are a new concept and people love the idea of earning cashback on their purchases. However, the focus on product offering seemed to be to the exclusion of aesthetics.
As a designer, my interest is in understanding the relationship between the colour, style, layout and pattern of a website and how this affects customer’s conscious and subliminal view of it. This helps to identify what to do and what not to do when taking the initial steps in a design project.
Step 3 – Utilise Client Experience and Knowledge.
I had a series of conference calls with the CEO of eDealsUK and the company’s staff to gain a deeper understanding of where the cashback business was heading. After running eDealsUK for four years and having more cashback websites than any other business in the UK, they had considerable knowledge to share.
I spent time trying to see how the wealth of information provided could be utilised to provide the best possible user experience. The important notes and design parameters are summarized below:
- Education – Cashback is still a relatively new term for many, and a large number of visitors do not understand the concept. Therefore, the website must educate visitors and address all concerns about cashback shopping. eDealsUK’s staff highlighted the fact that web visitors don’t read everything. Hence, the design should emphasize what’s essential and what’s not.
- Branding – A lively and fresh brand is essential. It should be easily recognizable, appealing, consistent and flexible through various mediums besides internet.
- Simplicity – Simple designs yield better returns. Keeping the contents and design focused on delivering what the user wants ends up leading to better conversions.
- Style – A dash of 2.0 will not harm the branding but it must remain simple and interesting for longevity.
- Incentivisation – Design for a Cause – eDealsUK wanted to include some noble features into the project, including buying carbon offsetting for each new member and giving users an option of keeping their cashback or donating to a good cause. This proved another challenge for us: to incorporate a feel of environmental-friendliness, professionalism and seriousness through design, so that people both see the site’s green credentials and donate their money with trust.
Finally – The Challenge Emerges
Based on my primary research and feedback from several specialists in different areas of the eDealsUK set-up, I started to envisage a design for the new 100% cashback website and how to address the needs of internet shoppers who may be unaware they can earn cashback while shopping online.
With not much precedence in terms of strong design in the sector to refer to, it was time for me and eDealsUK’s internal designers to roll our sleeves up and set the standards ourselves.
Situations like these can be tricky. For some it can become a nightmare and for others an opportunity to let loose. For us it was a challenge we were prepared to accept.
Our first goal: ‘To sketch the brand character and define various factors which customers can relate to the brand.’
eDealsUK had come up with the name UKShoppersClub for the cashback site. It was a catchy name which clearly defined the business, was easy to remember and was search-engine friendly. eDealsUK’s programmers and designers spent the last half of 2007 coding and designing the website. I thought it was mighty impressive.
Here’s a screenshot of the design as it stood in December 2007:
Part II: We discuss our evaluation of the design as it stood in December 2007 and take you through the process of rebranding the cashback website with a new identity. I explore how we enhanced the look and feel of the site, going through dozens of revisions.