Chaucer Interactives Case Study

A new strategy for designing and producing interactives


Roles: UX Design | User Interface Design | Visual Design

Intro to Chaucer Interactives
Chaucer is a digital-first authoring and production tool for content creators. A big part of Chaucer's attraction to our stakeholders is it's ever-expanding suite of widgets which are Javascript-based interactive elements that can be added to any product. These include anything from simple slideshows to complex learning and assessment tools.


1. Inconsistent User Authoring Experience
These interactives require an authoring environment. Because the initial batch of these widgets were built at break-neck speed, they were built without a consistent UI or UX.

2. Not meeting users needs
Many of these were built without a clear understanding of the goals of the user or the context.

3. Not Agile/Dev friendly
Because these widgets were not built with a universal spec in mind, it caused extra work and unnecessary iteration for the developers.

4. Lack of mobile strategy
Concern of the ability to make these widgets usable in a mobile environment and without time/impetus for a mobile strategy, a poor 'scaling' solution was enacted.



1. Create a consistent User Authoring Experience
Through analyzing the necessary interactions, I was able to greatly limit the number of affordances needed. This also extended to a harmonous and consistent visual design as well.

2. Meeting users needs
To ensure we were building a product that would meet our user's needs, initiated 1) kick-off meetings to discuss goals/expectations, 2) consistent client engagement via walkthroughs during the wireframe review stage and 3) implemented a testing ground that afforded the client's the ability to test the widgets and provide pre-release feedback for early iteration.

3. Agile/Dev friendly
By limiting the amount of affordances and creating a living design language, it was easy for the developers to understand and reuse code which also resulted in a more bug-free product.

4. A mobile strategy
Took the effort to validate an effective responsive mobile design strategy by creating Proof of Concepts of our more content-heavy widget types.