Making it easier to archive and program Viacom content across the globe
I was the sole UX Designer for the replatforming and redesign of ARC, the proprietary content management and distribution tool used by all of the Viacom networks to archive, schedule and deliver their digital content to the consumer.
Comedy Central's The Daily Show With Trevor Noah
Viacom Networks includes multiple brands: Comedy Central, MTV, VH1, Spike, BET, CMT, Nickelodeon, and more
The combined brands have nearly 100 million unique users per month consuming their digital content
Viacom digital has offices across North America, South America, Europe, Asia, and Australia
Viacom's CMS handles over 200 different content types, such as shows, video clips, full episodes, and more
Millions of pieces of unique content to catalog, program, and distribute
The networks combined handle 90 million queries a day
At the time we started this project, all of the Viacom networks, including MTV, Comedy Central and Nickelodeon, were using an outdated, flex-based CMS (with the unfortunate name of "ISiS") to archive and distribute their digital content to their nearly 100 million unique visitors per month. The UI was confusing, unwieldy, inefficient, and difficult to learn. It lacked standard error and validation messaging, so content that had been scheduled to appear on consumer-facing websites or apps, would often just show up as blank. Training new hires to use the interface took months, with learning often occurring through sheer trial and error.
Before: A basic content record from ISiS (the original Viacom CMS)
• Clunky, disorganized and confusing
• No clear hierarchy of content
• One very long form with all fields displayed
• Non intuitive workflows
• Big learning curve
• Difficult to train new hires
• No clear error messaging
Simplify the workflow around archiving & scheduling digital content
Reduce instances of content erroneously scheduled or missing from Viacom’s consumer-facing sites
Reduce time troubleshooting and fixing missing content
Reduce time training
I worked within an international, experienced Agile team that comprised:
System Owner (tech lead)
Front-end Developers (4)
The end users of ARC were the 300+ editorial and production staff from all the Viacom brands across the globe.
They fell into 3 main categories:
Coordinates with show producers to determine editorial priorities
Decides which content will be shown on the show website and partner sites/platforms
Determines the rollout schedule for all content on website, app, and partner sites/platforms
Creates web-only content, such as thematic vide playlists, to be used as sponsorship opportunities
Digital Production Assistant
Submits show content to video department for video ingestion
Uploads and archives all digital content
Creates associations between all related content
Schedules content rollout for website and app
Schedules content distribution for all partner platforms (Yahoo, Hulu, etc).
Digital Production, New Hire
Trains to do all tasks that Digital Production Artist does (sometimes for months)
The first thing we needed to do, was to gain an in-depth understanding of how the users were working in their current CMS, and conversely, how the CMS was working for them. In order to do this, we began by employing a variety of qualitative and quantitative research methods.
We conducted over 25 contextual inquiries of Viacom site producers and production staff, spanning all of the networks, domestically and internationally. These were a hybrid of user interviews and observation.
Some of the questions asked:
"What is the first thing you do when you log on to the system every day?"
"What are the 3 tasks that you perform the most often?"
"Where do you encounter friction in the workflow of your top tasks?"
"What are some frequent sources of frustration when executing a top task?"
"How could the workflow for any of your top tasks be more efficient?"
"Are there any workflows or segments of a particular workflow, that work well for you?"
The rate of erroneously scheduled video playlists was almost 20%
We worked with the data integration team to gather
the following metrics:
- System: we looked at system downtime, and response time
- Quality: we looked at the frequency of data quality tickets opened
We also gathered data from the front-end team:
- Error rates for programming video clips and playlists
- Time taken to complete the most common workflows
When the research and discovery phase was complete, we defined and prioritized the design goals that would guide our process:
- Reduce page clutter
- Breakout similar content into groupings
- Implement clear visual hierarchy
- Implement clear typographic hierarchy
- Simplify language, eliminate terms that are only known to a few
- Increase feedback during task
"Protect the user!"
- Ideation session revelation
Because this application had so many complex features and workflows, I facilitated frequent ideation and feedback sessions with the Product Owner, and other key stakeholders.
Dry-erase board during one of many lively ideation sessions
Content Record Form Template
The so-called "meat and potatoes" of Arc were the content record pages that served as the basic building blocks for all content in the system. The challenge was to create a single content record template that would work for the 200+ different types of content in Arc.
Each open record would appear as a tab on the top, so the user could easily toggle between them as they were working.
Instead of showing all of the hundreds of form fields on one long page, and without any clear organization, I divided them into five distinct categories (Info, Assets, Distribution, Related Items, Backlinks) that the user could toggle between.
I pulled the core actions out of the form, and grouped them together in a persistent right rail menu. Icons were used to make critical actions more easily identifiable.
The global functions and robust search functionality were move to the left panel, which could expand so that the user could have access to it at the same time as they had a specific content record open.
• Streamlined layout with clear hierarchy
• Clear delineation between global and local menus
• Spacious, not cluttered
• Like-content is grouped and separated out into distinct sections/tabs
• Preview functionality has been added to reduce error
• Only displays fields relevant to task being performed
• Icons and other graphic prompts are used to highlight actions
The new ARC CMS was a vast improvement over the old system!
Trevor Noah is excited about ARC
90% reduction in missing or erroneously scheduled content
Decreased time spent completing common tasks
Decreased time spent training new hires
Decreased time spent troubleshooting errors or missing content
Decreased frustration levels
Increased buy-in from international teams
Easier to share content with international teams
Built in HTML5 and Angular, making it easier to scale