Writing guide & content library
The problems
I was hired on as BigCommerce’s first UX writer. There were no established guidelines for writing copy. This caused a few problems:
Too many copy request tickets in Jira for very basic and commonplace interactions
Copy was inconsistent across product domains
No content design guidelines or heuristics made it hard to sell stakeholders on content decisions
Compounding the issue, I found it difficult to stay consistent with myself. On Monday, I might write out a status message one way. On Friday, I would write something completely different. Neither were wrong. Both stayed true to the rules of the writing guide. Both were just inconsistent with each other.
Writing copy meant searching through old copy docs, the production site and Figma files to see if I had written a similar interaction before and how I had done it. Reviewing even the most basic designs was an onerous task.
The goals
I had 5 goals with this project:
Create a UX writing guide, offering advice on voice and tone and dos and don’ts
Create a design library for content, allowing the design team to copy and paste reusable copy strings into designs
Empower designers to write their own copy for everyday interactions
Reduce design debt that needs to be fixed later and save everyone time
Upscale everyone’s writing
A sample from the UX writing guide I created for BigCommerce.
Another sample from the BigCommerce UX writing guide I created.
Empathizing with users
After conducting a high-level audit of the site and in-progress designs, I created the UX writing guide in under 90 days. UX writing guides, however, are great for writers, not so great for designers. The page views for the writing guide bore this out. No one was looking at the guide I created, other than me. Instead, designers messaged me on Slack, tagged me in Figma or created copy tickets in Jira if they had a question.
User archetype
To help me find the right solution to this new problem, I approached it like I would any other design challenge. I started with a quick user archetype. In this case, the “users” were the product designers:
Informational needs
What word or phrase am I supposed to use?
How is this solution easier or faster than what we’re doing now?
Are design teams at other companies using this?
Jobs to be done
Write quality copy for BigCommerce’s most used interactions
Keep copy consistent throughout the BigCommerce platform
Empower designers to write their own copy
Psychological profile
Cognitive load: Must be easier to use than just asking the UX writer (aka me) to write it
Aesthetic-Usability Effect: An app made specifically for designers better be visually appealing
Ideation and development
Whatever the solution was going to be, it needed to do a few things right:
Turn theoretical advice into practical guidance
Meet designers in the space where they do most of their work (Figma)
Taxonomy - allow for the efficient classification and retrieval of content
After a bit of due diligence, I settled on an app called Ditto, a Figma plugin that would allow me to take our most frequently used words and phrases and turn them into reusable components — something product designers already do with visual components.
Take, as a very basic example, “OK,” “Ok” and “Okay.” Which do we use at BigCommerce? With Ditto, any time a designer needs to create an acknowledgment CTA, all they have to do is search Ditto for the right copy string and attach it to their designs. If we change our mind later, I can update the component and it will update all designs with the attached component.
BigCommerce’s component library in Ditto. I organized the components following the results from a card sorting exercise I conducted in OptimalSort with the rest of the product design team.
Terrible picture, I know, but here’ another look at the taxonomy I developed to give some structure to our content components.
Iteration
Using the UX writing guide as a jumping off point, I created a component library for words with over 100 individual copy strings organized in the way that made the most sense to me:
Verbs
Nouns
Adjectives
Error
Success
Confirmation
Early feedback from designers revealed:
Designers liked to navigate to components, as opposed to using the search function
They had trouble finding components
To make components easier for designers to find, I ran a card sorting exercise in OptimalSort with the design team, allowing them to group and name the component groups in whatever way made sense to them. After all, they were going to be the ones using Ditto most often.
The results of the card sort showed that designers preferred to group copy components the same way they grouped visual components. In the end, the taxonomy working behind the scenes used a combination of my original classification system and that suggested by the designers.
Modals
CTAs
Status > error/success/confirmation/etc.
Input
Product group > login/checkout/catalog/shipping/etc.
Parts of speech > noun/verb/adjective
Validation and results
With the tools and processes I put in place, BigCommerce automated about 80% of the more mundane design interactions. Instead of explaining the difference between “back” and “cancel” for the dozenth time, I had more time to focus on unique, complex interactions that couldn’t be solved with a simple, reusable component. With less scutwork to do, content-related Jira ticket turnaround time went from approximately 3 days to 2 days or less.
BigCommerce also accumulates less copy-related design debt every quarter, thanks to the consistency the design team is able to achieve through the UX writing guide and content library. Case in point, new copy-related design debt went down. BigCommerce creates roughly 7 to 12 new copy-related design debt tickets every quarter, while resolving between 50 and 100 tickets in that same time.
Read the UX writing guide I created for BigCommerce.
Future ideas and fun with AI
In November 2023, OpenAI announced custom versions of ChatGPT that could be trained for specific tasks — no coding required. I had worked on pre-trained LLMs on a different project, but that required significant engineering resources.
Now, on my own, I could create a custom GPT, trained on the content guidelines I created. Unfortunately, I never got a chance to work on this project before leaving BigCommerce.
A content design team could use a UX writing GPT to do things like…
Copy and paste human-created content into the GPT and ask it to determine if the content follows UX writing guidelines
Ask the GPT to create net new content in adherence with established UX writing guidelines
For our friends in product design, serve as a human proxy for simple questions when a UX writer isn’t available
To demonstrate the possibilities of this tool, I created a custom GPT called Robot Right (requires ChatGPT Plus).
A custom GPT, called Robot Right, I created to help product teams craft clear, concise and effective microcopy.