Design system component to increase efficiency by 90%

Bulk Action

The ability to perform bulk actions is highly valuable for improving efficiency, convenience, and overall user satisfaction. Admin experiences at Guild lack standardized, reusable bulk action functionality in the design system, leading to significant time spent on repetitive tasks by the operations teams.

Introduction

Guild’s admin teams were caught in a loop of repetitive, time-consuming data editing. It wasn’t just a small inconvenience—it was a daily grind. Meanwhile, the Design and Engineering teams were stretched thin, unable to address the issue with a cohesive, reusable solution. It was clear something had to change.

Every time admin users needed to perform bulk actions on data tables, they faced inconsistent processes. Imagine repeatedly selecting rows one by one. We knew there had to be a better way and that this could be a systems solution. Our mission was to create a reusable bulk action component that would ease implementation but also bring relief to those doing the heavy lifting.

The Team

This problem was tasked to the design system squad, which consisted of:

  • Product Manager

  • Front-end Engineers

  • Staff Product Designer

  • Product Designer (me)

Key Problem and Impact

  • Inefficient Row Selection: Picture Maddy, an internal admin user, starting her day by manually selecting data rows, one at a time. Every. Single. Day. What could have been a few clicks turned into hours of tedious work. It wasn’t just an inefficiency—it was a real barrier to getting meaningful tasks done. Over time, these minor tasks added up, draining valuable hours from her day.

  • Lack of Standardization: Guild’s product ecosystem was using different, custom-built bulk action functionalities. This lack of consistency meant Maddy and her colleagues had to relearn processes for each task, adding to their workload. This inconsistency also meant that engineers and designers had to reinvent the wheel whenever the product wanted to include bulk action functionality as a solution.

Discovery

Audit

Reviewed existing instances of bulk action in our product.

Research

Analyzed best practices and how other design systems handle this component.

Usability

Conducted user testing to analyze the usability of the component.

Key Discovery Takeaways

  • Future Opportunities: Although bulk action was only used in two places within our product, the potential for its application was obvious.

  • User Understanding: Users intuitively grasped the connection between the data table content and the actions in the bulk action bar. This told us we were on the right track—users didn’t need to be retrained, they needed tools that aligned with their workflows.

  • Material UI Advantage: Our data table component was built on Material UI which already included a bulk action feature. This realization allowed us to focus on refining rather than reinventing, saving time and resources.

Usability Testing

We ran usability tests to validate our assumptions. Could users instinctively navigate the new bulk action feature, drawing from their experience with similar tools? Would they easily see the connection between the table content and the action bar? It was time to find out.

  • Unmoderated click test via Userzoom

    The test included 50 participants

    98% of participants are over the age of 30

    Industry was evenly between administrations, customer service, finance, and operations

  • Understand if users can see the connection between the selected rows in the data table and the action bar

    Understand if users require any additional context

Insights from Testing

  • Selecting Rows: Users instinctively knew how to check and uncheck all rows. It was like muscle memory.

  • Taking Action: Though the success rate for taking action was 60%, we realized that distractions caused by table content wouldn’t affect real-world use.

  • Need for More Context: We discovered users struggled to estimate the total number of rows in the data table which pointed to a need for contextual cues.

The Final Component

The bulk action panel was born out of these insights—an optional function within the data table component which could be turned on/off by engineering during implementation. It wasn’t just a new feature; it was a tool designed to empower users like Maddy, Engineers, and Designers.

Implementation

The journey didn’t end with the design. To ensure a seamless transition to the design system engineering team, we:

  • Shared the Design: We collaborated closely with design system engineers, gathering feedback and ensuring the feasibility of our design.

  • Created Comprehensive Documentation: Every detail, every interaction was documented, ensuring the component could be easily understood and implemented.

Impact

The introduction of bulk action functionality reduced the time to update datasets from 10 minutes to just 1-2 minutes, improving efficiency by up to 90%. This improvement streamlined workflows for all teams using the Recess table component, freeing up time previously spent on repetitive tasks and allowing for greater focus on more strategic work.

This work is property of Guild submitted with approval by Guild as an example of work I contributed to while employed by Guild.