@svadmin/create 0.15.0 → 0.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/guidance/DESIGN.md +34 -0
- package/package.json +1 -1
- package/scaffold-manifest.json +1 -1
package/guidance/DESIGN.md
CHANGED
|
@@ -102,6 +102,40 @@ architecture, and scenario coverage may expose missing components or examples,
|
|
|
102
102
|
but its palette, decoration, card treatment, typography, and branding are not
|
|
103
103
|
visual authority.
|
|
104
104
|
|
|
105
|
+
### Design principles
|
|
106
|
+
|
|
107
|
+
Seven principles turn the Stripe-first direction into reviewable product
|
|
108
|
+
decisions. They apply to built-in components, examples, generated applications,
|
|
109
|
+
and documentation:
|
|
110
|
+
|
|
111
|
+
1. **Clear by default:** every page has one primary job, one dominant next
|
|
112
|
+
action, and one owner for every visible fact. Supporting copy adds a
|
|
113
|
+
constraint, consequence, scope, or recovery path instead of repeating UI.
|
|
114
|
+
2. **Efficient in the loop:** preserve filters, selection, navigation context,
|
|
115
|
+
and keyboard reachability across repeated work. Loading and feedback must not
|
|
116
|
+
move the primary action or force an unnecessary page transition.
|
|
117
|
+
3. **Consistent by contract:** semantic tokens, component variants, state names,
|
|
118
|
+
page skeletons, and feedback lifecycles remain stable across products. Layout
|
|
119
|
+
presets may change density and composition, not interaction meaning.
|
|
120
|
+
4. **Trustworthy in every state:** loading, empty, partial, error, forbidden,
|
|
121
|
+
destructive, reversible, and completed states expose their scope and next
|
|
122
|
+
step. Data freshness, permission boundaries, and action consequences must be
|
|
123
|
+
visible when they affect a decision.
|
|
124
|
+
5. **Restrained like Stripe:** neutral surfaces and precise hierarchy carry the
|
|
125
|
+
interface. Accent, elevation, radius, animation, and decoration are used only
|
|
126
|
+
when they clarify priority or interaction.
|
|
127
|
+
6. **Accessible by construction:** keyboard access, visible focus, semantic
|
|
128
|
+
structure, non-color status cues, readable contrast, stable targets, and
|
|
129
|
+
responsive behavior are component defaults rather than page-level repairs.
|
|
130
|
+
7. **AI-ready and auditable:** generated UI declares its primary workflow,
|
|
131
|
+
information owners, state owners, and feedback removal conditions; it uses
|
|
132
|
+
the trusted component catalog and passes deterministic and visual gates.
|
|
133
|
+
|
|
134
|
+
Use these principles as an ordered review: first verify the task and state are
|
|
135
|
+
clear, then efficiency and consistency, then trust, restraint, accessibility,
|
|
136
|
+
and generation evidence. A visually polished page still fails when its state or
|
|
137
|
+
action ownership is ambiguous.
|
|
138
|
+
|
|
105
139
|
## Colors
|
|
106
140
|
|
|
107
141
|
Neutrals carry the interface. Primary is a single controlled interaction accent,
|
package/package.json
CHANGED