Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Content design page updates #13143

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions .changeset/gentle-cycles-teach.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
---
---
2 changes: 1 addition & 1 deletion polaris.shopify.com/content/content/alternative-text.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: Alternative text
description: Alt text provides an inclusive experience for merchants who use screen readers.
description: Build inclusive experiences for merchants who use screen readers
icon: ImageAltIcon
order: 5
keywords:
Expand Down
8 changes: 4 additions & 4 deletions polaris.shopify.com/content/content/error-messages.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ Error messages should:
- Help merchants avoid mistakes in the first place, using clear content to manage expectations and highlight potential risks
- Only explain what happened behind the scenes when it’s helpful to merchants or you can’t offer a solution

As always, follow all our content principles of keeping it short, using plain language, and getting rid of repetition. Also, good design can reduce the need for error messages by preventing them.
As always, follow our content [fundamentals](/content/fundamentals) of keeping it short, using plain language, and getting rid of repetition.

## Design for clarity

Expand Down Expand Up @@ -114,13 +114,13 @@ Button: Shopify Home
#### Do

Heading: Couldn’t deposit payout \
Body: The bank account we have on file was closed. Update your details, and we’ll retry automatically.
Body: The bank account we have on file was closed. Update your details, and we’ll retry automatically. \
Button: Update bank account

#### Don’t

Heading: Invalid bank account
Body: Your payout was not deposited because your bank account was closed. Go to your bank account details and update them to match a valid checking account. Then save so that we can retry.
Heading: Invalid bank account \
Body: Your payout was not deposited because your bank account was closed. Go to your bank account details and update them to match a valid checking account. Then save so that we can retry. \
Button: Next


Expand Down
4 changes: 2 additions & 2 deletions polaris.shopify.com/content/content/fundamentals.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: Fundamentals
description: How to design content to create world-class software
description: Designing content for experiences
icon: TextInColumnsIcon
order: 1
keywords:
Expand Down Expand Up @@ -36,7 +36,7 @@ keywords:

These fundamentals apply to every piece of content you create. For specific questions, dig into our detailed content guidelines for everything from [grammar](/content/grammar-and-mechanics) to [components](/components).

Think of tools you use every day, such as your phone, car, blender. They all have a learning curve. But the very best of them feel easy from the very first use. Buttons are where you expect them. Labeling is intuitive. Everything unnecessary has been removed, and what’s left is the perfect balance of words and visuals. That’s what we’re building here at Shopify.
Think of tools you use every day, such as your phone, car, or blender. They all have a learning curve, but the very best of them feel easy from the very first use. Buttons are where you expect them. Labeling is intuitive. Everything unnecessary has been removed, and what’s left is the perfect balance of words and visuals. That’s what we’re building here at Shopify.


## Content 🤝 design
Expand Down
2 changes: 1 addition & 1 deletion polaris.shopify.com/content/content/inclusive-language.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: Inclusive language
description: Make commerce better for everyone by writing inclusively.
description: Make commerce better for everyone by writing inclusively
icon: EyeCheckMarkIcon
order: 6
keywords:
Expand Down
2 changes: 1 addition & 1 deletion polaris.shopify.com/content/content/index.mdx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: Content
order: 4
description: Thoughtful, crafted content is a core element of a well-designed user experience
description: How to use content to build a world-class user experience
icon: TextAlignmentLeftIcon
---

Expand Down
2 changes: 1 addition & 1 deletion polaris.shopify.com/content/content/naming.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: Naming
description: What to consider as you name products and features
description: What to consider as you name products or features
icon: ProductIcon
order: 4
keywords:
Expand Down
6 changes: 3 additions & 3 deletions polaris.shopify.com/content/getting-started/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ The [Shopify/polaris GitHub repo](https://github.com/Shopify/polaris) is an open

## Tutorials

### [Build a Shopify app](https://shopify.dev/apps/getting-started/create)
#### [Build a Shopify app](https://shopify.dev/apps/getting-started/create)

In this tutorial, you'll create an app that merchants can access in the Shopify admin. You'll use an app initialization command that generates starter code for building your app, and sets up your development environment so that you can work with your app using [Shopify CLI](https://shopify.dev/apps/tools/cli).

Expand All @@ -51,6 +51,6 @@ Your app will use Polaris and [App Bridge](https://shopify.dev/apps/tools/app-br

Polaris provides foundational design guidance for creating good merchant experiences. Here are some recommended resources to:

- [Experience Values](/foundations/experience-values)
- [Experience values](/foundations/experience-values)
- [Design guidelines](/design)
- [Product content](/content/product-content)
- [Content fundamentals](/content/fundamentals)
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ keywords:

Actions should always clearly communicate their purpose by using a text label, an icon, or a combination of both.

See the [actionable language guidelines](/content/actionable-language#buttons) for more detail.
See [fundamentals](/content/fundamentals#inspire-action) for more detail.

</Stack>

Expand Down
10 changes: 10 additions & 0 deletions polaris.shopify.com/next.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -169,6 +169,16 @@ const nextConfig = {
destination: '/content/fundamentals',
permanent: true,
},
{
source: '/content/voice-and-tone',
destination: '/content/fundamentals',
permanent: true,
},
{
source: '/content/merchant-to-customer',
destination: '/content/fundamentals',
permanent: true,
},
...whatsNew,
...actions,
...deprecated,
Expand Down