feat(frontend): official design-system routing, motion skeletons, and redesign protocol#27
Merged
beefiker merged 2 commits intoJul 12, 2026
Conversation
…redesign protocol
Extend superloopy-frontend with three lazily loaded context references and
a dial-inference table, closing three request shapes the skill had no lane
for: platform briefs owned by an official component package, scroll/physics
motion that fails at implementation, and redesigns of living sites.
Per-file changes:
- skills/superloopy-frontend/references/system-map.md (new, 60 lines):
brief -> official-package routing table (Fluent, Material, Carbon,
Polaris, Atlaskit, Primer, GOV.UK, USWDS, Bootstrap, Radix, shadcn/ui,
Tailwind), honesty rules (never hand-roll a system's look, no
mostly-overridden token imports, one system per project),
aesthetic-vs-system boundary with the Liquid Glass labeled-approximation
caveat, and install-command reality anchors. These are user-project
dependencies only; Superloopy's package.json stays dependency-free.
- skills/superloopy-frontend/references/motion.md (new, 149 lines): named
bans (window scroll listeners, continuous values in React state, rAF
loops touching state, GSAP/Motion mixed in one tree, un-isolated motion
leaves, half-built motion) plus three canonical skeletons (GSAP
sticky-stack, GSAP horizontal pan, Motion whileInView stagger), each
with its known failure mode called out (pin at start: "top top", never
"top center") and reduced-motion fallbacks kept mandatory.
- skills/superloopy-frontend/references/redesign.md (new, 52 lines): mode
detection (greenfield/preserve/overhaul), audit-before-touching recorded
as REDESIGN_AUDIT.md under the evidence root, preservation rules
(IA/slugs/anchors, brand-color override path, copy voice, a11y wins,
analytics contracts), a never-change-silently list, priority-ordered
modernization levers, and an evolution-vs-redesign decision tree.
- skills/superloopy-frontend/SKILL.md (108 -> 122 lines): three router
bullets for the new references; Phase 1 gains a dial-inference table so
DESIGN_VARIANCE / MOTION_INTENSITY / VISUAL_DENSITY trace to the Design
Read instead of habit. Activation contract and frontmatter untouched.
- test/plugin.test.js: new pin test ("frontend skill routes system-map,
motion, and redesign references with dial inference") locking the router
bullets, the one-system lock, the scroll-listener ban, start: "top top",
useMotionValue, ctx.revert() cleanup, reduced-motion, REDESIGN_AUDIT.md,
and the never-change-silently list.
- docs/superloopy-file-audit.md: 3 inventory rows (role + Superloopy-native
boundary) for the new references.
- docs/superloopy-loop-golden-set.md: 3 evidence rows with must-keep
invariants for the new references.
- docs/superloopy-design-audit.md: new `frontend-context-routing` decision
row (reason / effect / guard).
- Version 0.9.1 -> 0.10.0; scripts/sync-version.mjs stamped
.claude-plugin/plugin.json, .codex-plugin/plugin.json,
.claude-plugin/marketplace.json, and package-lock.json.
Design context: mechanisms adapted (independently re-authored prose, no
external code or design files vendored) from the MIT-licensed taste-skill
v2 (github.com/Leonxlnx/taste-skill), whose dial/anti-slop spine
superloopy-frontend already draws on. Content lands as lazily loaded
references to keep the router light, matching the v0.7.1 payload
discipline.
Validation: node --test runs 544 tests, 540 pass; the 4 failures
(doctor-packed installedModelPolicy x3 + doctor CLI root fallback) fail
identically on origin/main in this environment (stale local
~/.codex/agents fleet vs model policy 2026-07-10) and are unrelated to
this change. All new files sit under the 550-line reviewability cap.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Merge the current main branch while preserving its Web/Qt router, then add web-only system, motion, and redesign references with dependency approval, static fallbacks, provenance, focused tests, and the 0.10.0 version sync.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
요약
이 PR을 현재
main위로 통합하고, 유용한 부분만 선택적으로 정리했습니다. 기존 Web/Qt 라우터와 Qt 레퍼런스는 그대로 유지하고, 웹 작업에서 필요할 때만 추가 컨텍스트를 지연 로드합니다.web.md: 실제 플랫폼 계약, 모션 구현, 운영 중인 사이트 리디자인 요청만 각각의 레퍼런스로 라우팅합니다.system-map.md: 디자인시스템을 시각적 분위기가 아니라 기존 의존성·호스트·정책·명시적 사용자 선택으로 판정합니다. 새 패키지는 설치 전에 반드시 승인을 받습니다. Primer는 제품 React (@primer/react), CSS (@primer/css), 마케팅/브랜드 (@primer/react-brand) 경로를 구분합니다.motion.md: GSAP/Motion 시작 템플릿에 반응형 재계산, 범위가 제한된 cleanup, 정적 reduced-motion 레이아웃, 실제 브라우저 검증 체크리스트를 포함합니다.redesign.md: 분석/검색 데이터가 없으면 추측하지 않고unavailable and unverified로 기록하며, 필드 이름과 필드 순서를 별도 계약으로 다룹니다.upstream-notice.md: MIT 기반 Taste Skill 적응 범위와 전체 저작권/허가 고지를 패키지에 보존합니다.What this helps
이 변경은 Superloopy 프런트엔드 스킬이 다음 세 상황에서 더 안전하고 구체적인 판단을 하도록 돕습니다.
Scope and safety
main의 Web/Qt 라우팅과 Qt 작업은 변경하지 않습니다.0.10.0으로 동기화했습니다.Validation
node --test test/*.test.jswith a cleanHOME: 561/561 passednode --test test/plugin.test.js: 19/19 passednode src/cli.js doctor --json:ok: true, file/design/reviewability audits cleannode scripts/sync-version.mjs: 0 files updated (idempotent)npm pack --dry-run --json --ignore-scripts: all four new references includedEnglish summary
Selectively integrates the useful mechanisms from the original proposal on top of current
main. It preserves the existing Web/Qt router, adds web-only lazy context for platform contracts, motion, and living-site redesigns, requires approval before dependencies, keeps static reduced-motion fallbacks, and retains the complete MIT attribution notice. No dependencies were added; version metadata is synchronized at0.10.0; the clean test suite passes 561/561.