WordPress.com

Build a site. Sell your stuff. Start a blog.

The WordPress.com dashboard

WordPress.com hosts millions of websites and is powered by, you guessed it, WordPress.

WordPress.com started as a blogging platform and grew into a flexible website-building machine. Nearly all of the work I did integrated with WordPress.com in some way. To start, I want to share my work on Calypso.

One of the wildest projects I worked on was to help completely rebuild the WordPress admin interface as a React application. This application is known as Calypso and uses the WordPress API to communicate with WordPress behind the scenes.

When the project first started, I worked on areas of the dashboard that are related to Jetpack. By the time I left Automattic, I ended up designing and implementing the Activity Log, Plugins, and People sections along with various Jetpack connection and management flows.

Activity Log

I worked with a team on the design and I oversaw the implementation of the Activity Log project. When we shifted Jetpack to be more security-focused, we made a gargantuan effort to build a rock-solid and intuitive backup interface. The interface was built into WordPress.com's dashboard so a user could restore their Jetpack site even if the site was down. It isn't unusual for a site to break because of a plugin or theme update and this interface gave the user an undo button for their entire site.

We designed the interface to resemble a ledger to simplify the concept of rewinding a site to a previous state. The ledger was also invaluable in helping both users and Happiness Engineers (support) identify changes on a site that either were unintentional or made by another user.

The Activity Logo showing a few event types

Plugins

I designed and oversaw the implementation of the Plugins views. This added the ability to manage and install plugins from within the WordPress.com dashboard. It also allowed folks to autoupdate plugins with ease.

The Plugins browser

People

I quickly designed and implemented an interface for managing users on a site. It combined the various tools and lists to manage site users, readers, and email followers. Before, this functionality was spread out in multiple interfaces and was frustrating to use. People also lets folks manage outstanding invites to the site if needed.

Note: We decided to call it "People" as it felt a little less dehumanizing than "Users."

The People view

Settings

I aligned both WordPress.com setting and Jetpack settings in an effort to organize and simplify Jetpack settings. At the time, Jetpack had over 40 modules and settings exposed for most of them. Now, the settings are consistent across dashboards and many of the unnecessary settings have been removed. I also took the time to improve several of the settings form components and design patterns.

WordPress.com settings

My first React Components

I designed and built the Card, Button, Spinner, and a slew of other components. Over time, our devs improving on my crude React components, but the core styling is still there. Building these components awakened my deep interest in systematic design.