RESPONSIVE WEBSITE

Hotel Monteleone

A LUXURY NEW ORLEANS HOTEL

Hotel Monteleone is the talk of the town for tourists and locals. It's everything you'd want from a historic New Orleans hotel, from elegant crown molding to antique painting the hotel has it all. I created a responsive website that helps users book rooms quickly and easily so they can explore the city faster.

“In the spring of 1988, I returned to New Orleans, and as soon as I smelled the air, I knew I was home.
It was rich, almost sweet, like the scent of jasmine and roses around our old courtyard. I walked the streets, savoring that long lost perfume.”

Anne Rice


Author

MY CONTRIBUTIONS

  • Strategy
  • Responsive Design
  • User Research
  • Reservation Strategy
  • UI design
  • UX design
  • Branding
  • Creative Direction
THE PROBLEM

A HISTORIC HOTEL WITH A HISTORIC WEBSITE

When driving in to New Orleans at night the first thing you see is the warm red neon sign on top of the hotel. It's distinct charm can be felt from miles away, however the best way to experience the hotel is staying the night. The problem is that the website had a ten year old user-experience, that wasn't the type of history users wanted to see. Book a room was super confusing, the booking feature was hidden and only worked half the time.

The experience with the booking form lead to 50% abandonment, such a huge lose in revenue! The problem was that the form would reset randomly and force the user to redo all their information. After a lot of exploration I narrowed down the main pain points:

  • Confusing navigation

  • Difficult to book a reservation

  • Lack of social abilities

  • Too many unused pages

CONSTRAINTS

SO MANY CHEFS IN THE KITCHEN

This project was huge. It took a team of 4 people to sift throw all the current content to narrow it down to the meat of the information. We didn't want to waste any time designing things that didn't need to be created because we had to launch the website in three months before the New Year.

On top of the time constraint we had to get approval from a board of 8 people, each one having their own vision for how the website should look. Working in these types of situations had helped me understand how to lead the direction of the group.

THE USERS

WHO USES THIS ANYWAY

Understanding the users for Hotel Monteleone required interviewing users and sales rep professionals from Hotel Monteleone. What I uncovered is that the main users that are booking rooms are stay at home moms that are planning vacations for their family. They are typically between the ages of 28-55 and have 1-4 children. The types of things they find value in are learning more about the history of the Hotel and what events are happening. The second main type of users are event planners. They are looking for booking information, layouts and pricing.

The pain points from both these types of users are not being able to find the information they need within a few clicks. If they can't find what they want then they will move on to another website.

NAVIGATION

FINDING WHAT YOU WANT

With the page numbers out of the way I finally started getting into the meat of the website. The navigation from the previous site was made up of two nav menus. One along the right side of the page and the other along the top of the page. Neither of them gave an clear indication for what they did and ended up making the user extremely confused on where to go next.

To better understand what the users wanted to view I looked at the analytics from the website and creating a sitemap that put the most visited pages as the top tier navigation items.

  • Accommodations

  • Entertainment

  • Private Events

  • The Hotel

  • Contact Us

That’s 5 different routes that the user can go down, all eventually directing the user to book a reservation. Everything has a point and a purpose. This is what I call an internal sales funnel, it funnels the users into their different information paths that offer value while subtly selling the user on booking a room.

HOMEPAGE

A GATEWAY TO HISTORY

The homepage is one of the most important parts of the website because it introduces the users to the Hotel experience within the first 5 seconds. For the headlines I spent an adequate amount of time coming up with intriguing blurbs that would keep the user reading.

Below the hero section is where the user journey really begins. From here the user can travel down a few different routes that all lead to the ultimate goal of booking a room.

PAGE NUMBERS

GETTING TO THE CORE

There are some parts of the UX strategy that aren’t as obvious but they play a huge role in how the user interacts with the website. One of these parts was sifting through over 200 pages that were deep linked on the website. Each one containing a unique URL that was being crawled and displayed by search engine results. All these extra pages made it extremely confusing for users to navigate and typically had a bounce rate of 95%.

The Hotel Monteleone is a famous historical hotel in the heart of New Orleans and people love to read about it. I combined all the relevant information into a history section that was easily accessed from the navigation menu.

After multiple rounds and revisions I finally narrowed down the pages to less than 30 from the previous 200+ pages.

RESERVATION

I NEED A ROOM

Notice how the “Book Reservation” isn’t a part of the main navigation. That’s because the analytics showed me that users wanted to be sold on the experience before they decided to book a room. Pushing a “book reservation” form on the user would come off as pushy and inauthentic.

The previous website featured the booking form right on the homepage and made users scroll down to find it. The form would often go half completed and didn’t work on mobile because it was built on flash.

Instead of recreating this inefficient form I developed a new strategy. I added call-to-actions on vital sections throughout the site where users are most likely to convert. Then I determined using heat maps that most user interaction happened on the top right section of the page. I created a “Book Reservation” button right above the navigation in the top right corner that lead the users to a page that only contained the book reservation form. This way all other information is taken out and the user is solely focused on filling out the form. This is a concept I borrowed from amazon. Users are easily distracted and pushing them to book a room at this point is vital.

The new form is also elegant and easy to use, while being mobile responsive. The user can pick a range of dates from a visual card and book a room within moments.

ROOMS

SHOW ME THE GOOD STUFF

EVENTS

TIME TO HAVE FUN

MEETINGS

GETTING THE GROUP TOGETHER

A huge focus for the Hotel Monteleone was increasing their meetings and weddings. I took this into account when creating the meetings page. I included all the relevant information 1. About the rooms 2. Layouts 3. Catering. From this page event planners have all the information that need to be able to plan a successful event without having to search too far.

BACK TO WORK