Skip to content

Commit 0d446cb

Browse files
authored
Simplify design patterns page (#7441)
### WHY are these changes introduced? The design pattern page currently includes a section describing the differences between compositions and patterns. While this information is valuable to us a team, we are still defining and testing these concepts. Publishing them on the site at this stage seems to have introduced some confusion for readers. ### WHAT is this pull request doing? Removes section on compositions vs patterns until we develop stronger opinions and feel comfortable publishing them publicly. Also reorganizes the order of the principles, placing "Contextual" last, and closest to the related image.
1 parent 4b44119 commit 0d446cb

File tree

2 files changed

+10
-32
lines changed

2 files changed

+10
-32
lines changed

.changeset/pretty-bats-know.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'polaris.shopify.com': minor
3+
---
4+
5+
Remove section on compositions vs patterns.

polaris.shopify.com/content/patterns/design-patterns.md

Lines changed: 5 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -15,19 +15,15 @@ A design pattern is a repeatable solution to a common UX problem in a specific m
1515

1616
---
1717

18-
### Join the conversation!
18+
### Join the conversation
1919

2020
Do you have ideas or feedback on how we can make these guidelines more empowering and useful? Please share your thoughts in the [GitHub discussion](https://github.com/Shopify/polaris/discussions/6046).
2121

2222
---
2323

2424
## Principles
2525

26-
For patterns to be successful, they need to be contextual, consistent, and unified.
27-
28-
### Contextual
29-
30-
A pattern is always paired with the problem it solves and the situation it appears in. A solution applied in a context it wasn’t designed for is not a pattern.
26+
For patterns to be successful, they need to be consistent, unified, and contextual.
3127

3228
### Consistent
3329

@@ -37,31 +33,8 @@ Patterns are always used in the same way for the same reasons. Merchants need to
3733

3834
Patterns are always informed by and designed together with similar patterns. For example, patterns with similar purpose should complement each other, and patterns with similar functionality should share appearance and behavior.
3935

40-
![A solution box within a problem box within a situation box.](/images/foundations/patterns/design-patterns/situation-problem-solution.png)
41-
42-
Patterns come with a solution, problem, and situation that belong together. Solutions taken out of this context are no longer a pattern.
43-
44-
## Patterns vs. compositions
45-
46-
Patterns are for merchants and compositions are for builders.
47-
48-
### Pattern purpose
49-
50-
- Design the best possible merchant experience
51-
- Simplify learning the UI
52-
- Improve recognizability and ease of use
53-
- Improve merchants’ admin proficiency
54-
55-
### Composition purpose
56-
57-
- Share as much code as possible
58-
- Speed up the build process
59-
- Improve maintainability and reusability
60-
- Ensure build consistency
36+
### Contextual
6137

62-
### How to distinguish
38+
A pattern is always paired with the problem it solves and the situation it appears in. A solution applied in a context it wasn’t designed for is not a pattern.
6339

64-
- Patterns solve usability problems that relate to the usage of admin, while compositions solve build problems that relate to the build process
65-
- Patterns ensure consistent product experience, while compositions ensure consistent implementation
66-
- A pattern can be hard coded and still be a pattern, and a composition can be using Polaris primitives and tokens and still not be a pattern
67-
- Patterns are the language we speak with merchants, compositions are the code we share among us
40+
![A solution box within a problem box within a situation box.](/images/foundations/patterns/design-patterns/situation-problem-solution.png)

0 commit comments

Comments
 (0)