dreative 0.5.1 → 0.5.2
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/README.md +49 -27
- package/dist/cli/audit.js +206 -0
- package/dist/cli/audit.test.js +79 -0
- package/dist/cli/docsCheck.js +163 -0
- package/dist/cli/docsCheck.test.js +8 -0
- package/dist/cli/index.js +45 -9
- package/dist/server/preview.js +73 -73
- package/dist/server/store.js +11 -0
- package/dist/shared/artifacts.js +162 -0
- package/dist/shared/design.js +42 -22
- package/dist/shared/ruleSystem.js +130 -0
- package/dist/shared/ruleSystem.test.js +187 -0
- package/dist/shared/skillSystem.js +173 -0
- package/dist/shared/skillSystem.test.js +110 -0
- package/dist/ui/assets/{index--vztc_MR.js → index-CKwmbx2j.js} +13 -13
- package/dist/ui/index.html +12 -12
- package/package.json +5 -3
- package/skill/dreative/DESIGN.md +121 -93
- package/skill/dreative/PLAN.md +229 -92
- package/skill/dreative/SKILL.md +218 -137
- package/skill/dreative/frameworks/nextjs.md +13 -0
- package/skill/dreative/frameworks/react-vite.md +12 -0
- package/skill/dreative/frameworks/styling.md +14 -0
- package/skill/dreative/frameworks/sveltekit.md +10 -0
- package/skill/dreative/frameworks/vue-nuxt.md +12 -0
- package/skill/dreative/recipes/3d-recipes.md +44 -0
- package/skill/dreative/recipes/cinematic-recipes.md +19 -0
- package/skill/dreative/recipes/immersive-recipes.md +18 -0
- package/skill/dreative/recipes/media-recipes.md +60 -0
- package/skill/dreative/recipes/motion-recipes.md +44 -0
- package/skill/dreative/references/ARTIFACTS.md +180 -0
- package/skill/dreative/references/REFLEX_FONTS.json +44 -0
- package/skill/dreative/references/RULES.json +186 -0
- package/skill/dreative/references/SKILL_CONTRACT.md +30 -0
- package/skill/dreative/references/TIERS.md +42 -0
- package/skill/dreative/schemas/plan.schema.json +241 -0
- package/skill/dreative/schemas/verify.schema.json +61 -0
- package/skill/dreative/skills/3d.md +94 -267
- package/skill/dreative/skills/cinematic.md +56 -232
- package/skill/dreative/skills/experimental.md +108 -95
- package/skill/dreative/skills/immersive.md +61 -223
- package/skill/dreative/skills/interaction.md +9 -1
- package/skill/dreative/skills/media.md +135 -564
- package/skill/dreative/skills/mobile.md +128 -117
- package/skill/dreative/skills/motion.md +89 -256
- package/skill/dreative/skills/refined.md +116 -102
- package/skill/dreative/skills/ux.md +155 -144
- package/dist/server/ai.js +0 -177
package/skill/dreative/PLAN.md
CHANGED
|
@@ -41,22 +41,22 @@ Rules:
|
|
|
41
41
|
stills" and continuing is a FAILURE even though it's honest. The fix is a
|
|
42
42
|
question with at least two live options: "install <concrete MCP/tool name>
|
|
43
43
|
now and use it" vs "skip it, use <the specific fallback>". Ask it in the
|
|
44
|
-
|
|
44
|
+
decision phase (§3), phrased as a genuine fork, not a heads-up. Never
|
|
45
45
|
install tools silently; never silently degrade either.
|
|
46
46
|
- The probe result changes the blueprint: no video-gen → hero loops become
|
|
47
47
|
generated stills + ken-burns or a shader surface; **no image-gen → media
|
|
48
48
|
cells become `source-image` (DESIGN.md §7's priority: verified stock/CDN
|
|
49
49
|
photography), every planned cutout prop becomes a sourced-and-matted photo
|
|
50
50
|
or is cut, and any 3D of an organic real-world subject is re-planned as a
|
|
51
|
-
photo billboard,
|
|
51
|
+
photo billboard, a brand-native abstract instrument, or cut (3d.md §1–2 — coded
|
|
52
52
|
organic geometry never becomes the fallback)**; no browser tools → the
|
|
53
53
|
verification protocol's manual fallback (SKILL.md) must be declared up front.
|
|
54
54
|
Missing tools change WHERE assets come from, never whether media/3D rules
|
|
55
|
-
apply — sourced media carries the same treatment obligations (media.md §
|
|
55
|
+
apply — sourced media carries the same treatment obligations (media.md §1–3).
|
|
56
56
|
|
|
57
57
|
## 2. The blueprint (section-by-section, media-first)
|
|
58
58
|
|
|
59
|
-
Draft the page as a compact table BEFORE asking anything — the
|
|
59
|
+
Draft the page as a compact table BEFORE asking anything — the decision phase
|
|
60
60
|
presents choices about a concrete plan, not abstractions. Per section:
|
|
61
61
|
|
|
62
62
|
| section | layout family | media plan | motion treatment | interaction | intensity | fallback |
|
|
@@ -67,39 +67,52 @@ presents choices about a concrete plan, not abstractions. Per section:
|
|
|
67
67
|
(exists in repo / user must supply — name it), `none`. Media enters through
|
|
68
68
|
the motion system per `skills/media.md` — name the treatment (curtain reveal,
|
|
69
69
|
mask-shaped, hover-woken, media-plane distortion…), never "add an image".
|
|
70
|
-
At dial ≥ 7 the
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
70
|
+
At dial ≥ 7 the proven default is one meaningful media set-piece and the
|
|
71
|
+
blueprint names which section carries it. The outcome is a memorable moment
|
|
72
|
+
where media itself becomes the visitor-controlled spectacle, not a specific
|
|
73
|
+
catalog effect. A different solution uses a registered planning-time
|
|
74
|
+
substitution with observable success criteria and evidence IDs.
|
|
75
|
+
When the set-piece uses a depth dive (the default for image-led `award`
|
|
76
|
+
concepts with depth-capable assets), its
|
|
75
77
|
`generate-image` cell must plan a DEPTH-CAPABLE composition (a corridor,
|
|
76
78
|
room, landscape, machinery receding — something a camera can enter) and
|
|
77
79
|
the companion assets in the same cell: the depth map and/or the separated
|
|
78
80
|
foreground/background plates, generated in the same prompt world.
|
|
79
|
-
The set-piece is chosen via
|
|
80
|
-
media.md's exploration protocol: invent three brand-native candidates not
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
81
|
+
The set-piece is chosen via
|
|
82
|
+
media.md's exploration protocol: invent three brand-native candidates not
|
|
83
|
+
sourced from recipes, record them + the pick in `conceptExploration`, then
|
|
84
|
+
load recipe references only for feasibility/implementation/fallback and log
|
|
85
|
+
them in `recipeAccess`. A media plan assembled from listed effects before
|
|
86
|
+
original exploration is invalid. **Every media-plane / pixel-class cell
|
|
87
|
+
names WHICH image asset the effect consumes as its texture/source** — a
|
|
88
|
+
"shader plane" cell with no named image, or a plane carrying its own
|
|
89
|
+
separate texture (steel/noise/gradient) layered over the section's
|
|
90
|
+
photography, is an invalid cell (media.md §2's treatment-identity rule: the
|
|
91
|
+
treatment must transform the image's own pixels, aligned to its rect —
|
|
92
|
+
never a decorated rectangle floating over a static `<img>`).
|
|
93
|
+
**Custom 3D in a media cell must name
|
|
84
94
|
its asset source in the blueprint** — a GLB path, a generated/sourced
|
|
85
95
|
texture (the actual prompt or file), or the billboard cutout it will ride
|
|
86
96
|
on. "Custom 3D bean/bottle/plant geometry" with no named source is an
|
|
87
|
-
invalid cell: primitives can't produce an organic subject (3d.md §
|
|
97
|
+
invalid cell: primitives can't produce an organic subject (3d.md §1), so
|
|
88
98
|
re-plan it as rung 2 (photo billboard) or an abstract SUPPORTING form
|
|
89
|
-
(3d.md §
|
|
99
|
+
(3d.md §2 — never a generic promoted signature object) at plan time —
|
|
90
100
|
don't let the build stage discover this. The user picking "custom 3D" in
|
|
91
101
|
the media question grants the *medium*, not an exemption from the ladder.
|
|
92
|
-
Every 3D prop cell also names its BERTH (3d.md §
|
|
102
|
+
Every 3D prop cell also names its BERTH (3d.md §3): which lane/stage of
|
|
93
103
|
the section it occupies and what the layout does to make room — a prop
|
|
94
104
|
planned "over the hero image" or with no berth is an invalid cell.
|
|
95
|
-
At award
|
|
96
|
-
|
|
97
|
-
and asset source
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
105
|
+
At the `award` tier the outcome gate is one unmistakable dimensional or
|
|
106
|
+
spatial signature. The proven default is a recognizable real GLB or photoreal
|
|
107
|
+
cutout prop with a berth and asset source. A typography, photographic, data,
|
|
108
|
+
scene-instrument, or other alternative must use `award.spatialSignature` and
|
|
109
|
+
prove equivalent depth, recurrence, interaction, and dominance on desktop
|
|
110
|
+
and mobile. Generic orbs/blobs/toruses remain invalid.
|
|
111
|
+
At dial ≥ 8 the media column marks each hero/key image quiet-class or
|
|
112
|
+
PIXEL-class. The proven default is at least half pixel-class (minimum three,
|
|
113
|
+
set-piece included), each a different mechanism. A coherent alternative may
|
|
114
|
+
substitute `media.award.pixelCoverage` only when it visibly develops through
|
|
115
|
+
at least three materially different roles or states and carries runtime proof.
|
|
103
116
|
- **Travel map (mandatory when any element persists across sections).** If
|
|
104
117
|
the blueprint contains a fixed canvas object, a recurring signature, or any
|
|
105
118
|
scroll-morphing prop that lives through more than one section, add a travel
|
|
@@ -109,21 +122,18 @@ presents choices about a concrete plan, not abstractions. Per section:
|
|
|
109
122
|
object is scripted HIDDEN for that section. A persistent object without a
|
|
110
123
|
travel map is an unplanned collision that verify will find later — plan it
|
|
111
124
|
now. The set-piece at dial ≥ 8 must also be pixel-transforming per
|
|
112
|
-
media.md §
|
|
113
|
-
- **
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
"Curtain reveal ×5 + one set-piece" fails the quota: that is a page grazing
|
|
122
|
-
its rules, not a designed page. The quota tallies go in the plan file and
|
|
123
|
-
are re-counted at verify.
|
|
125
|
+
media.md §3 (placement choreography like orbit/collapse doesn't qualify).
|
|
126
|
+
- **Diversity or development (dial ≥ 7 / expressive+).** Choose and record one
|
|
127
|
+
path in `creativeStrategy`. Diversity uses at least four distinct mechanisms
|
|
128
|
+
across three distinct drivers. Development uses one coherent signature
|
|
129
|
+
mechanism that changes through at least three materially different roles or
|
|
130
|
+
states, supported by two quieter secondary mechanisms and two drivers. The
|
|
131
|
+
same reveal repeated with different values is neither path. This keeps the
|
|
132
|
+
proven anti-repetition safeguard without forcing unrelated effects into a
|
|
133
|
+
coherent concept.
|
|
124
134
|
- **motion treatment** — from motion.md/immersive.md/cinematic.md vocabulary,
|
|
125
|
-
with the dial-appropriate ambition. **motion.md §
|
|
126
|
-
plan gate, not a target:** at expressive
|
|
135
|
+
with the dial-appropriate ambition. **motion.md §5's verification inventory is a hard
|
|
136
|
+
plan gate, not a target:** at `expressive`/`award` ambition the blueprint
|
|
127
137
|
must enumerate every §9 item for its dial — which element carries it, what
|
|
128
138
|
triggers it — or explicitly name the item as cut with a reason. A plan that
|
|
129
139
|
neither covers nor justifies a §9 item is incomplete; rework it before
|
|
@@ -142,16 +152,43 @@ presents choices about a concrete plan, not abstractions. Per section:
|
|
|
142
152
|
it's fragile.
|
|
143
153
|
|
|
144
154
|
Plus four page-level lines: register + design read (DESIGN.md §2), signature
|
|
145
|
-
element, animation stack (ONE system: GSAP+Lenis or motion/react — motion.md §
|
|
155
|
+
element, animation stack (ONE system: GSAP+Lenis or motion/react — motion.md §2),
|
|
146
156
|
and the mobile strategy per ambitious effect (DESIGN.md §13).
|
|
147
157
|
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
158
|
+
**Signature-element plan gate.** The signature line is checked HERE, not
|
|
159
|
+
discovered at build time: if the signature is a visual OBJECT, it must be a
|
|
160
|
+
subject a stranger names correctly (3d.md §1–2's subject test). An abstract
|
|
161
|
+
crude coded organic form is a hard-gate failure. Generic spheres/orbs/rings/
|
|
162
|
+
blobs/toruses with no brand-native function remain invalid signatures. The
|
|
163
|
+
proven `award` default is a real GLB or rung-2 transparent photoreal cutout;
|
|
164
|
+
an alternative spatial typography, layered photography, data structure, or
|
|
165
|
+
interactive instrument uses a registered substitution and must outperform the
|
|
166
|
+
default on depth, recurrence, input response, and visual dominance. **Coded custom 3D is
|
|
167
|
+
capability-gated at the probe (§1):** offer/plan it only when the probe
|
|
168
|
+
verified an actual quality path — a real GLB in reach, image-gen for
|
|
169
|
+
albedo/label textures, an HDRI/environment source. No verified texture path
|
|
170
|
+
⇒ the `custom 3D` option is presented as "3D-look props (photoreal cutouts
|
|
171
|
+
sold with depth)" and every 3D cell is planned as a rung-2 billboard; coded
|
|
172
|
+
geometry without a texture path is never planned "to be figured out at
|
|
173
|
+
build".
|
|
174
|
+
|
|
175
|
+
**Previous-run divergence (reruns over the same project).** If
|
|
176
|
+
`.dreative/plan.md` (or verify.md) from an earlier run already exists in this
|
|
177
|
+
project and the user asked for a NEW take (rather than iterating the shipped
|
|
178
|
+
one), read the old plan first and diverge on at least: signature family,
|
|
179
|
+
set-piece family, hero layout family, and palette strategy. Reusing the old
|
|
180
|
+
run's choices because they're in context is the same reflex the entropy draw
|
|
181
|
+
exists to break — a rerun that a user would describe as "the same site again"
|
|
182
|
+
is a failed rerun. Record in the new plan file which axes diverged from the
|
|
183
|
+
previous run.
|
|
184
|
+
|
|
185
|
+
## 3. The decision phase
|
|
186
|
+
|
|
187
|
+
Run one short decision phase containing several sequential single-question
|
|
188
|
+
calls. Use the environment's structured question tool when available; otherwise
|
|
189
|
+
ask in chat. Never dump the whole pool in one message: each answer can change
|
|
190
|
+
what comes next (for example, a cinematic treatment makes the media question
|
|
191
|
+
matter more, while restyle depth can remove the mockup question).
|
|
155
192
|
|
|
156
193
|
**Skip what the prompt already answers.** Before asking anything, walk the pool
|
|
157
194
|
below against the user's prompt + attachments: a question whose answer is
|
|
@@ -162,6 +199,33 @@ the ambiguity ("you said animated — full scroll choreography, or calm
|
|
|
162
199
|
micro-interactions?"). Restate what you inferred from the prompt in the plan
|
|
163
200
|
file so silently-skipped questions are still auditable.
|
|
164
201
|
|
|
202
|
+
**Answers come only from the user, through the tool.** Never infer, assume,
|
|
203
|
+
or self-supply an answer to a question you posed — an unanswered question
|
|
204
|
+
blocks; a fabricated answer is a corrupted plan. If the user's reply to ANY
|
|
205
|
+
question is itself a question, a request to re-see options, or free text that
|
|
206
|
+
doesn't answer what was asked ("wait, what were the vibe options?"), that
|
|
207
|
+
question is NOT answered: respond to what they asked first (re-present the
|
|
208
|
+
options, clarify), then re-ask the original question as its own call. A
|
|
209
|
+
question consumed by a side-exchange and never re-asked is a lost decision —
|
|
210
|
+
track which pool items actually have answers, not which were merely posed.
|
|
211
|
+
Free text volunteered mid-round (a new feature, a constraint) is captured in
|
|
212
|
+
the plan file AND acknowledged in the next message, but doesn't substitute
|
|
213
|
+
for pending questions.
|
|
214
|
+
|
|
215
|
+
**Skip-honesty (the under-asking bug).** "Skip what the prompt already
|
|
216
|
+
answers" has a strict test: a question may be skipped ONLY when the prompt
|
|
217
|
+
LITERALLY contains its answer — and the plan file must QUOTE the prompt words
|
|
218
|
+
that answer it next to the skip. "I can infer a reasonable choice" is not a
|
|
219
|
+
skip license; silence in the prompt means ASK. In particular, **treatments
|
|
220
|
+
(item 2), media/asset types (item 3), and references (item 5) are never
|
|
221
|
+
skipped on inference at expressive/award ambition** — these are the three
|
|
222
|
+
questions that most change the build, and a round that jumps from vibe →
|
|
223
|
+
ambition → mockups → remarks without them delivered a design the user never
|
|
224
|
+
chose. Questions that are genuinely N/A (depth on a from-scratch build, scope
|
|
225
|
+
on a single page) are the only inference-skips allowed. If the asked count
|
|
226
|
+
lands under 4 on a non-trivial build, re-check the pool — you almost
|
|
227
|
+
certainly over-skipped.
|
|
228
|
+
|
|
165
229
|
Order most-decision-changing first, keep the total short (typically 3–5 asked,
|
|
166
230
|
hard cap 7). Structured tools always offer an "Other" free-text option, so
|
|
167
231
|
every question doubles as a remarks channel — and the last question asked
|
|
@@ -169,7 +233,7 @@ should explicitly invite extra direction.
|
|
|
169
233
|
|
|
170
234
|
1. **Depth** (redesigns of existing code only) — the §11 transformation-depth
|
|
171
235
|
ladder: restyle / re-layout / restructure / reimagine.
|
|
172
|
-
2. **Treatments** (multi-select — THE canonical skill-picker list). List every
|
|
236
|
+
2. **Treatments** (multi-select — THE canonical skill-picker list). List every
|
|
173
237
|
option **individually**, never pre-bundled into a combo choice (a
|
|
174
238
|
"refined+motion+interaction+ux+mobile" single option is a bug — the user
|
|
175
239
|
can't select a subset of a bundle). Mark the ones the request obviously
|
|
@@ -190,16 +254,11 @@ should explicitly invite extra direction.
|
|
|
190
254
|
- **cinematic** — "dark, moody, movie-like atmosphere: glow, particles, fluid surfaces (think film title sequence)"
|
|
191
255
|
- **refined** — "quiet luxury: lots of space, beautiful photography, very little movement — Apple/fashion-brand calm"
|
|
192
256
|
- **media** — "AI-generated images/video made for this page and woven into the motion (hero film loop, images that come alive)"
|
|
193
|
-
- **ux** — "everything actually works: menus, forms, cart, keyboard — pretty AND functional"
|
|
194
|
-
- **mobile** — first-class phone experience:
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
for every build via `ux` + DESIGN.md §13's required mobile strategy line,
|
|
199
|
-
so don't mark this "(Recommended)" just because a build is ambitious.
|
|
200
|
-
Recommend it only when the user asks for it, or the brief signals mobile
|
|
201
|
-
is a primary surface (e.g. explicitly mobile-first, or a mobile-heavy
|
|
202
|
-
audience/product).
|
|
257
|
+
- **ux** — "everything actually works: menus, forms, cart, keyboard — pretty AND functional". This is always included; show it as locked/included rather than optional.
|
|
258
|
+
- **mobile** — first-class phone experience: thumb-ergonomic layout and
|
|
259
|
+
effects re-authored for touch, not merely scaled down. This is always
|
|
260
|
+
included at baseline; mark it as an emphasized treatment only when mobile
|
|
261
|
+
is the primary surface or the user explicitly asks for a mobile-first take.
|
|
203
262
|
- **experimental** — user-facing phrasing: "go weird: images that tear/
|
|
204
263
|
dissolve/reassemble as you scroll, the camera diving into scenes, one
|
|
205
264
|
never-seen-before idea per section". Internally this is the
|
|
@@ -214,9 +273,18 @@ should explicitly invite extra direction.
|
|
|
214
273
|
"never seen before", or award-tier + immersive/cinematic/3d stacked
|
|
215
274
|
together — it's the difference between effects *placed on* the page and
|
|
216
275
|
the page *behaving* like the reference sites when you interact with it.
|
|
217
|
-
Plus "none —
|
|
276
|
+
Plus "none — no optional treatments" (`ux` and `mobile` still apply). Skip only when the user already
|
|
218
277
|
named the treatments or the request is trivially a restyle; read each
|
|
219
|
-
chosen `skills/<name>.md` before designing.
|
|
278
|
+
chosen `skills/<name>.md` before designing.
|
|
279
|
+
|
|
280
|
+
**For multi-page work, follow selection with one page-assignment matrix.**
|
|
281
|
+
Rows are pages and columns are the user-selected optional treatments. Let the
|
|
282
|
+
user pin any treatment to specific pages. For unpinned selections, propose a
|
|
283
|
+
distribution based on page purpose and intensity, then ask for one approval
|
|
284
|
+
of the complete matrix. User pins are authoritative; routing cannot move
|
|
285
|
+
them or activate unselected optional skills. `ux` and baseline `mobile` apply
|
|
286
|
+
to every page. Selecting all means every skill is used somewhere in the
|
|
287
|
+
overall plan—not that every page receives every effect.
|
|
220
288
|
|
|
221
289
|
**Propose extra, request-specific skills beyond this fixed list** when the
|
|
222
290
|
brief hints at something the 10 named treatments don't cover well (sound
|
|
@@ -241,18 +309,33 @@ should explicitly invite extra direction.
|
|
|
241
309
|
tokens/time, so "images only" or "placeholders" is a legitimate budget
|
|
242
310
|
choice, not a downgrade. If a needed tool is missing, this is where the
|
|
243
311
|
install offer goes ("I can add <X> MCP for video generation — ok?").
|
|
312
|
+
**Set the iteration expectation honestly:** when the user picks `custom
|
|
313
|
+
3D`, `custom props`, or (later) the `award` tier, say plainly — in the
|
|
314
|
+
question's description or the plan recap — that complex 3D motion and prop
|
|
315
|
+
choreography rarely land perfectly in one pass: the first build ships a
|
|
316
|
+
working version (planned fallbacks where an effect fails verification),
|
|
317
|
+
and 1–2 follow-up prompts to tune specific moments are normal and
|
|
318
|
+
expected. This is a disclosure, not a discouragement; it prevents
|
|
319
|
+
"the plan promised more than the page shows" disappointment, and it never
|
|
320
|
+
licenses shipping less than the plan — the verify gates still apply in
|
|
321
|
+
full on pass one.
|
|
244
322
|
4. **Ambition tier** — present each tier with a plain description, a
|
|
245
323
|
best-fit use case, AND its honest tradeoff (a user choosing blind between
|
|
246
324
|
"cool-sounding" labels is the failure this wording prevents):
|
|
247
|
-
- **
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
325
|
+
- **Solid (`solid`)** — polished, complete, responsive, and light on custom
|
|
326
|
+
effects. *Best for:* dashboards, apps,
|
|
327
|
+
content-heavy sites, corporate audiences, tight deadlines. *Tradeoff:*
|
|
328
|
+
looks professional, won't turn heads.
|
|
329
|
+
- **Premium (`premium`)** — a strong design read, deliberate media, and one
|
|
330
|
+
signature detail with restrained motion. *Best for:* business, commerce,
|
|
331
|
+
and marketing work that should feel distinctive without becoming an
|
|
332
|
+
experience site. *Tradeoff:* more craft and media work than solid.
|
|
333
|
+
- **Expressive (`expressive`)** — rich scroll motion, 3D accents, everything still
|
|
334
|
+
instantly usable. *Best for:* most product, e-commerce, and marketing
|
|
335
|
+
sites — the show/usability sweet spot and the default recommendation.
|
|
336
|
+
*Tradeoff:* heavier than premium, but visitors never fight the page.
|
|
337
|
+
- **Award (`award`)** — the page becomes an experience: immersive 3D, cinematic
|
|
338
|
+
pacing, experimental transitions (dial 9-10). *Best for:* portfolios,
|
|
256
339
|
launches, brand showcases, agency work — anywhere wow IS the goal.
|
|
257
340
|
*Tradeoff:* heaviest build, longest load, and deliberately unconventional —
|
|
258
341
|
visitors explore rather than skim, so it can frustrate someone who just
|
|
@@ -261,11 +344,11 @@ should explicitly invite extra direction.
|
|
|
261
344
|
pass — state that cost too.
|
|
262
345
|
**Which option gets "(Recommended)" is computed, and the default bias is
|
|
263
346
|
UP:** when the brief carries no strong signal either way, recommend
|
|
264
|
-
**expressive** — unnamed ambition becomes beige (DESIGN.md §2), and this
|
|
265
|
-
skill exists for drastic change. Recommend **
|
|
347
|
+
**expressive** — unnamed ambition becomes beige (DESIGN.md §2), and this
|
|
348
|
+
skill exists for drastic change. Recommend **solid** only on concrete
|
|
266
349
|
counter-signals: explicit "minimal / corporate / clean / subtle" language,
|
|
267
350
|
a product/app/dashboard surface rather than a marketing page, or a hard
|
|
268
|
-
deadline constraint (item 7). Recommending
|
|
351
|
+
deadline constraint (item 7). Recommending solid to a signal-free brief is
|
|
269
352
|
a bug, same class as the item-8 mockup inversion.
|
|
270
353
|
5. **References (ask unless the prompt already supplied them)** — "Do you have
|
|
271
354
|
any reference — an image/screenshot, a website you love, or a video of a
|
|
@@ -300,17 +383,17 @@ should explicitly invite extra direction.
|
|
|
300
383
|
assume "all" just because the brief said "redesign the site" — confirm it.
|
|
301
384
|
Also capture what's in this pass vs later, and any hard constraints
|
|
302
385
|
(existing brand tokens to keep, CMS/content that must survive, deadline
|
|
303
|
-
implying the
|
|
386
|
+
implying the solid tier).
|
|
304
387
|
8. **Mockups first?** — offer to build 1:1 mockups BEFORE the full build:
|
|
305
388
|
"Mockup the key pages first" / "Straight to build". **Which one is marked
|
|
306
389
|
"(Recommended)" is NOT static — compute it from the depth + ambition
|
|
307
|
-
answers already given:** reimagine or restructure depth, OR award
|
|
390
|
+
answers already given:** reimagine or restructure depth, OR `award`
|
|
308
391
|
ambition, mean this is among the biggest changes the tool can make, so
|
|
309
392
|
**"Mockup first" is the recommended option.** Recommend "Straight to
|
|
310
|
-
build" only when depth is restyle/re-layout AND ambition is
|
|
311
|
-
expressive. Getting this backwards (recommending straight-to-build on a
|
|
312
|
-
reimagine + award
|
|
313
|
-
is restructure/reimagine OR ambition is award
|
|
393
|
+
build" only when depth is restyle/re-layout AND ambition is solid/premium/
|
|
394
|
+
expressive. Getting this backwards (recommending straight-to-build on a
|
|
395
|
+
reimagine + award combo) is a bug, not a stylistic choice. When depth
|
|
396
|
+
is restructure/reimagine OR ambition is `award`, also offer a third
|
|
314
397
|
option: **"two divergent mockups"** — the two strongest concepts from the
|
|
315
398
|
explore pass (DESIGN.md §2) each built as a mockup, user picks. State the
|
|
316
399
|
honest cost (a second mockup is real tokens/time); it's an offer, never
|
|
@@ -337,7 +420,7 @@ defaults.
|
|
|
337
420
|
|
|
338
421
|
### Calibration references (what the top tiers actually look like)
|
|
339
422
|
|
|
340
|
-
When the user picks award
|
|
423
|
+
When the user picks the `award` tier or 3d/immersive/cinematic treatments,
|
|
341
424
|
these are the bar (fetch and study whichever is closest before designing):
|
|
342
425
|
|
|
343
426
|
- https://www.experiencethebestyou.com/en-GB/ — coordinated scroll choreography
|
|
@@ -353,7 +436,7 @@ these are the bar (fetch and study whichever is closest before designing):
|
|
|
353
436
|
`TextureLoader` — one model, N palettes. Scroll drives it with plain
|
|
354
437
|
`ScrollTrigger.create`; backgrounds are pre-rendered per-flavor video
|
|
355
438
|
loops, not live sims. Lesson: photoreal product 3D = real GLB + real label
|
|
356
|
-
texture + HDRI environment — never coded geometry (3d.md §
|
|
439
|
+
texture + HDRI environment — never crude organic coded geometry (3d.md §1) — and the
|
|
357
440
|
cheap parts (backgrounds) are pre-rendered video.
|
|
358
441
|
- https://www.cinetica.studio/ — the "composed chaos" register (stack
|
|
359
442
|
verified): Webflow + the FULL GSAP plugin suite (ScrollTrigger, SplitText,
|
|
@@ -370,7 +453,7 @@ these are the bar (fetch and study whichever is closest before designing):
|
|
|
370
453
|
darkness.
|
|
371
454
|
|
|
372
455
|
These teardowns were verified July 2026 and will age — sites redesign and
|
|
373
|
-
registers move on. At award
|
|
456
|
+
registers move on. At the `award` tier, when browser tools exist, spend ONE
|
|
374
457
|
fetch on a current source (Awwwards SOTD or godly.website) to confirm the
|
|
375
458
|
register you're chasing is still the frontier, and note in plan.md what you
|
|
376
459
|
saw. The stack LESSONS above outlive the sites themselves; the aesthetics
|
|
@@ -381,12 +464,34 @@ generated wallpapers behind text. If the environment has 3D-capable tooling and
|
|
|
381
464
|
the user opted in, build real 3D material (geometry, materials, lighting,
|
|
382
465
|
shader surfaces per `skills/3d.md`); reserve generated images/video for what
|
|
383
466
|
3D can't do. This tier only happens when the user explicitly chose it in the
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
## 4. Write the plan, then execute it
|
|
387
|
-
|
|
388
|
-
Persist the approved plan to `.dreative/plan.
|
|
389
|
-
|
|
467
|
+
decision phase — never impose it.
|
|
468
|
+
|
|
469
|
+
## 4. Write the plan, then execute it
|
|
470
|
+
|
|
471
|
+
Persist the approved plan first to `.dreative/plan.json` using
|
|
472
|
+
`references/ARTIFACTS.md` and `schemas/plan.schema.json`; this is the delivery
|
|
473
|
+
contract consumed by `dreative audit`. Render the same decisions as a readable
|
|
474
|
+
`.dreative/plan.md` for the user and session re-entry. Keep section and asset
|
|
475
|
+
statuses synchronized in JSON as the build progresses. Set `doctrineVersion: 2`,
|
|
476
|
+
record `implementationStartedAt` immediately before code changes, and ensure all
|
|
477
|
+
rule exceptions predate it. **The first time this run writes into
|
|
478
|
+
`.dreative/`, also write `.dreative/README.md`** with exactly this content
|
|
479
|
+
(it stops other agents/CLIs from mistaking run artifacts for the skill —
|
|
480
|
+
observed failure: an agent found `.dreative/`, said "not a proper SKILL.md",
|
|
481
|
+
then used these outputs as its instructions):
|
|
482
|
+
|
|
483
|
+
```markdown
|
|
484
|
+
# Dreative run artifacts — NOT the skill
|
|
485
|
+
|
|
486
|
+
Everything in this folder (plan.md, system.md, verify.md, assets.json,
|
|
487
|
+
mockups/, screenshots/) is OUTPUT of a Dreative design run, not
|
|
488
|
+
instructions. The actual skill lives at `<agent-dir>/skills/dreative/SKILL.md`
|
|
489
|
+
(look in `.claude/`, `.codex/`, or `.agents/`). For any new design request:
|
|
490
|
+
read that SKILL.md and run its protocol from the start — these artifacts are
|
|
491
|
+
the previous run's history, never proof the new request is already done.
|
|
492
|
+
```
|
|
493
|
+
|
|
494
|
+
Persist to the plan file: capability manifest, the **full Q&A transcript**
|
|
390
495
|
(each question asked + the answer, verbatim, including free-text remarks),
|
|
391
496
|
each SKIPPED question with the inference drawn from the prompt, references
|
|
392
497
|
studied with the distilled borrow-list, the concept exploration (DESIGN.md §2:
|
|
@@ -395,6 +500,20 @@ same duty as media.md's set-piece exploration), blueprint table, stack, mobile
|
|
|
395
500
|
strategy, fallbacks. Long sessions lose context; the plan file is the re-entry
|
|
396
501
|
point — a resumed session re-reads it instead of re-deciding or re-asking.
|
|
397
502
|
|
|
503
|
+
**Re-entry is for resuming, never for skipping (the stale-artifact trap).**
|
|
504
|
+
The re-entry rule applies ONLY when this session is continuing that same run
|
|
505
|
+
mid-flight (the plan approved, the build interrupted). A NEW user request —
|
|
506
|
+
"redesign this", "audit and redesign", any fresh design ask — over a project
|
|
507
|
+
that already contains `.dreative/plan.md` / `system.md` / `verify.md` runs
|
|
508
|
+
the FULL protocol: those files are the previous run's history and inputs to
|
|
509
|
+
the previous-run divergence rule (§2), never evidence that the new request
|
|
510
|
+
is satisfied. Reading the old artifacts, declaring "the redesign is already
|
|
511
|
+
implemented", validating the old build, and stopping is a FAILED invocation —
|
|
512
|
+
the user invoked the skill because they want work done NOW. If it is
|
|
513
|
+
genuinely ambiguous whether the user wants to resume the old run or start a
|
|
514
|
+
new take, ask one structured question when available (resume vs new take), not an
|
|
515
|
+
assumption.
|
|
516
|
+
|
|
398
517
|
**Then show the plan to the user in chat, before touching code.** Writing
|
|
399
518
|
`plan.md` is not the same as the user having seen it — after the last
|
|
400
519
|
question (§3.9) is answered, post a readable recap in the same conversation:
|
|
@@ -436,20 +555,38 @@ tweak feedback into the plan file before building.
|
|
|
436
555
|
**Execution order (always):**
|
|
437
556
|
|
|
438
557
|
1. **Assets first.** Generate every planned image/video/sequence NOW, at the
|
|
439
|
-
blueprint's aspect ratios, graded to the palette (media.md §
|
|
558
|
+
blueprint's aspect ratios, graded to the palette (media.md §4). Sections get
|
|
440
559
|
designed around real assets, not around placeholders that "will be swapped".
|
|
441
|
-
2. **Foundation.** Install and
|
|
560
|
+
2. **Foundation.** Install and wire the animation stack (motion.md §2 and the
|
|
561
|
+
motion recipe reference), fonts,
|
|
442
562
|
tokens, providers — before any section code.
|
|
443
563
|
3. **Sections** in blueprint order, each honoring its row (skills tagged per
|
|
444
564
|
section apply to that section).
|
|
445
565
|
4. **Effects + choreography** across sections (page-level timelines, transitions,
|
|
446
566
|
the signature element).
|
|
447
567
|
5. **Verification** — the full runtime protocol (SKILL.md §V: runtime gates +
|
|
448
|
-
self-critique, mobile first, evidence written to `.dreative/verify.
|
|
568
|
+
self-critique, mobile first, evidence written to `.dreative/verify.json` and
|
|
569
|
+
summarized in `.dreative/verify.md`).
|
|
449
570
|
Any effect that fails gets its planned fallback, and the final report says
|
|
450
571
|
so: "shipped the §2 fallback for X because Y".
|
|
451
572
|
|
|
573
|
+
**Execution is mandatory, not advisory.** Once the plan is approved, it MUST be
|
|
574
|
+
carried out in full:
|
|
575
|
+
|
|
576
|
+
- Work through blueprint rows top to bottom; a row is only closed when its code
|
|
577
|
+
is written AND its verification gate passes (or its named fallback shipped).
|
|
578
|
+
- Never end the session, summarize, or declare done while unshipped rows
|
|
579
|
+
remain. If interrupted or the context is compacted, re-read
|
|
580
|
+
`.dreative/plan.json` (using `plan.md` for narrative context) and resume from
|
|
581
|
+
the first unshipped row — do NOT
|
|
582
|
+
re-plan, re-ask, or restart.
|
|
583
|
+
- Cutting a row requires an explicit user decision or a hard technical blocker
|
|
584
|
+
named in the report; "ran long" is not a reason.
|
|
585
|
+
- Before the final report, walk `plan.json` row by row, mark each one, and run
|
|
586
|
+
`dreative audit`.
|
|
587
|
+
|
|
452
588
|
Report against the plan when done: each blueprint row → shipped / fallback /
|
|
453
|
-
cut (with reason), plus the motion inventory (motion.md §
|
|
589
|
+
cut (with reason), plus the motion inventory (motion.md §5) and the preservation
|
|
454
590
|
ledger when §11 applies. A build that silently diverges from its approved plan
|
|
455
|
-
is a bug even when it looks good
|
|
591
|
+
is a bug even when it looks good — and a plan left half-executed is a failed
|
|
592
|
+
task, not a partial success.
|