Redesign of Spotahome — A UX Case Study

Spotahome logo. Credit

“Spotahome follows a similar business model to online holiday rentals but instead focuses on finding you a home for stays of 30 days or longer. We are a 100% online booking platform” — Spotahome, Google Play Store

Overview: A proposal for a redesign of the user experience for the app Spotahome, focusing on the user’s home identification filtering process. At the time of this case study, the iOS version of the app had 78 reviews with an average rating of 4.4, compared to the Android version with 1301 reviews and rating of 4.0. Based on its larger size user base and lower average rating, I decided there is more opportunity in redesigning the Android app.

Solution: A new take on the current Android version of the app that reduces cognitive overload in the listings filtering process.

Role as Designer: user experience design, usability testing, user research, rapid sketching/ Crazy 8s, low-fidelity / high-fidelity prototyping.

Tools: Pen + paper, Figma

Redesign of Spotahome city browsing screen

How can we simplify the home filtering experience for the user while maintaining speed and effectiveness?

Based on the Spotahome Play Store description, it is clear that their prospective market of users are travelers looking for primarily for extended stays in large and popular international cities.

For my focus on user research and understanding what the pain points of the Android app are for current users, I referred to online reviews of the app from the Google Play Store:

Credit

While there are many five star reviews and the average rating for the app is a 4.0—both undeniably respectable—there are also a number of dissatisfied users in the one star category. I focused my research on these reviews. I was able to categorize these reviews into two types of criticism: 1) locations of listings and 2) user experience.

  • No one knows what cities Spotahome has listings for

Many of the negative reviews pertain to the geographic locations the company services—currently, not the US. Here are two examples:

This sort of review can be easily mitigated with clearer UX copy establishing which cities are available for search, before the user downloads the app! This saves the user time, storage, and data, and limits the number of poor reviews that the company receives. Spotahome does publicize this information on their website, though many users clearly do not follow this user flow. Instead, they download the app only to have to uninstall it because it is not useful to them.

  • Navigating the app feels slow, makes the user feel encumbered

There appeared to be a lot of support for critical reviews mentioning the difficulty in navigating the app and the overall experience of the app. Here are a few examples:

These reviews are where I want to focus my redesign proposal on. Most critically, they isolate a need: users need a lightweight, simple solution to filtering and finding homes that match their criteria.

To confirm my thoughts and address the need statement that I discovered from reading reviews, I decided to conduct a few rapid usability testing sessions on the current Android app offering from Spotahome with a few friends. The criteria I had for selecting friends was that they have to have: traveled internationally, rented a place via a house-share site at least once, and are in the target age range of 18–35.

Once I identified three candidates for usability testing, I wrote a script for them to follow, briefly explaining the task to them and allowing for them to ask me questions if needed along the way.

  • The Script

Context. You’re a recent graduate looking for an extended getaway in Rome. You want to stay in Rome for 7 months, starting Oct 6. Your price range for a house is between 400 to 1500 euros / month.

Task. Open the app and continue as a guest, without providing additional information. Find a few possible places to stay that meet your criteria.

After the user completes the first context and task pair, the following context and task are provided.

Context. Wait, you realize that you actually wanted to visit Paris, not Rome. Your requirements for the place, including duration and move in date, price all remain the same.

Task. Find a few more places to stay.

  • Participant 1. Sam

My first candidate immediately had questions, from the moment the app was first opened. Here are some of his out-loud thoughts and questions as he navigated the app:

“Do I put looking for a home?”

“Lightning bolt?”

“What do I do now?”

which was said a total of four times, and

“Do I do a filter?”

I noticed a few user patterns from watching Sam go through the app after hearing the context and task that I wanted to confirm with the other two candidates. For example, he had difficulty locating the filter option and spent a lot of time resizing and panning the on-screen map.

Another interesting takeaway from this session is that after the second context-task pair was provided, Sam correctly modified the city location and exclaimed with horror:

Oh my gosh, it reset everything!

when he realized that by changing the city, he had erased all of his previous filter criteria choices.

  • Participant 2. Sarah

Sarah confirmed some of my suspicions regarding locating the filter option and navigating the app. After hearing the context and task, she started by immediately panning and zooming in and out of the map, looking for places that matched the criteria. She opened the left menu first when looking for the filter options, and when she discovered the filter options, had difficulty with the slider option for price range.

One interesting piece of Sarah’s usability testing session is that when filtering, she completely missed that the filter option had a place to input move-in date and duration of stay. My hypothesis is that this is because the bright green price slider right below the date/duration criteria input draws user attention past this section. Rather than finding the date/duration input section, Sarah scrolled through the entire list of filters, only to give up and return to the map of resulting matches.

