Inform users without overwhelming them.

Creating the optimal booking flow for digital nomads to book a co-working space efficiently and to their individual needs. Includes competitor anaylsis, user research, UX and UI.

UX/UI
Persona
Userflow
Research
Wireframe
Mockup

Provide and receive abundant amount of information without overwhelming users.

Project Description

A platform for digital nomads to find co-working spaces that meets their individual needs, designing specifically their booking flow. How may we provide and receive an abundant amount of information from the user without overwhelming them?

Scope

Enhancing and creating the ideal booking flow

Designing a booking flow that is easy and quick for the user has a lot of complexity. There is plenty of information that must be presented to the user and plenty back must be given to the co-working space. The goal is to make it as seamless, individual to the user as possible while including all information needed without having the feeling of being overwhelmed.

We used previous research we've done on a co-working space that involved interviews, surveys, and observation. Utilizing our previous research and knowledge of the booking flow in our current company help make a ber case.

How may we provide and receive an abundant amount of information from the user without overwhelming them?

The research, UX & UI is created by myself and Fei Huang. This page and written content are done by myself.

Our Primary User

Since 2018, the number of digital nomads has tripled to 15.5 million.

Before we get into discovering the flow; who are the users of co-working spaces? There are freelancers, remote workers and digital nomads who want more than working in isolation in their home offices, bedrooms or kitchens. These individuals may want to divide work from home by switching locations, make new connections or simply don't have the ideal space to work. Many users who use co-working spaces fall into this category. Back when I wanted to live the digital nomad life, I got recommended to go to co-working spaces to meet new people that were travellers like myself.

ecobin

Competitor Research

How do users currently book at co-working spaces?

Currently, the majority of websites only allow enquiry or purchase of a day pass. Many do not allow to easily book online . We find this an inconvenience as the timely response from an enquiry can vary. However, I also suspect it is to ensure the people coming in are genuine in their use of the space. How are we able to confirm genuine use when booking online? My suggestion making a requirement for users to use connect Linkedin or a business email as I've seen some competitors do.

Below I mapped out the user flows of two major competitors: Wework and coworker. I found that often it would put me through a loop or it would only allow me to send enquiry request.


ecobin

What information is displayed?

We established all the information that our competitors put in to show the user what this co-working space has. In summary: Location, images, price, promotions, description, status (their capacity), amenities, reviews, Covid regulations, similar rooms and plans.


Primary Research

Ambience, Greenery,
Sunlight & Connections

Environment
Based on interviews, surveys, and observations at a co-working space we narrowed down our main takebacks. The environment places a high impact on our productivity or lack of a good environment. Greenery, natural sunlight, noise level, and temperatureare all major impacts. Some enjoy warmer environments while others feel uncomfortable.

Community
We found that many placed importance on the community as well, finding others who wanted to collaborate , in the same industry or make connections .

Other
Storage & Regulations for space is another important factor that we haven't seen too much on other websites. Where do they store their coats? And where are the rules?

ecobin

This is my spot!

The majority of us experienced the annoyance of someone sitting in our seat even if it's not really our seat. Even worse when it is a seat we've paid for. That concludes we must give the ability to select a seat in case they will be coming back frequently even for public seats we use frequently.

Here are some quotes that stood out to us:

My Spot
"Once someone gets comfortable with their spot, it becomes their spot.
Other community members identify that.”

Industry
“I don’t have a lot of people here that are in the creative field, it’s hard to get feedback.”

Interact
“I like that there’s a possibility to interact with people I wouldn’t normally.

Design System

We need a little
encourage-mint

We choose a green colorscheme because of importance of having greenery in the workspace is. Margin, padding, grid We used google material design as reference. Using a 12 column grid as we're designing for high DPI laptop screen. We're using 8, 16, 24 and 40 for paddings and margins.

Font Headers we used Helvetica because it's a sans-serif and they are known to be the most user friendly to read on screens.

Font size of 14px as Poppins were chosen as paragraph text. Normally 15 and up is recommended but because Poppins is rather a large font itself we decided on 14. In addition we left aligned all text (center text is not known to be user friendly) and strayed away from making titles all CAPS as it's more difficult to read.

Accessibility Giving plenty of spacing, line-height and ensuring that color contrast passed WCAG AAA makes design better for accessibility. If we used lighter greys on a white background, we ensured that the text is bold.

ecobin

User flow & Wireframe

Minimize clicks
and pages

Our goal is to minimize the number of clicks and pages without sacrificing information or user experience. We looked out how other booking flows do it, websites such as Airbnb, Expedia.

Originally we were going to make selecting duration, and guests on two separate pages. Because we are trying to decrease the number of pages, we looked for a different solution.

Airbnb does a good job of locating a side nav where users are able to select date and view the estimated cost.

ecobin

To narrow down the scope we made the decision that the front page of this website will not be designed at the moment. This page will allow user to choose what type of pass they want in the first place (Pay as you go, monthly etc.)

ecobin

High Fi Mockups

What do we
recommend?

ecobin

1. Left Side Nav
Add left hand side nav that includes to separate actions to 'book now' or 'enquire'. Selecting date and end time to see the total cost live. It also cuts down on the flow.

2. Add tags
Add tags based on the enviornment and the type of users that normally work.

3. The rules
Have access right away to the rules & policies. This should also be sent to them in the flow and email as well.

*Below the fold design in progress

ecobin

5 Step Flow
Why 5? We generally enjoy odd numbers and that's why we split seating area from seat. However, it also means that it has it's own dedicate page and there's less need to scroll. In addition to seating would only show once the seating area is selected.

In this instance, the location requires online payment.

We ensured that we gave the user a moment to review everything before booking as well.

*Below the fold design, seat selection, payment and review is in progress

ecobin

1. Image of Room
Having image of the space would help better sell that seating area.

2. Tags to sell location
Including the type of enviornment, such as "quiet" or "collaborative"

3. Show more
This would display the unique amenities that specific room has.

ecobin

Allow users to select what they need before they arrive, and discover if this is an additional cost. This step is also made to be skippable.

Summary

How to condense a long flow?

- Contain information required such as duration, and guests at the start, and allow users to see what this may cost them.

- Only include what's relevant to their flow. Have they booked this place before? There should be an option to quickly book it again if they already have an account *this design is in progress

- Combine some elements as we did with duration and guest. Select Area and seat could have been combined as well if this flow was even longer.

- Ensure you give them a 'skip' button.

- Have 'view details' to hide long information

This project is in progress. We're looking forward to finishing the UI and conducting some user tests.

Need an experienced research-driven designer, to improve your software on your team?

I'm currently open for a full-time remote UX/UI or Product Design position.

Contact me at z.risi@yahoo.ca