BRINGING THE OPEN-DOOR ETHOS ONLINE FOR THEHOXTON.COM
BRINGING THE OPEN-DOOR ETHOS ONLINE FOR THEHOXTON.COM
Client: Ennismore
Role: UX Design Lead
Agency: Feed
Year: 2020
↓
↓
The Ask
The Ask
The Ask
The Brief
The Hoxton is a series of 10 open house hotels across the globe, each inspired by the diversity and originality of the streets surrounding them. Each culturally rich, location welcomes both tourists and locals alike to its inspiring events, great eateries, and cosy bedrooms. With a new brand direction and bold expansion plans for the future, Ennismore approached Feed to create a new mobile-friendly website that could grow alongside the brand.
Goals
As with any similar project, improving the conversion of users was obviously a primary goal however the other tasks which made this project unique were to:
• Create a future-proof site to grow alongside the brand
• Optimise the booking journey for mobile users
• Welcome guests and locals alike
The Approach
The Approach
Welcoming Everyone
Welcoming everyone is an important brand value to The Hoxton. With this in mind, we developed two Personas at the start of the project to represent two very broad user groups. The Guests, or those users traveling from out of town had much less experience and knowledge of a city and therefore looking for a very different online experience from the second group, The Locals who already know the neighborhoods like the back of their hands.
World-Wide Web
With 9 diverse properties across the globe, each with its own subsidiary brands such as bars, restaurants, and meeting spaces. It became apparent early on that this project would, in essence, be 9 separate websites brought together under a single homepage, acting as both an introduction to The Hoxton and a portal to their different locations. This change to the information architecture allowed us to optimise the experience regardless of the user's entry point to the website.
Once the new sitemap had been created, we turned our attention to allowing users to navigate through the site with minimal friction. On mobile devices navigation links were organised into a scrollable list where as the utility elements, such as search functionality, were fixed to the bottom of the open menu for ease of use.
On desktop devices, the added real estate allowed us to create a content-rich mega menu, utilizing imagery to provide clarity to the user. It also gave us a chance to surface relevant offers and promotions within the menu itself, providing the business with additional ways to convert users.
Location Switcher
With the site structure defined, we needed to provide users with an intuitive manner in which to navigate through the site. The navigation was created with two use cases in mind. The first, users who landed to the site on the homepage, expecting an overview of all The Hoxton properties. The second were those users who arrived directly on a property page, expecting more of an in-depth menu detailing property-specific pages. Initial concepts explored the idea of keeping the location switcher separate from the rest of the navigation, however, this approach tested poorly with users, and so a more integrated solution was implemented.
The Book Button
Encouraging Add-Ons
As previously mentioned, improving the booking journey for mobile users was a primary concern during this project. The first step in this optimising process was looking at the booking form on the website. With the ability to book bedrooms, dining experiences, and meeting rooms, the form needed to facilitate a wide range of onward journeys into both The Hoxton’s own back-end booking engine, and other 3rd party services such as OpenTable. We split the form into 3 separate areas, dynamically pre-populated with content depending on where on the site the user initially interacted with the book button.
As previously mentioned, a primary goal of this project was to encourage pre-arrival bookings of the activities guests can enjoy at Gleneagles. However, due to restrictions, some of these are not currently available to book online. We, therefore, had to encourage users to make enquiries about these in advance, either online or via phone, in order to avoid disappointment. The challenge, however, was making sure users have enough information to be confident in booking these country pursuits before arrival. To showcase these activities, we utilized a little eCommerce thinking and created a card system in order to highlight the essential information for the activities in a very shoppable manner. Once evoked, the cards expand to display additional information and provide the user with an enquiry CTA.
The Booking Engine (User Flow)
Making the Homepage Work Harder
Part of the initial ask from Ennismore was to take a look at their existing booking engine and see where improvements could be made. Initially, we developed simple User Flows to understand, map out and ultimately optimise the process of booking a room. During this part of the process, our primary concern was streamlining the experience as much as possible.
Once the correct User Flow had been established we began to Wire Flow, helping to visualise the journey. It is here that we started looking at maximising the commerciality of the booking engine, exploring the most suitable places in which to offer add-ons and upgrades to the user.
The final stage in the process was the creation of high-fidelity wireframes, focussing specifically on how to present the users with all the information they needed in a clear and coherent manner.
Meetings & Celebrations
Within each Hoxton, are individually bookable spaces available for meetings, private parties, and dining experiences. Early testing highlighted the main needs users had for this part of the website. Primary needs such as room capacity, inclusions, and location were predictable, however, a large portion of users did not in fact wish to book these facilities online To support these users we fixed a “Make Enquiry” CTA to the bottom of the screen on these pages, allowing a quick and easy way for them to get in touch.
Welcoming Everyone
The many events hosted at The Hoxton play a major role in supporting their open house ethos, being especially popular with the locals of a city. We needed to create a central hub where users could discover, book, and share these events with their friends and family. For SEO purposes all upcoming events needed to be on a single hub, regardless of location. This meant providing users with intuitive filtering options by city and interest was particularly important.
In order to ensure that the website can continue to grow alongside the brand, the decision was made early on to design & build everything in a modular manner. This modular approach meant that upon delivery the business had everything needed to create and edit any pages they needed to post-launch. It also meant that by taking a little more time to set everything up in this way during the initial sprints, the UX, design, and development teams could work much quicker as the project progressed, greatly improving overall efficiency.
