UX Writing
Write clear, concise, user-centered interface copy (UX text/microcopy) for digital products and experiences. This skill provides frameworks, patterns, and best practices for creating text that helps users accomplish their goals.
When to Use This Skill
Use this skill when:
- Writing interface copy (buttons, labels, titles, messages, forms)
- Editing existing UX text for clarity and effectiveness
- Creating error messages, notifications, or success messages
- Designing conversational flows or onboarding experiences
- Establishing voice and tone for a product
- Auditing product content for consistency and usability
Core UX Writing Principles
The Four Quality Standards
Every piece of UX text should be:
- Purposeful — Helps users or the business achieve goals
- Concise — Uses the fewest words possible without losing meaning
- Conversational — Sounds natural and human, not robotic
- Clear — Unambiguous, accurate, and easy to understand
Key Best Practices
Conciseness
- Use 40-60 characters per line maximum
- Every word must have a job
- Break dense text into scannable chunks
- Front-load important information
- Eliminate deadwood phrases ("in order to" → "to", "due to the fact that" → "because", "at this point in time" → "now")
- Replace phrasal verbs with direct verbs ("find out" → "discover", "set up" → "configure", "carry out" → "perform")
- Avoid stacking modifiers — one adjective is usually enough
Clarity
- Use plain language (7th grade reading level for general, 10th for professional)
- Avoid jargon, idioms, and technical terms
- Use consistent terminology throughout
- Choose meaningful, specific verbs
- Avoid discriminatory or exclusionary language (gendered defaults, ableist idioms, culturally specific metaphors)
Conversational Tone
- Write how you speak
- Use active voice 85% of the time
- Include prepositions and articles
- Avoid robotic phrasing
User-Centered
- Focus on user benefits, not features
- Anticipate and answer user questions
- Use second-person ("you") language
- Match user's language and mental models
UX Text Patterns
Apply these common patterns for interface elements.
Titles
- Purpose: Orient users to where they are
- Format: Noun phrases. Page titles, modal/dialog titles, and menu/navigation items use title case (see Capitalization below for title-case mechanics). Lower-level headings (H3+), figure captions, callouts, and table titles use sentence case.
- Types: Brand titles, content titles, category titles, task titles
- Examples:
- Page title (title case): "Account Settings", "Your Library", "Run Payroll"
- Lower-level heading (sentence case): "Recent activity", "Bank account details", "Tax withholdings"
Buttons and Links
- Purpose: Enable users to take action
- Format: Active imperative verbs, sentence case
- Pattern:
[Verb] [object]
- Examples: "Save changes", "Delete account", "View details"
- Avoid: Generic labels like "OK", "Submit", "Click here"
Error Messages
- Purpose: Explain problem and provide solution
- Format: Empathetic, clear, actionable
- Pattern:
[What failed]. [Why/context]. [What to do].
Error Message Types
Validation Errors (Inline)
- Show as user completes field or on blur
- Brief, specific guidance to correct input
- Pattern:
[Field] [specific requirement]
- Examples:
- "Email must include @"
- "Password must be at least 8 characters"
- "Choose a date in the future"
- Timing: Real-time or on field exit
- Location: Below or beside the field
System Errors (Modal/Banner)
- Show when backend operations fail
- Explain what happened and why
- Pattern:
[Action failed]. [Likely cause]. [Recovery step].
- Examples:
- "Payment failed. Your card was declined. Try a different payment method."
- "Couldn't save changes. Connection lost. Reconnect and try again."
- "Upload failed. File is too large. Choose a file under 10MB."
- Timing: Immediately after failure
- Location: Modal dialog or prominent banner
Blocking Errors (Full-screen)
- Prevent continued use until resolved
- Clear explanation of blocker and resolution
- Pattern:
[What's blocked]. [Why]. [Specific action needed].
- Examples:
- "Update required. This version is no longer supported. Update now to continue."
- "Subscription expired. Your account is paused. Renew subscription to restore access."
- "Verification needed. Confirm your email to access features. Check your inbox."
- Timing: On app launch or feature access
- Location: Full screen or large modal
Permission Errors
- Explain benefit before requesting permission
- Pattern:
[User benefit]. [Permission needed].
- Examples:
- "Get notified when orders ship. Enable notifications."
- "Find nearby stores. Allow location access."
- "Back up your photos. Grant storage permission."
- Timing: When feature is first used
- Location: In context of the feature
What to Avoid
- Technical codes without explanation ("Error 403")
- Blame language ("invalid input", "illegal character")
- Robotic tone ("An error has occurred")
- Dead ends (error with no recovery path)
- Vague causes ("Something went wrong")
Success Messages
- Purpose: Confirm action completion
- Format: Past tense, specific, encouraging
- Pattern:
[Action] [result/benefit]
- Examples: "Changes saved", "Email sent", "Profile updated"
Empty States
- Purpose: Guide users when content is absent
- Types: First-use, user-cleared, error/no results
- Format: Explanation + CTA to populate
- Example: "No messages yet. Start a conversation to connect with your team."
Form Fields
- Labels: Clear noun phrases describing input ("Email address", "Phone number")
- Instructions: Verb-first, explain why information is needed
- Placeholder: Use sparingly, only for standard inputs like "name@example.com"
- Helper text: Static, on-demand, or automatic based on importance
Notifications
- Purpose: Deliver timely, valuable information
- Types: Action-required (intrusive), Passive (less intrusive)
- Format: Verb-first title + contextual description
- Example: "Update required. Install the latest version to continue."
Formatting & Style Conventions
Capitalization
- Sentence case (default): Body text, descriptions, helper text, error messages, success messages, tooltips, placeholder text, button labels, lower-level (H3+) headings, figure captions, callouts, table titles
- Title case: Page titles, modal/dialog titles, menu and navigation items, form field labels
- All-caps: Reserved for short overline / eyebrow labels (≤3 words) that sit above a heading or metric — e.g., stat-card section headers like
EMPLOYEES, TOTAL PAY, LAST UPDATED, category tags over KPI values — and for acronyms (PDF, URL, API, EIN, SSN). Trimble's own product surfaces use this treatment for short category overlines; it's an intentional typographic signal, not shouting. Do not use all-caps for prose, button labels, error messages, page titles, tabs/menu labels, or any string longer than ~3 words — beyond that length readability drops sharply and it reads as shouting.
Title case mechanics (applies wherever title case is used):
- Capitalize the first and last word of the title regardless of part of speech.
- Capitalize all adjectives, adverbs, and nouns.
- Capitalize all pronouns (including "it").
- Capitalize all verbs, including the verb "to be" in all forms (is, are, was, has been, etc.).
- Capitalize "no", "not", and the interjection "O".
- Do not capitalize articles ("a", "an", "the") unless first or last in the title.
- Do not capitalize coordinating conjunctions ("and", "or", "nor", "but", "for", "yet", "so") unless first or last in the title.
- Do not capitalize "to" (with or without an infinitive) unless first or last in the title.
- Do not capitalize prepositions (e.g., "in", "on", "at", "by", "of", "with") unless first or last in the title.
Examples:
- "Run Payroll for the Pay Period"
- "Add a New Employee"
- "How to File Quarterly Taxes"
Lista interpretations of edge cases:
- "Coming soon" is the canonical future-feature label everywhere it appears (badges, callouts, copy). Even when used in a title-cased context, write it sentence case per the
lista-ui-conventions rule. Do not expose milestone granularity ("Coming at Beta", "Coming at GA") in user-facing strings.
- Dropdown action items (imperative-verb items inside a button-triggered menu, e.g.
"Add employee", "See payroll runs", "Export report") are treated as buttons → sentence case, not as static navigation menu items. Prism's "menu items use title case" rule applies to navigational menus (side nav, breadcrumbs, top-level nav links pointing to pages), not action menus.
- Buttons that reference a named page (e.g.
"Go to Setup Wizard", "Back to Payroll Hub", "Open Time Review") preserve the page name's title case while the surrounding button copy stays sentence case. The page name is a proper noun in this context.
Numbers and Dates
- Use numerals, not words ("12" not "twelve") — saves space and scans faster.
- Spell out the month in dates: "August 5, 2025" or "5 August 2025" — never "8/5/2025" or "8.5.2025" (ambiguous across locales).
- Spell out day of the week and month; abbreviate only when space is constrained (e.g., tables, mobile): "Sat., Jan. 24".
- Avoid ordinal suffixes in dates: write "August 5", not "August 5th"; write "May 1", not "May 1st".
- Year ranges use a hyphen with the full year on both sides: "2015-2016", not "2015-16" and not "2015 to 2016".
Tense
- Prefer past tense over present perfect for status messages: "File uploaded" not "File has been uploaded"
- Present perfect adds words without adding meaning in most UI contexts
Abbreviations
- Only use abbreviations your users will immediately understand (common: PDF, URL, ID)
- Spell out on first use if there's any doubt, then abbreviate after: "application programming interface (API)"
- Latin abbreviations (e.g., i.e., etc.) — use proper punctuation: period after each letter, comma before and after in a sentence
- When in doubt, spell it out
Voice and Tone
Voice (Consistent Brand Personality)
Voice is the consistent personality of the product. Establish voice using:
- Concepts: 3-5 key brand principles/values
- Voice characteristics: Descriptive adjectives for each concept
- Do/Don't examples: Concrete examples showing voice in action
See references/voice-chart-template.md for creating a voice chart.
Tone (Adaptive to Context)
Tone is how voice adapts to specific situations. While voice remains constant, tone shifts based on user context and emotional state.
Tone Variables
- Purpose: Why user is seeing this text (information, action, confirmation)
- Context: What user is trying to do (learning, completing task, recovering from error)
- Emotional state: How user likely feels (frustrated, excited, confused, cautious)
- Stakes: Impact of the action (low: changing theme, high: deleting account)
Tone Adaptation by User Emotional State
Frustrated (errors, failures, blockers)
- Empathetic and solution-focused
- Acknowledge the problem without blame
- Provide clear recovery path
- Example: "Payment failed. Your card was declined. Try a different payment method."
Confused (first use, complex features)
- Patient and explanatory
- Break down steps clearly
- Provide context and guidance
- Example: "Connect your bank to see spending insights. We'll guide you through it."
Confident (routine tasks, return visits)
- Efficient and direct
- Minimal explanation
- Quick confirmation
- Example: "Saved"
Cautious (high-stakes actions, data loss)
- Serious and transparent
- Clear consequences
- Respectful of user's decision
- Example: "Delete account? You'll lose all data and this can't be undone."
Successful (completions, achievements)
- Positive and encouraging
- Proportional to achievement
- Brief celebration
- Example: "Profile updated. Your changes are live."
Tone Adaptation by Content Type
Error messages: Empathetic, reassuring, solution-focused
- Never blame user
- Explain what happened
- Provide clear next step
Success messages: Positive, specific, encouraging
- Confirm what happened
- Proportional to action importance
- Brief and clear
Instructions: Clear, direct, helpful
- Front-load key action
- Explain why when needed
- Use simple steps
Onboarding: Inviting, encouraging, concise
- Welcome without overwhelming
- Focus on value
- Celebrate early wins
Confirmations: Serious, transparent, respectful
- Clear about consequences
- No manipulation
- Easy to back out
Empty states: Hopeful, actionable, guiding
- Explain why it's empty
- Provide clear next action
- Keep encouraging tone
Editing Process
Edit UX text in four phases:
Phase 1: Purposeful
- Does text help user achieve their goal?
- Does text serve business objectives?
- Is value to user clear?
- Are concerns anticipated and addressed?
Phase 2: Concise
- Remove unnecessary words
- Combine redundant information
- Ensure every word earns its space
- Front-load important concepts
Phase 3: Conversational
- Read aloud—would you say this?
- Use active voice (unless passive is clearer)
- Include natural connecting words
- Avoid corporate jargon
Phase 4: Clear
- Use specific, accurate verbs
- Maintain consistent terminology
- Test readability (Hemingway Editor, Flesch-Kincaid)
- Ensure unambiguous meaning
Workflow
Understand context
- User goals and needs
- Business objectives
- Technical constraints
- Emotional state of user
Draft content
- Start with conversation (what would you say?)
- Apply appropriate pattern
- Consider voice and tone
- Front-load important information
Edit iteratively
- Phase 1: Purposeful
- Phase 2: Concise
- Phase 3: Conversational
- Phase 4: Clear
Test and measure
- Review with team
- Test with users when possible
- Measure task completion, comprehension
- Iterate based on feedback
Accessibility in UX Writing
Writing accessible content ensures all users, including those using assistive technology, can understand and interact with your product.
Core Accessibility Principles
Screen Reader Optimization
- Label all interactive elements explicitly ("Submit form" not just "Submit")
- Write descriptive link text ("Read pricing details" not "Click here")
- Structure error messages to work with screen readers (error + field label read together)
- Use ARIA labels when visual context isn't sufficient
Cognitive Accessibility
- Target 8-14 words per sentence (8 words = 100% comprehension, 14 words = 90%)
- Break complex information into scannable chunks
- Use clear headings and logical hierarchy
- Provide consistent, predictable patterns
Multi-Modal Communication
- Don't rely on color alone to convey meaning
- Pair visual indicators with text ("Error: Email required" with red icon)
- Provide text alternatives for icons and images
- Ensure sufficient color contrast (WCAG AA minimum: 4.5:1)
Plain Language for All
- Target 7th-8th grade reading level for general audience
- Define technical terms when first used
- Avoid idioms, metaphors, and cultural references
- Use common, everyday words
Accessible Pattern Examples
Buttons
- ❌ Poor: "Submit" (context missing for screen readers)
- ✅ Good: "Submit application"
Links
- ❌ Poor: "Click here for more information"
- ✅ Good: "Read our privacy policy"
Error Messages
- ❌ Poor: Red text showing "Invalid"
- ✅ Good: "Error: Email must include @" (with error icon)
Form Labels
- ❌ Poor: Placeholder-only fields
- ✅ Good: Visible label + optional placeholder
UX Text Benchmarks
Use these research-backed metrics to create effective UX text.
Sentence Length Targets
By Content Type
- Buttons/CTAs: 2-4 words ideal, 6 word maximum
- Titles: 3-6 words, 40 characters maximum
- Error messages: 12-18 words (including solution)
- Instructions: 20 words maximum, 14 ideal
- Body copy: 15-20 words per sentence average
- Notifications: 10-15 words for title + body
Comprehension Rates
- 8 words or fewer: 100% user comprehension
- 14 words or fewer: 90% user comprehension
- 25 words: Maximum before significant comprehension drop
Character and Line Length
Optimal Ranges
- Line length: 40-60 characters for maximum readability
- Button labels: 15-25 characters
- Page titles: 30-50 characters
- Notification titles: 35-45 characters
Reading Level Guidelines
By Audience
- General public: 7th-8th grade (Flesch-Kincaid)
- Professional tools: 9th-10th grade
- Technical products: 10th-11th grade
- Specialized fields: 11th-12th grade (only when necessary)
Testing Tools
- Hemingway Editor: Highlights complex sentences
- Readable.com: Provides multiple readability scores
- Microsoft Word: Built-in Flesch-Kincaid scoring
Common Mistakes to Avoid
- Using passive voice excessively
- Generic button labels ("Submit", "OK")
- Blaming users in error messages
- Overly clever humor in serious contexts
- Inconsistent terminology
- Hidden instructions or explanations
- System-oriented language vs. user language
- Too many words (not concise enough)
- Robotic, corporate tone
- Relying on color alone for meaning
- Writing inaccessible link text ("Click here")
Quick Reference
Sentence case: "Save your changes" (not "Save Your Changes")
Active imperative for buttons: "Delete account" (not "Account deletion")
User-focused: "Save time with shortcuts" (not "We offer shortcuts")
Specific verbs: "Delete" (not "Remove" when permanently deleting)
Front-loaded: "Password must be 8 characters" (not "Must be 8 characters for your password")
Style references
External references this skill is grounded in (consult these for any case the skill doesn't cover):
- Modus Style Guide — Trimble's design-system writing rules (the canonical source for Modus-branded products).
- The Chicago Manual of Style — fallback for grammar, punctuation, and citation questions.
- The Merriam-Webster Dictionary — fallback for spelling and word choice.
Lista Payroll inherits Prism's writing conventions, which are themselves aligned with Modus. When this skill conflicts with lista-ui-conventions (e.g. "Coming soon" copy), the Lista rule wins.
Resources
This skill includes:
- references/accessibility-guidelines.md: Comprehensive guide to writing accessible UX text for all users
- references/voice-chart-template.md: Template for creating a product voice chart
- references/content-usability-checklist.md: Comprehensive checklist for evaluating UX text quality
- references/patterns-detailed.md: Extended examples of UX text patterns in different voices
- examples/real-world-improvements.md: Before/after transformations with detailed analysis and scoring
- templates/error-message-template.md: Fillable template for writing effective error messages
- templates/empty-state-template.md: Guide for creating helpful empty states
- templates/onboarding-flow-template.md: Framework for designing clear onboarding experiences
1---2name: ux-writing3description: Create user-centered, accessible interface copy (microcopy) for digital products including buttons, labels, error messages, notifications, forms, onboarding, empty states, success messages, and help text. Use when writing or editing any text that appears in apps, websites, or software interfaces, designing conversational flows, establishing voice and tone guidelines, auditing product content for consistency and usability, reviewing UI strings, or improving existing interface copy. Applies UX writing best practices based on four quality standards — purposeful, concise, conversational, and clear. Includes accessibility guidelines, research-backed benchmarks (sentence length, comprehension rates, reading levels), expanded error patterns, tone adaptation frameworks, and comprehensive reference materials.4---56# UX Writing78Write clear, concise, user-centered interface copy (UX text/microcopy) for digital products and experiences. This skill provides frameworks, patterns, and best practices for creating text that helps users accomplish their goals.910## When to Use This Skill1112Use this skill when:13- Writing interface copy (buttons, labels, titles, messages, forms)14- Editing existing UX text for clarity and effectiveness15- Creating error messages, notifications, or success messages16- Designing conversational flows or onboarding experiences17- Establishing voice and tone for a product18- Auditing product content for consistency and usability1920## Core UX Writing Principles2122### The Four Quality Standards2324Every piece of UX text should be:25261. **Purposeful** — Helps users or the business achieve goals272. **Concise** — Uses the fewest words possible without losing meaning283. **Conversational** — Sounds natural and human, not robotic294. **Clear** — Unambiguous, accurate, and easy to understand3031### Key Best Practices3233**Conciseness**34- Use 40-60 characters per line maximum35- Every word must have a job36- Break dense text into scannable chunks37- Front-load important information38- Eliminate deadwood phrases ("in order to" → "to", "due to the fact that" → "because", "at this point in time" → "now")39- Replace phrasal verbs with direct verbs ("find out" → "discover", "set up" → "configure", "carry out" → "perform")40- Avoid stacking modifiers — one adjective is usually enough4142**Clarity**43- Use plain language (7th grade reading level for general, 10th for professional)44- Avoid jargon, idioms, and technical terms45- Use consistent terminology throughout46- Choose meaningful, specific verbs47- Avoid discriminatory or exclusionary language (gendered defaults, ableist idioms, culturally specific metaphors)4849**Conversational Tone**50- Write how you speak51- Use active voice 85% of the time52- Include prepositions and articles53- Avoid robotic phrasing5455**User-Centered**56- Focus on user benefits, not features57- Anticipate and answer user questions58- Use second-person ("you") language59- Match user's language and mental models6061## UX Text Patterns6263Apply these common patterns for interface elements.6465### Titles66- **Purpose**: Orient users to where they are67- **Format**: Noun phrases. **Page titles, modal/dialog titles, and menu/navigation items use title case** (see Capitalization below for title-case mechanics). **Lower-level headings (H3+), figure captions, callouts, and table titles use sentence case.**68- **Types**: Brand titles, content titles, category titles, task titles69- **Examples**:70 - Page title (title case): "Account Settings", "Your Library", "Run Payroll"71 - Lower-level heading (sentence case): "Recent activity", "Bank account details", "Tax withholdings"7273### Buttons and Links74- **Purpose**: Enable users to take action75- **Format**: Active imperative verbs, sentence case76- **Pattern**: `[Verb] [object]` 77- **Examples**: "Save changes", "Delete account", "View details"78- **Avoid**: Generic labels like "OK", "Submit", "Click here"7980### Error Messages81- **Purpose**: Explain problem and provide solution82- **Format**: Empathetic, clear, actionable83- **Pattern**: `[What failed]. [Why/context]. [What to do].`8485**Error Message Types**8687**Validation Errors (Inline)**88- Show as user completes field or on blur89- Brief, specific guidance to correct input90- Pattern: `[Field] [specific requirement]`91- Examples:92 - "Email must include @"93 - "Password must be at least 8 characters"94 - "Choose a date in the future"95- Timing: Real-time or on field exit96- Location: Below or beside the field9798**System Errors (Modal/Banner)**99- Show when backend operations fail100- Explain what happened and why101- Pattern: `[Action failed]. [Likely cause]. [Recovery step].`102- Examples:103 - "Payment failed. Your card was declined. Try a different payment method."104 - "Couldn't save changes. Connection lost. Reconnect and try again."105 - "Upload failed. File is too large. Choose a file under 10MB."106- Timing: Immediately after failure107- Location: Modal dialog or prominent banner108109**Blocking Errors (Full-screen)**110- Prevent continued use until resolved111- Clear explanation of blocker and resolution112- Pattern: `[What's blocked]. [Why]. [Specific action needed].`113- Examples:114 - "Update required. This version is no longer supported. Update now to continue."115 - "Subscription expired. Your account is paused. Renew subscription to restore access."116 - "Verification needed. Confirm your email to access features. Check your inbox."117- Timing: On app launch or feature access118- Location: Full screen or large modal119120**Permission Errors**121- Explain benefit before requesting permission122- Pattern: `[User benefit]. [Permission needed].`123- Examples:124 - "Get notified when orders ship. Enable notifications."125 - "Find nearby stores. Allow location access."126 - "Back up your photos. Grant storage permission."127- Timing: When feature is first used128- Location: In context of the feature129130**What to Avoid**131- Technical codes without explanation ("Error 403")132- Blame language ("invalid input", "illegal character")133- Robotic tone ("An error has occurred")134- Dead ends (error with no recovery path)135- Vague causes ("Something went wrong")136137### Success Messages138- **Purpose**: Confirm action completion139- **Format**: Past tense, specific, encouraging140- **Pattern**: `[Action] [result/benefit]`141- **Examples**: "Changes saved", "Email sent", "Profile updated"142143### Empty States144- **Purpose**: Guide users when content is absent145- **Types**: First-use, user-cleared, error/no results146- **Format**: Explanation + CTA to populate147- **Example**: "No messages yet. Start a conversation to connect with your team."148149### Form Fields150- **Labels**: Clear noun phrases describing input ("Email address", "Phone number")151- **Instructions**: Verb-first, explain why information is needed152- **Placeholder**: Use sparingly, only for standard inputs like "name@example.com"153- **Helper text**: Static, on-demand, or automatic based on importance154155### Notifications156- **Purpose**: Deliver timely, valuable information157- **Types**: Action-required (intrusive), Passive (less intrusive)158- **Format**: Verb-first title + contextual description159- **Example**: "Update required. Install the latest version to continue."160161## Formatting & Style Conventions162163### Capitalization164165- **Sentence case** (default): Body text, descriptions, helper text, error messages, success messages, tooltips, placeholder text, **button labels**, lower-level (H3+) headings, figure captions, callouts, table titles166- **Title case**: Page titles, modal/dialog titles, menu and navigation items, form field labels167- **All-caps**: Reserved for **short overline / eyebrow labels** (≤3 words) that sit above a heading or metric — e.g., stat-card section headers like `EMPLOYEES`, `TOTAL PAY`, `LAST UPDATED`, category tags over KPI values — and for **acronyms** (`PDF`, `URL`, `API`, `EIN`, `SSN`). Trimble's own product surfaces use this treatment for short category overlines; it's an intentional typographic signal, not shouting. **Do not** use all-caps for prose, button labels, error messages, page titles, tabs/menu labels, or any string longer than ~3 words — beyond that length readability drops sharply and it reads as shouting.168169**Title case mechanics** (applies wherever title case is used):170171- Capitalize the first and last word of the title regardless of part of speech.172- Capitalize all adjectives, adverbs, and nouns.173- Capitalize all pronouns (including "it").174- Capitalize all verbs, including the verb "to be" in all forms (is, are, was, has been, etc.).175- Capitalize "no", "not", and the interjection "O".176- Do **not** capitalize articles ("a", "an", "the") unless first or last in the title.177- Do **not** capitalize coordinating conjunctions ("and", "or", "nor", "but", "for", "yet", "so") unless first or last in the title.178- Do **not** capitalize "to" (with or without an infinitive) unless first or last in the title.179- Do **not** capitalize prepositions (e.g., "in", "on", "at", "by", "of", "with") unless first or last in the title.180181Examples:182- "Run Payroll for the Pay Period"183- "Add a New Employee"184- "How to File Quarterly Taxes"185186**Lista interpretations of edge cases:**187188- **"Coming soon"** is the canonical future-feature label everywhere it appears (badges, callouts, copy). Even when used in a title-cased context, write it sentence case per the `lista-ui-conventions` rule. Do not expose milestone granularity ("Coming at Beta", "Coming at GA") in user-facing strings.189- **Dropdown action items** (imperative-verb items inside a button-triggered menu, e.g. `"Add employee"`, `"See payroll runs"`, `"Export report"`) are treated as **buttons → sentence case**, not as static navigation menu items. Prism's "menu items use title case" rule applies to **navigational** menus (side nav, breadcrumbs, top-level nav links pointing to pages), not action menus.190- **Buttons that reference a named page** (e.g. `"Go to Setup Wizard"`, `"Back to Payroll Hub"`, `"Open Time Review"`) **preserve the page name's title case** while the surrounding button copy stays sentence case. The page name is a proper noun in this context.191192### Numbers and Dates193194- Use numerals, not words ("12" not "twelve") — saves space and scans faster.195- Spell out the month in dates: "August 5, 2025" or "5 August 2025" — never "8/5/2025" or "8.5.2025" (ambiguous across locales).196- Spell out day of the week and month; abbreviate only when space is constrained (e.g., tables, mobile): "Sat., Jan. 24".197- **Avoid ordinal suffixes** in dates: write "August 5", not "August 5th"; write "May 1", not "May 1st".198- **Year ranges** use a hyphen with the full year on both sides: "2015-2016", not "2015-16" and not "2015 to 2016".199200### Tense201202- Prefer past tense over present perfect for status messages: "File uploaded" not "File has been uploaded"203- Present perfect adds words without adding meaning in most UI contexts204205### Abbreviations206207- Only use abbreviations your users will immediately understand (common: PDF, URL, ID)208- Spell out on first use if there's any doubt, then abbreviate after: "application programming interface (API)"209- Latin abbreviations (e.g., i.e., etc.) — use proper punctuation: period after each letter, comma before and after in a sentence210- When in doubt, spell it out211212## Voice and Tone213214### Voice (Consistent Brand Personality)215Voice is the consistent personality of the product. Establish voice using:216- **Concepts**: 3-5 key brand principles/values217- **Voice characteristics**: Descriptive adjectives for each concept218- **Do/Don't examples**: Concrete examples showing voice in action219220See references/voice-chart-template.md for creating a voice chart.221222### Tone (Adaptive to Context)223Tone is how voice adapts to specific situations. While voice remains constant, tone shifts based on user context and emotional state.224225**Tone Variables**226- **Purpose**: Why user is seeing this text (information, action, confirmation)227- **Context**: What user is trying to do (learning, completing task, recovering from error)228- **Emotional state**: How user likely feels (frustrated, excited, confused, cautious)229- **Stakes**: Impact of the action (low: changing theme, high: deleting account)230231**Tone Adaptation by User Emotional State**232233**Frustrated** (errors, failures, blockers)234- Empathetic and solution-focused235- Acknowledge the problem without blame236- Provide clear recovery path237- Example: "Payment failed. Your card was declined. Try a different payment method."238239**Confused** (first use, complex features)240- Patient and explanatory241- Break down steps clearly242- Provide context and guidance243- Example: "Connect your bank to see spending insights. We'll guide you through it."244245**Confident** (routine tasks, return visits)246- Efficient and direct247- Minimal explanation248- Quick confirmation249- Example: "Saved"250251**Cautious** (high-stakes actions, data loss)252- Serious and transparent253- Clear consequences254- Respectful of user's decision255- Example: "Delete account? You'll lose all data and this can't be undone."256257**Successful** (completions, achievements)258- Positive and encouraging259- Proportional to achievement260- Brief celebration261- Example: "Profile updated. Your changes are live."262263**Tone Adaptation by Content Type**264265**Error messages**: Empathetic, reassuring, solution-focused266- Never blame user267- Explain what happened268- Provide clear next step269270**Success messages**: Positive, specific, encouraging271- Confirm what happened272- Proportional to action importance273- Brief and clear274275**Instructions**: Clear, direct, helpful276- Front-load key action277- Explain why when needed278- Use simple steps279280**Onboarding**: Inviting, encouraging, concise281- Welcome without overwhelming282- Focus on value283- Celebrate early wins284285**Confirmations**: Serious, transparent, respectful286- Clear about consequences287- No manipulation288- Easy to back out289290**Empty states**: Hopeful, actionable, guiding291- Explain why it's empty292- Provide clear next action293- Keep encouraging tone294295## Editing Process296297Edit UX text in four phases:298299### Phase 1: Purposeful300- Does text help user achieve their goal?301- Does text serve business objectives?302- Is value to user clear?303- Are concerns anticipated and addressed?304305### Phase 2: Concise306- Remove unnecessary words307- Combine redundant information308- Ensure every word earns its space309- Front-load important concepts310311### Phase 3: Conversational312- Read aloud—would you say this?313- Use active voice (unless passive is clearer)314- Include natural connecting words315- Avoid corporate jargon316317### Phase 4: Clear318- Use specific, accurate verbs319- Maintain consistent terminology320- Test readability (Hemingway Editor, Flesch-Kincaid)321- Ensure unambiguous meaning322323## Workflow3243251. **Understand context**326 - User goals and needs327 - Business objectives328 - Technical constraints329 - Emotional state of user3303312. **Draft content**332 - Start with conversation (what would you say?)333 - Apply appropriate pattern334 - Consider voice and tone335 - Front-load important information3363373. **Edit iteratively**338 - Phase 1: Purposeful339 - Phase 2: Concise340 - Phase 3: Conversational341 - Phase 4: Clear3423434. **Test and measure**344 - Review with team345 - Test with users when possible346 - Measure task completion, comprehension347 - Iterate based on feedback348349## Accessibility in UX Writing350351Writing accessible content ensures all users, including those using assistive technology, can understand and interact with your product.352353### Core Accessibility Principles354355**Screen Reader Optimization**356- Label all interactive elements explicitly ("Submit form" not just "Submit")357- Write descriptive link text ("Read pricing details" not "Click here")358- Structure error messages to work with screen readers (error + field label read together)359- Use ARIA labels when visual context isn't sufficient360361**Cognitive Accessibility**362- Target 8-14 words per sentence (8 words = 100% comprehension, 14 words = 90%)363- Break complex information into scannable chunks364- Use clear headings and logical hierarchy365- Provide consistent, predictable patterns366367**Multi-Modal Communication**368- Don't rely on color alone to convey meaning369- Pair visual indicators with text ("Error: Email required" with red icon)370- Provide text alternatives for icons and images371- Ensure sufficient color contrast (WCAG AA minimum: 4.5:1)372373**Plain Language for All**374- Target 7th-8th grade reading level for general audience375- Define technical terms when first used376- Avoid idioms, metaphors, and cultural references377- Use common, everyday words378379### Accessible Pattern Examples380381**Buttons**382- ❌ Poor: "Submit" (context missing for screen readers)383- ✅ Good: "Submit application"384385**Links**386- ❌ Poor: "Click here for more information"387- ✅ Good: "Read our privacy policy"388389**Error Messages**390- ❌ Poor: Red text showing "Invalid"391- ✅ Good: "Error: Email must include @" (with error icon)392393**Form Labels**394- ❌ Poor: Placeholder-only fields395- ✅ Good: Visible label + optional placeholder396397## UX Text Benchmarks398399Use these research-backed metrics to create effective UX text.400401### Sentence Length Targets402403**By Content Type**404- **Buttons/CTAs**: 2-4 words ideal, 6 word maximum405- **Titles**: 3-6 words, 40 characters maximum406- **Error messages**: 12-18 words (including solution)407- **Instructions**: 20 words maximum, 14 ideal408- **Body copy**: 15-20 words per sentence average409- **Notifications**: 10-15 words for title + body410411**Comprehension Rates**412- 8 words or fewer: 100% user comprehension413- 14 words or fewer: 90% user comprehension414- 25 words: Maximum before significant comprehension drop415416### Character and Line Length417418**Optimal Ranges**419- **Line length**: 40-60 characters for maximum readability420- **Button labels**: 15-25 characters421- **Page titles**: 30-50 characters422- **Notification titles**: 35-45 characters423424### Reading Level Guidelines425426**By Audience**427- **General public**: 7th-8th grade (Flesch-Kincaid)428- **Professional tools**: 9th-10th grade429- **Technical products**: 10th-11th grade430- **Specialized fields**: 11th-12th grade (only when necessary)431432**Testing Tools**433- Hemingway Editor: Highlights complex sentences434- Readable.com: Provides multiple readability scores435- Microsoft Word: Built-in Flesch-Kincaid scoring436437## Common Mistakes to Avoid438439- Using passive voice excessively440- Generic button labels ("Submit", "OK")441- Blaming users in error messages442- Overly clever humor in serious contexts443- Inconsistent terminology444- Hidden instructions or explanations445- System-oriented language vs. user language446- Too many words (not concise enough)447- Robotic, corporate tone448- Relying on color alone for meaning449- Writing inaccessible link text ("Click here")450451## Quick Reference452453**Sentence case**: "Save your changes" (not "Save Your Changes") 454**Active imperative for buttons**: "Delete account" (not "Account deletion") 455**User-focused**: "Save time with shortcuts" (not "We offer shortcuts") 456**Specific verbs**: "Delete" (not "Remove" when permanently deleting) 457**Front-loaded**: "Password must be 8 characters" (not "Must be 8 characters for your password")458459## Style references460461External references this skill is grounded in (consult these for any case the skill doesn't cover):462463- **Modus Style Guide** — Trimble's design-system writing rules (the canonical source for Modus-branded products).464- **The Chicago Manual of Style** — fallback for grammar, punctuation, and citation questions.465- **The Merriam-Webster Dictionary** — fallback for spelling and word choice.466467Lista Payroll inherits Prism's writing conventions, which are themselves aligned with Modus. When this skill conflicts with `lista-ui-conventions` (e.g. "Coming soon" copy), the Lista rule wins.468469## Resources470471This skill includes:472- **references/accessibility-guidelines.md**: Comprehensive guide to writing accessible UX text for all users473- **references/voice-chart-template.md**: Template for creating a product voice chart474- **references/content-usability-checklist.md**: Comprehensive checklist for evaluating UX text quality475- **references/patterns-detailed.md**: Extended examples of UX text patterns in different voices476- **examples/real-world-improvements.md**: Before/after transformations with detailed analysis and scoring477- **templates/error-message-template.md**: Fillable template for writing effective error messages478- **templates/empty-state-template.md**: Guide for creating helpful empty states479- **templates/onboarding-flow-template.md**: Framework for designing clear onboarding experiences