Workbee
A marketplace for tenants to book a seat in co-working or public spaces
A solution for individuals such as students and remote workers to find suitable workspaces.
Overview
Workbee aims to be the premier coworking space marketplace for tenants to rent public and private workspaces from hosts. Our marketplace will include specialty workspaces that may offer professional equipment, and allow the hosts to make their own rules. This platform is geared towards providing a flexible solution for individuals such as students, freelancers, and remote workers.
Created the design system, user flow, low to high fi wireframes, and prototypes. Led the team by distributing the works and managing timeline.
The Team
Wendy (Me) - UX Designer (main booking flow)
Christina - UX Designer (check-in/out flow)
Andrea, Dishanth, Ruyue - UX Researcher
Duration
Sep. 2021 - Nov. 2021 (3 mon)
Workbee Preview
My Role - UX Designer/Leader
00
Problem Space
A glimpse into the problem we are trying to solve
How might we
secure individuals such as students, freelancers, and remote workers suitable and available workspaces to minimize searching time?
Understand the access control industry and empathize with users
01
Research
Competitor Analysis
None of the direct competitors includes all of the eight key features we defined in our matrix.
Survey
From the 71 responses we collected, we found that most people prefer to work in coffee shops and 57% of the respondents stay anywhere between 3-6 hours in public workspaces, which prompted us to design the app such that users were able to book timeslots for workspaces in 1-hour long increments, which was contrary to our competitors, all of whom only offered space rentals in day-long increments or longer.
Stakeholder Interviews
We created interviews and affinity mapping to gain a deeper insight into how the stakeholders — hosts, students, and remote workers — interact with our application space currently and what their processes and difficulties are. We learned two facts:
1. Spaces are chosen based on their unique characteristics.
2. Knowing the space availability is crucial.
Research Takeaways
Identify user's pain based on the research and specify the design requirements
02
Define
Pain Points
Students and remote workers face difficulties in identifying public workspace availability and character in advance.
Requirements
Show spaces catering to users' wish
-
Ｍust list and provide available workspaces
-
Must inform users of the available amenities
-
Must allow users to reserve seats
-
Must have filter to show space listing by criteria
Create flowchart and wireframe
03
Design
Brainstorming
After speciying the requirements, I led my team to build the initial user flow together with sticky notes and sketch the initial low-fi wireframes using paper and markers. Starting from the left is the home page, search, search result page , space description page, and reservation page. I was in charge of the search result page, and I came up with an idea to use tags, a feature which later became a differentiator of Workbee, to present each location on the map view.
Med-Fi Wireframes
Based on our brainstorming, I created the user flow on Miro and the corresponding med-fi wireframes on Figma. I have created two versions for the search result list.
Landing on home page, user can search for the available spaces based on their availability, location, and preference. In the search page, I added the Tags feature that allows users to select the space character they prefer. The search result page will present in list view with the map view in the background by default. I came up with two versions, one with instant book button and one without.
I skipped the sign up/in process for the med-fi wireframes. After clicking into the space, users can read the space details and make reservation. I separated the reservation into three processes: confirm details, confirm and pay, and complete reservation.
Create rapid-prototype and conduct A/B testing
04
Prototype and Test
Prototype
I created the prototpye with the med-fi wireframes to run our first usability testing.
Usability Testing & A/B Testing
We conducted the testing on five people and found that users prefer the search result page without the instant book button because users like to absorb information through images and want to learn more about the first-time visiting spaces.
The users also indicated that the reservation process is confusing and some items are repeated.
The title does not clearly inform users of the status.
Editting selected option is redundant and repetitive.
Adjust user flow and wireframe
05
Iteration
Design System
I created the design system to unify my and the other UX designer's wireframes.
High-fi Wireframe
Based on the testing result, I came back and re-adjust the reservation flow and created the high-fidelity wireframes.
Prototype & Usability Testing
I created the prototype for the researchers on my team to run the second usability testing on UserTesting.com.
These are the highlighted feedbacks and suggestions:
1. The filter can be more flexible and specific.
Every user had a different preference using the filter, and we should allow them to select different Tags in the setting they hope to show on the searching page. Also, some participants found the Tags not specific.
2. Users love the map legend.
All the participants liked the idea that we used space type as the legend marking the spaces on the map.
3. Users want to be able to change the availability time on the space detail page.
The user wanted to select their time slots before reaching the reservation flow. This would allow the user to be able to gauge the availability of spots before committing to a location.
Final Prototype
I was responsible for the main flow, and Christina, the other UX designer was responsible for the check-in/out and the subscription model flow. After testing on our flows separately, we combined our screens into one final prototype.