@erclx/canon 5.79.0 → 5.80.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/CHANGELOG.md +17 -0
- package/claude/.claude-plugin/plugin.json +1 -1
- package/claude/skills/canon-cli/SKILL.md +13 -10
- package/claude/skills/design-pick/SKILL.md +8 -0
- package/claude/skills/design-pick/references/design-config.md +9 -6
- package/claude/skills/design-references/REQUIREMENT.md +32 -0
- package/claude/skills/design-references/SKILL.md +120 -0
- package/claude/skills/design-references/references/films.md +90 -0
- package/claude/skills/design-references/references/sites.md +36 -0
- package/claude/skills/design-taste/SKILL.md +16 -4
- package/claude/skills/design-taste/references/adopted.md +5 -1
- package/claude/skills/design-taste/references/kinds.md +1 -0
- package/claude/skills/design-taste/references/preflight.md +27 -1
- package/claude/skills/design-taste/references/tells.md +2 -0
- package/claude/skills/review-ui/references/driving.md +33 -1
- package/claude/skills/search-craft/REQUIREMENT.md +3 -3
- package/claude/skills/search-craft/SKILL.md +12 -1
- package/claude/skills/target-scaffold/REQUIREMENT.md +31 -0
- package/claude/skills/target-scaffold/SKILL.md +44 -0
- package/claude/skills/target-setup/SKILL.md +5 -1
- package/claude/skills/ui-checklist/SKILL.md +5 -1
- package/claude/skills/ui-craft/SKILL.md +9 -9
- package/claude/skills/ui-craft/references/adopted.md +4 -2
- package/claude/skills/ui-craft/references/capture.md +8 -0
- package/claude/skills/ui-craft/references/controls.md +6 -0
- package/claude/skills/ui-craft/references/motion.md +6 -0
- package/claude/skills/ui-film/references/take-craft.md +2 -0
- package/docs/agents/output-shape.md +2 -1
- package/docs/target/projects.md +2 -2
- package/docs/workflow/skill-map.md +7 -5
- package/docs/workflow/visual-design-workflow.md +4 -0
- package/governance/ledger/skills/design-references/SKILL.md +38 -0
- package/governance/ledger/skills/design-taste/SKILL.md +36 -30
- package/governance/ledger/skills/design-taste/kinds.md +1 -0
- package/governance/ledger/skills/design-taste/tells.md +22 -20
- package/governance/ledger/skills/search-craft/SKILL.md +6 -0
- package/governance/ledger/skills/ui-craft/capture.md +10 -0
- package/governance/ledger/skills/ui-craft/controls.md +8 -0
- package/governance/ledger/skills/ui-craft/motion.md +9 -1
- package/package.json +3 -3
- package/src/capture/render.ts +154 -2
- package/src/capture/sections.ts +257 -0
- package/src/claude/cases/misc.ts +5 -0
- package/src/claude/cases/setup.ts +7 -0
- package/src/commands/capture.ts +149 -4
- package/src/commands/tooling.ts +72 -0
- package/src/take/perform.ts +29 -4
- package/src/tooling/list.ts +3 -0
- package/src/tooling/scaffold.ts +193 -0
- package/tooling/cloudflare/manifest.toml +1 -1
- package/tooling/cloudflare/reference.md +8 -0
|
@@ -9,14 +9,14 @@ description: Why a session needs a thinking step before an outside search, deriv
|
|
|
9
9
|
|
|
10
10
|
A session reaching outside the project runs one generic `WebSearch` and takes what ranks highest. Open results skew to third-party pages, two summaries of the same query can disagree on a fact, and an advocacy source can lean the answer. Scoped to authorities the session names itself, the same query returns primary sources.
|
|
11
11
|
|
|
12
|
-
Access is a second gap a session cannot derive. Some sites refuse a fetch
|
|
12
|
+
Access is a second gap a session cannot derive. Some sites refuse a fetch and others have no free route, while `plan-groundwork` and `write-doc` require an outside source and give no route to one. A quote drafted from recall is a third, since it runs no search and reads as exact while its wording or attribution is wrong.
|
|
13
13
|
|
|
14
14
|
## Must
|
|
15
15
|
|
|
16
16
|
- Name the field before a query is written, and derive its authorities from the kind of body the field trusts
|
|
17
|
-
- Run the query scoped to those authorities and open beside it, prefer the scoped result on a conflict
|
|
18
|
-
- Check a scoped result's domain before citing it, since the filter is not strict
|
|
17
|
+
- Run the query scoped to those authorities and open beside it, prefer the scoped result on a conflict and say so, and check a scoped result's domain before citing it
|
|
19
18
|
- Prefer a public API over a fetched page where one exists, and keep an access note grown from failures a session hit, dated by the commit that adds each line
|
|
19
|
+
- Quote a source only from a page or ledger row read in the session, with a quoting trigger in the description that reaches a session running no search
|
|
20
20
|
- Stop for the operator before a paid or logged-in route, and close with the practice skill's excuses, red flags, checklist, and the sources adopted and declined with the reason for each
|
|
21
21
|
|
|
22
22
|
## Must not
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: search-craft
|
|
3
|
-
description: Carries the thinking step a session takes before it searches outside the project, naming the field, deriving who that field treats as authoritative, and running a search scoped to those sources beside an open one, plus a dated note on which sites refuse access. Use before any outside search for evidence, papers, documentation, statistics, or opinion, when a procedure loads it at its sourcing step, or when asked "find me the strongest evidence on X", "where should I look for this", "what does the research say", "find papers on", "look up the docs for", or "what are people saying about". Do NOT use to format a citation, which belongs to the surface writing it, to source a Claude Code subject, which is a direct fetch of Anthropic's docs index, or to generate an image, which is not search.
|
|
3
|
+
description: Carries the thinking step a session takes before it searches outside the project, naming the field, deriving who that field treats as authoritative, and running a search scoped to those sources beside an open one, plus a dated note on which sites refuse access and the rule that a quote comes from a page read rather than recall. Use before any outside search for evidence, papers, documentation, statistics, or opinion, before quoting a source on any surface, when a procedure loads it at its sourcing step, or when asked "find me the strongest evidence on X", "where should I look for this", "what does the research say", "find papers on", "look up the docs for", or "what are people saying about". Do NOT use to format a citation, which belongs to the surface writing it, to source a Claude Code subject, which is a direct fetch of Anthropic's docs index, or to generate an image, which is not search.
|
|
4
4
|
metadata:
|
|
5
5
|
family: build
|
|
6
6
|
---
|
|
@@ -42,6 +42,10 @@ This skill carries the step before the search. Work out where the field's author
|
|
|
42
42
|
- Prefer a source's public API over a fetched and summarized HTML page where one exists. An API returns the dates, authors, and identifiers a citation needs, which a summary can drop.
|
|
43
43
|
- Reach the API with a plain request when it needs no key, rather than writing a wrapper for one search.
|
|
44
44
|
|
|
45
|
+
## Quote what was read
|
|
46
|
+
|
|
47
|
+
- Quote a source only from a page or a ledger row read in this session, never from recall, since a remembered quote reads as exact while its wording or attribution has drifted.
|
|
48
|
+
|
|
45
49
|
## Access note
|
|
46
50
|
|
|
47
51
|
Each line is a claim measured once, and the commit that adds it carries the date. Sites change their blocking without notice, so re-check a line before relying on it. Add a line only for a failure a session actually hit.
|
|
@@ -65,6 +69,7 @@ Read `${CLAUDE_SKILL_DIR}/references/adopted.md` only when extending this guidan
|
|
|
65
69
|
- You are about to write a query and have not named the field.
|
|
66
70
|
- Every source you are about to cite came from one open search.
|
|
67
71
|
- You named an authority because it is a site you remember, not because it is the kind of body the field trusts.
|
|
72
|
+
- You are about to quote a source you have not opened in this session.
|
|
68
73
|
|
|
69
74
|
### Results and access
|
|
70
75
|
|
|
@@ -82,6 +87,12 @@ These flags fire after the search has run.
|
|
|
82
87
|
- Every cited source's domain was checked, and a fact the summaries disagreed on was confirmed on the page itself.
|
|
83
88
|
- No paid, logged-in, or scraped route was taken without the operator's answer.
|
|
84
89
|
|
|
90
|
+
### Quotes
|
|
91
|
+
|
|
92
|
+
A quote carries its own check, since it can reach a surface with no search run.
|
|
93
|
+
|
|
94
|
+
- Every quote was copied from a page or a ledger row read in this session.
|
|
95
|
+
|
|
85
96
|
## What this delegates
|
|
86
97
|
|
|
87
98
|
- The form a citation takes: the surface writing it, such as the standard the procedure writes to
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: target-scaffold
|
|
3
|
+
description: Why an empty folder gets its own skill rather than a branch inside target-setup
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Scaffold requirement
|
|
7
|
+
|
|
8
|
+
## Gap
|
|
9
|
+
|
|
10
|
+
A developer in an empty folder has no skill to run. `target-setup` detects a stack from files that are not there yet, so it falls back to `base` and installs tooling onto nothing.
|
|
11
|
+
|
|
12
|
+
The tested non-interactive starters sit in the stack manifests. A session left to improvise picks a scaffolder from memory, answers its prompts wrong, or writes into the wrong folder.
|
|
13
|
+
|
|
14
|
+
## Must
|
|
15
|
+
|
|
16
|
+
- Offer only the stacks the catalog reports as carrying a starter, read at runtime rather than hardcoded
|
|
17
|
+
- Start the project through the CLI verb alone, so the starter that runs is the one `canon tooling verify` tests
|
|
18
|
+
- Write nothing into a folder that already holds files, and route that folder to `target-setup`
|
|
19
|
+
- Leave the project name to the person, refusing rather than renaming when a package manager would reject it
|
|
20
|
+
- Hand the started project to `target-setup` with nothing resolved ahead of its own detection
|
|
21
|
+
|
|
22
|
+
## Must not
|
|
23
|
+
|
|
24
|
+
- Run a scaffolder command directly, which drifts from the manifest the verb reads
|
|
25
|
+
- Pick a stack for a caller who named none
|
|
26
|
+
- Depend on the author typing its name, since `target-setup` routes an empty folder here
|
|
27
|
+
|
|
28
|
+
## Out of scope
|
|
29
|
+
|
|
30
|
+
- Installing tooling, governance, and indexes on the started project, which `target-setup` owns
|
|
31
|
+
- Shipping a starter template of its own, since the toolkit ships no application code
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: target-scaffold
|
|
3
|
+
description: Starts a new project on the toolkit from an empty folder. Asks for the stack and the project name, runs the stack's starter through `canon tooling scaffold`, then hands off to `target-setup`. Use when asked to "start a new project", "scaffold a project here", "start a new astro project here", "create a vite app from scratch", or "set up this empty folder". Assumes the `canon` CLI is on PATH. Do NOT use on a folder that already holds files, which is `target-setup`, or to change the stack of an existing project.
|
|
4
|
+
metadata:
|
|
5
|
+
family: setup
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# Scaffold
|
|
9
|
+
|
|
10
|
+
Starts a project in an empty folder and hands it to `target-setup`. The CLI owns the starter command, the empty-folder test, and the name check, while this skill picks the arguments, runs the verb, and routes on its record. It runs no scaffolder itself. Nor does it name a stack.
|
|
11
|
+
|
|
12
|
+
## Steps
|
|
13
|
+
|
|
14
|
+
1. Resolve the target. The current folder is the default, and its folder name becomes the project name. When the request names a different project name, the target is a new subfolder of that name.
|
|
15
|
+
2. Run `ls -A` on the target, where a subfolder that does not exist yet counts as empty. When it lists anything but `.git`, stop and route to `/canon:target-setup`, since the folder is already a project.
|
|
16
|
+
3. Run `canon tooling list --json` and offer only the stacks whose `scaffold` is `true`. A stack without a starter is a layer synced onto a project.
|
|
17
|
+
4. Resolve the stack. Take one the request named, or ask through the structured question surface with one option per offered stack.
|
|
18
|
+
- With no person present and no stack named, stop and list the offered names rather than picking one
|
|
19
|
+
5. Preview the stack, the target, the project name, and the command, then run it:
|
|
20
|
+
|
|
21
|
+
```bash
|
|
22
|
+
canon tooling scaffold <stack> <target> --json
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## Route on the record
|
|
26
|
+
|
|
27
|
+
Branch on the record's `ok` and `reason` rather than on the exit, which a shell function wrapping `canon` can flatten to zero.
|
|
28
|
+
|
|
29
|
+
| Record | Route |
|
|
30
|
+
| -------------------------------------- | ------------------------------------------------------------------------------------------------------------ |
|
|
31
|
+
| `ok: true` | Report the `files` it moved, then hand off below |
|
|
32
|
+
| `bad-name` | Offer the record's `suggested` name as a subfolder target, and rerun only once the person accepts or renames |
|
|
33
|
+
| `not-empty` | Route to `/canon:target-setup`, since something landed in the folder after step 2 |
|
|
34
|
+
| `scaffold-failed` or `no-output` | Report the `message` and the `scratch` folder the verb kept, and stop. Nothing reached the target. |
|
|
35
|
+
| `no-scaffold`, `no-manifest`, or other | Report the `message` and stop, since the catalog read in step 3 and the verb disagree |
|
|
36
|
+
|
|
37
|
+
Never rename the folder or retry with a name the person did not choose, since the folder name becomes the package name.
|
|
38
|
+
|
|
39
|
+
## Hand off
|
|
40
|
+
|
|
41
|
+
Invoke `canon:target-setup` with the target as the working folder. Its detect phase now finds the starter's files and resolves the stack from them, so pass it nothing this skill resolved.
|
|
42
|
+
|
|
43
|
+
- The hand-off is the last step. Install, governance, verify, and indexes all belong to `target-setup`.
|
|
44
|
+
- Report the stack, the target, the files the verb moved, and that setup ran, in that order.
|
|
@@ -55,7 +55,11 @@ else. Do not pause for a separate confirmation beyond the extras question.
|
|
|
55
55
|
|
|
56
56
|
## Declined states
|
|
57
57
|
|
|
58
|
-
|
|
58
|
+
Four states reach this skill that the chain does not serve. Name the destination for each, so the refusal routes rather than ends.
|
|
59
|
+
|
|
60
|
+
### An empty folder
|
|
61
|
+
|
|
62
|
+
Stop before `detect` when the target holds nothing but `.git`, and hand off to `target-scaffold`. Detection reads a stack from files a project carries, so an empty folder resolves to `base` and installs tooling onto no project. That skill starts the project and hands it back here.
|
|
59
63
|
|
|
60
64
|
### An existing project
|
|
61
65
|
|
|
@@ -33,12 +33,16 @@ The evidence comment already heads the list with `## What to look at`, so the fi
|
|
|
33
33
|
- [ ] <route>[, <width>]: <verb> <target> → <expected visual result>
|
|
34
34
|
```
|
|
35
35
|
|
|
36
|
+
### The parts of a box
|
|
37
|
+
|
|
36
38
|
Write each box so a session driving the running app can run it without guessing, with one rule for each part:
|
|
37
39
|
|
|
38
40
|
- **Route.** A path or the control that reaches it. A box naming none is driven from the address the driver opens.
|
|
39
41
|
- Write "from the page the app opens on" for a state reached by a sequence.
|
|
40
42
|
- **Width.** Only when the change can differ by width, such as layout, spacing, or anything responsive. Copy, color, or a state rendering the same everywhere leaves it off.
|
|
41
|
-
- **Verb.** An action a driver performs, such as "scroll to", "click", "resize to",
|
|
43
|
+
- **Verb.** An action a driver performs, such as "scroll to", "click", "resize to", "tab to", "wheel", "press", or "tap". Never "read" or "look at", which name no action.
|
|
44
|
+
- A changed surface that scrolls, snaps, or tracks the scroll takes "wheel" or "press" with the key, never "scroll to", which a scripted scroll passes on a page the wheel cannot move.
|
|
45
|
+
- A touch or hover behavior takes "tap" or "hover" at a phone width. A change that moves nothing takes no wheel box.
|
|
42
46
|
- **Taste.** End the line with `(taste)` when the result is a judgment of look or feel. A driver reports such a box as needing a person's eyes rather than passing it.
|
|
43
47
|
- **Setup.** State inline the setup the page does not open in and the fixture state it needs. End with `(local only)` when a hosted preview cannot reach it, such as a stopped service.
|
|
44
48
|
- **Fixture.** End with `(needs fixture)` when the drive fixture lacks the state. The builder adds it, or with no `canon/config/app-drive.toml` writes the setup inline and drops the marker.
|
|
@@ -15,15 +15,15 @@ Load this before building rather than after, since a missing state or a trapped
|
|
|
15
15
|
|
|
16
16
|
Read every reference on the always row for any rendered change, then each row the change matches.
|
|
17
17
|
|
|
18
|
-
| The change
|
|
19
|
-
|
|
|
20
|
-
| Any rendered change
|
|
21
|
-
| A click, press, drag, gesture, or popover dismissal
|
|
22
|
-
| A form, a field, validation, or a sign-in step
|
|
23
|
-
| An animation, transition, autoplay, or
|
|
24
|
-
| A destructive action, an edit cancel,
|
|
25
|
-
| A rendered string, heading, label, or link
|
|
26
|
-
| A rendered surface has changed and is about to be handed over
|
|
18
|
+
| The change | Read |
|
|
19
|
+
| ---------------------------------------------------------------------------------------------------- | ------------------------------------- |
|
|
20
|
+
| Any rendered change | `a11y.md`, `keyboard.md`, `states.md` |
|
|
21
|
+
| A click, press, drag, gesture, or popover dismissal | `pointer.md` |
|
|
22
|
+
| A form, a field, validation, or a sign-in step | `forms.md` |
|
|
23
|
+
| An animation, transition, autoplay, carousel, or scroll-driven or dragged motion | `motion.md` |
|
|
24
|
+
| A destructive action, an edit cancel, a hover or disabled state, or chrome that looks like a control | `controls.md` |
|
|
25
|
+
| A rendered string, heading, label, or link | `copy.md` |
|
|
26
|
+
| A rendered surface has changed and is about to be handed over, or a change scrolls or snaps | `capture.md` |
|
|
27
27
|
|
|
28
28
|
Each name sits under `${CLAUDE_SKILL_DIR}/references/`. A row's reference is read whole, since its sections name the cases a change reaches without saying so.
|
|
29
29
|
|
|
@@ -12,11 +12,13 @@ Every bullet in a reference has its own source row in a ledger outside the plugi
|
|
|
12
12
|
Each field below names the source its references cite, and a house choice covers a threshold or a scope no source states.
|
|
13
13
|
|
|
14
14
|
- **Web accessibility.** The W3C's [WCAG 2.2](https://www.w3.org/TR/WCAG22/) and the [ARIA Authoring Practices Guide](https://www.w3.org/WAI/ARIA/apg/) back the accessibility, keyboard, pointer, and motion references.
|
|
15
|
-
- **CSS behavior.** [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS) and the CSS specifications back the focus ring, `color-scheme`, and
|
|
15
|
+
- **CSS behavior.** [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS) and the CSS specifications back the focus ring, `color-scheme`, overflow, cursor, and hover query bullets.
|
|
16
16
|
- **Native targets.** Apple's and Android's platform guidelines back the native touch target figures in `pointer.md`.
|
|
17
17
|
- **Forms and copy.** The [GOV.UK Design System](https://design-system.service.gov.uk/) and its style guide back `forms.md` and the copy and casing sections of `copy.md`.
|
|
18
|
+
- **Interaction design.** [Ben Shneiderman](https://www.cs.umd.edu/~ben/)'s direct manipulation paper and the motion system of [Material Components](https://github.com/material-components/material-components-android) back the reader-paced section of `motion.md`.
|
|
19
|
+
- **Web performance.** Google's [web.dev](https://web.dev/) guidance on layout shift backs the held-size bullet in `motion.md`.
|
|
18
20
|
- **Usability research.** The [Nielsen Norman Group](https://www.nngroup.com/articles/) backs most of `states.md`, part of `controls.md`, and the link sections of `copy.md`.
|
|
19
|
-
- **Capture.** `capture.md` is a house procedure, with its reflow width taken from the WCAG reflow criterion `a11y.md` cites.
|
|
21
|
+
- **Capture.** `capture.md` is a house procedure, with its reflow width taken from the WCAG reflow criterion `a11y.md` cites. Its keyboard pass for a change that moves rests on WCAG 2.1.1 Keyboard.
|
|
20
22
|
|
|
21
23
|
## Where the rows sit
|
|
22
24
|
|
|
@@ -35,6 +35,14 @@ Only a change with no visible result in any reachable state is exempt, such as a
|
|
|
35
35
|
- Capture a state case at one width, driving states a first render cannot reach, such as an open menu.
|
|
36
36
|
- Add a surface's case with the surface, and remove it with the surface.
|
|
37
37
|
|
|
38
|
+
## What a moving change owes
|
|
39
|
+
|
|
40
|
+
- Verify a change that scrolls, snaps, or tracks the scroll with the input a person uses, at each width it is captured at. A scripted `scrollIntoView` only brings a target into view.
|
|
41
|
+
- Send the wheel in 100 px notches at two paces, spaced and in a burst, since a snap or scroll-linked page can stall at one pace and move at the other.
|
|
42
|
+
- Move the same surface with the keyboard, through the arrow keys and Page Down, since a surface the wheel moves and the keys cannot fails keyboard operation.
|
|
43
|
+
- Sample the motion at fixed steps across its range, reading the position after each notch or key, never only where it ends.
|
|
44
|
+
- Drive a touch or hover behavior in a touch session, since a resized desktop window keeps hover on and cannot fail a hover query.
|
|
45
|
+
|
|
38
46
|
## Sharing a capture
|
|
39
47
|
|
|
40
48
|
- Write a capture into a folder named `evidence`, which the pull request comment collects from.
|
|
@@ -12,7 +12,13 @@
|
|
|
12
12
|
- Say why a control is disabled, in text beside it or a tooltip, and keep it focusable through `aria-disabled` when the reason matters.
|
|
13
13
|
- Declare `color-scheme` on `:root` to match each theme, so scrollbars and form controls follow the theme instead of staying light.
|
|
14
14
|
|
|
15
|
+
## Signifiers
|
|
16
|
+
|
|
17
|
+
- Give nothing a control's look, such as a button fill or a tab underline, unless it acts, since the look promises a response.
|
|
18
|
+
- Keep the default cursor on decorative chrome, such as a mock tab bar, a status pill, or an address bar.
|
|
19
|
+
|
|
15
20
|
## Hover and focus effects
|
|
16
21
|
|
|
17
22
|
- Keep content shown on hover or focus dismissible without moving the pointer, hoverable, and visible until the trigger leaves or the person dismisses it (WCAG 1.4.13).
|
|
18
23
|
- Change no context, such as navigating, submitting, or moving focus, when a control gains focus or changes value, unless the person was told first (WCAG 3.2.1, 3.2.2).
|
|
24
|
+
- Put hover styles behind `@media (hover: hover)`, since a touch screen keeps the last tapped element in hover.
|
|
@@ -6,6 +6,12 @@
|
|
|
6
6
|
- Halt an auto-advancing carousel or ticker while it holds keyboard focus or pointer hover.
|
|
7
7
|
- Never flash content more than three times in any one second (WCAG 2.3.1).
|
|
8
8
|
|
|
9
|
+
## Motion the reader drives
|
|
10
|
+
|
|
11
|
+
- When the reader sets the pace, as with a scroll, a drag, or a swipe, move by the input rather than a timer, so stopping halfway leaves the motion halfway and reversing the input reverses it.
|
|
12
|
+
- Never blend two texts mid-transition. Swap them at a threshold so every moment shows one readable state, with no blank frame between them.
|
|
13
|
+
- Keep a component's outer size fixed while it animates, or swaps instantly under reduced motion, letting its contents give and take room inside it, so the page around it never moves.
|
|
14
|
+
|
|
9
15
|
## Reduced motion
|
|
10
16
|
|
|
11
17
|
- Honor `prefers-reduced-motion: reduce` for every animation and transition that conveys no state. Remove it or replace it with an instant change.
|
|
@@ -83,6 +83,8 @@ Two rules hold once a beat is filmed.
|
|
|
83
83
|
- Use a `move` to a point only for a target the page reveals on hover, and follow it with the click
|
|
84
84
|
- Read each target off the served page before writing it. The verb refuses `target-missing` rather than filming a guess, and a refusal costs a reload.
|
|
85
85
|
|
|
86
|
+
Both forms reach inside an open shadow root, such as a web component banner. A document-tree match wins over one inside a root, unless a `text=` match contains the root's match, where the inner one wins. A selector cannot span a shadow boundary, and a target inside a closed root or a frame refuses as missing.
|
|
87
|
+
|
|
86
88
|
## The pointer
|
|
87
89
|
|
|
88
90
|
- Draw no pointer in the page. The edit draws one from the log at a constant size, and two pointers on one frame leave the viewer guessing which one acted.
|
|
@@ -46,7 +46,7 @@ Discover names at runtime rather than hardcoding them.
|
|
|
46
46
|
|
|
47
47
|
| Command | Returns |
|
|
48
48
|
| --------------------------------- | ---------------------------------------------------------------- |
|
|
49
|
-
| `canon tooling list --json` | Stacks, extends chain, dep and script counts
|
|
49
|
+
| `canon tooling list --json` | Stacks, extends chain, dep and script counts, scaffold flag |
|
|
50
50
|
| `canon gov list --json` | Governance stacks, rule sets, evidence, and unreferenced rules |
|
|
51
51
|
| `canon gov detect --json` | Opt-in rules a target's dependencies and paths propose |
|
|
52
52
|
| `canon claude seeds list --json` | Seed doc sources with content |
|
|
@@ -75,6 +75,7 @@ canon tooling sync astro /path/to/project --write
|
|
|
75
75
|
canon tooling inject base /path/to/project --configs --seeds
|
|
76
76
|
canon tooling prune-gitignore base /path/to/project
|
|
77
77
|
canon tooling verify vite-react
|
|
78
|
+
canon tooling scaffold astro /path/to/empty-folder --json
|
|
78
79
|
canon audits run --json
|
|
79
80
|
canon secrets scan --json
|
|
80
81
|
canon deps audit --json
|
package/docs/target/projects.md
CHANGED
|
@@ -36,8 +36,8 @@ To develop against a checkout, run `claude --plugin-dir <toolkit>/claude`.
|
|
|
36
36
|
|
|
37
37
|
## Scaffold
|
|
38
38
|
|
|
39
|
-
1.
|
|
40
|
-
2.
|
|
39
|
+
1. In an empty folder, invoke `canon:target-scaffold`. It asks for the stack, runs the stack's starter, and hands off to `canon:target-setup`.
|
|
40
|
+
2. Otherwise invoke `canon:target-setup` in Claude Code. It detects the stack, previews the chain with the opt-in rules `canon gov detect` proposes, and runs it on your confirmation.
|
|
41
41
|
|
|
42
42
|
The chain runs these phases:
|
|
43
43
|
|
|
@@ -10,10 +10,11 @@ Groups run in the order a project meets them. Every name `canon claude skills li
|
|
|
10
10
|
|
|
11
11
|
## Set up a project
|
|
12
12
|
|
|
13
|
-
| Skill
|
|
14
|
-
|
|
|
15
|
-
| `canon:target-
|
|
16
|
-
| `canon:
|
|
13
|
+
| Skill | When to use |
|
|
14
|
+
| ----------------------- | ------------------------------------------------- |
|
|
15
|
+
| `canon:target-scaffold` | In an empty folder, to start a project on a stack |
|
|
16
|
+
| `canon:target-setup` | On a fresh scaffold, to run the install chain |
|
|
17
|
+
| `canon:deploy-app` | When a project is ready to publish |
|
|
17
18
|
|
|
18
19
|
## Decide what to build
|
|
19
20
|
|
|
@@ -26,6 +27,7 @@ Groups run in the order a project meets them. Every name `canon claude skills li
|
|
|
26
27
|
| `canon:plan-groundwork` | The state is unmeasured and approaches compete |
|
|
27
28
|
| `canon:decision-escalate` | Open decisions turn on your preference |
|
|
28
29
|
| `canon:proposal-critique` | A proposal needs questioning before it is built |
|
|
30
|
+
| `canon:design-references` | A design round has no real site to look at |
|
|
29
31
|
| `canon:design-pick` | The call is taste, wanting candidates side by side |
|
|
30
32
|
| `canon:task-board` | A decided item needs a file on the board |
|
|
31
33
|
| `canon:plan-feature` | The approach is settled and needs a plan |
|
|
@@ -44,7 +46,7 @@ Groups run in the order a project meets them. Every name `canon claude skills li
|
|
|
44
46
|
| `canon:deprecation-migration` | Deleting or replacing code something may call |
|
|
45
47
|
| `canon:code-craft` | Before writing a function, class, or module |
|
|
46
48
|
| `canon:review-craft` | Reviewing a change |
|
|
47
|
-
| `canon:search-craft` | Before searching outside
|
|
49
|
+
| `canon:search-craft` | Before searching outside or quoting a source |
|
|
48
50
|
| `canon:systematic-debugging` | A test fails or a bug surfaces |
|
|
49
51
|
| `canon:design-taste` | Drafting or judging an interface |
|
|
50
52
|
| `canon:ui-craft` | Building or judging a component's behavior |
|
|
@@ -75,10 +75,14 @@ A close posts as `## UI review closed`. The reviewers lift the draft mark on the
|
|
|
75
75
|
|
|
76
76
|
Most projects author design in the loop above and need nothing more. Start with `canon:design-pick`, which drafts candidates as frames on a [Frameboard](https://www.npmjs.com/package/frameboard) board and takes your pick, then record the pick with `canon:design-record`. `canon:design-identity` drafts a logo mark and social card the same way.
|
|
77
77
|
|
|
78
|
+
- Run `canon:design-references` first when a round has nothing real to look at, with a site address or bare to capture the project's list and then a default one.
|
|
79
|
+
- It fills a `references` page on the same board with section shots at each width, a filmed scroll, and a few hovers, each frame naming its source.
|
|
80
|
+
|
|
78
81
|
A pick round drafts on `.canon/board/` unless the project names another board in `canon/config/design.toml`.
|
|
79
82
|
|
|
80
83
|
- Set `board` when your design sync reads another Frameboard board, so the picked frame lands without a redraw.
|
|
81
84
|
- Leave `project` unset to keep rounds in their own `picks` project on that board.
|
|
85
|
+
- Set `references` to an array of site addresses to replace the default list `canon:design-references` captures when you name no site.
|
|
82
86
|
|
|
83
87
|
A graphical tool earns its place when design is the product, a designer owns it, and it changes more often than code. Then the tool is the source of truth, and `canon/DESIGN.md` carries a top note naming the upstream project.
|
|
84
88
|
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: Design references skill ledger
|
|
3
|
+
description: Sources for claude/skills/design-references/SKILL.md, being the copy-structure rule, the DESIGN.md collection and its license, and the capture and film decisions behind the steps
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Design references skill ledger
|
|
7
|
+
|
|
8
|
+
The field is design practice and content licensing. A reference library's own terms carry where copying stops, and the community DESIGN.md collection's license carries what a run may fetch and read. The capture and film steps rest on measurements a groundwork track took against four live sites, so their rows are house choices naming the failure each prevents.
|
|
9
|
+
|
|
10
|
+
The skill is not a practice skill, so this ledger cites the rules a reader would contest rather than every bullet. Steps that call a verb route to it and take no row.
|
|
11
|
+
|
|
12
|
+
## What a draft may take
|
|
13
|
+
|
|
14
|
+
| Bullet | Source | Read |
|
|
15
|
+
| ------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------- |
|
|
16
|
+
| Take layout, rhythm, and shape | [Mobbin MCP](https://mobbin.com/mcp): "Do not copy protected designs, branding, text, or assets verbatim." | 2026-11-08 |
|
|
17
|
+
| Never another product's text or marks | [Mobbin MCP](https://mobbin.com/mcp): the same line, read as the boundary a reference library sets for a draft drawn from it | 2026-11-08 |
|
|
18
|
+
| Never a value named as a value | House choice: a draft taking another site's colors, sizes, and fonts ships that site's brand, and a value written into a caption is copied by the next arm that reads it | 2026-11-08 |
|
|
19
|
+
| Name the source on every frame | House choice: a frame with no source on a board of designs reads as a design, so a later round lands a reference in the record as though the project drew it | 2026-11-08 |
|
|
20
|
+
|
|
21
|
+
## Name what the shots show
|
|
22
|
+
|
|
23
|
+
| Bullet | Source | Read |
|
|
24
|
+
| ----------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------- |
|
|
25
|
+
| The community collection | [VoltAgent awesome-design-md, License](https://github.com/VoltAgent/awesome-design-md/blob/fcc70284932276d085f01ef9f83edde90b1258cb/README.md#license): MIT, and "The extracted design tokens represent publicly visible CSS values." | 2026-11-08 |
|
|
26
|
+
| Vocabulary alone, no value | [VoltAgent awesome-design-md, License](https://github.com/VoltAgent/awesome-design-md/blob/fcc70284932276d085f01ef9f83edde90b1258cb/README.md#license): "We do not claim ownership of any site's visual identity." The tokens stay the site's brand, so a run reads names only | 2026-11-08 |
|
|
27
|
+
| Pinned commit, bumped by hand | House choice: a moving head changes the vocabulary between two runs of one site, so two references pages read in different words. The pin is the head on the read date | 2026-11-08 |
|
|
28
|
+
| An absent file never stops it | House choice: the collection covers about eighty sites, so most sites an operator names have no file, and a run stopping there captures nothing | 2026-11-08 |
|
|
29
|
+
|
|
30
|
+
## Capture and film
|
|
31
|
+
|
|
32
|
+
| Bullet | Source | Read |
|
|
33
|
+
| --------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- |
|
|
34
|
+
| One shot per section | House choice: a full-page image of a long site cannot be scanned, and sections cut where a designer would name them came back on Notion, Vercel, and Linear in a groundwork spike | 2026-11-08 |
|
|
35
|
+
| Film a scroll rather than trust a still | House choice: a still at one scroll position painted Notion's scroll-linked logo strip over its hero in a groundwork spike, and a filmed scroll showed it where a visitor sees it | 2026-11-08 |
|
|
36
|
+
| Hovers at desktop alone | House choice: a phone has no hover, and a mobile session reported `(hover: hover)` false in a groundwork spike | 2026-11-08 |
|
|
37
|
+
| One hover per take | House choice: a take refuses whole on one missing target, so a hover picked from a snapshot that misses would otherwise cost every film beside it | 2026-11-08 |
|
|
38
|
+
| No browser script of its own | House choice: a fix to how a page is shot lands once in `canon capture` or `canon take` rather than in every session's script | 2026-11-08 |
|
|
@@ -5,35 +5,39 @@ description: Sources for claude/skills/design-taste/SKILL.md, one row per bullet
|
|
|
5
5
|
|
|
6
6
|
# Design taste skill ledger
|
|
7
7
|
|
|
8
|
-
The field is visual design judgment.
|
|
8
|
+
The field is visual design judgment. Garrett's planes carry the layer order, NN/g carries redesign, tone, and control consistency, Apple carries motion, and Comeau carries shadow lighting. The ten defaults are catalog observations, as in the `tells.md` ledger, recording model output and never cited as an authority. `## What this delegates` routes, so it takes no table.
|
|
9
9
|
|
|
10
|
-
No outside authority takes a side on the four grey-box rules,
|
|
10
|
+
No outside authority takes a side on the four grey-box rules, four layer rules, the focus ring lock, or the greenfield mode. Each of those ten rows is a house choice naming the failure it prevents. The row leading story and content cites Garrett for the order and names its in-round half as a house choice.
|
|
11
11
|
|
|
12
12
|
## The defaults you are reaching past
|
|
13
13
|
|
|
14
|
-
| Bullet | Source
|
|
15
|
-
| ---------------------------- |
|
|
16
|
-
| Three equal cards | Catalog observation, [Redesign skill](https://github.com/nxpatterns/claude-taste-skill/blob/main/skills/redesign-skill/SKILL.md): "Three equal card columns as feature row. This is the most generic AI layout."
|
|
17
|
-
| The centered hero | Catalog observation, [Taste-Skill tells](https://github.com/leonxlnx/taste-skill/blob/main/skills/taste-skill/references/tells.md): "Centred headline, subtitle, two buttons, screenshot below"
|
|
18
|
-
| The violet-to-blue accent | Catalog observation, [Taste-Skill tells](https://github.com/leonxlnx/taste-skill/blob/main/skills/taste-skill/references/tells.md): "Violet / indigo gradients on hero, buttons and glows" are banned, reached past with "flat colour"
|
|
19
|
-
| Numbered labels | Catalog observation, [Taste-Skill v2 experimental](https://github.com/Leonxlnx/taste-skill-classics/blob/main/skills/taste-skill-v2-experimental/SKILL.md): "Step 1 / Step 2 / Step 3" is banned, since "The actual step content is the label"
|
|
20
|
-
| The scroll cue | Catalog observation, [Taste-Skill v2 experimental](https://github.com/Leonxlnx/taste-skill-classics/blob/main/skills/taste-skill-v2-experimental/SKILL.md): "Scroll cues are banned."
|
|
21
|
-
| A dot before every item | Catalog observation, [Taste-Skill v2 experimental](https://github.com/Leonxlnx/taste-skill-classics/blob/main/skills/taste-skill-v2-experimental/SKILL.md): a dot is "Only acceptable when conveying real semantic state"
|
|
22
|
-
| A glow for elevation | Catalog observation, [Impeccable craft floor](https://github.com/pbakaus/impeccable/blob/main/skill/reference/craft-floor.md): "shadows carry an offset and a soft blur. A zero-offset colored halo is decoration."
|
|
23
|
-
| A screenshot built of shapes | Catalog observation, [Taste-Skill v2 experimental](https://github.com/Leonxlnx/taste-skill-classics/blob/main/skills/taste-skill-v2-experimental/SKILL.md): "NO div-based fake product UI in the hero"
|
|
24
|
-
| Placeholder that announces | Catalog observation, [Redesign skill](https://github.com/nxpatterns/claude-taste-skill/blob/main/skills/redesign-skill/SKILL.md): "Placeholder company names like "Acme Corp"", replaced with "contextual, believable brand names"
|
|
25
|
-
| Warm verbs over meaning | Catalog observation, [Redesign skill](https://github.com/nxpatterns/claude-taste-skill/blob/main/skills/redesign-skill/SKILL.md): "Never use "Elevate", "Seamless", "Unleash"", and "Write plain, specific language"
|
|
14
|
+
| Bullet | Source | Read |
|
|
15
|
+
| ---------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- |
|
|
16
|
+
| Three equal cards | Catalog observation, [Redesign skill](https://github.com/nxpatterns/claude-taste-skill/blob/main/skills/redesign-skill/SKILL.md): "Three equal card columns as feature row. This is the most generic AI layout." | 2026-10-24 |
|
|
17
|
+
| The centered hero | Catalog observation, [Taste-Skill tells](https://github.com/leonxlnx/taste-skill/blob/main/skills/taste-skill/references/tells.md): "Centred headline, subtitle, two buttons, screenshot below" | 2026-10-24 |
|
|
18
|
+
| The violet-to-blue accent | Catalog observation, [Taste-Skill tells](https://github.com/leonxlnx/taste-skill/blob/main/skills/taste-skill/references/tells.md): "Violet / indigo gradients on hero, buttons and glows" are banned, reached past with "flat colour" | 2026-10-24 |
|
|
19
|
+
| Numbered labels | Catalog observation, [Taste-Skill v2 experimental](https://github.com/Leonxlnx/taste-skill-classics/blob/main/skills/taste-skill-v2-experimental/SKILL.md): "Step 1 / Step 2 / Step 3" is banned, since "The actual step content is the label" | 2026-10-24 |
|
|
20
|
+
| The scroll cue | Catalog observation, [Taste-Skill v2 experimental](https://github.com/Leonxlnx/taste-skill-classics/blob/main/skills/taste-skill-v2-experimental/SKILL.md): "Scroll cues are banned." | 2026-10-24 |
|
|
21
|
+
| A dot before every item | Catalog observation, [Taste-Skill v2 experimental](https://github.com/Leonxlnx/taste-skill-classics/blob/main/skills/taste-skill-v2-experimental/SKILL.md): a dot is "Only acceptable when conveying real semantic state" | 2026-10-24 |
|
|
22
|
+
| A glow for elevation | Catalog observation, [Impeccable craft floor](https://github.com/pbakaus/impeccable/blob/main/skill/reference/craft-floor.md): "shadows carry an offset and a soft blur. A zero-offset colored halo is decoration." | 2026-10-24 |
|
|
23
|
+
| A screenshot built of shapes | Catalog observation, [Taste-Skill v2 experimental](https://github.com/Leonxlnx/taste-skill-classics/blob/main/skills/taste-skill-v2-experimental/SKILL.md): "NO div-based fake product UI in the hero" | 2026-10-24 |
|
|
24
|
+
| Placeholder that announces | Catalog observation, [Redesign skill](https://github.com/nxpatterns/claude-taste-skill/blob/main/skills/redesign-skill/SKILL.md): "Placeholder company names like "Acme Corp"", replaced with "contextual, believable brand names", and "Lorem Ipsum. Never use placeholder latin text. Write real draft copy." | 2026-10-24 |
|
|
25
|
+
| Warm verbs over meaning | Catalog observation, [Redesign skill](https://github.com/nxpatterns/claude-taste-skill/blob/main/skills/redesign-skill/SKILL.md): "Never use "Elevate", "Seamless", "Unleash"", and "Write plain, specific language" | 2026-10-24 |
|
|
26
26
|
|
|
27
27
|
## The layers, and the order they settle
|
|
28
28
|
|
|
29
|
-
| Bullet | Source
|
|
30
|
-
| -------------------------------------- |
|
|
31
|
-
| A higher layer over a broken lower one | [Garrett, The Elements of User Experience, ch. 2](http://www.jjg.net/elements/pdf/elements_ch02.pdf): "the choices available to us on each plane are constrained by the decisions we make about issues on the planes below it"
|
|
32
|
-
| A lower layer through a finished one | House choice: a finished palette, type, and imagery hide a weak composition or layout, so the round judges the wrong layer and passes it
|
|
33
|
-
| A round varies one layer | House choice: a round varying several layers yields a pick that cannot say which difference decided it, so the next round repeats the question
|
|
34
|
-
| Never settle a higher layer first | [Garrett, The Elements of User Experience, ch. 2](http://www.jjg.net/elements/pdf/elements_ch02.pdf): "Each plane is dependent on the planes below it."
|
|
35
|
-
|
|
|
36
|
-
| Check the layers below the complaint | [Garrett, The Elements of User Experience, ch. 2](http://www.jjg.net/elements/pdf/elements_ch02.pdf): "When the choices we make don't align with those above and below, projects often derail"
|
|
29
|
+
| Bullet | Source | Read |
|
|
30
|
+
| -------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- |
|
|
31
|
+
| A higher layer over a broken lower one | [Garrett, The Elements of User Experience, ch. 2](http://www.jjg.net/elements/pdf/elements_ch02.pdf): "the choices available to us on each plane are constrained by the decisions we make about issues on the planes below it" | 2026-10-24 |
|
|
32
|
+
| A lower layer through a finished one | House choice: a finished palette, type, and imagery hide a weak composition or layout, so the round judges the wrong layer and passes it | 2026-10-24 |
|
|
33
|
+
| A round varies one layer | House choice: a round varying several layers yields a pick that cannot say which difference decided it, so the next round repeats the question | 2026-10-24 |
|
|
34
|
+
| Never settle a higher layer first | [Garrett, The Elements of User Experience, ch. 2](http://www.jjg.net/elements/pdf/elements_ch02.pdf): "Each plane is dependent on the planes below it." | 2026-10-24 |
|
|
35
|
+
| Story and content lead, in words | [Garrett, The Elements of User Experience, ch. 2](http://www.jjg.net/elements/pdf/elements_ch02.pdf): "decisions on the strategy plane will have a sort of "ripple effect" all the way up the chain." Settling them inside the requested round is a house choice, since words drawn as arms give a pick no visual difference to compare | 2026-11-08 |
|
|
36
|
+
| Check the layers below the complaint | [Garrett, The Elements of User Experience, ch. 2](http://www.jjg.net/elements/pdf/elements_ch02.pdf): "When the choices we make don't align with those above and below, projects often derail" | 2026-10-24 |
|
|
37
|
+
| The story settles once per page | [Garrett, The Elements of User Experience, ch. 2](http://www.jjg.net/elements/pdf/elements_ch02.pdf): strategy covers "what the people running the site want to get out of it but what the users want to get out of the site as well" | 2026-11-08 |
|
|
38
|
+
| An arc only where the kind requires it | House choice: an arc demanded of an application surface orders tools as an argument nobody reads, while a marketing page with none orders its claims by template | 2026-11-08 |
|
|
39
|
+
| Sort a fact by deleting its section | House choice: a page-wide fact written into each card drifts between sections, so the voice reads differently in the seventh section than in the first | 2026-11-08 |
|
|
40
|
+
| One content card per section | [Garrett, The Elements of User Experience, ch. 2](http://www.jjg.net/elements/pdf/elements_ch02.pdf): "scope takes the form of content requirements: a description of the various content elements that will be required." | 2026-11-08 |
|
|
37
41
|
|
|
38
42
|
## Grey-box when judging layers 1 to 4
|
|
39
43
|
|
|
@@ -46,14 +50,16 @@ No outside authority takes a side on the four grey-box rules, three layer rules,
|
|
|
46
50
|
|
|
47
51
|
## Lock what must not vary across a surface
|
|
48
52
|
|
|
49
|
-
| Bullet
|
|
50
|
-
|
|
|
51
|
-
| One accent
|
|
52
|
-
| One radius system
|
|
53
|
-
| One theme
|
|
54
|
-
| One copy register
|
|
55
|
-
| One light source
|
|
56
|
-
| One focus ring weight
|
|
53
|
+
| Bullet | Source | Read |
|
|
54
|
+
| ------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- |
|
|
55
|
+
| One accent | Catalog observation, [Redesign skill](https://github.com/nxpatterns/claude-taste-skill/blob/main/skills/redesign-skill/SKILL.md): "More than one accent color. Pick one. Remove the rest." | 2026-10-24 |
|
|
56
|
+
| One radius system | Catalog observation, [Taste-Skill tells](https://github.com/leonxlnx/taste-skill/blob/main/skills/taste-skill/references/tells.md): "One medium border radius (12–16px) on everything" is reached past with "Square or fully round, chosen once" | 2026-10-24 |
|
|
57
|
+
| One theme | Catalog observation, [Redesign skill](https://github.com/nxpatterns/claude-taste-skill/blob/main/skills/redesign-skill/SKILL.md): "A single dark-background section breaking an otherwise light page looks like a copy-paste accident." | 2026-10-24 |
|
|
58
|
+
| One copy register | [NN/g, The Four Dimensions of Tone of Voice](https://www.nngroup.com/articles/tone-of-voice-dimensions/): "Keep your brand personality consistent", the part that backs one register per composition | 2026-10-24 |
|
|
59
|
+
| One light source | [Comeau, Designing Beautiful Shadows in CSS](https://www.joshwcomeau.com/css/designing-shadows/): "we should decide on a single light source for all elements on the page", and black shadow "also desaturates it quite a bit" | 2026-10-24 |
|
|
60
|
+
| One focus ring weight | House choice: a focus ring varying by component reads as several products on one surface. The `ui-craft` skill owns the visibility floor | 2026-10-24 |
|
|
61
|
+
| One control style per job | [NN/g, Consistency and Standards](https://www.nngroup.com/articles/consistency-and-standards/): "they should use the same patterns everywhere inside the system" | 2026-11-08 |
|
|
62
|
+
| One motion model per kind | [Apple HIG, Motion](https://developer.apple.com/design/human-interface-guidelines/motion): "Many system components automatically include motion, letting you offer familiar and consistent experiences throughout your app or game." The three model names are a house choice, since the source names none | 2026-11-08 |
|
|
57
63
|
|
|
58
64
|
## Working on something that already exists
|
|
59
65
|
|
|
@@ -15,6 +15,7 @@ Impeccable's three mode references sort a surface by what the visitor came to do
|
|
|
15
15
|
| ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- |
|
|
16
16
|
| Optimizes for comprehension | Catalog observation, [Impeccable persuade mode](https://github.com/pbakaus/impeccable/blob/main/skill/reference/mode-persuade.md): "the opening must make the offer intelligible and desirable, expose a clear action" | 2026-10-24 |
|
|
17
17
|
| Composition carries the weight | House choice: a palette round run against a flat composition changes nothing a stranger notices, since section order is what they judge first | 2026-10-24 |
|
|
18
|
+
| The story carries an arc | House choice: a page with no stated arc orders its sections by template, so a stranger meets the proof before the claim it backs | 2026-11-08 |
|
|
18
19
|
| Vary the section shape | Catalog observation, [Taste-Skill tells](https://github.com/leonxlnx/taste-skill/blob/main/skills/taste-skill/references/tells.md): "Every section the same layout family" is a structural tell, reached past with "Different composition per section" | 2026-10-24 |
|
|
19
20
|
| Low density | Catalog observation, [Redesign skill](https://github.com/nxpatterns/claude-taste-skill/blob/main/skills/redesign-skill/SKILL.md): "Dense layouts work for data dashboards, not for marketing pages." | 2026-10-24 |
|
|
20
21
|
| Every claim names a real thing | Catalog observation, [Impeccable persuade mode](https://github.com/pbakaus/impeccable/blob/main/skill/reference/mode-persuade.md): the opening must "demonstrate something only this product can prove" | 2026-10-24 |
|