Experience Content Management System

A custom content management system that helps iRobot create, manage, and publish consumer experiences on the web.

Project Overview

iRobot requested a custom content management system for their online experiences as a place to manage assets and visual presence. Some experiences managed through the CMS are online quizzes, comparison charts, interactive product demos, AR product demos, 360 degree rotational product demos, and in-store tablet apps. The site also holds information for product lines and live QR code links. Our task was to ensure these experiences are fully customizable by the iRobot team while collecting valuable consumer analytics.

The CMS helps keep content organized and accessible so it can be used and repurposed effectively. This is an ongoing project with their team as new customer experiences are launched.

GOALS

  • User friendly CMS that powers the customer facing experiences.

  • Manage content versions and publish status’.

  • Provide store and partner specific experiences.

CLIENT 
iRobot

ROLE 
Digital Designer (Interaction design, Visual design, Creative direction, Client presentations)

TOOLS 
Sketch, Zeplin

TEAM 
Project Manager, BE Developers, FE Developers

AGENCY 
Genome Digital

Structure

What we refer to as “experiences” are generated and customizable embeddable customer facing micro-sites and digital interactions. Each of them connect to other areas of the CMS where reusable content is added. Then, outputs of the experiences can be used to generate QR codes or run through a translation module.

CMS Field Mapping

The image below shows an example of how customizable each experience is through the CMS. Using the Comparison Chart design, I mapped out a few areas to their specific field components. For example, the header text can be changed along with certain styling like font and color. We determine with the client what is necessary for customization without disrupting the integrity of the design. Our client felt content with the placement and breakpoints in the text, so customization for size and alignment was not necessary. Sometimes, too much control over the design can lead to confusion or misjudgment on the client end as they are trying to quickly input content.

KEY FEATURES

Product Management

The product lineup for the iRobot brand is created and maintained in the products module. We developed this section to house all content related to products shown in all experiences.

Certain experiences have specific content shown in the customer facing sites, for example, the “‘Best for’ Section Icons” are only displayed on Comparison Charts and “Main Highlights” are only shown in Quizzes. But, some content is reused across multiple or all experiences! Each time a new experiences is launched, we analyze the functionality and match what field content we can reuse or create a new section for potential new fields.

KEY FEATURES

Multi-Language Support

As a global company, the business needed a way to translate all digital experiences. The translations module allows for the iRobot team to see all text entered into the CMS fields in a centralized table that includes all supported languages. If an English line has been entered and saved in an experience, the table will show a flag on that text until each translation has been entered.

We use an API to send any selected missing translations to be returned. The client can check the status of the process and access the returned translations. A manual process is also available in the UI where the client can type the translation directly into the table or import a CSV file.

Next Project

Next Project →