DocumentCloud Add-Ons

Improving discoverability of a top-line feature

DocumentCloud provides powerful functionality in the form of Add-Ons, which leverage GitHub Actions to execute complex logic on collections of documents. This allows for AI tools like GPT-driven analysis and OCR; watch tools like scrapers and change monitoring; and bulk editing tools.

In their initial version, add-ons were only accessible via a dropdown menu. Users reported difficultly in browsing add-ons, accessing frequently-used add-ons, and viewing the logs describing add-on runs. I attempted to address all these features through a redesign of the browser interface. On MuckRock’s part, they wanted to see increased utilization of an important feature and a decrease in support requests related to basic add-on functionality.

Before, add-ons were only visible to users after opening a dropdown menu.

Understanding the goals both MuckRock and their users had for this feature, I began to explore potential UI solutions through Figma illustrations. I incorporated multiple rounds of feedback into the design until landing on an approach that the team agreed was ripe for development.

This design process led to the discovery of some core UX patterns:

  • I discovered “Pin” as a primary action for users to manage their shortlist of favorite add-ons. Pins provide a low-commitment way to keep add-ons present and visible.
  • We decided to add top-level links for browsing add-ons and viewing the add-on log history to the application sidebar to aid discoverability. Pinned add-ons were a natural addition to the sidebar, as well.
  • I also landed on a drawer overlay to contain the add-on interfaces. This treatment allowed the document list to be usable in the background, so that documents could be selected while an add-on form was open. It also adapted well to a narrower mobile viewport, and helped illustrate how add-ons are a functional layer on top of documents.

Based on the Figma illustrations, I used a component-driven process to develop Svelte components with Storybook. I introduced Storybook into the codebase, documenting some existing components as I worked. As I developed the components in isolation, another team member, Chris Amico, integrated the components into the application. We launched the feature after a few months.

After launch, DocumentCloud saw its best month of add-on utilization ever in August. September saw the second-highest utilization. Users report satisfaction with the feature, and this provides a new foundation for the feature’s future growth.