Messy and time-wasting housing ads are no more

Kylie Chung
7 min readApr 1, 2021

This is a case study about the concept group project I was involved in during my time studying General Assembly’s User Experience Immersive Design remote course.

What is Spareroom?

Spareroom is a flat sharing and flatmate finder platform across the UK. They help users search and connect with each other to find a suitable place to live.

The design opportunity

During the COVID pandemic, people looking to find a new place to live were faced with even more challenges. Spareroom sees an opportunity in adapting their services to provide an easier means for their users to find places to live and flatmates with aligned personalities and interests to the searching user.

The deliverable features:

  • make user profiles more engaging and showcase individual personalities more on the platform
  • make the search functionality easier for the users to find each other, while also matching other criteria such as location, price, etc.
  • make the overall process of finding future flatmates more fun and engaging
  • help manage the logistics of arranging meetings/viewings/user interaction and support making these as engaging as possible for the users

My role

  • user research and analysis, competitor research, prototyping and finalising the design with high fidelity mockup, documenting style guides, and demo-ing the finished design
the double diamond design process

My group used the double diamond design approach to navigate redesigning the website.

sectioning line

1. Discover

user interviews, pain-points, surveys, research analysis, market research and comparison

To start off the researching process, we conducted 12 interviews in total to ask them questions about finding a flatmate. We also sent out a survey to get some quantitative data. Below are some pictures of our found insights.

54% preferred desktop, 65% are willing to link their profile to social media and 68% don’t rely solely on virtual interaction

Market Research

Part of the discovery process was researching Spareroom’s competitors. We looked at their direct competitors who are these brands down below. We looked at the features they all had in common and what features they didn’t have. By doing this we can locate an uncovered area in the market that Spareroom can take up, and stand out against their competitors.

the direct competitors of spareroom are rightmove, open rent, zoopla, roomi, ideal flatmate and roomgo

Here are some of the insights we found among the direct competitors. Realising these features are under-considered in the market and with what we gathered from the user pain-points earlier, we can use these insights when designing to improve Spareroom’s position in the market.

Next, we did some inspiration research. This was focused on finding what other features we think other brands championed in functionality.

The features are:

  • engagement
  • reviews or ratings
  • the ‘community’ aspect of flatmate searching

Engagement

As a group, we thought dating apps have really good features and functions that encourage user interaction and engagement. We investigated their user profile elements and interaction features between users, such as their ‘like’ ability and messaging function.

Reviews and ratings

I suggested looking at Uber and Airbnb to look at how they show user reviews and ratings. We thought it would be interesting to introduce this idea to Spareroom’s redesign, as it would tackle the user pain-point about having low trust in the site and its users.

I thought that examples were very clear and the UI has elements that are easy to digest for the user. Not only that I thought the verified element on Airbnb’s site is a very good idea to increase the trustworthiness of their service to their users.

‘Community’ aspect

One of the ideas to increase user engagement was to include a community search to Spareroom. We thought to look into Facebook’s feature of Groups. These groups are organically created by users of the site and each group grows and has different rules and topics which can be very niche and suitable for users. Another feature was the messenger function in Facebook’s platform. This function has a permanent place in the platform’s UI, which makes it very easy to access and helps to increase user interaction.

sectioning line

2. Define

user personas and story, problem statements, empathy mapping, how might we statements, empathy mapping, hypothesis statements, user flow

User personas & problem statements

We decided to create 2 user personas for this project, because the brief was stretched over different areas to solve so we thought it would be a better decision to make 2 different perspectives to solve for. They are one for the user who is finding a room, and a user who is looking for someone to rent their room.

As a group we planned a user flow, which will help us to plan out the user journey when they use the site. We made different journeys for the user who is searching for a flatmate and the user who is searching for a room.

3. Develop

How Might We statements, design studio, sketching, prototyping, dot voting, usability testing, and analysing feedback

How Might We

After discovering and defining our user and their problems from their experience using Spareroom’s website, it was time to start the development phase. The first step for us was to think about how we could solve our user’s problems. We did this by thinking individual How Might We statements and coming back together and narrowing down the statements that would best summarise how we could help the user.

Design Studio

Design Studio is a fast-paced session where our group brainstormed different possibilities of solving our user pain-points and reiterating our ideas together to vote on the best ideas to continue going forward later with in the designing.

Before we started, we wanted to clearly state what were the features we are going to tackle from the research we gathered. To find this ‘sweet spot’ we created a venn-diagram that represents the business goals and user needs to find the common needs. The common features are: Interest groups, Verification, Chat function, Reviews and Ratings, and Search improvements.

Ideating and testing

We sketched out some simple wireframes that we thought could tackle our user pain points and include the key features we are designing for.

User Testing-12 tests

Key feedbacks:

  • Purpose of interest groups are not clear
  • Chat function was misunderstood as customer service, and not a messenger chat for users
  • Homepage is unclear because of too many different functions

4. Deliver

High fidelity prototyping, documenting style guides, next steps

After conducting user testing from our wireframing and low fidelity prototypes, we came to the conclusion that these are the key features that will help to solve our user problems and improve the experience of using the site.

Style Guide

style sheet

Key Learning

  • consider privacy settings in more detail

This was something we touched on mid-way through our sprint, it is really important to us when we get really insightful feedback like this. In week 2 we did some design studios and dot voting sessions to attempt to tackle this problem, but we didn’t have enough time to properly integrate it into our already mid — high fidelity designs.

Below are some pictures of some sketches I’ve done, these are my ideas:

  • users can see how other users are related to them by mutual friendships
  • prompted messages to request more information from users
  • checklists to request and give information
  • pop-ups to show which users want to connect

Thank you for persevering to this point! Please consider leaving a like if you enjoyed what you read, learned something new, or simply scrolled to the bottom of the page!
You can read about other projects I’ve worked on here in Medium or you can view them in my portfolio!

Portfolio
LinkedIn

--

--