docs(figma): storyboard blurb reworded + frames-are-app-states escalation (#2004)

Field feedback from a raw-API agent build (join-the-world-flow): the
catalog blurb's word 'animatics' encodes the PNG-slideshow architecture
the skill body explicitly forbids — an agent routing by the blurb
concludes the shipped behavior is frames-as-pictures. Reworded to
'reconstructed motion (frames read as states, not slides)' across all
catalog surfaces (skill frontmatter, CLAUDE.md, README, skills.mdx,
hyperframes router, figma guide).

Also codifies the stronger doctrine that build demonstrated as
storyboard rule 10: when every frame is the same product UI in
successive states, rebuild the app as live DOM (Phase-3 for stateful
parts, real pixels for static chrome — code what changes state, freeze
what doesn't) and perform frame deltas as interactions instead of
tweens. Spec §5.1 records the escalation + field origin.

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Vance Ingalls
2026-07-06 16:55:47 -07:00
committed by GitHub
co-authored by Claude Fable 5
parent 241f9d683e
commit ccc1308839
8 changed files with 49 additions and 25 deletions
@@ -9,20 +9,9 @@ import { fileURLToPath } from "node:url";
// wording in SKILL.md is the only thing that produces their usage signal. The
// manifest hash proves the skill changed; this proves a future prompt edit
// didn't silently drop the beacon slugs or the completion event.
const SKILL_MD = readFileSync(
join(
fileURLToPath(new URL(".", import.meta.url)),
"..",
"..",
"..",
"..",
"..",
"skills",
"figma",
"SKILL.md",
),
"utf8",
);
const REPO_ROOT = join(fileURLToPath(new URL(".", import.meta.url)), "..", "..", "..", "..", "..");
const read = (...parts: string[]): string => readFileSync(join(REPO_ROOT, ...parts), "utf8");
const SKILL_MD = read("skills", "figma", "SKILL.md");
describe("figma SKILL.md telemetry beacons", () => {
it("instructs the beacon for every MCP-only phase", () => {
@@ -37,3 +26,37 @@ describe("figma SKILL.md telemetry beacons", () => {
expect(SKILL_MD).toMatch(/--outcome=success\|error/);
});
});
// Routing pin: the catalog blurb once said "storyboard sections → animatics",
// which encodes the frames-as-pictures slideshow the skill's own cardinal rule
// forbids — a field agent routed by that word and concluded the shipped
// behavior was the PNG-sequence architecture. These assertions keep the
// frames-are-states framing on every discovery surface and keep the doctrine
// in the skill body, so a future sync can't silently reintroduce the old word.
describe("figma storyboard doctrine pins", () => {
const CATALOG_SURFACES: Array<[string, string[]]> = [
["skills/figma/SKILL.md", ["skills", "figma", "SKILL.md"]],
["CLAUDE.md", ["CLAUDE.md"]],
["README.md", ["README.md"]],
["docs/guides/skills.mdx", ["docs", "guides", "skills.mdx"]],
["skills/hyperframes/SKILL.md", ["skills", "hyperframes", "SKILL.md"]],
];
it("every catalog surface says reconstructed motion, never animatics", () => {
for (const [label, parts] of CATALOG_SURFACES) {
const content = read(...parts);
expect(content, label).toContain("reconstructed motion");
expect(content, label).not.toContain("animatics");
}
});
it("the source-of-truth description carries the frames-as-states framing", () => {
expect(SKILL_MD).toContain("frames read as states, not slides");
});
it("keeps the cardinal rule and the app-states escalation (rule 10)", () => {
expect(SKILL_MD).toContain("KEYFRAMES, not slides");
expect(SKILL_MD).toContain("code what changes state, freeze what doesn't");
expect(SKILL_MD).toContain("interaction to perform");
});
});