Learn a language

The existing site felt out-dated and was performing poorly in regards to conversion on sales and lead generation. The CMS was also difficult to use.

Client: IH London
Website: ihlondon.com
Role: AD, UX, UI & Dev handover
Agency: Spinach Design
Senior: Adam Thomas (Creative Director)
Solution

Sort through the 3000 page site and create a new user journey and design that is easy to use and maintain going forwards.

Responsibilities

Production of the sitemap, wire-frames and user experience. I designed the core pages of the site for client approval before rolling out the rest of the site. I then worked alongside a third party development team to hand all assets over for the build process.

Persona research

The researcher

Those who want to get to specific info and/or know what they want to book.

  • Has already performed some “research” and has a good concept of what they need (course(s)) to achieve their end goal.
  • Likely has looked at other schools across different locations and websites.
  • Information requirement to progress to “pulling the trigger” – cold hard facts – details about course length, dates, cost.
  • Have likely made the decision to book and need to be directed to that facility in as few clicks as possible.
The dreamer

Those who require peripheral info to help them get to the “pull the trigger” decision point to book.

  • Through external influence or personal ambition has a desire to move towards a life change.
  • More likely to be looking for information peripheral to the core course detail – what a course would facilitate for them, where they could go, etc.
  • Responds well to reassurance and testimonial pieces as validation.

Starting the sitemapping process

IA design

Menu structure

Step 01

The Mega-Menu facilitates the separate requirements of the 2 persona’s: the ability to drill directly into the site to arrive at a specific course in 1 click, or to click through on supporting/peripheral content…

Step 02

To allow expansion on all areas of the site, sections were designed as single columns which can expand down.

Wireframe creation

Art direction

IH-DesignConcept06
IH-DesignConcept01
IH-DesignConcept03
IH-DesignConcept02
IH-DesignConcept05

Final designs