Avid Hotels Site Design

IHG
UX

Avid Hotels Site Design

Problem

IHG had a new ambition laid down by its new CEO: double company growth by the year 2020, referred to company-wide as IHG 2X

In order to truly meet this new ambition, a brand was to be created to fill the gaps left by IHG's current properties. Of this void, avid was born.

Solution

The future of everyday travel

avid hotels was to be the brand of the future. In a world where the very real threat of AirBnB loomed, avid aimed to be everything the hotel industry was not; clean, uncompromising in regards to essentials, and, most importantly, affordable. Branded by british agency forpeople, it became the job of the IHG Digital Studio to build this breath of fresh air quicky, affordably, and in line with all currently existing systems

The future of everyday travel

avid hotels was to be the brand of the future. In a world where the very real threat of AirBnB loomed, avid aimed to be everything the hotel industry was not; clean, uncompromising in regards to essentials, and, most importantly, affordable. Branded by british agency forpeople, it became the job of the IHG Digital Studio to build this breath of fresh air quicky, affordably, and in line with all currently existing systems

Simplified site, complex processes

Arguably the most challenging part of any UX project is the handoff from creative to developers. You know how it goes; you pass them a deck with a style guide covered in lines and arrows and padding and pray to god that the front end developers don't fuck up your precious baby, or if they do that there's enough time and/or money to fix it.

With avid, we had neither the luxury of time or abundance money to spare; starting on January 1st 2018, the site needed to be live by May in order for customers to book the first hotel for it's opening in October. That means we had 120 days to design, build, QA, UAT, and launch a fully-fledged website. With a launch date that was fast approaching, I was brought in to co-design the site and build a functional Webflow prototype in order to ensure that the creative process could occur iteratively and without roadblocks. The idea here is simple; by building out the prototype in Webflow, we effectively eliminated any guesswork on the part of our developers partners. All the code was to be there, and any hover state, interaction, or otherwise would be accounted for.

Simplified site, complex processes

Arguably the most challenging part of any UX project is the handoff from creative to developers. You know how it goes; you pass them a deck with a style guide covered in lines and arrows and padding and pray to god that the front end developers don't fuck up your precious baby, or if they do that there's enough time and/or money to fix it.

With avid, we had neither the luxury of time or abundance money to spare; starting on January 1st 2018, the site needed to be live by May in order for customers to book the first hotel for it's opening in October. That means we had 120 days to design, build, QA, UAT, and launch a fully-fledged website. With a launch date that was fast approaching, I was brought in to co-design the site and build a functional Webflow prototype in order to ensure that the creative process could occur iteratively and without roadblocks. The idea here is simple; by building out the prototype in Webflow, we effectively eliminated any guesswork on the part of our developers partners. All the code was to be there, and any hover state, interaction, or otherwise would be accounted for.

Bun in and out of the oven

Day 1, we hit the ground running. Working with our UEA parters, co-designer Sanithna and I tackled the very real challenge of taking an identity that was hot out of the oven and translating it into a site which reflects the values of the brand. Little nuances helped to bring the brand to life; little white rules beneath tabs, buttons changing to a slightly different hue on hover, and not a dash more than necessary of the powerful colors that, when combined, become avid hotels.

Because of our Agile processes, we needed to be designing, styling, and enabling our developers to be working simultaneously. The image you see here is of the prototype I built to meet this challenge. Every piece of it was created with intent, from padding, alignment, line height, color, font size, image, and more. I'd ask that you take a moment to explore this prototype, as alot of time, effort, design, blood, sweat, and tears went into its creation.

Bun in and out of the oven

Day 1, we hit the ground running. Working with our UEA parters, co-designer Sanithna and I tackled the very real challenge of taking an identity that was hot out of the oven and translating it into a site which reflects the values of the brand. Little nuances helped to bring the brand to life; little white rules beneath tabs, buttons changing to a slightly different hue on hover, and not a dash more than necessary of the powerful colors that, when combined, become avid hotels.

Because of our Agile processes, we needed to be designing, styling, and enabling our developers to be working simultaneously. The image you see here is of the prototype I built to meet this challenge. Every piece of it was created with intent, from padding, alignment, line height, color, font size, image, and more. I'd ask that you take a moment to explore this prototype, as alot of time, effort, design, blood, sweat, and tears went into its creation.

Launch baby, launch!

www.ihg.com/avidhotels launched on May 3rd 2018, and by May 7th 2018 avid signed their 100th hotel. And boy, am I a proud daddy.

Launch baby, launch!

www.ihg.com/avidhotels launched on May 3rd 2018, and by May 7th 2018 avid signed their 100th hotel. And boy, am I a proud daddy.

Keep exploring?

Keep exploring?

Keep exploring?