Deployer is a code management platform to help engineers modify their content on ArcXP's CMS.

ArcXP(Arc), a division of the Washington Post, is a cloud-based SaaS platform with a large suite of application for end-to-end CMS experience, including content creation, page building, and media management.

Both internal and external engineers use Deployer to modify their content for PageBuilder Editor, which is a critical content management system product for ArcXp.

1. Solve usability problems

Due to the lack of designers, lots of UX debt in the backlog are not solved. As a product designer, I proposed to the product manager and led an end-to-end redesign.

2. Align with Arc Design System

Deployer is an old product and did not update the UI for a long time. The initiative of this project is to align Deployer with the current design system.

Survey and interview

To understand current user needs, I conducted a survey on Maze and received feedback from 8 power users. Then I also conducted followup interviews to understand more details.

Who are the target users？

Target users for Deployer are engineers who have to deal with multiple tasks. Therefore, the efficiency is critical for them.

Expedite user flow

We activate slack notification when event finished to allow users saving time during the multi-tasking work environment,  So users can easily switch between tasks. And combined the steps to simplify the user flow.

Ideate card layout

Error log button is the most important feature for engineers because one of their major task is to trouble shoot for the clients. I did the redesign using components from Arc Design System to ensure the consistency.

Prototype and validate

With the new design and user flow, I created high-fidelity prototype with Figma and conducted internal user testings for feedback.

1. Activate slack notification

The slack notification will appear after each deployer event is finished and shows the status. Users are able to return to Deployer by clicking the notification.

2. Combine steps

Users are allowed to choose combine "deploy and promote" according to the need.

3. Error logs redesign

The new error logs shows next to the deploy status. When users hover on the info icon, it shows the tooltip and users can click to open the error logs.

1. Always take initiative

At first, it is only a UI redesign. But I take initiative to research current UX problem and negotiate with the product manager to make it a complete end-to-end redesign.

2. Use design system

I learned how to read design system documents and use components in Figma. I am also planning to contribute to the design system components in the future.

3. Work with product manager, engineers, and other designers

I learned how to work together with different people. I learned product perspectives from working with the product manager. I taught engineers how to use Figma and read my design. I also practiced pitching my design decisions to other senior designers.