Team: David Bowman, Emily Maurer, Yoli Hodde
Role: information archite
cture, UX, visual design
In 2020, there was a strategic push at WordPress VIP to give customers more tools to problem solve when using the product. Refreshing the product documentation was a key step towards reaching this goal.
As a design team, we focused on a few key areas—overhauling the information architecture, implementing a more robust search experience, and creating custom Gutenberg blocks for our article templates. We also reoriented the visual design to better harmonize with the VIP product interface. Frequent communication with internal stakeholders, a focus on cross-team collaboration, and aggressively pursuing deadlines allowed us to complete the project quickly and build the internal trust required for such a radical rethink of the experience.

An extensive content audit was necessary to enable us to restructure the existing documentation.

Although some of the issues with the docs were obvious, we surveyed the team to identify internal pain points and conducted a competitive audit to see how similar companies structured their documentation. Ultimately we we decided to adopt the model articulated by Daniele Procida in his talk, What Nobody Tells You About Documentation.
Articles were divided into four content types—tutorials, how-to-guides, reference, and background—and written with specific users and use-cases in mind. Restructuring the docs in this way required an extensive content audit. Many existing articles were divided into smaller, more manageable chunks. Some had to be rewritten from scratch.
Component system developed for the new documentation site.
Custom note blocks are color-coded to denote different types of information: general info, warnings, pro-tips, and WordPress-specific information.

The sidebar navigation was designed to hold two levels of hierarchy. Any additional levels of hierarchy needed for a particular topic are contained within the articles themselves.

More Projects

back to top