HotPatch— a UX/UI Client Project Case Study

James Bynner
8 min readJan 10, 2022

--

Making booking space simple in 2021

Imagine a space which supports the most aspiring young entrepreneurs to grow, build connections and showcase their talents.

HotPatch is a non profit organisation which connects people with rentable space and supports community initiatives and start ups.

Working with 3 other GA students our task was to use user research and insights to further understand the needs of renters and hosts and share recommendations to improve their user journeys.

This was a 3 week design sprint group project which covered User Research and Insights, Design Studios and Ideation, User Testing and our final High Fidelity Design.

Tools: Miro, Figma

Deliverables

• Research insight & findings concerning competitors, user types, and behaviour including personas and scenarios

• Design & usability recommendations for improvement

• Product sketches and mid fidelity wireframes and testing

• High fidelity mock-up

• A final presentation to the client which summarises the UX work

Success criteria

The overall objective of the redesign was to identify the key priorities for renters and hosts and propose solutions to improve the overall customer experience.

The Process

Empathise / Define / Ideate / Prototype / Test

The mission

HotPatch’s mission is to support local people and local initiatives. Understanding the needs, desires and aspirations of clients allowed me as the designer to produce designs which represents who the organisation is and what they want to become. It allows me to be their cheerleaders.

Understanding the problem

HotPatch bounce rate

So the bounce rate is high but what is preventing users from booking and how are other organisations addressing this issue?

Competitive and Comparison Analysis

One of HotPatch’s key priorities is for the website to develop trust in users to ensure patch conversion. We researched 6 venue hire organisations for our competitive analysis and learnt the quality and quantity of photos, space descriptions, star ratings increased successful bookings as evidenced by reviews.

As HotPatch also had a high bounce of people browsing but not hiring space, our comparison analysis focused on 3 companies. Amazon, Airbnb and Uber all stood out for their simple designs and intuitive navigation systems providing reassurance for users and keeping customers active on the site with a 3–4 step booking process.

Below is the analysis we did on AirBB, the travel app HotPatch were inspired by and based their website designs on.

AirBNB’s initiative 5 step booking process

My Reflection on Analysis: Look for key takeaways and ensure feedback to Clients highlights ‘opportunities’ where the organisation can grow. Ask Client where and how they might use these insights to develop their service as this will ensure solutions are practical to implement.

We carried out 5 hosts and 8 renter interviews hoping to understand user’s key motivations, needs and pain points. We wanted to know HotPatch’s mission and what difference their service makes to the lives of people renting spaces. The following ‘I Statement’s shows insights recorded from the Renter’s perspective:

Renter ‘I Statements’

Host pain point: Many of the Hosts we spoke to received relatively few bookings over the last 3–6 months and tend to focus their time on patch listings in other space hire sites which receives more attention. “In the last 6 months I only had one booking from the HotPatch platform” said one Host we spoke to.

My thoughts on the problem: The danger for HotPatch is that while they want to encourage lifetime users, Hosts might delete their accounts permanently due to low booking numbers. The focus for the user journey needs to now look at Retention.

Next on the ‘to do’ list were defining the unmet needs (problem) for Renters and Hosts and creating our personas. We created two of each one for the Renter and one for the Host.

Re

Renter Persona

Vicky needs to find a way of receiving accurate information and a more intuitive booking process when using HotPatch in order to find a suitable space that meets her needs of being in a co-working environment.

Host persona

Dylan needs to find a way of increasing the exposure of his listing in order to maximise conversions of his patch as well as being able to support and be part of his local community.

Let’s take a minute to recap our HotPatch journey so far…

So far we have gathered insights from interviews and our own research. We’ve understood the key priorities for HotPatch and the pain points for renters and hosts and we’re ready to solutionise.

Lets go…

How Might We Statements (HMW)

Our HMWs explored two key areas. From the Renters Vicky’s perspective, how might we create a loyalty system that encourages further bookings and from the hosts point of view, ideas looked at how to increase Patch promotions and the number and frequency in which people rent patches.

DESIGN STUDIOS

These key insights were taken into our design studio where we did crazy 6s with the HotPatch team. We all took the role of ‘Vicky’, our renter and came up with ideas ranging from Gamification to creating a ‘Super User’ and voted on each other’s ideas as marked by the yellow circles. The focus of the activity required HotPatch to problem solve as if they were Renters booking spaces. What incentives might they need to keep booking?

We did a second design studio led by the HotPatch team from the Host’s view and sketches illustrated ways in which we might help Hosts promote their patch.

As a design team, we walked away from these sessions feeling inspired, energised and connected to the organisation’s mission as the project moved into mid fidelity and user testing.

USER TESTING THE HOTPATCH WEBSITE

Building on this momentum we started user testing the existing HotPPatch website.

Patch listings

5 people with no prior knowledge of HotPatch carried out 4 set tasks and two significant themes emerged:

  1. The need for category lists and filters to easily guide people through the ‘patch listing’ process
  2. For patch details and features to be comprehensive and backed up with positive reviews.

“Reviews are really important for me. They enable me to decide whether to book a space or not. All 4 venues I checked out on HotPatch have no reviews which makes me want to leave the page and look for somewhere more trustworthy”.

Claire, Social Well-being and Community Activism Researcher

The sketch above demonstrates how we redesigned HotPatch’s current search and filter functions for Patch listings based on the feedback provided which were incorporated into both renter and host user flows as indicated by the yellow stars.

MID FID USER TESTING

This led to further mid fidelity mockups and testing. Looking for trends, comments were noted and further changes made to improve functionality and the user experience. The feedback we received can be seen in the following two slides.

User Feedback on mid fidelity designs

We are nearly there with our design. We have gathered lots of useful feedback from user testing and learned that while our well thought-out design choices e.g. star rating and loyalty system might be clear to us, this understanding was lost in others. Moving forward into high fidelity we need to turn our rationale behind ideas into an intuitive user experience which is easy to follow.

High Fidelity Prototype

Welcome to our high fidelity prototype which combines our research, user testing and insights. This is the desktop prototype which highlights how we have simplified the search options, ensured patch listings are comprehensive and renters are rewarded for booking through our loyalty system. We hope by making these changes, HotPatch will experience a higher rate of bookings due to the intuitive 4 step booking process and for our new features to re-establish trust with Hosts due to the implementation of our Patch Promotions solutions.

Figma high fidelity prototype

HotPatch feedback

The feedback from the HotPatch team was positive. They felt we really understood the organisation’s mission which is to create a trustworthy site with an efficient booking process and rewards. Yas, the CEO told us after the presentation that it is amazing to see ideas which have existed in his head, come to life in high-fidelity. The wider HotPatch team also valued the touch points we had along the way and how design studio ideas were incorporated in the final design. While some recommendations may take longer to implement there are others such as the patch details and category lists which can be done straight away and will make a real difference to the service.

My practice and my learning

Overall I felt our group jelled really well and had a great work ethic which enabled us to move the project forward. The power of encouragement and taking time to provide positive feedback to each to team members ensures groups move forward with momentum and energy. This is my learning.

And finally…to the HotPatch Team

Thank you for trusting us with this process, thank you for your openness to new ideas and for your support and engagement through-out this project. As one of your Hosts pointed out “HotPatch goes above and beyond to helping out those in need”. The organisation should be proud of what it has achieved and can continue to achieve in the future.

--

--