Room Booking Overview
At OfficeSpace Software, I led the design of a new feature called Room Booking Overview, which gave Facility Mangers an all-new way to track their room bookings, optimize space capacity, and even move meetings with one click to accommodate their needs—all in an intuitive calendar interface.
Without a one-stop calendar view that integrated data from OfficeSpace, Facility Managers had no way of identifying booking inefficiencies.
By including some key clients early on in the design process, we ensured that the final product was perfectly suited to the needs of the target user persona.
Starting with a Sketch
This feature, like so many great ideas, started on the back of the proverbial napkin. In a sidebar during a conference meeting, one of our PMs quickly sketched the idea and asked another: “What can we do with this?”
Not wanting to get ahead of ourselves, we decided to show the idea to key clients and potential users to define the scope and MVP functionality of the feature.
Vetting the Idea
To make sure we designed the right thing, we started by working directly with relevant clients who had submitted related feature requests. Through a series of one-on-one research calls, I interviewed these clients and showed them an alpha version of the feature. To keep the focus on the idea itself, what I showed was totally removed from the the context of the OfficeSpace’s look and feel.
This stage was crucial, as the feedback we gathered helped us triangulate 1) what unique value proposition we could offer, 2) what would be useful to our users, and 3) what existing solutions the feature would be competing with.
Key takeaways from preliminary research
- Our assumption that only FMs would need access to this feature was wrong; many suggested that a new user role might need to be created.
- Many found the color coding system we used to differentiate room capacity to be extremely intuitive—a good sign.
- Meeting privacy settings would need to be taken into consideration. Even seeing the title or the participants might be too sensitive.
Taking it to High Fidelity
Armed with knowledge and a better idea of the scope of the MVP, I now felt comfortable creating high-fidelity designs in our design system. This interface was unlike any other in our product and required introducing new patterns; I borrowed ideas from similar experiences in other products, wanting our users to feel a sense of familiarity.
Preparing for a Smooth Handoff
My core deliverable was a few dozen static screen mockups, but I know better than to think that will be enough for an efficient engineering handoff. My final Figma file also contained written documentation of our design decisions, links to videos I’d made for certain interactions, and specs for responsiveness, loading states, and screen transitions.
All that meant that the build process was done in less than a quarter, with a minimal amount of back-and-forth and QA tickets.
Results
“Ding ding ding!”The exact reaction of one of our clients upon seeing the alpha version of this feature for the first time.
We expected this feature to find a dedicated niche in our client base, and it did. Room Booking Overview was launched as an add-on purchase with an attach rate of 25%, exceeding our expectations and immediately driving revenue growth. Since launch, we’ve shipped additional follow-up improvements based on our initial user research, creating a small but ardent set of users whose return rate signals just how well we hit the mark.
