Templates - UX Writing Skill

Use these templates to write consistent, effective UX text for common interface patterns. Each template includes structure, examples, and checklists.

Available templates

Error message template

Write clear, actionable error messages

Empty state template

Guide users when content is absent

Onboarding flow template

Design clear onboarding experiences

Error message template

Use this template to write clear, actionable error messages that help users recover.

Structure

[What failed] [Why it might have failed, if known] [What to do next]

Inline error (form validation)

Format: Brief, immediate correction guidance

[Field requirement or constraint]

Examples

Email must include @
Password needs 8+ characters
Card number is incomplete
Choose a future date

Detour error (recoverable problem)

Format: Problem + Solution

Title: [Action that failed]
Body: [Brief explanation]. [Recovery instruction].
Button: [Specific recovery action]

Title: Can't save changes
Body: Check your internet connection and try again.
Button: Retry

Blocking error (system issue)

Format: Clear explanation + Timeline + Reassurance

Title: [What's unavailable]
Body: [Why it's unavailable]. [When it will be available]. [Reassurance about user data].
Button: [Status check or alternative action]

Title: Service temporarily unavailable
Body: We're updating our systems and will be back in about 15 minutes. Your data is safe.
Button: Check status

Error message checklist

Before finalizing an error message, verify:

Avoids blame — No “invalid,” “illegal,” “wrong,” “error”
Empathetic tone — Acknowledge user frustration
Specific problem — Not generic “something went wrong”
Clear recovery — Tell user exactly what to do
Front-loaded — Most important info first
Active voice — “We couldn’t save” not “changes could not be saved”
Human language — Not system codes or technical jargon

Voice variations by context

High-stakes error (payment, security, data loss)

Tone: Serious, clear, reassuring

We couldn't process your payment. Your card wasn't charged. Check your card details and try again.

Low-stakes error (optional feature, nice-to-have)

Tone: Light, helpful, not dramatic

Couldn't load preview. Refresh to try again.

First-time user error

Tone: Educational, patient

Profile photo must be under 5MB. Try a smaller file or compress your image.

Common mistakes

Don't

“An error occurred”
“Invalid email address”
“ERR_CONNECTION_TIMEOUT”
“Upload failed”
“Your request could not be processed”

Do

“We couldn’t save your changes”
“Email must include @”
“Connection timed out. Check your internet and try again.”
“Upload failed. Check your file size and try again.”
“We couldn’t process your request”

Quick fill template

Use this for rapid error message drafting:

Identify what failed

What action or operation didn’t work?

Determine why (if known)

What likely caused the failure?

Specify what user should do

What specific action will help them recover?

Write the draft

[What failed]. [Why, if known]. [Next action].

Example:

What failed: Couldn’t send invite
Why: Email bounced
What to do: Check spelling
Draft: “Couldn’t send invite. Check the email address and try again.”

Empty state template

Use this template to guide users when content is absent and help them take action to populate the space.

Structure

[Title explaining the empty state] [Brief explanation or encouragement] [Clear call to action]

First-use empty state

Purpose: Guide new users to populate content
Tone: Inviting, encouraging, clear on benefit

Title: [What's empty]
Body: [Brief benefit of adding content]
Button: [Specific action to populate]

Title: No projects yet
Body: Create your first project to start organizing work.
Button: Create project

User-cleared empty state

Purpose: Confirm completion, positive reinforcement
Tone: Positive, celebratory (appropriately)

Title: [Positive completion statement]
Body: [Optional: What happens next or when new content appears]

Title: You're all caught up
Body: New tasks will appear here when they're assigned to you.

Error/no results empty state

Purpose: Suggest alternatives when search/filter returns nothing
Tone: Helpful, solution-focused

Title: [What wasn't found]
Body: [Suggestion to modify or alternative action]
Button: [Alternative action]

Title: No results for "vintage cameras"
Body: Try different keywords or browse all items.
Button: Browse all items

Empty state checklist

Before finalizing an empty state, verify:

Clear context — User knows what’s empty and why
Actionable — Provides specific next step
Appropriate tone — Matches emotional context
Value-focused — Shows benefit of taking action
Concise — Brief enough to scan quickly
Avoids negativity — No “nothing here” or “you have no…”

Content patterns by type

First-use
User-cleared
No results
Permission required

Pattern: “No [content] yet. [Benefit statement]. [Action]”Examples:

“No contacts yet. Import contacts to start messaging. Import contacts”
“No favorites saved. Save items to find them quickly later. Browse items”
“No team members yet. Invite people to collaborate on projects. Invite team”

Voice variations

Professional/B2B product

Title: No documents uploaded
Body: Upload files to share with your team.
Button: Upload document

Consumer/friendly product

Title: Nothing here yet!
Body: Start adding favorites to build your collection.
Button: Find favorites

Serious/high-stakes product

Title: No alerts
Body: Your systems are running normally.

Common mistakes

Don't

“You have no contacts”
“Empty”
Three different buttons competing
Long paragraph explaining the feature
“No records found in database”

Do

“No contacts yet”
“No contacts yet. Import to get started.”
One clear next action
One sentence benefit, clear button
“No projects found”

Onboarding flow template

Use this template to design clear, encouraging onboarding experiences that help users succeed quickly.

Onboarding principles

Show value early

Help users succeed in their first session

Progressive disclosure

Don’t overwhelm with all features at once

Optional whenever possible

Let users skip and explore

Celebrate small wins

Acknowledge each completed step

Be concise

Users want to start using the product, not read about it

Core flow structure

Welcome

Orient user and set expectations

Setup

Collect essential information only

First success

Guide user to their first win

Next steps

Suggest logical next actions

Each step should answer:

Where am I? (Progress indicator)
What do I do here? (Clear instruction)
Why does this matter? (Benefit to user)
Can I skip this? (Exit option)

Welcome screen template

Purpose: Orient user and set expectations

Headline: [Welcome + value proposition]
Body: [2-3 benefits, bulleted]
Primary CTA: [Get started action]
Secondary CTA: [Sign in, if applicable]

Headline: Welcome to TaskFlow
Body:
• Organize projects with your team
• Track progress in real time
• Never miss a deadline

Primary CTA: Create account
Secondary CTA: Sign in

Account setup template

Purpose: Collect essential information only

Title: [Action-oriented title]
Body: [Why this information is needed]
Fields: [Minimum required fields]
Primary CTA: [Continue/Next action]
Secondary CTA: [Skip, if truly optional]

Title: Tell us about yourself
Body: We'll personalize your experience.

Fields:
- Name
- Email
- Password

Primary CTA: Continue
Secondary CTA: I'll do this later

Best practices:

Only ask for what you absolutely need now
Explain why each field is required
Use smart defaults when possible
Allow skipping optional steps

Feature introduction template

Purpose: Teach one feature at a time through action

Title: [Feature name + benefit]
Body: [Brief explanation, 1-2 sentences]
Visual: [Screenshot or illustration]
Primary CTA: [Action to try the feature]
Secondary CTA: Skip / Next
Progress: [X of Y steps]

Title: Create your first project
Body: Projects help you organize related tasks and collaborate with your team.

[Visual: Screenshot of project view]

Primary CTA: Create project
Secondary CTA: Skip for now
Progress: Step 2 of 4

Best practices:

Show, don’t tell (use visuals)
Let users try immediately
Keep explanations under 20 words
Always allow skipping

Success/completion template

Purpose: Celebrate user’s first win, encourage next action

Title: [Celebratory statement]
Body: [What they accomplished + what's possible next]
Primary CTA: [Next natural action]
Secondary CTA: [Alternative or exit to product]

Title: You're all set!
Body: You created your first project. Ready to invite your team?

Primary CTA: Invite team members
Secondary CTA: Explore on my own

Best practices:

Use exclamation points sparingly (once per flow max)
Make the celebration feel earned
Suggest logical next step
Provide exit to main product

Onboarding step checklist

For each step in your onboarding flow, verify:

Single focus — One action or concept per step
Clear value — User knows why this matters
Actionable — User knows exactly what to do
Skipable — Optional steps can be skipped
Progress visible — User knows how many steps remain
Concise — Body text under 30 words
Appropriate tone — Encouraging without being patronizing

Content patterns by step type

Welcome/Introduction
Permission request
Feature tutorial
Completion

Pattern: “Welcome to [Product]. [Do X to achieve Y].”Examples:

“Welcome to Notion. Create beautiful docs, wikis, and projects.”
“Welcome to Figma. Design, prototype, and collaborate in real time.”

Tone variations

Professional/B2B

Title: Set up your workspace
Body: Add team members and create your first project.
CTA: Continue setup

Consumer/casual

Title: Let's get you started!
Body: This will only take a minute.
CTA: Let's go

Technical/developer

Title: Configure your environment
Body: Connect your repository to start deploying.
CTA: Connect repo

Multi-screen flow example

View complete 4-screen flow

Screen 1: Welcome

Welcome to WriteRight

Write better, faster with AI-powered editing.

• Fix grammar instantly
• Improve clarity and tone
• Write with confidence

[Get started]

Screen 2: Setup

What brings you to WriteRight? (2 of 4)

Select all that apply:
□ Business writing
□ Creative writing
□ Student papers
□ Personal projects

[Continue] [Skip]

Screen 3: First action

Try it out (3 of 4)

Paste any text below and watch WriteRight improve it.

[Text input box]

[Analyze my writing] [Skip]

Screen 4: Success

Nice work!

You improved your first piece of writing. Ready to write your next masterpiece?

[Start writing] [See tips]

Common mistakes

Don't

Too many steps (10+ screens)
Feature dump (“Here are 47 things!”)
No skip option
Passive voice (“Your account has been created”)
Corporate speak (“Facilitate enhanced productivity”)

Do

Focused flow (3-5 steps to first value)
Progressive disclosure (one key feature at a time)
Respect choice (skip available)
Active voice (“You created your account!”)
Plain language (“Get more done”)

Testing your onboarding

Questions to answer:

Can users complete onboarding in under 2 minutes?

Time your onboarding flow from start to finish. If it takes longer than 2 minutes, consider removing steps or making more optional.

Do users achieve something meaningful in their first session?

Users should complete at least one core action (create project, send message, upload file) before onboarding ends.

Can users skip optional steps without confusion?

Test that skip buttons work and users aren’t penalized for skipping.

Is the tone encouraging without being condescending?

Read your copy out loud. Does it sound patronizing or genuinely helpful?

Does each screen have a single, clear purpose?

Each screen should teach one concept or collect one piece of information.

​Available templates

Error message template

Empty state template

Onboarding flow template

​Error message template

​Structure

​Inline error (form validation)

​Detour error (recoverable problem)

​Blocking error (system issue)

​Error message checklist

​Voice variations by context

​Common mistakes

Don't

Do

​Quick fill template

​Empty state template

​Structure

​First-use empty state

​User-cleared empty state

​Error/no results empty state

​Empty state checklist

​Content patterns by type

​Voice variations

​Common mistakes

Don't

Do

​Onboarding flow template

​Onboarding principles

Show value early

Progressive disclosure

Optional whenever possible

Celebrate small wins

Be concise

​Core flow structure

​Welcome screen template

​Account setup template

​Feature introduction template

​Success/completion template

​Onboarding step checklist

​Content patterns by step type

​Tone variations

​Multi-screen flow example

​Common mistakes

Don't

Do

​Testing your onboarding

Available templates

Error message template

Structure

Inline error (form validation)

Detour error (recoverable problem)

Blocking error (system issue)

Error message checklist

Voice variations by context

Common mistakes

Quick fill template

Empty state template

Structure

First-use empty state

User-cleared empty state

Error/no results empty state

Empty state checklist

Content patterns by type

Voice variations

Common mistakes

Onboarding flow template

Onboarding principles

Core flow structure

Welcome screen template

Account setup template

Feature introduction template

Success/completion template

Onboarding step checklist

Content patterns by step type

Tone variations

Multi-screen flow example

Common mistakes

Testing your onboarding