Joshua Wold

In 2016 our team at XWP was able to work with the Beachbody on Demand folks to create a new editorial workflow for the content creation staff. You can read the case study to learn about the work that was done.

During this process I was covering the role of Product Owner for our team, as well as contributing UI/UX support to the editorial workflow. 

Since the content staff needed the ability to upload content regularly, and had a specific flow to how content would be added, we used the Customizer in WordPress to make previewing and saving drafts easier as part of this process. 

Following are a few interfaces to highlight the work I contributed to throughout the project. 

Editorial calendar

Along with the regular programming that gets created for new shows, the team also needed the ability to share training sessions on a per day basis, using a calendar within WordPress. I worked with our team to create concepts and interface ideas that would allow for creating the editorial flow.

Localization

We discussed ways to allow for quick translation and localization of the work that happened. In this case the team needed to be able to translate strings of text and have them show in French and English. Following is a clickable prototype showing a proposal for adding strings in multiple languages.

 

You can check out the original Trac issue.

This was such an eye opening feature for me. Several of my team members were discussing the the need to save drafts in the Customizer. I got pulled in and was able to lend UI/UX support to the project.

Over the course of about six months we worked on the issue. I learned a lot about the needs of an open source project, and the importance of understanding the priorities you’re working with. It’s a lot different than simply having a single stakeholder that you’re trying to design for. 

Following are some of my sketches (just a few, there’s more!) showing the process we went through to try and create an elegant solution. 

The project started for me when my teammate reached out with a sketch, proposing some initial ideas for where we could take the flow for saving and publishing. We hopped on a call together and talked through this flow. From there I created a sketch to followup and simplify my understanding of the interface.

This served as the launching point for several further iterations and discussions. The benefit of creating a simple sketch like this, as opposed to a finish prototype, is we could think through problems and have discussions before introducing a ton of extra time into finessing the interface.

From there I kept playing with ideas, based on feedback from the team, with attempts to simplify things and make sure that the flow made sense for a user trying to manage the status of a post.

The process got messy, as the above diagram shows. We played with a lot of ideas, and ended up scrapping most of them.

I began to create some flow diagrams to show how each part of the interface would connect with other parts. 

Finally I shared an Adobe XD prototype (diagram above) with the whole interface worked out. We thought we were in a good place with this.

Until we received some feedback on needing to simplify things again. So, I went back to the drawing board. It’s critical to recognize in any project the need for returning to lower fidelity when confusion arises, or rapid changes are needed. 

After this point I needed to return to client projects, so several of the Core team were able to improve the work here and push the project across the finish line. You can see the final work in the Customizer today within WordPress. 

I spoke about this at WordCamp Seattle 2018, but I wanted to dive into a short post to talk about some of the contributions I’ve been able to make.

Since 2016 I’ve been involved in one way or another, helping out in a number of issues related to the WordPress admin experience.

Here’s the thing, you don’t need to be a developer to make a huge impact on this project. As a designer I’ve been able to help out on a number of issues and make a small impact on the project by being willing to jump in where needed. A few ways I’ve been able to help:

• Save and publish in WordPress – Working with the Core team on proposing a way to save your work in the Customizer. 
• Gutenberg – Starting in 2017 I was able to jump into some issues in Gutenberg and start giving UX feedback and support. I wrote about my initial experience. 
• Lead support – I’m currently a Design Team Rep and recently Co-led the WordPress 4.9.8 release
• Speaking – I’ve been privileged to speak at a number of WordCamps

There are so many ways to help out. These are just a few. The sky is the limit.