When trying to apply date/duration criteria, Sarah ran into another problem. After tapping on the start-date placeholder text, Sarah selected her end date as her start date. There is this room for error because the app doesn’t have an explicit end-date option; rather, the duration selector is provided and this isn’t necessarily clear.

Sarah also notes that copy in some places is unclear. What is the meaning of “Room,” versus “bedroom”?

  • Participant 3. Jonathan

My third participant’s experience actually mirrored the experiences of Sam and Sarah, exposing some clear user pain points.

Jonathan began by zooming into the map, complaining about how difficult it is to distinguish between different map markers and to zoom and pan the map without accidental touches.

He mentioned how the slider for the price range in the filter section is not tactile and not very user friendly; he missed the mark multiple times. Like Sarah, he completely overlooked the filter for date/duration criteria. Instead, he tried to implement this filter manually, by inputting check-in dates and duration within a selected property listing.

I began my design process with a round of Crazy 8s to get creative with brainstorming potential solutions to the problem statement I identified. I focused on aspects of user selection of various filter criteria to gauge what sort of impact and opportunity each step of the filtering process poses for this redesign.

Crazy 8s brainstorming process

After Crazy 8s, I began to transfer my low-fidelity sketches into high-fidelity screens in Figma. During this process, I focused on a 1:1 mapping process of translating the needs and pain points identified during initial usability testing into design choices.

  • Resolving the need of a cleaner filter list

The current app filter list is almost too thorough, which allows for the user to get distracted or feel overwhelmed easily. Both Sam and Jonathan mentioned during usability testing how they felt overwhelmed after opening the list of filters because of decision/choice paralysis. There are many ways to redesign this user experience to mitigate this sort of reaction.

One simple yet effective choice is to break down the filter list into a sequential user flow experience, where the user is guided through the list of filters from general to specific. This way, they are sure to have seen each of the filter headings for their trip and can choose to skip the more specific filters if they wish. Sequential user flow reduces the cognitive overload that the user faces when deciding which filters are completely necessary, and which can be skipped and considered for later.

For example, after the user selects a city that they wish to stay in, they are then guided through this filtering process. They cannot skip over the date/duration filter, the price range filter, or the number of beds/bedrooms filter. Once the user has provided adequate information, a map of the listings and a list of possible places to stay will be displayed. Then, they can choose to fine-tune their search with real-time updates using more specific filters.

Fine-tuning filtering, the second part of the filter process

In the screen above, the fine-tuning filtering option was selected, and the user is now able to provide specific details about what they are looking for in a specific listing. The listings that appear below the divider are updated in real-time as the user updates the filter sections.

  • Resolving the need of a more recognizable date/duration filter

When designing the first filter screen, date/duration, I considered how between Sam, Sarah, and Jonathan, all three had difficulty just noticing that this was an option. They simply looked past this “Enter your dates” section and their eyes gravitated toward the colorful sliding bar in the “Price per month” section. Even after noticing that they could input their desired move-in date and estimate of trip duration in months, they continued to run into problems with user input.

The price slider distract the user from picking dates

My solution is a twofold response to this user-input pain point: 1) reduce the amount of cognitive overload the user feels when they open the filter screen by redesigning the filtering process, and 2) make date/duration input more customizable and less prone to error.

Proposed redesign of the date and duration criteria input screen

With this proposed redesign, the user immediately sees the date/duration criteria filter after they select a city. This filter is one of the most critical filters for affecting user experience because it the possibility of saving the user a lot of time and effort by eliminating unavailable homes.

This redesign also highlights dual-mode input to allow the user more flexibility in defining relevant values. For example, when selecting a date, the user can choose to either type in the numerals corresponding to the date they want to check-in, or they can use the associated calendar and select a day. Next, when they decide on the duration of their stay, they can either type this input in or use the draggable slider. This dual-mode input affords the user multiple ways to submit data and provides a visual cross-check of the information, reducing the possibility of proceeding with an error.

If you’ve made it all the way here, thank you so much for following along with me on this case study! This was seriously fun design challenge, and despite having never used Spotahome—outside of user testing of course—I now feel comfortable explaining the product and some key hurdles that I predict the company’s designers had to cross to craft a pleasing user experience.

Good user experience is something that we can easily take for granted, especially when everything works as we expect. However, it’s truly fun to break a product down and examine it piece by piece, identifying potential problem areas or pain points.

For the future, if I were to continue this case study on Spotahome, I would love to continue investigating the flow of users through the filtering process. Additionally, I’d like to spend more time examining the interaction design of the app, including the appearance of menus, buttons, animations, and transitions between screens. Interaction design principles, when done tastefully and in moderation, can really impact and elevate the user experience of an app.

If you have lingering questions or comments about my process or want to hear more about the justification of my design choices, I’d love to chat about it in the comment section. Otherwise, thanks again for reading!

Product Design | Duke University

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store