If you’re the first UX writer or joining a team that has a style guide that needs some love, I’m going to tell you exactly how to build a style guide from the ground up.
There are 7 steps to create a style guide:
- Analyze your current style (even if it’s inconsistent)
- Pick a style guide as a foundation
- Create an outline
- Define your style rules
- Get alignment
- Share the style guide with everyone
- Keep building
1. Analyze your current style
The first step is to take a good look at any conventions your product already follows.
Remember when we took a million screenshots to audit the product’s current voice? Well, whip those out again, because they’re gonna be invaluable when understanding your product’s currency style conventions.
For example, here’s what I had created for Greg:
By taking a closer look, I can see that:
- Headlines and subheadlines are always in sentence case
- Buttons are usually in title case
- Greg uses the serial comma
Go through your audit, and write down a list of trends you see.
This will be a good starting off place to understand if your current style is something you want to keep and get a sense for how much you’ll have to change.
This will be the foundation for the rest of your style guide, so be as thorough as possible.
2. Pick a style guide as a foundation
The cool thing about style guides is there are already institutional ones that exist. And you can start with them as a framework for yours.
When you start with an existing style guide, most of the work is already done. Two common style guides to lean on as a foundation are:
- AP Style
- Chicago Manual of Style
Personally, companies I’ve worked with have always followed AP Style guidelines, but the choice is yours. Use their rules as your starting point, and make edits where it makes sense.
3. Create an outline
An outline will save your life here. You don’t want to be making up rules on the fly — that’s a recipe for unorganized stress.
Here’s a rough outline to follow:
- Abbreviations
- Acronyms
- Capitalization
- Contractions
- Emojis
- Numbers:
- Dates
- Decimals and fractions
- Percentages
- Ranges and spans
- Money
- Phone numbers
- Temperature
- Time
- Punctuation
- Apostrophes
- Colons
- Commas
- Dashes and hyphens
- Ellipses
- Periods
- Question marks
- Exclamation marks
- Quotation marks
- Semicolons
- Ampersands
- People, places, and things
- File extensions
- Pronouns
- Names and titles
- Schools
- States, cities, and countries
- URLs and websites
- Writing about your company
- Writing about other companies
- Slang and jargon
- Text formatting
- Mobile elements:
- Buttons
- Checkboxes
- Drop-down menus
- Forms
- Headings and subheadings
- Links
- Lists
- Navigation
- Radio buttons
Of course, edit this to your needs, but it should be most of the basics you need to define.
4. Define your style rules
Equipped with your outline, it’s time to define your style rules. Here, you want to blend what you found in your audit, what your foundational style guide recommends, and what you think will be best for the product.
There’s no “wrong” answer here — you just have to start making rules.
5. Get alignment
Since soooo many people will use the style guidelines, it’s important everyone is aligned with the calls you made.
The first step is to designate a list of “approvers” and “reviewers.” “Approvers” are decision-makers, like the VP of Product and the CMO. “Reviewers” are key stakeholders who you want to be in the loop, like Senior Product Managers, Product Marketing Managers, and engineers. Keep the list as limited as possible.
Style guides contain a lot of content, so I recommend allowing people to review and approve asynchronously. Google Docs makes it easy for people to leave comments and ask questions. I also recommend putting a section at the top of your Google Doc like this:
Ask your reviewers and approvers to sign and date next to their name once they’ve read and signed off on the guidelines. This gives you a written record and makes approvals easy.
6. Share the style guide with everyone
You finished the style guide 🎉🪩🕺 Now it’s time to make sure everyone had access and knows how to use this masterpiece you masterminded.
The best way to do that is to go on a roadshow. A roadshow is a fun way to say you host a meeting for various teams where you introduce and explain how to use the style guide. Teams you’d meet with would be:
- Marketing
- All of product design
- Product management
- Engineering
- Legal
- UX research
Come prepared with easy-to-use handouts and a link you can point people to where the style guide lives. If you put the style guide on a web page, that makes it easily accessible by everyone — much easier to find than a Google Doc.
7. Keep building
A style guide is never “finished.” It will constantly evolve as the company and product evolve. I recommend scheduling quarterly check-ins to review the style guide and make sure it still makes sense.
Happy UX writing đź––
