In browser editing CMS
Retrofitting enterprise software
The challenge of modernizing UI elements within existing functionality.
OpenText's WEM (Web Experience Manager) was an in-browser editing tool, designed to offer easy WYSIWYG editing options to Production Specialists, Editors, Contributors, and Translators. I worked with the lead designer and researchers on the OpenText team for about 9 months.
The 8.1 version, colloquially known as “The Floatie,” was the source of many complaints by users, and internal field and sales people alike. The most frequently voiced one was that it was somehow always in the way and require constant repositioning on the page. Additionally it was slow to load, and lacked extensibility.
The new design needed to rectify that, incorporating all existing functionality as well as new competitive features like drag and drop and responding to task flow in context.
Mapping interaction states
One of the most complicated aspects of this project were ironing out the details around drag and drop. There were a multitude of possible states: the validity of an object, the validity of said object being dropped into a valid field, the positioning of objects and whether they went above or below an existing object, and so forth.
For each of those state were micro interactions – the cursor would change when over a draggable object and the draggable object itself had different states depending on context. Using Bill Scott’s “interesting moments” grid as a guide, I created a storyboard grid that showed all the possible elements in all the possible states. This screen shows a part of that document
Using Axure, I built prototypes to support the user testing of the outlined use cases. Then OpenTexts’ UX research team ran a series of remote tests with current users. Using the results of the tests as our guide, UX Lead Robin Silberling and I would collaborate on new approaches, as well as how to integrate the new user stories for each round.
In all, I prototyped five rounds for testing.