Leanna Leung

Croissant

Croissant

Designing a 'Book Ahead' Feature

Croissant - Cover Image.png

Project Overview

Croissant provides on-demand access to a variety of shared work spaces through a subscription-based model. Users are allotted a set amount of hours (to work at a space) a month.

The Goal

Design a "book ahead" feature that allows users to reserve seats at a workspace in advance. Croissant found that users wanted a sense of security when planning out their week and scheduling meetings.

 

My Role

I was on a team of 12 designers. I focused on:

  • Lo-fi prototyping & validation
  • Hi-fi validation

Platform

Mobile iOS
 

 

Timeline

6 Weeks
 

Leanna successfully led the way in prototyping a new feature for our members. Her designs, which were based off of numerous user interviews, were well thought out and took into account the many nuances of our business. Hope to work with her again in the future!
— Dave Idell, CEO & Co-Founder of Croissant

TL;DR

Croissant currently only offers on-demand access to co-working spaces. We designed a new "book ahead" feature that guarantees that people will always have a space to work. Our solution flows seamlessly with the current experience for existing users and is also intuitive for new users....and it's being shipped right now! Stay tuned for results :)


1. Research

First, we needed to validate and understand users' motivations and needs behind reserving a seat at a workspace. As a precursor, we outlined our assumptions and developed a hypothesis to facilitate our research.

Assumptions

  • Users want to reserve a seat in advance when availability is low
  • Users would bring more guests for meetings if they could reserve seats in advance
  • Users love Croissant, and do not want the existing functionality to change
 

Hypothesis

A feature that allows users to reserve seats ahead of time without compromising the current experience of Croissant will add value for existing customers, increase usage of guest hours, and grow the number of referrals. 

 
Competitive Analysis.png

Learning from Competitors

Next, to understand the nature of booking a workspace in advance, we looked at the user experiences of 3 of Croissant's competitors who allow booking ahead to see what we might learn from their strengths and weaknesses. To dig deeper, we also conducted a usability test on Breather, Croissant's most direct competitor. 

 

Learning from Croissant Users

After understanding a bit about Croissant's competitors, we now wanted to learn more about Croissant users. We talked to users in SF, at Croissant co-working spaces, and users in New York, remotely.

User Interviews

We conducted need-finding interviews with 5 existing users with the goal of understanding: 

  • Why users need co-working space
  • How users currently use Croissant and what could be improved
  • How users expect the new book ahead feature to work 

Usability Testing

We simultaneously conducted usability tests on the Croissant app with 5 existing users and 4 new users. We wanted to make sure our designs wouldn't disrupt the current experience, and sought to learn:

  • What worked well and should remain the same
  • What could be improved and changed

Usability Pain Points in Current Experience

Usability Pain Points in Current Experience

2. Synthesis

To make sense of our research and extract user needs, we grouped our observations into themes. 

Research Insights

We identified several pain points in the current discovery and check-in/out process that we kept in mind to solve while designing the book ahead feature. Namely, we identified opportunities to improve the current search functionality, space details, and UI icons.

When it came to a book ahead feature, users expected:

  • To be able to specify check-in and check-out time
  • The current "check-in now" feature to remain as is
  • To be able to see upcoming bookings
  • A lenient cancellation policy & check-in grace period
  • Limitations on the number of reservations you can make, to prevent abuse
 

Personas

Most of Croissant's users are based in New York, where co-working spaces fill up quickly and there is a need to book ahead. Given the distance between our team in SF and our core users in NY, we developed a persona that would help keep users in mind and inform our decisions throughout the process. 

 

Task Flows

We also mapped a task flow of a user's journey from needing a workspace to working at a workspace, to understand the scope of the need to book ahead and envision how such a feature would fit in with the current experience.

Yellow = opportunities to improve the current experience
Red = where we come in with reserving a seat :) 


3. Ideate

Diverge

We ran a 4-hour Design Studio based on Jeff Gothelf's Lean UX methodology to brainstorm and consider as many alternatives as possible. Given the size of our team (12), we split into 2 groups to go through 2 rounds of UI sketching, critiquing, and refining. We ultimately came up with 2 cohesive reservation designs and flows.   

Team 1 UI Sketches

Team 2 UI Sketches - My Team!

Converge

Next, using our 2 sets of UI sketches as inspiration, we made mid-fi prototypes to present to Croissant for feedback. After incorporating their feedback, we merged our 2 designs into a single mid-fidelity prototype to validate. 

Team 1 Prototype

 

Combined Prototype

 

Team 2 Prototype


4. Mid-Fi Prototyping & Validation

Prototyping & Validation

Our combined prototype featured: 

  • Two modes of booking:
    • Book Today/Now: default upon opening the app. Similar to current experience - sans "Hold a seat" button 
    • Book Ahead: Users can filter book ahead options in the top navigation bar
  • Ability to favorite spaces: also added a "Favorites" tab for quick access
  • Ability to edit and cancel reservations from reservation confirm page
  • "My Bookings" Tab: which replaced the "Seat" tab. Would display the active seat (if checked-in) and future reservations

We conducted usability tests with 4 of the 5 existing Croissant users we initially interviewed. We asked users to:

  1. Book 2 seats in advance: "Show me what you would do to make sure you and your colleague have a seat for Dec 22"
  2. Edit their booking: "Now imagine that you need to cancel your reservation. What would you do?"
  3. Find a workspace to work at right now: "Now, imagine that you need a space to work right now. Show me what you would do"

Validation Insights

Our usability tests revealed the following about our users:

  • Struggled to find and confirm filters. The filter in the top navigation bar wasn't obvious enough, and it isn't clear how to confirm the filter and proceed to the next step.
  • Struggled with locating the button to edit a reservation. The edit button was not in a position that's familiar to users.
  • Unsure of the cancellation policy. Users hesitated to confirm a booking.
  • Expect to be able to book ahead by selecting a space first. Users expected the feature to behave in a similar manner to how they currently check-in to a space on-demand.

5. Hi-Fi Prototyping & Validation

Iterating on our Prototype

To resolve the issues we found during mid-fi testing, we:

  • Added a filters icon to the top Nav bar and colored the "See Available" button to make the filter more noticeable
  • Added an "Edit" button: to reservation page instead of drop down
  • Added a note about the cancellation policy beneath the reservation confirmation button
  • Differentiated the filters according to the user's flow: 1) wanted to choose a space first or 2) wanted to specify a date and time first 

Validation Insights

To test if we resolved the pain points we found during our lo-fi usability tests, we conducted another round of testing with 3 existing Croissant users and 2 new users with the same tasks. We found that users: 

  • Didn't realize the "See 4 Workspaces" button would take them to the next step after selecting a date, time, seats, and amenities
  • Struggled to find the Edit reservation action in the navigation bar-- they expected it to be on-screen near the reservation details

After presenting our findings to Croissant, Croissant wanted our designs to align with their brand principles of flexibility and playfulness. So, we went back to our users and asked how they felt about having to specify a check-out time when making a reservation, and thought of alternative copy options to "Book Ahead". We found that users actually did not want to specify check-out time, and that "Save Seats" resonated with both users and the brand. 

We then made changes according to feedback from our users and Croissant. The changes from the current app, to our lo-fi prototype, and to our final hi-fi prototype, are annotated below: (click to enlarge)


Final Deliverable

Croissant challenged us to design a feature that would allow users to book space at a workspace in advance. We delivered a final hi-fi prototype that seamlessly flows with the current experience, and that users love! 

We'll be measuring the impact of our design once Croissant implements our feature in March. So stay tuned!