CMS

Evolving a no-code design platform for usability, smoother workflows, and external adoption

CMS ConceptCMS Hero

brief

Transforming an internal tool into a product ready for external adoption.

My Contribution

  • Designed four new UX streams to guide development
  • Provided high fidelity designs for tickets and contributed PRs
  • Used user feedback to steer feature prioritization in the roadmap

Outcome

Took a manual, time-intensive process taking ~20 hours down to ~2, along with new features for improved consistency, reliability, and collaboration.

Role
Design Lead

Functions
UI/UX, Product Management, Development

Duration
14 months

Challenge

As the company pivoted to a B2B model, we needed to evolve an internal tool into a platform usable by external organizations.

The tool's strength was its quality of output; its weakness was inefficiency.

Goal

Refine the tool's core workflow for creating interactive articles.

If initially we had a manual, time-intensive editor, we were trying to create a printing press.

Pitch

The selling point to publications was an improved article experience for readers with demonstrated longer engagement times — at the expense of a greater time investment for designing and publishing.

The redesign aimed to tilt this balance in favor of publishers.

Three main areas for improvement:

Initial Input

Though articles were constructed of a series of similar text objects, visuals, and pages, each item had to be individually input and configured from scratch.

Opportunity for automation here.

Positioning and Styling

UX inefficiencies slowed down navigating between objects in the editor and a lack of configurable "styles" slowed down designing.

As well a lack of positioning options meant some designs were impossible to render.

Iterating

Without native support, iterating was time-intensive and often led to users using other tools like Figma first.

Not needing a fully-flexible design tool, we had to create a custom concept for iterating.
Empty CMS Interface

New stories opened completely blank - pages and content blocks had to be added and configured one by one.


Even for practiced users, it took 30–45 minutes just to get content in place before any real layout or interaction design could begin.

User Interviews

Adding to the above UX review, interviews surfaced a critical additional persona the tool wasn’t designed for: editors.

Designers

The primary cohort of users were those designing the articles, ranging from social media producers to digitally-native journalists. Time-constrained, they prioritized efficiency and had a high bar for quickly producing designs adherent to style guides.

Most had experience creating visual assets, but less often responsive webpages.

Editors

Editors needed a dedicated writing experience to more quickly revise articles, without needing to navigate or interfere with designs and layouts.

They asked for a new interface for easily updating text and swapping assets.

Defining priorities for the redesign:

  1. Automate the initial input UX
  2. Design a scheme to help users intuit how objects would behave responsively across changing screen sizes
  3. Establish a component system for both speed and consistency
  4. Create a new UX dedicated to editors

Surveying other design tools and interviewing designers, producers, and editors across newsrooms, we began mapping an updated UX —

Clustered ideas to loosely organized site maps to detailed hierarchical feature lists and user flows.

Artifact 1 - Early workshop insights

— and produced the following north star for development:

CMS Layers Interface

The stage was updated to better support active design work.


Users could view and edit multiple pages at once, and adjust screen sizes directly within the editor to test responsive behavior in real time.

As the above design led development, my tasks progressively shifted to:

Managing a Roadmap

Reflexively steering development with feedback from users to prioritize tickets.

Providing Acute Designs

Breaking down features into individual tickets with production-ready designs for smooth engineering handoff.

Contributing PRs

Contributing to frontend polish, building small features, and enabling engineers to tackle bigger updates.

Along the way, we ran prototypes with publications including Stanford Medicine Magazine, The Conversation, BCG, and NPR. After implementing AI to aid in the upfront allocation of content across pages, we put together polished articles in as little as two hours, with initial layouts in minutes.