Skip to content

Commit

Permalink
docs(ux-writing): Content updates as part of audit. (#4031)
Browse files Browse the repository at this point in the history
* Content edits.

* docs(ux-writing): Content updates as part of audit.

* A few small edits.

* Update packages/documentation-site/patternfly-docs/content/design-guidelines/content/numerics.md

* Update packages/documentation-site/patternfly-docs/content/design-guidelines/content/punctuation.md

* Updates per feedback.
  • Loading branch information
edonehoo authored Jun 5, 2024
1 parent 46cb172 commit 5ad3de6
Show file tree
Hide file tree
Showing 8 changed files with 107 additions and 97 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ Consistent capitalization adds clarity and creates unity across product UIs. Pat

For example: “When you use PatternFly’s design resources, you get helpful tips and best practices.”

**Above all else, your main goal should be consistency.** You may need to use different capitalization standards depending on what you're designing, but be sure to keep the capitalization within your product area consistent.
**Above all else, your main goal should be consistency.** You might need to use different capitalization standards depending on what you're designing, but be sure to keep the capitalization within your product area consistent.

## Red Hat product UIs

Expand All @@ -27,7 +27,7 @@ When you write for a product, make sure you adhere to the following capitalizati

| **Feature name** | **UI text** | **Reasoning** |
|------------------|--------------|------------------|
| Compliance | “Check your system **compliance** using Red Hat Insights **Compliance**.” | The first “compliance” is lowercase since it refers to a concept. The second “compliance” refers to a specific feature offered on cloud.redhat.com, so it is capitalized. |
| Compliance | “Check your system **compliance** using Red Hat Insights **Compliance**.” | The first “compliance” is lowercase because it refers to a concept. The second “compliance” refers to a specific feature offered on cloud.redhat.com, so it is capitalized. |
| Sources | “Add a *source* by going to **Settings > *Sources*.**” "Check the *Sources* table for status."<br /><br />Button text: "Add *source*" | “Sources” is only capitalized when it directly refers to a subsection, feature, or location in the UI. "Source" is lowercase in the button text because button labels should always be in sentence case. |
</div>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ A user should never feel like the error is their fault. Avoid language like “Y
<div class="ws-content-table">

| **Before** | **After** |
|:-----------------:|:-----------------:|
|-----------------|-----------------|
| You did not provide your authentication credentials. | Authentication credentials weren't provided.|

</div>
Expand All @@ -45,7 +45,7 @@ A user should never feel stuck. If they’re hit with an error, give them the in
<div class="ws-content-table">

| **Before** | **After** |
|:-------------:|:------------------:|
|-------------|------------------|
| Your list already has the maximum number of items. You are not able to continue customizing. | Your list has the maximum number of items. To continue customizing, remove an item.|

</div>
Expand All @@ -58,7 +58,7 @@ Error messages are frustrating enough without technical terms that users might n
<div class="ws-content-table">

| **Before** | **After** |
|:---------------:|:-----------------:|
|---------------|-----------------|
| Error code 5959: Outdated version information. Task termination pending. | Your task is outdated. To keep it active, update its version.|

</div>
Expand All @@ -71,7 +71,7 @@ Tell your user what is wrong. An error without an explanation can add to their f
<div class="ws-content-table">

| **Before** | **After** |
|:-------------:|:----------------:|
|-------------|----------------|
| An error occurred. The email cannot be sent. | To send this email, turn on your email permissions in user settings.|

</div>
Expand All @@ -82,7 +82,7 @@ However, don’t include too much information. The user doesn’t need to know e
<div class="ws-content-table">

| **Before** | **After** |
|:------------:|:------------:|
|------------|------------|
| Your information cannot be saved. Our system is currently designed to accommodate 1 record per user. The system memory is unable to store more at this time. | Only 1 record can be saved. To continue, remove one of your records.|

</div>
Expand All @@ -96,7 +96,7 @@ When providing users with a resolution, start the sentence with their goal ("the
<div class="ws-content-table">

| **Before** | **After** |
|:-----------------:|:----------------:|
|-----------------|----------------|
| Click **Log in** to manually log in. | To manually log in, click **Log in.**|

</div>
Expand Down Expand Up @@ -130,7 +130,7 @@ To create effective 404 pages, follow these best practice guidelines:
<div class="ws-content-table">

| **Before** | **After** |
|:-----------:|:-----------:|
|-----------|-----------|
| Error 404: Not found| 404: That page no longer exists |

</div>
Expand All @@ -141,7 +141,7 @@ To create effective 404 pages, follow these best practice guidelines:
<div class="ws-content-table">

| **Before** | **After** |
|:-----------:|:-----------:|
|-----------|-----------|
| Uh oh, spaghetti-o! We lost that one | We lost that page |
| Oops! We dropped the ball | We couldn't find that page |
| Huh, that's odd... | That page no longer exists |
Expand All @@ -154,7 +154,7 @@ To create effective 404 pages, follow these best practice guidelines:
<div class="ws-content-table">

| **Before** | **After** |
|:-----------:|:-----------:|
|-----------|-----------|
| Your search came up empty | We can't find that page |
| The page you're trying to reach doesn't exist | That page no longer exists |

Expand All @@ -166,7 +166,7 @@ To create effective 404 pages, follow these best practice guidelines:
<div class="ws-content-table">

| **Before** | **After** |
|:-----------:|:-----------:|
|-----------|-----------|
| That page doesn't exist. | Another page might have what you need, so try searching PatternFly. |

</div>
Expand All @@ -177,7 +177,7 @@ To create effective 404 pages, follow these best practice guidelines:
<div class="ws-content-table">

| **Before** | **After** |
|:-----------:|:-----------:|
|-----------|-----------|
| **Error 404: Not found**<br />Requested URL not found on this server. Please try again. | **404: We couldn't find that page**<br />Another page might have what you need, so try searching PatternFly. |

</div>
Expand All @@ -188,7 +188,7 @@ To create effective 404 pages, follow these best practice guidelines:
<div class="ws-content-table">

| **Before** | **After** |
|:-----------:|:-----------:|
|-----------|-----------|
| **404: Not all who wander are lost...**<br />But this page is. Search again or find your way back home. | **404: We lost that page**<br />Let's find you a better one. Try a new search or return home. |

</div>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
---
id: Product tours
id: Guided tours
section: UX writing
---
A product tour, also referred to as an "onboarding flow", includes a series of dialog boxes or pop-ups that introduce users to a new tool or a redesigned tool.
A **guided tour**, also referred to as an onboarding flow or a product tour, includes a series of dialog boxes or pop-ups that introduce users to a new or redesigned tool.

In product tours, your UX copy is never intended only to tell a user *how* something works. You need to convince them that using and learning about the product is worth their time.
In guided tours, your UX copy is never intended only to tell a user *how* something works. You need to convince them that using and learning about the product is worth their time.

When writing a product tour, refer to the following best practice guidelines and their respective before/after example:
When writing a guided tour, refer to the following best practice guidelines and their respective before/after example:

1. **Focus on the user’s goals**: Emphasize what the user can do with the product.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ PatternFly date and time formats follow the American standard. When localizing,
| 12-hour time notation | This time convention divides the 24 hours of the day into 2 periods of 12 hours, AM and PM. <br /><br />12-hour time notation is the American standard. | 3:00 PM |
| 24-hour time notation | This time convention divides the day by 24 hours and runs from midnight to midnight. The hours are represented from 0 to 23. | 14:00 |
| Date and time | Include the timestamp, along with the timezone, after the date. | Thursday, January 21, 2019 9:38:11 PM EST<br /><br />Thursday, 21 January 2019, 9:38:11 PM EST <br /><br />07 Jan 2019, 23:33 UTC |
| Time zone | Display time in the user's time zone or in UTC. <br /><br />Use UTC when spanning multiple time zones. | Maintenance begins today at 14:00 UTC (2 PM EST). |
| Time zone | Display time in the user's time zone or in UTC. <br /><br />Use UTC when spanning multiple time zones.<br /><br /> Avoid mentioning if a time zone uses Standard Time or Daylight Saving Time. | Maintenance begins today at 14:00 UTC (2 PM EST). |
| Day |Write out the full name of the day. If space is limited, use the day’s 3-letter abbreviation: <ul><li>Mon</li><li>Tue</li><li>Wed</li><li>Thu</li><li>Fri</li><li>Sat</li><li>Sun</li></ul> | Monday, September 17, 2020 <br /><br />Mon, Sep 17, 2020 |
| Month | Write out the full name of the month. If space is limited, use the month’s 3-letter abbreviation. <ul><li>Jan</li><li>Feb</li><li>Mar</li><li>Apr</li><li>May</li><li>Jun</li><li>Jul</li><li>Aug</li><li>Sep</li><li>Oct</li><li>Nov</li><li>Dec</li></ul> | September 17, 2020 <br /><br />Sep 17, 2020 |
| Duration | HH:MM:SS or HH:MM | 03:15:30 <br /><br />03:15<br /><br />00:15 |
Expand Down
Loading

0 comments on commit 5ad3de6

Please sign in to comment.