Eliminating knowledge gaps with clear UI microcopy
Adobe
Problem
Adobe Contribute was an in-browser WYSIWYG web page editing app that integrated with Adobe Dreamweaver.
Contribute enabled non-specialists to edit web pages directly, without having to know HTML or web design concepts.
The challenge was creating UI microcopy that made the options clear and their effects comprehensible to a non-specialist.
Solution
Create UI microcopy for Contribute that bridges the knowledge gap between experts and non-specialists, enabling users to get the results they expected while minimizing the need for them to understand jargon.
Not only could Contribute let you edit web pages in the browser of your choice, it could display multiple browsers simultaneously. This made it easier to navigate the sloppiness associated with WYSIWYG HTML editors.
My role:
As a contract UX writer working directly with the development team, I contributed a variety of string types, including:
Labels
Tooltips
Headings and subheadings
Placeholders
Progress indicators
Success messages
Error messages
Confirmation messages
Empty states
Our microcopy made it seem as though the user was working in familiar environments such as Adobe Photoshop or InDesign while they were editing in a browser window.
Process
With product managers, marketing managers, and product specialists, I iterated and tested microcopy, adhering to Adobe’s content guide and following guidelines for accessibility.
Tooltips and dialog messages were essential elements for lowering user anxiety and increasing confidence.
Results
Sadly, Contribute was discontinued soon after the release I worked on. There was too much competition from website building systems such as WordPress and Joomla, which had developed their own WYSIWYG editors. The best result was that I got to work with one of the most professional content design and UX writing teams around.
