arkaos 4.27.0 → 4.29.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/THE-ARKAOS-GUIDE.md +1 -1
- package/VERSION +1 -1
- package/arka/skills/human-writing/SKILL.md +40 -2
- package/arka/skills/human-writing/references/anti-slop-phrases.md +131 -0
- package/arka/skills/human-writing/references/pt-pt-anti-slop.md +82 -0
- package/arka/skills/human-writing/references/stop-slop.LICENSE +21 -0
- package/arka/skills/human-writing/references/structural-patterns.md +151 -0
- package/arka/skills/refine/SKILL.md +7 -0
- package/config/claude-agents/brand-director.md +1 -1
- package/config/claude-agents/content-marketer.md +1 -1
- package/config/claude-agents/content-strategist.md +1 -1
- package/config/claude-agents/design-ops-lead.md +1 -1
- package/config/claude-agents/eduardo-copy.md +13 -0
- package/config/claude-agents/frontend-dev.md +1 -1
- package/config/claude-agents/lifecycle-marketer.md +1 -1
- package/config/claude-agents/product-marketer.md +1 -1
- package/config/claude-agents/repurpose-distributor.md +1 -1
- package/config/claude-agents/sales-copywriter.md +1 -1
- package/config/claude-agents/scriptwriter.md +1 -1
- package/config/claude-agents/ux-designer.md +1 -1
- package/config/claude-agents/ux-strategist.md +1 -1
- package/config/claude-agents/viral-engineer.md +1 -1
- package/config/claude-agents/visual-designer.md +1 -1
- package/config/claude-agents/wcag-auditor.md +1 -1
- package/config/evals/marketing.yaml +74 -0
- package/config/skills-provenance.yaml +14 -2
- package/departments/brand/agents/brand-director.yaml +2 -0
- package/departments/brand/agents/design-ops/design-ops-lead.yaml +2 -0
- package/departments/brand/agents/design-ops/wcag-auditor.yaml +2 -0
- package/departments/brand/agents/ux-designer.yaml +2 -0
- package/departments/brand/agents/ux-strategist.yaml +2 -0
- package/departments/brand/agents/visual-designer.yaml +2 -0
- package/departments/brand/references/uiux-knowledge-and-tools.md +185 -2
- package/departments/brand/skills/design-review/SKILL.md +25 -0
- package/departments/brand/skills/design-review/references/anti-patterns.md +420 -0
- package/departments/brand/skills/design-review/references/critique-protocol.md +169 -0
- package/departments/brand/skills/design-review/references/design-registers.md +181 -0
- package/departments/brand/skills/design-review/references/genres/atmospheric.md +71 -0
- package/departments/brand/skills/design-review/references/genres/editorial.md +74 -0
- package/departments/brand/skills/design-review/references/genres/modern-minimal.md +73 -0
- package/departments/brand/skills/design-review/references/genres/playful.md +72 -0
- package/departments/brand/skills/design-review/references/hallmark.LICENSE +21 -0
- package/departments/brand/skills/design-review/references/impeccable.LICENSE +191 -0
- package/departments/brand/skills/design-review/references/impeccable.NOTICE +11 -0
- package/departments/brand/skills/design-review/references/slop-test.md +194 -0
- package/departments/brand/skills/ux-audit/SKILL.md +25 -4
- package/departments/content/agents/content-strategist.yaml +1 -0
- package/departments/content/agents/repurpose-distributor.yaml +1 -0
- package/departments/content/agents/scriptwriter.yaml +1 -0
- package/departments/content/agents/viral-engineer.yaml +1 -0
- package/departments/dev/agents/frontend-dev.yaml +2 -0
- package/departments/landing/agents/sales-copywriter.yaml +1 -0
- package/departments/marketing/agents/content-marketer.yaml +1 -0
- package/departments/marketing/agents/growth-marketing/lifecycle-marketer.yaml +1 -0
- package/departments/marketing/agents/growth-marketing/product-marketer.yaml +1 -0
- package/departments/quality/agents/copy-director.yaml +1 -0
- package/harness/codex/AGENTS.md +1 -1
- package/harness/copilot/copilot-instructions.md +1 -1
- package/harness/cursor/rules/arkaos.mdc +2 -2
- package/harness/gemini/GEMINI.md +1 -1
- package/harness/opencode/AGENTS.md +1 -1
- package/harness/zed/.rules +1 -1
- package/knowledge/agents-registry-v2.json +28 -5
- package/knowledge/skills-manifest.json +7 -3
- package/package.json +1 -1
- package/pyproject.toml +1 -1
|
@@ -1731,6 +1731,80 @@
|
|
|
1731
1731
|
tags:
|
|
1732
1732
|
- human-writing
|
|
1733
1733
|
- imported
|
|
1734
|
+
- id: marketing-human-writing-07
|
|
1735
|
+
department: marketing
|
|
1736
|
+
prompt: 'Rewrite this launch-post paragraph: ''Here''s the thing: shipping fast isn''t
|
|
1737
|
+
the problem. Shipping the wrong thing is. What if I told you the answer isn''t more
|
|
1738
|
+
process? When the feedback loop tightens, the product improves. The implications are
|
|
1739
|
+
significant. Not a framework. Not a methodology. A habit.'''
|
|
1740
|
+
expected_properties:
|
|
1741
|
+
- Identifies throat-clearing opener ("Here's the thing:")
|
|
1742
|
+
- Identifies binary contrasts ("isn't the problem... is", "the answer isn't")
|
|
1743
|
+
- Identifies rhetorical setup ("What if I told you")
|
|
1744
|
+
- Identifies false agency ("the feedback loop tightens, the product improves")
|
|
1745
|
+
- Identifies vague declarative ("The implications are significant")
|
|
1746
|
+
- Identifies negative listing ("Not a framework. Not a methodology. A habit.")
|
|
1747
|
+
- Rewrite states points directly and names the human actor
|
|
1748
|
+
rubric: 'Should apply Rule 8 (No Formulaic Structures) and the structural-patterns
|
|
1749
|
+
catalogue. Should flag every structural pattern in the paragraph: throat-clearing
|
|
1750
|
+
opener, two binary contrasts, rhetorical setup, false agency (nobody tightens the
|
|
1751
|
+
loop or improves the product in the sentence — the rewrite must name who does),
|
|
1752
|
+
vague declarative, and negative listing. The rewrite should state each point as a
|
|
1753
|
+
direct claim with a human subject, without introducing new AI patterns (no em
|
|
1754
|
+
dashes, no fresh contrasts). Should not merely reword phrases while keeping the
|
|
1755
|
+
structures.'
|
|
1756
|
+
tags:
|
|
1757
|
+
- human-writing
|
|
1758
|
+
- id: marketing-human-writing-08
|
|
1759
|
+
department: marketing
|
|
1760
|
+
prompt: 'Limpa este parágrafo de um email de lançamento: ''Vamos mergulhar no que
|
|
1761
|
+
torna este produto verdadeiramente único. Não se trata de mais uma ferramenta,
|
|
1762
|
+
trata-se de uma nova forma de trabalhar. Basicamente, a plataforma ganha vida
|
|
1763
|
+
com os teus dados — e os resultados falam por si. As implicações são profundas.'''
|
|
1764
|
+
expected_properties:
|
|
1765
|
+
- Responds in European Portuguese (pt-PT)
|
|
1766
|
+
- Identifies "Vamos mergulhar" as throat-clearing
|
|
1767
|
+
- Identifies "Não se trata de X, trata-se de Y" as binary contrast
|
|
1768
|
+
- Identifies stacked -mente adverbs ("verdadeiramente", "basicamente")
|
|
1769
|
+
- Identifies false agency ("a plataforma ganha vida", "os resultados falam")
|
|
1770
|
+
- Identifies em dash used as connector
|
|
1771
|
+
- Identifies vague declarative ("As implicações são profundas")
|
|
1772
|
+
- Rewrite is idiomatic pt-PT with named actors and direct claims
|
|
1773
|
+
rubric: 'Should apply references/pt-pt-anti-slop.md and respond in pt-PT (never
|
|
1774
|
+
pt-BR). Should flag: "Vamos mergulhar" (abertura de limpar a garganta),
|
|
1775
|
+
"Não se trata de... trata-se de" (contraste binário), "verdadeiramente" and
|
|
1776
|
+
"basicamente" (advérbios a cortar por defeito), "a plataforma ganha vida" and
|
|
1777
|
+
"os resultados falam por si" (falsa agência — nomear quem faz), the em dash
|
|
1778
|
+
connector (Rule 1), and "As implicações são profundas" (declarativa vaga).
|
|
1779
|
+
The rewrite must be natural European Portuguese with direct statements and
|
|
1780
|
+
human subjects, and must not translate English constructs literally.'
|
|
1781
|
+
tags:
|
|
1782
|
+
- human-writing
|
|
1783
|
+
- id: marketing-human-writing-09
|
|
1784
|
+
department: marketing
|
|
1785
|
+
prompt: 'Score this draft with the Slop Score rubric and tell me if it ships:
|
|
1786
|
+
''In today''s fast-paced landscape, teams need to navigate complexity. Here''s
|
|
1787
|
+
why that matters: productivity isn''t about tools. It''s about focus. Really,
|
|
1788
|
+
the data tells us everything. Make no mistake, this changes everything. The
|
|
1789
|
+
stakes are high.'''
|
|
1790
|
+
expected_properties:
|
|
1791
|
+
- Applies the five Slop Score dimensions (Directness, Rhythm, Trust, Authenticity, Density)
|
|
1792
|
+
- Scores each dimension 1-10 with a one-line justification
|
|
1793
|
+
- Total is clearly below the 35/50 threshold
|
|
1794
|
+
- Verdict is revise, not ship
|
|
1795
|
+
- Names the specific offending patterns per dimension
|
|
1796
|
+
- Offers a revised version or the concrete revision steps
|
|
1797
|
+
rubric: 'Should apply the Slop Score rubric from the human-writing skill: rate
|
|
1798
|
+
Directness, Rhythm, Trust, Authenticity, and Density 1-10 each with brief
|
|
1799
|
+
justification tied to specific text (cliches "in today''s fast-paced" and
|
|
1800
|
+
"navigate", emphasis crutches "Here''s why that matters" and "Make no
|
|
1801
|
+
mistake", binary contrast "isn''t about tools. It''s about focus", false
|
|
1802
|
+
agency "the data tells us", vague declarative "The stakes are high",
|
|
1803
|
+
metronomic short sentences). The total must land clearly below 35/50 and the
|
|
1804
|
+
verdict must be revise-before-shipping, with a rewrite or concrete steps.
|
|
1805
|
+
Should not score generously to avoid the revision.'
|
|
1806
|
+
tags:
|
|
1807
|
+
- human-writing
|
|
1734
1808
|
- id: marketing-customer-research-01
|
|
1735
1809
|
department: marketing
|
|
1736
1810
|
prompt: I have 20 customer interview transcripts. Help me analyze them.
|
|
@@ -60,6 +60,20 @@
|
|
|
60
60
|
baseline_date: 2026-07-14
|
|
61
61
|
|
|
62
62
|
derived:
|
|
63
|
+
# Design absorption campaign W1 — slop gates, anti-patterns, critique
|
|
64
|
+
# protocol and registers derived from nutlope/hallmark (MIT, primary
|
|
65
|
+
# source in frontmatter) and pbakaus/impeccable (Apache-2.0, second
|
|
66
|
+
# source recorded in docs/THIRD-PARTY-NOTICES.md). Both skills were
|
|
67
|
+
# reclassified OUT of first_party deliberately: their bodies now carry
|
|
68
|
+
# substantial ported content.
|
|
69
|
+
departments/brand/skills/design-review:
|
|
70
|
+
origin: community
|
|
71
|
+
source: https://github.com/nutlope/hallmark
|
|
72
|
+
license: MIT
|
|
73
|
+
departments/brand/skills/ux-audit:
|
|
74
|
+
origin: community
|
|
75
|
+
source: https://github.com/nutlope/hallmark
|
|
76
|
+
license: MIT
|
|
63
77
|
# Marketing skills integration campaign — derived from
|
|
64
78
|
# coreyhaines31/marketingskills (MIT). Frontmatter metadata must match
|
|
65
79
|
# each entry field-for-field (test_registry_matches_frontmatter_field_for_field).
|
|
@@ -272,7 +286,6 @@ first_party:
|
|
|
272
286
|
- departments/brand
|
|
273
287
|
- departments/brand/skills/archetype-finder
|
|
274
288
|
- departments/brand/skills/colors
|
|
275
|
-
- departments/brand/skills/design-review
|
|
276
289
|
- departments/brand/skills/design-system
|
|
277
290
|
- departments/brand/skills/identity-system
|
|
278
291
|
- departments/brand/skills/logo-brief
|
|
@@ -280,7 +293,6 @@ first_party:
|
|
|
280
293
|
- departments/brand/skills/naming-evaluate
|
|
281
294
|
- departments/brand/skills/positioning-statement
|
|
282
295
|
- departments/brand/skills/primal-audit
|
|
283
|
-
- departments/brand/skills/ux-audit
|
|
284
296
|
- departments/brand/skills/voice-guide
|
|
285
297
|
- departments/brand/skills/wireframe
|
|
286
298
|
- departments/community
|
|
@@ -70,6 +70,8 @@ expertise:
|
|
|
70
70
|
- WCAG 2.1 AA
|
|
71
71
|
- Two-Part Conversion Formula
|
|
72
72
|
- Microinteractions (trigger-rules-feedback-loops)
|
|
73
|
+
- Hallmark slop gates (58) + pre-emit critique (P/H/E/S/R/V)
|
|
74
|
+
- Impeccable design laws + registers (brand vs product)
|
|
73
75
|
- runtime:frontend-design (Anthropic skill)
|
|
74
76
|
knowledge_sources:
|
|
75
77
|
- "[[Area 02 - Design]]"
|
|
@@ -54,6 +54,8 @@ expertise:
|
|
|
54
54
|
- Blue Ocean / Value Innovation
|
|
55
55
|
- Provisional Personas
|
|
56
56
|
- Lean UX
|
|
57
|
+
- Hallmark slop gates (58) + pre-emit critique (P/H/E/S/R/V)
|
|
58
|
+
- Impeccable design laws + registers (brand vs product)
|
|
57
59
|
knowledge_sources:
|
|
58
60
|
- "[[Personas/Jaime Levy]]"
|
|
59
61
|
- "[[4 Elementos Centrais da UX Strategy]]"
|
|
@@ -57,6 +57,8 @@ expertise:
|
|
|
57
57
|
- Brand Identity Process (Wheeler)
|
|
58
58
|
- ArkaOS Design Tokens
|
|
59
59
|
- WCAG AA contrast
|
|
60
|
+
- Hallmark slop gates (58) + pre-emit critique (P/H/E/S/R/V)
|
|
61
|
+
- Impeccable design laws + registers (brand vs product)
|
|
60
62
|
- runtime:frontend-design (Anthropic skill)
|
|
61
63
|
- runtime:ui-ux-pro-max (community skill)
|
|
62
64
|
depth: expert
|
|
@@ -6,7 +6,8 @@
|
|
|
6
6
|
>
|
|
7
7
|
> Read this BEFORE any UI/UX work. It defines the non-negotiable KB-first
|
|
8
8
|
> rule, the canonical knowledge sources, the concrete design tokens, the
|
|
9
|
-
> motion system, the new tooling,
|
|
9
|
+
> motion system, the new tooling, the squad validation order, the canonical
|
|
10
|
+
> reflex-reject lists (§11) and the hard design laws (§12).
|
|
10
11
|
|
|
11
12
|
---
|
|
12
13
|
|
|
@@ -132,7 +133,10 @@ write material findings back to `[[Area 02 - Design]]`:
|
|
|
132
133
|
- Dieter Rams' 10 principles
|
|
133
134
|
- Atomic Design (full atoms→pages)
|
|
134
135
|
- Microinteractions (trigger→rules→feedback→loops/modes)
|
|
135
|
-
- Color theory & typography science (OKLCH, harmony, modular scale)
|
|
136
|
+
- Color theory & typography science (OKLCH, harmony, modular scale) —
|
|
137
|
+
**partially filled in-repo**: hard floors/ceilings now live in §12 and
|
|
138
|
+
the reflex-reject discipline in §11; deeper craft references live under
|
|
139
|
+
`departments/brand/skills/design-review/references/`.
|
|
136
140
|
- Gestalt & visual hierarchy (F/Z scanning, proximity, contrast)
|
|
137
141
|
|
|
138
142
|
---
|
|
@@ -168,6 +172,23 @@ for any other brief?"* If yes, revise and state what changed and why.
|
|
|
168
172
|
Quality floor, never announced: responsive to mobile, visible keyboard
|
|
169
173
|
focus, `prefers-reduced-motion` respected, WCAG AA contrast.
|
|
170
174
|
|
|
175
|
+
**Pre-emit critique (scored — hallmark protocol).** Before handing back
|
|
176
|
+
any design artifact, score it 1–5 on six axes:
|
|
177
|
+
|
|
178
|
+
| Axis | Question |
|
|
179
|
+
|---|---|
|
|
180
|
+
| **P** Philosophy | Does the design have a stated POV the brief earns? |
|
|
181
|
+
| **H** Hierarchy | Does the eye land where the content says it should? |
|
|
182
|
+
| **E** Execution | Are spacing, contrast, states, and breakpoints finished? |
|
|
183
|
+
| **S** Specificity | Does this look like *this brief* — or a generic page? |
|
|
184
|
+
| **R** Restraint | Is every bold move deliberate; is everything else quiet? |
|
|
185
|
+
| **V** Variety | Does it differ structurally from the previous output? |
|
|
186
|
+
|
|
187
|
+
Any axis **< 3 triggers a revision pass** — never ship and explain.
|
|
188
|
+
Stamp the six scores in the artifact via the `[arka:design-dna]` companion
|
|
189
|
+
stamp (§9). The 58 pass/fail slop gates that operationalize this rubric
|
|
190
|
+
live in `departments/brand/skills/design-review/references/slop-test.md`.
|
|
191
|
+
|
|
171
192
|
## 9. Design Marker Contract (`[arka:design]`)
|
|
172
193
|
|
|
173
194
|
Every UI/design-producing turn MUST emit the structured marker on its own
|
|
@@ -192,6 +213,21 @@ A bare `[arka:design] <token>` is a LEGACY marker: tolerated in WARN mode,
|
|
|
192
213
|
counted separately in telemetry, and treated as missing once the frontend
|
|
193
214
|
gate goes hard.
|
|
194
215
|
|
|
216
|
+
**Companion stamp `[arka:design-dna]` (informational).** Design-producing
|
|
217
|
+
work additionally stamps the first non-empty line of produced CSS with:
|
|
218
|
+
|
|
219
|
+
```
|
|
220
|
+
/* [arka:design-dna] macrostructure=<name> genre=<genre> anchor=<oklch|hex> display=<font> body=<font> critique=P#H#E#S#R#V# */
|
|
221
|
+
```
|
|
222
|
+
|
|
223
|
+
Key=value, single line, greppable. It records the structural choice, the
|
|
224
|
+
palette anchor, the type pairing, and the six pre-emit critique scores
|
|
225
|
+
(§8), and feeds the structural-diversification rule (consecutive outputs
|
|
226
|
+
must differ on at least one axis; project memory at
|
|
227
|
+
`.arka/design/log.json`). This stamp is **NOT parsed by the frontend gate**
|
|
228
|
+
(`core/workflow/frontend_gate.py`) and carries no gate semantics — the
|
|
229
|
+
structured `[arka:design]` marker above remains the only enforced line.
|
|
230
|
+
|
|
195
231
|
## 10. Aesthetic Directions Catalog (optional, curated)
|
|
196
232
|
|
|
197
233
|
When a project has NO design system yet and the brief leaves the visual
|
|
@@ -207,3 +243,150 @@ job: load `gsap-core` + `gsap-timeline` for any animation work,
|
|
|
207
243
|
`gsap-scrolltrigger`/`gsap-plugins` as the work demands, `gsap-react` on
|
|
208
244
|
React, and treat `gsap-performance` as the review bar
|
|
209
245
|
(`npx skills add https://github.com/greensock/gsap-skills` when absent).
|
|
246
|
+
|
|
247
|
+
## 11. Canonical Reflex-Reject (fonts + aesthetic lanes)
|
|
248
|
+
|
|
249
|
+
> Derived from [impeccable](https://github.com/pbakaus/impeccable)
|
|
250
|
+
> (Apache-2.0) and [hallmark](https://github.com/nutlope/hallmark) (MIT) —
|
|
251
|
+
> license texts at `departments/brand/skills/design-review/references/`.
|
|
252
|
+
> This section is the SINGLE canonical home of the list. Skills and gates
|
|
253
|
+
> point here; they never restate it (drift risk).
|
|
254
|
+
|
|
255
|
+
These are **training-data defaults**: every LLM reaches for them by
|
|
256
|
+
reflex, which is exactly why using them by reflex produces monoculture.
|
|
257
|
+
The semantics are **never-by-reflex**, not never:
|
|
258
|
+
|
|
259
|
+
1. **Identity-preservation carve-out** — when the existing brand has
|
|
260
|
+
already committed to a font or lane, identity wins. The list governs
|
|
261
|
+
greenfield decisions only.
|
|
262
|
+
2. **Deliberate-pick carve-out** — a listed font may be used when a named
|
|
263
|
+
theme or brief *deliberately* selects it and the choice is stated with
|
|
264
|
+
its reason (e.g. Playfair Display as display-only in an editorial
|
|
265
|
+
theme; Space Grotesk in a brutalist direction). Reflex is the crime,
|
|
266
|
+
not the font.
|
|
267
|
+
3. **Product-register carve-out** — product UI (design SERVES the task)
|
|
268
|
+
has explicit permission for system fonts and familiar sans defaults
|
|
269
|
+
(Inter, SF Pro, system-ui). The ban list bites on BRAND surfaces
|
|
270
|
+
(design IS the product). See
|
|
271
|
+
`departments/brand/skills/design-review/references/design-registers.md`.
|
|
272
|
+
|
|
273
|
+
### Reflex-reject fonts
|
|
274
|
+
|
|
275
|
+
**Sans:** Inter · DM Sans · Space Grotesk · Outfit · Plus Jakarta Sans ·
|
|
276
|
+
Instrument Sans · Syne · Roboto · Open Sans · Lato · Poppins · Source Sans ·
|
|
277
|
+
Nunito · Montserrat · Raleway · Work Sans · system-ui-as-brand · Arial ·
|
|
278
|
+
Helvetica-as-default
|
|
279
|
+
**Serif:** Fraunces · Newsreader · Lora · Crimson / Crimson Pro / Crimson
|
|
280
|
+
Text · Playfair Display · Cormorant / Cormorant Garamond · DM Serif Display ·
|
|
281
|
+
DM Serif Text · Instrument Serif · Merriweather · Source Serif ·
|
|
282
|
+
Georgia-as-default
|
|
283
|
+
**Mono:** IBM Plex Mono · Space Mono · Courier New · Consolas-as-default ·
|
|
284
|
+
system-mono-as-brand
|
|
285
|
+
**Family-wide:** IBM Plex Sans · IBM Plex Serif
|
|
286
|
+
|
|
287
|
+
Selection discipline when rejecting a reflex pick: run the 4-step
|
|
288
|
+
physical-object font procedure in `design-registers.md` (three concrete
|
|
289
|
+
brand-voice words → reject reflex picks → browse a real catalog for the
|
|
290
|
+
brand as a physical object → cross-check).
|
|
291
|
+
|
|
292
|
+
### Reflex-reject aesthetic lanes
|
|
293
|
+
|
|
294
|
+
- **Editorial-typographic** — display serif (often italic) + small mono
|
|
295
|
+
labels + ruled separators + monochromatic restraint. The 2026 fingerprint:
|
|
296
|
+
three rule-separated columns, an italic serif headline, lowercase
|
|
297
|
+
track-spaced metadata, no imagery. Every Stripe-adjacent and
|
|
298
|
+
Notion-adjacent brand has landed here. Requires a register reason that
|
|
299
|
+
*demands* it (a literal magazine), not a mood.
|
|
300
|
+
|
|
301
|
+
Lanes saturate and desaturate over time — entries move in and out on
|
|
302
|
+
evidence, mirroring upstream. The **second-order slop check** applies: if
|
|
303
|
+
the aesthetic family is guessable from category-plus-anti-references
|
|
304
|
+
("fintech that's not navy-and-gold → terminal-native dark mode"), it is
|
|
305
|
+
the trap one tier deeper. Rework until neither the first-order nor the
|
|
306
|
+
second-order answer is obvious.
|
|
307
|
+
|
|
308
|
+
## 12. Design Laws (hard floors and ceilings)
|
|
309
|
+
|
|
310
|
+
> Derived from [impeccable](https://github.com/pbakaus/impeccable)
|
|
311
|
+
> (Apache-2.0) and [hallmark](https://github.com/nutlope/hallmark) (MIT).
|
|
312
|
+
> Compact canonical table — one law per line. The enforcement surfaces
|
|
313
|
+
> (slop gates, design-slop detector, QG visual review) cite these; deeper
|
|
314
|
+
> rationale lives in `design-review/references/`.
|
|
315
|
+
|
|
316
|
+
**Typography**
|
|
317
|
+
- Body contrast ≥ 4.5:1; large text (≥18px, or bold ≥14px) ≥ 3:1;
|
|
318
|
+
placeholders need 4.5:1 too — muted-gray-on-tinted-near-white is the
|
|
319
|
+
single biggest readability failure.
|
|
320
|
+
- Prose line length 65–75ch (dense data UI may run denser).
|
|
321
|
+
- Hero/display ceiling: `clamp()` max ≤ 6rem. Above that the page shouts.
|
|
322
|
+
- Display letter-spacing floor ≥ −0.04em — tighter and letters touch.
|
|
323
|
+
- `text-wrap: balance` on h1–h3; `text-wrap: pretty` on long prose.
|
|
324
|
+
- Max 3 font families per page (display + body + one outlier). Four = slop.
|
|
325
|
+
- Pair on a contrast axis (serif+sans, geometric+humanist) or use one
|
|
326
|
+
family with committed weight contrast — never two similar sans.
|
|
327
|
+
- Light-on-dark compensation runs on three axes: line-height +0.05–0.1,
|
|
328
|
+
letter-spacing +0.01–0.02em, optionally body weight one notch up.
|
|
329
|
+
- Commit to extremes: weight 200 next to 800 reads as intentional;
|
|
330
|
+
400 next to 600 reads as a default setting.
|
|
331
|
+
|
|
332
|
+
**Color**
|
|
333
|
+
- OKLCH for new palettes. Pure gray is dead: tint neutrals 0.005–0.015
|
|
334
|
+
chroma toward the brand hue (never default-tint warm/cool).
|
|
335
|
+
- The warm-neutral band (L 0.84–0.97, C < 0.06, hue 40–100) is the
|
|
336
|
+
saturated AI default — cream/sand/paper by any token name
|
|
337
|
+
(`--paper`, `--cream`, `--sand`, `--linen`, `--parchment`…) is a tell.
|
|
338
|
+
Warmth is carried by accent + typography + imagery, not body bg.
|
|
339
|
+
- Pick a color strategy BEFORE colors, on the commitment axis:
|
|
340
|
+
**Restrained** (neutrals + one accent ≤10%) · **Committed** (one
|
|
341
|
+
saturated color, 30–60% of surface) · **Full palette** (3–4 named
|
|
342
|
+
roles) · **Drenched** (the surface IS the color).
|
|
343
|
+
- Gray text on colored backgrounds washes out: use a darker shade of the
|
|
344
|
+
background's own hue or a transparency of the text color.
|
|
345
|
+
- Button text vs fill must differ by > 5% lightness or > 0.05 chroma in
|
|
346
|
+
OKLCH (catches the black-on-black bug).
|
|
347
|
+
- Heavy alpha/transparency is a design smell — it usually means an
|
|
348
|
+
incomplete palette.
|
|
349
|
+
|
|
350
|
+
**Layout**
|
|
351
|
+
- Nested cards are always wrong; cards only when truly the best affordance.
|
|
352
|
+
- Flexbox for 1D, Grid for 2D; breakpoint-free grids via
|
|
353
|
+
`repeat(auto-fit, minmax(280px, 1fr))`.
|
|
354
|
+
- Semantic z-index scale (dropdown → sticky → modal-backdrop → modal →
|
|
355
|
+
toast → tooltip); never 999/9999.
|
|
356
|
+
- Vary spacing for rhythm: generous separations, tight groupings —
|
|
357
|
+
monotonous spacing is a tell.
|
|
358
|
+
- Touch targets ≥ 44×44 (extend hit area via `::before { inset: -10px }`
|
|
359
|
+
when the visual must stay smaller).
|
|
360
|
+
|
|
361
|
+
**Motion**
|
|
362
|
+
- Ease out with exponential curves (ease-out-quart/quint/expo); no bounce,
|
|
363
|
+
no elastic, no browser-default `ease`.
|
|
364
|
+
- Exits run ~75% of the enter duration.
|
|
365
|
+
- `prefers-reduced-motion` alternative is mandatory for every animation.
|
|
366
|
+
- Never animate CSS layout properties without real need; motion conveys
|
|
367
|
+
state on product surfaces, never decoration.
|
|
368
|
+
- The uniform fade-and-rise reveal on every scrolled section is a tell —
|
|
369
|
+
each reveal fits what it reveals; zero motion is not the fix either.
|
|
370
|
+
- Reveal animations enhance an already-visible default — never gate
|
|
371
|
+
content visibility on a class-triggered transition (ships blank in
|
|
372
|
+
hidden tabs and headless renderers).
|
|
373
|
+
|
|
374
|
+
**Interaction**
|
|
375
|
+
- Every interactive element ships all 8 states: default, hover,
|
|
376
|
+
focus-visible, active, disabled, loading, error, success. Missing any =
|
|
377
|
+
unfinished.
|
|
378
|
+
- Skeletons for loading, not spinners in content; empty states teach the
|
|
379
|
+
interface.
|
|
380
|
+
- Modal as first thought is laziness — exhaust inline/progressive
|
|
381
|
+
alternatives first.
|
|
382
|
+
|
|
383
|
+
**Absolute bans (match-and-refuse — rewrite the element, never ship):**
|
|
384
|
+
side-stripe borders (`border-left/right` > 1px as accent) · gradient text
|
|
385
|
+
(`background-clip: text`) · glassmorphism-as-default · the hero-metric
|
|
386
|
+
template (big number + small label + gradient accent) · identical
|
|
387
|
+
icon+heading+text card grids · tiny uppercase tracked eyebrow above every
|
|
388
|
+
section · numbered section markers (01/02/03) as default scaffolding ·
|
|
389
|
+
text overflowing its container at any breakpoint.
|
|
390
|
+
|
|
391
|
+
These laws are floors, not aspirations: §8's three default looks plus any
|
|
392
|
+
absolute-ban hit are constitution violations under `excellence-mandate`.
|
|
@@ -13,6 +13,10 @@ description: >
|
|
|
13
13
|
dev/clean-code-review wins; trying to break flows or find abuse vectors ->
|
|
14
14
|
dev/adversarial-review wins.
|
|
15
15
|
allowed-tools: [Read, Write, Edit, Bash, Grep, Glob, Agent]
|
|
16
|
+
metadata:
|
|
17
|
+
origin: community
|
|
18
|
+
source: https://github.com/nutlope/hallmark
|
|
19
|
+
license: MIT
|
|
16
20
|
---
|
|
17
21
|
|
|
18
22
|
# Design Review — `/brand design-review`
|
|
@@ -41,6 +45,12 @@ Do this BEFORE reviewing, in this order, and record what actually loaded:
|
|
|
41
45
|
3. **Read the brand guidelines / design system** — the review compares
|
|
42
46
|
against the project's OWN tokens (`design-system.yaml`, brandbook,
|
|
43
47
|
or §3 of the squad reference as fallback).
|
|
48
|
+
4. **Load the review references in this directory** —
|
|
49
|
+
`references/design-registers.md` (pick the register FIRST: brand vs
|
|
50
|
+
product changes what "good" means), `references/critique-protocol.md`
|
|
51
|
+
(two-isolated-subagent orchestration for deep reviews),
|
|
52
|
+
`references/slop-test.md` + `references/anti-patterns.md` (the
|
|
53
|
+
mechanical gates and the named-tell dictionary used below).
|
|
44
54
|
|
|
45
55
|
### Graceful degradation (honest, never silent)
|
|
46
56
|
|
|
@@ -102,11 +112,26 @@ For every captured surface, annotate deviations with exact values
|
|
|
102
112
|
- **Benchmark contrast** — for each major finding, one line on what the
|
|
103
113
|
named benchmark does instead.
|
|
104
114
|
|
|
115
|
+
## Slop gates (pre-verdict — MANDATORY)
|
|
116
|
+
|
|
117
|
+
Before issuing any verdict, run the reviewed surfaces through
|
|
118
|
+
`references/slop-test.md`: 58 pass/fail gates (every answer must be
|
|
119
|
+
**no**) plus the six-axis pre-emit rubric (P/H/E/S/R/V, squad reference
|
|
120
|
+
§8). Anti-pattern findings are named from
|
|
121
|
+
`references/anti-patterns.md` with their Critical/Major/Minor severity —
|
|
122
|
+
never described vaguely. When produced CSS carries the
|
|
123
|
+
`[arka:design-dna]` stamp, verify the recorded critique scores against
|
|
124
|
+
what the screenshots actually show; a stamp that flatters the artifact
|
|
125
|
+
is itself a finding.
|
|
126
|
+
|
|
105
127
|
## Verdict
|
|
106
128
|
|
|
107
129
|
`ON-BRAND` / `DEVIATIONS (n)` / `OFF-BRAND` — with the annotated
|
|
108
130
|
screenshot list, exact-value deviation table, and fix list ranked by
|
|
109
131
|
visual impact. A review with zero captured screenshots is INVALID.
|
|
132
|
+
`OFF-BRAND` and every rejected surface MUST cite the failed slop-gate
|
|
133
|
+
numbers and named anti-patterns (e.g. "gates 12, 41; purple-gradient
|
|
134
|
+
hero [Critical]") — verdicts on evidence, never on vibes.
|
|
110
135
|
|
|
111
136
|
## Output
|
|
112
137
|
|