Thunderbird

CHALLENGE

Thunderbird Hotel is looking for an improved eCommerce website and want to showcase their products/services while maintaining the brand image: “small shop” appeal and great customer service.

Although the hotel prides themselves on their in-person experience, the pandemic hit them pretty hard and they saw an opportunity to support the local community by highlighting local businesses and allowing people to order some products online with the ongoing pandemic.

To support local businesses and bolster traffic to Marfa, TX, the user needs a clear and cohesive website to book a stay for their trip. They need to be able to view available rooms, prices and amenities included with the room, so that they can make a confident and informed decision without having to contact the property. They need a resource for local events, restaurants, and shops because they want to experience the culture and what is unique about that area.

SOLUTION

Build an efficient and clear way for users to book a hotel with rooms that fit the user's specific needs. Add detailed information about what is available in each room so that users do not have to do further research or call the property. Hotel amenities, room features and descriptions and transparent pricing is obvious to the user when they input the duration of their stay and filters of what they are looking for in a room.

UX PROCESS

SKETCHES + LOW fidelity prototype

usability
testing

high fidelity prototype

COMPETITIVE ANALYSIS

The biggest takeaway from the Competitive Analysis, is that the other hotel locations all provided a directory or map of local restaurants, and businesses that guests could explore. If the Thunderbird Hotel wants to support the Marfa community this would be an important feature to make available on their website.

El Cosmico Hotel

MARFA, TX

El Rey Court

SANTA FE, NM

High Country Lodge

FLAGSTAFF, AZ

Thunderbird Hotel

MARFA, TX

BOOKING

FOOD

EVENTS

SPA

SHOP

GALLERY

RESOURCES

USER INTERVIEWS

USER #1

Age: 31
Location: Phoenix, Arizona
Occupation: Owns own Chiropractic office
Married, 1 dog

USER #2

Age: 27
Location: Arvada, Colorado
Occupation: Director of Grants + Partnerships
Married, 1 dog

USER #3

Age: 31
Location: Denver, Colorado
Occupation: Digital Marketing Manager
Married, 1 dog + 2 cats

USER #4

Age: 33
Location: Tempe, Arizona
Occupation: Stay at home mom
Married, 1 child

USER #5

Age: 28
Location: Wilmington, North Carolina
Occupation: Associate Marketing Manager
Single, no pets

INTERVIEW GOALS

Through my user interviews I wanted to gain an understanding of what they are looking for when they book a hotel. Not only the process or steps taken to complete the task, but the details about the location, property and surrounding areas. I wanted to learn, how they search for a hotel, how they prefer to book a room, how they get around in a new place when they travel and who they travel with.

AFFINITY MAPPING

I organized the findings from user interviews by building an affinity map. This helped me discover key takeaways from the users and identify patterns in their answers.

KEY TAKEAWAYS

The most important takeaway from the interviews is that users want to know all the details about what is available in a clear and obvious way. They want to find the information that they need on the site without having to call the hotel. Details that are important are the room types with clear descriptions, amenities available at the hotel and in specific rooms, and transparent pricing.

Having a very comprehensive list of what is available, in the rooms, and also what is around in town.

List different room types and what is available in each room, clear room descriptions of what is truly in the room.

These findings help guide my priorities and focus in what functions and features needed to be built so that the users have a positive experience on the website. This will be done by providing an answer to each of the following questions.

I want to see the availability of rooms, the price, and hit list of features and amenities.

Wants to know dates that are available, and types of rooms available to choose from.

How will I display all of the important details of the rooms that are available in a clear and concise way?

Display all of the amenities that are available through the hotel that customers have access to?

Create a library of images that customers can use to get a good idea of what is available and the overall vibe of the hotel?

Share and inform customers of all of the local events, shops, restaurants, coffee shops and bars?

PERSONA

After synthesizing the data from the competitive analysis, and user interviews I started to develop the persona. I knew that I could focus all of the users concerns into one persona. While, the users backgrounds are different they all shared many of the same behaviors, concerns and needs when booking a hotel room in a new area.

CARD SORTING

I conducted a Hybrid Card Sort, where users can categorize items in specific categories or create their own category if they feel it does not fit in to any of the categories provided. 5 individuals participated in the card sorting exercise. I provided 3 categories for users to sort the cards into; Room, Food and Beverage, and Merchandise. Each category had the predicted items sorted at the highest rates. There were 5 additional categories created by the participants; Accessories, Amenities, Dessert, Snack and Sweets. These results help guide how I setup the menus within the navigation of the website.

65% of participants categorized the cards into the correct category.

Each provided category had an agreement rate of over 78%.

Users created 5 additional categories and 8 cards were sorted into them.

USER + TASK FLOW

The User Flow built for the Thunderbird Hotel demonstrates how important the details about the rooms are important to the user. If they are not able to find a room that meets their needs, the user will leave the website. This may not necessarily mean that the hotel doesn't provide what the user is looking for. The website needs to clearly display all of the information in a clear and easy to find way so that the user does not feel the need to call the property and abandon the process.

SKETCHES

LOW-FIDELITY PROTOTYPE

After reviewing my sketches and gaining a good understanding of how I wanted each page and feature to function I translated my sketches to a prototype in Figma. I made sure that my focus was still on having areas to provide clear descriptions and details on what is available in each room.

USABILITY TESTING

Based on the users needs I wanted to make sure that they could book a room with all of the amenities that they look for without having to contact the property. All of the necessary details need to be provided to the user during the booking process.

TASK

Book a room through December 15 and 18 with a king bed, kitchenette, complimentary breakfast and that allows pets.

OBJECTIVE

The objective is to make sure that it is clear and efficient for the user to book a room with their specific needs during their time of travel.

USABILITY RESULTS

PARTICIPANTS

Participant #1

TIME

1:45

ERRORS

Clicked on the room before inputting the dates and details of the search.

HESITATIONS

Having a full calendar view for selecting the date would help hold their attention. Wasn’t sure that the room was booked without having a “review” page before confirming the room.

Participant #2

2:30

Clicked on the room before inputting the dates and details of the search. Clicked “Book Now” in the header rather than the button next to the room description.

Wanted to select the room before inputting the details for date, and what they are looking for in a room. There are multiple “Book Now” CTA’s on the page and clicked the one at the top of the page that first caught their attention.

Participant #3

2:30

Clicked on the room before inputting the dates and details of the search.Clicked out of the filters window before selecting all that applied.

The selection of room features/hotel amenities was confusing without more specific categorization.

Participant #4

3:20

Clicked on the room before inputting the dates and details of the search.Clicked on “Book Now” in the header instead of “Confirm Stay” on the payment information page.

Saw the “Book Now” button in the header before the “Confirm Stay” button when inputting all of the customer information.

Participant #5

2:05

Clicked on the room before inputting the dates and details of the search.

Wanted to select the room before inputting the details for date, and what they were looking for in a room.

HIGH-FIDELITY PROTOTYPE

From usability testing the changes that were made in the next iteration made a smooth booking flow with less confusion on the order of processes and conflicting calls to action.

The search bar was overlooked. It is not prominent enough to prompt users to enter the information before looking at the rooms that are available. A full calendar was added to the page to correct this.

The “BOOK NOW” buttons were more apparent to users than the search bar. Prompting them to click "BOOK NOW" rather than enter the information needed to filter the available rooms.

Users clicked out of the filter window before all of the options were selected. Prompting the user to start over with selecting filters. Adding variations to the prototype helped correct this issue.

After the filters had been applied and the search results for the rooms populated users clicked on the “BOOK NOW” button in the header rather than the button associated with the room.

NEXT STEPS