Conceptual project for Designlab's UX Academy
Well-Known Platform (Airbnb or VRBO)
Many people use platforms like Airbnb or VRBO to find and book unique vacation rentals like tiny houses. However, by using these platforms, users can end up paying 5%-15% more than if they'd book directly from the owner's website.
Owner Direct-Booking
Unfortunately, using an owner's direct booking website can be frustrating. Many direct booking websites are outdated, hard to navigate, and contain unclear information. Some users also express concerns about the security of using a direct booking website instead of a well-known platform like Airbnb or VRBO.
Users want a vacation rental website that is simple to navigate and that contains all the information they need to confidently make a reservation.
The Tiny Dweller vacation rental company owns multiple tiny houses. Users can search for and book one of the houses directly from the company through the Tiny Dweller website.
I wanted to create a product that allowed users to experience the fun of tiny house living. At first, I envisioned a site where users could rent land from individuals all over the US. Then users could park their mobile tiny houses on the land they had rented.
I dove into researching the legal requirements surrounding tiny houses on wheels.
Key Findings:
Requirements varied widely from state to state and city to city within a state.
Legally, this focus wouldn't be feasible for Tiny Dweller.
I pivoted in my research to see if it would make sense to have a website for stationary tiny houses.
My discoveries led me to focus on designing a direct-booking website for the Tiny Dweller company. The Tiny Dweller company rents out stationery tiny houses located on one lot of land.
Three statistics in particular helped to confirm this decision:
I researched four direct booking websites that specialized in tiny house vacation rentals. I wanted to see what strengths and opportunities for improvement they had.
While I discovered some great details these websites included, like a diagram of the house floor plan or a virtual tour video, I also discovered opportunities for improvement.
Here are some opportunities for improvement that I focused on while designing:
Visible pricing
Visible date availability
Easy options for viewing the pictures
Visible rules and policies
Familiar and simple navigation patterns
Concise details
Visible reviews
Sites like Airbnb and VRBO are highly successful, so I knew I could learn from them. I specifically studied:
The navigation patterns
The information in the listings
Key Finding:
Neither of them offered virtual tours or video walk-throughs of the houses. This seemed like it could be a big improvement that I could include on the Tiny Dweller website.
6 interviewees
All had booked or browsed for a vacation rental or hotel multiple times
Key Findings:
Knowing the price and location right away is top of mind for users.
Informative pictures are critical.
Having a quick, simple way to communicate with the owner is necessary.
Amenities, reviews, and security features are valuable to know.
Details about the owner, the area, and nearby attractions are also helpful.
I created a user persona that summarized the themes I had uncovered during my research.
After focusing on this POV statement, I went on to ask, "How might we eliminate any unpleasant surprises for users who book tiny house vacation rentals?"
Both statements helped to guide my work and keep me focused as I designed.
I created a sitemap for the entire Tiny Dweller website. However, due to time constraints, I only designed the searching and booking part of the site.
Creating user flows and task flows helped me to visualize the steps the user would take to search for and book a vacation rental.
After figuring out the mobile version, I translated my design into a desktop version. All the mobile and desktop screens for the task flow of searching for and booking a vacation rental are below:
To make it easy for users, I focused on giving highlights of the important information about the house on the house listing page.
If users need to know more, they can expand the information and see it on a separate page. This keeps the long listing page from becoming too unwieldy.
I conducted usability testing on the mobile mid-fidelity screens. It was important to me to be able to see and talk with my testers in real time so I could ask any clarifying questions and hear their input.
Held moderated testing
Had five participants
Used Zoom
Users liked the familiar navigation patterns and the progress tracker on the check-out pages that helped show where they were.
They also suggested various improvements, which I prioritized them according to their level of urgency and according to the amount of time I had.
The pictures below show some of the iterations based on their suggestions.
BEFORE: The types of credit cards accepted are not shown, causing doubt for the user. There are also no Google Pay or Apple Pay options.
AFTER: Accepted credit cards are shown. Google Pay and Apple Pay added to give users more payment options.
BEFORE: No email confirmation is given after booking, causing users to feel uncertain about what to do next.
AFTER: Email confirmation is added, giving users a level of assurance.
BEFORE:
1. The user has to scroll to find the check-in and check-out times, making them easy to miss.
2. The nightly rate is shown but not the estimated total price, which could give users an unpleasant surprise when they begin the payment process.
AFTER:
1. Check-in and check-out times are included at the top under the listing picture so users don't miss them.
2. The estimated total price is added at bottom for full transparency.
BEFORE: Users don't have the option to filter the reviews, making them need to scroll to see varied ratings.
AFTER: Options to filter the reviews are added, helping users see what's important to them.
I created a component library before tackling the high fidelity version of the screens.
I enjoyed designing the high fidelity wireframes. Below are some of the mobile and desktop screens for the task flow of seeing the information for a tiny house.
The next step would be to finish the other parts of the site that I was unable to fully design due to time constraints. This would include the following sections: About, Attractions, and FAQs.
After that, the product would need to be sent off to developers.
In the future, it would also be good to explore options for users to create an account to keep track of their booking information, save their payment information for future trips, and easily leave reviews.
Currently, in order to contact the owner, the user has to call or email them using the contact information given. In the future it would also be good to explore an integrated messaging system so the user doesn't need to leave the site to contact the owner.
Takeaway 1
When designing Tiny Dweller, I found that analyzing existing navigational patterns was very helpful. I was able to take what was already proven to work well and add features that my research indicated would be beneficial. This saved me a lot of time and error.
Takeaway 2
Discovering that it wasn't legally feasible to follow my first idea for Tiny Dweller's business model reminded me once again of the importance of accurate, thorough research before going too far with a project.
Takeaway 3
I enjoyed hearing what users had to say about their experience when searching for hotels and vacation rentals. Sometimes without the right research, it can be easy to think of users as a vague group of people that you're trying to build an experience with. However, conducting interviews and listening to their stories, their hopes, and their concerns helped me to empathize with them as real people and really root for this design to be something that helps them to plan a lovely vacation.