Swarm CMS

CMS Interface Design for Hive Media Group

After years of getting by with third party content management systems for its slideshow articles, Hive Media Group needed something more suited to its writer’s and media buyer’s needs. They decided to build the tool in-house and I lead the UX/UI charge. Starting with post-it note storyboards and wireframes I worked with the content and media teams to develop intuitive workflows.

After several days of user testing we had worked out a viable paper prototype. I took what we had learned, brought it into Adobe XD and began building out a digital prototype. Hundreds of mockups later I had a working prototype to further test with the team. After a few rounds of revisions the prototype was dev-ready.

Soon after Swarm CMS launched the content and media teams saw significant increases in productivity for writers, editors, and ad buyers alike.

As new features were requested and scope of the CMS grew, I realized a more robust design language was necessary to maintain a consistent look and feel. I worked with the dev team and updated the design to be based on Google’s Material Design language. I continued to work with the content, media, and dev teams to design and build new features, maintaining both the look and feel as well as the seamless workflow and productivity.

Research Phase

Artboards of Version 1.0

Featured Image Preview

This feature allows writers and editors to preview their how their article and featured image will appear to users across all devices. Swipe to see workflow.

Readable Integration

Readable is a third-party platform that tests and scores readability of a selection of text. The content team requested integration into Swarm so they could quickly check and revise articles, ensuring content is appropriate for a given audience.

Taxonomies Revision

My initial solution for taxonomies did not satisfy the editors. Based on dropdowns, it was difficult to select and edit multiple taxonomies quickly. This revised interface allowed for taxonomies to be modified and expanded quickly and on the fly.

Getty Image Integration

Getty Images is the main image resource for the content team. Prior to integration the team would need to browse Getty in a separate window, download images locally, then upload them into Swarm. This important feature eliminated those extra steps allowing writers and editors to browse, search, edit, and insert images all within Swarm.

Style Guide

Quick reference for developers.