Leveling up Office Hours with Airtable for Wayfair’s Design System, Homebase
A deep dive into the award winning Office Hours Command Center
Airtable enables data-driven decisions. At Wayfair, our award-winning interface supports office hours by streamlining our workflow and providing crucial feedback data.
Homebase is Wayfair’s design system and the name of the team that manages the design system. Our mission is to provide foundational guidelines and flexible, reusable components to enable Wayfair’s teams to ship the best possible end-user experiences, quickly. The keyword here is enable.
How do you enable {insert the size of your organization here} people to use a design system?
Investing in an engaged design system community within your organization is just as important as building a component library — if not more! What is the point in building an amazing design system if no one uses it?!
One way our team has invested in building an engaged community has been by creating a robust help system. Our help system which enables a two way dialogue with our end-users, Wayfairians, includes training & onboarding sessions, Slack support channels, and office hours.
Office hours have been a cornerstone of our help system since the inception of our design system team, circa 2018. Over the years, our team, design system, organization, and ways of working have matured a lot and our existing process was getting unwieldy. It was time to level up the way we engaged with our users, and we started with office hours sessions.
What are office hours?
Office hours are where people* can meet with cross-functional members of our team to suggest new components or variations, ask questions about the design system, or talk about their experience using the design system. It’s a place where we can seek feedback and engage in dialogue with our end-users.
Hosting weekly office hours sessions allows our team to:
- Build meaningful connections with experience designers, engineers, and product managers using the design system (or who are interested in adopting the design system!).
- Provide more in-depth support than what is achievable via Slack.
- Offer a safe, inclusive space to ask clarifying questions about the design system and receive constructive feedback on component implementation and accessibility.
- Proactively evolve the design system based on the input we receive directly from the people using our design system.
In this article, I’ll share how we streamlined our operations for office hours and (hopefully) share some insight that can help you level-up your design system support, no matter where you are in your design system journey.
*Author’s note: When referring to people throughout this article, I am talking about design system users — because design systems are for people!
A single source of truth for all office hours appointments
Our team has been using Airtable as a lightweight CRM (customer relationship management) tool for quite some time to aggregate office hours data. This allows us to access all appointment information from one place, such as attendees, topics discussed, resolution, action items, and more.
When people sign up for an office hours appointment, data from Calendly is automatically added to the Airtable base via Zapier. We lovingly refer to the Airtable base as our Office Hours Command Center.
There’s a lot of data packed into the Airtable base — which means it was also intimidating for team members to update and was incredibly difficult to navigate (i.e. lots of horizontal scrolling).
We needed a tool that would empower team members to facilitate effective office hours appointments rather than paralyze them.
Airtable Interface Designer
Enter: Interface Designer, a new Airtable feature launched in early 2022, that has supercharged how we facilitate office hours.
We built several custom visual and interactive interfaces for office hours using the data available in our base:
- Pre-Screen Office Hours Sign-Ups: This interface allows us to review the information provided at sign-up and send an email (directly from Airtable!) when more information is required to facilitate a productive session. We can also redirect people to other support channels that if Homebase cannot resolve the question.
- Upcoming Appointment Coverage: Our team is dedicated to having adequate cross-functional coverage for all appointments. This interface allows team members to sign up as a session lead, dedicated notetaker, or attendee. This interface ensures the necessary subject matter experts will be available to support and newer team members can observe and learn about the design system.
- Facilitate Homebase Office Hours: The real magic happens here. This interface allows the team to easily view all appointment info, take notes, and send follow-up emails from one place — without unnecessary horizontal scrolling!
- Office Hours Metrics Dashboard: A metrics dashboard to track and display key performance indicators (more on that below). We can tag appointments with metadata — such as topics and components discussed — to proactively monitor trends that may indicate where we can provide better education, documentation, and support materials for people using the design system.
Airtable automations
Previously, managing office hours was a manual process — but we’re all about working smarter, not harder. We set up Airtable automations to increase efficiency and to standardize the lifecycle of an office hours appointment.
Here are a few nifty automations that improved our workflow immensely:
- “New appointment” notifications: A Slack channel notifies the team each time someone signs up for office hours. Timely notifications allow us to proactively pre-screen appointments to ensure that all necessary information has been provided and the appointment is appropriate for Homebase office hours.
- Send emails from Airtable: Sending follow-up emails is not new for us. However, we automated the process through Airtable, so they look a lot nicer, and now there is a record of all emails sent!
- “Needs follow-up” alerts: Airtable searches for records that require a follow-up, and a Slack channel alerts the team when a follow-up email for an appointment needs to be sent. This automation gives us confidence that we have a 100% response rate for all appointments.
Airtable forms
We are also making use of Airtable forms. At the end of every appointment, attendees receive an automated email to complete an anonymous 2-question survey to rate the quality of support they received during office hours.
Feedback from the survey allows us to measure customer satisfaction (CSAT) and keeps all data for office hours in one place.
Measuring success
Data is a powerful storytelling tool. We want to be able to tell a story about the effectiveness of office hours and how we are supporting our community.
To make continuous improvements to office hours, we monitor the following KPIs:
- Customer Satisfaction (CSAT): The quality of support received during an office hours session. A score of ≥80% is a good indicator of success based on industry standards.
- Rate of Resolution: This metric is used to evaluate how frequently we resolve questions during an appointment and to determine the overall efficacy of Homebase office hours. The industry-standard benchmark for the rate of resolution is 65–75%. Appointments with no resolution may indicate areas of opportunity for us to request additional information or to redirect questions to more appropriate support channels.
- Internal Homebase Team Rating: This metric is a 5-point rating scale (1–5 stars) to measure the quality of support that we feel we were able to provide during an appointment alongside comments to support the rating.
The results so far (9 months later)
So is it working? Heck, yes! 🎉
We monitor feedback weekly and make adjustments as needed. Since implementing these changes, the resolution rate of appointments has risen from 25% to >59%, appointment ratings from Homebase team members have risen from 2.5/5 to >3, and our CSAT is 94%.
Tracking and evaluating design system office hours has allowed our team to measure success, identify areas for improvement, and hold ourselves accountable for supporting our design system community at Wayfair.
Wayfair Office Hours Command Center wins 2022 Airtable Interface Designer Contest 🏆
We submitted our Office Hours Command Center (which is now available in the Airtable Universe) into Airtable’s Interface Designer Contest and won first place in the best use case/solution category. Other categories included: best design, wildcard, and honorable mentions.
Congratulations to the Homebase Design System team!
I’d like to extend a special thanks to the following team members for their thoughtful analysis of our help system that created the pathways for us to optimize the Homebase Office Hours experience for everyone: Blair Wilcox, Dennae Makel, Jessie Rogers, Kelly Bondanza, Neva Corbo-Hudak, and Sara Heilbronner.
And my gratitude to Jensen Fitzgerald for submitting our Office Hours Command Center base into the Airtable Interface Designer Contest!
🙌 💜 🙌 💜 🙌 💜 🙌 💜 🙌
Karissa Woodward-Hobson is an Associate Director of Product Design at Wayfair. She leads experience design for Homebase, the design system team, which manages the Android, iOS, and web systems used to design and develop digital products at Wayfair.
About Wayfair’s Global Experience Design Community
Global Experience Design at Wayfair is a cross-disciplinary function including product design, user research, and content strategy. We create experiences for all of our end-users, including suppliers, customers, agents, field champions, and internal employees. The Wayfair experience supports our mission to be the destination for all things home, helping everyone, anywhere create their feeling of home. 🎉
