1实现原理 · 为什么它能做到
这是一份『冻结的原始版本』：v1 的 dial 驱动哲学、反 slop 规则与模式名词库被原样保留，供依赖其精确行为的老项目钉版安装。
CHANGELOG.md
The original release. Dial-driven philosophy, anti-slop rules, reference vocabulary of pattern names.
注：CHANGELOG 与 README 都把 v2 视为新默认、把本文件视为兼容性保险；本 skill 的价值不在创新而在『行为可复现』——升级 v2 可能破坏既有工作流的项目应显式安装 design-taste-frontend-v1。
用三个 1–10 档位（DESIGN_VARIANCE / MOTION_INTENSITY / VISUAL_DENSITY）驱动全篇规则分支，基线固定 8/6/4，并禁止用户改文件、只接受对话中的动态覆盖。
skills/taste-skill-v1/SKILL.md
The standard baseline for all generations is strictly set to these values (8, 6, 4). Do not ask the user to edit this file.
注：§6 给每个档位的 1-3 / 4-7 / 8-10 三段定义（如 VARIANCE 8-10 = Masonry、分数单位网格、2fr 1fr 1fr、padding-left: 20vw），§3 的规则再按档位条件触发——这是 v1 的『参数化设计纪律』核心。
把依赖治理写成强制前置步骤：导入任何第三方库前必须先读 package.json，缺包则先输出安装命令，禁止假设库存在。
skills/taste-skill-v1/SKILL.md
**DEPENDENCY VERIFICATION [MANDATORY]:** Before importing ANY 3rd party library (e.g. `framer-motion`, `lucide-react`, `zustand`), you MUST check `package.json`.
注：同节还含 Tailwind 版本锁（v3 项目不得用 v4 语法；v4 不得在 postcss.config.js 用 tailwindcss 插件，须用 @tailwindcss/postcss 或 Vite 插件）——这是本仓库少见的『构建配置正确性』约束。
框架层约定：默认 React/Next.js 与 RSC，交互组件必须抽成叶子组件加 'use client'，全局状态仅用于避免深层透传。
skills/taste-skill-v1/SKILL.md
* **State Management:** Use local `useState`/`useReducer` for isolated UI.
注：§2 同时规定 RSC SAFETY（provider 需包 'use client'）与 INTERACTIVITY ISOLATION（§4/§7 激活时交互 UI 必须抽离），把『能跑』写进规则而不是留给模型即兴。
反 AI 偏见规则被编号成 6 条可执行设计指令（确定性排版、色彩校准、布局去中心化、材质与去卡片化、交互状态全周期、表单模式），每条都带默认 class 串。
skills/taste-skill-v1/SKILL.md
**ANTI-CENTER BIAS:** Centered Hero/H1 sections are strictly BANNED when `DESIGN_VARIANCE > 4`.
注：如 Rule 1 直接给 'Default to `text-4xl md:text-6xl tracking-tighter leading-none`'、Rule 6 给 'Use a standard `gap-2` for input blocks'——把审美决定降级为可抄写的类名。
创意主动性有明确的技术实现规定：磁吸微物理必须用 Framer Motion 的 useMotionValue/useTransform 脱离 React 渲染循环，禁止用 useState 承载连续动画。
skills/taste-skill-v1/SKILL.md
**CRITICAL:** NEVER use React `useState` for magnetic hover or continuous animations.
注：§4 同时规定 layout/layoutId 共享元素过渡、staggerChildren 需父子同处一个 Client Component 树——创意效果与性能约束被绑在一起，这是 v1 较 v2 更『偏工程』的一面。
禁止混用动画栈：同一组件树内不得同时出现 GSAP/ThreeJS 与 Framer Motion，GSAP/ThreeJS 仅限整页滚动叙事并需严格 useEffect 清理。
skills/taste-skill-v1/SKILL.md
**CRITICAL:** Never mix GSAP/ThreeJS with Framer Motion in the same component tree.
注：这条与同仓库 gpt-taste（全面改用 GSAP）形成鲜明对比：v1 默认 Framer Motion，GSAP 仅作为整页滚动叙事的例外通道。
AI tells 清单按五个维度枚举（视觉/CSS、排版、布局间距、内容数据、外部资源与组件），含假名字（John Doe/Sarah Chan）、假数字（99.99%/50%）、假品牌名（Acme/Nexus/SmartFlow）与营销废话词。
skills/taste-skill-v1/SKILL.md
**NO Broken Unsplash Links:** Do not use Unsplash. Use absolute, reliable placeholders like `https://picsum.photos/seed/{random_string}/800/600` or SVG UI Avatars.
注：该清单是 v1 的招牌：把『看起来像 AI 做的』拆成可点名的具体模式，这是后续 v2 与 gpt-taste 继承的语料来源。
§8 是一份『高级交互名词库』（导航/布局/卡片/滚动/画廊/排版/微交互七类，数十个模式名），供模型从中取材而非现编。
skills/taste-skill-v1/SKILL.md
## 9. THE "MOTION-ENGINE" BENTO PARADIGM
注：§9 进一步把 Bento 范式写成可施工规格：背景 #f9fafb、卡面纯白 + border-slate-200/50、圆角 rounded-[2.5rem]、扩散阴影数值、且规定标签必须放在卡片外部下方；并给出 5 张卡各自的具体微动画（智能列表/命令输入/实时状态/宽数据流/情境 UI）。
收尾用 7 项 pre-flight 检查表把『交付前自检』制度化，覆盖全局状态、移动端折叠、100dvh、useEffect 清理、空/loading/error 状态、去卡片化、CPU 密集动画隔离。
skills/taste-skill-v1/SKILL.md
- [ ] Do full-height sections safely use `min-h-[100dvh]` instead of the bugged `h-screen`?
注：检查表是勾选框形式，便于模型逐项确认；其中 100dvh 与 useEffect 清理两条同时出现在 §2/§5 的正文规则里，属双重强调。
2核心能力
01三档参数化设计纪律（VARIANCE 8 / MOTION 6 / DENSITY 4）+ 按档位分支的规则集
02依赖与构建配置正确性前置检查（package.json 校验、Tailwind v3/v4 语法锁、缺包先给安装命令）
03React/Next RSC 架构约定与交互组件隔离（'use client' 叶子组件、全局状态节流）
04反 AI 偏见六条工程指令（排版/色彩/去中心化布局/去卡片化/交互状态/表单）
05高级动效范式与性能红线（useMotionValue 磁吸、layout 过渡、stagger 编排、禁动画 top/left/width/height）
06AI tells 五维禁用清单（假名字/假数字/假品牌名/营销废话/Unsplash 坏链/3 列等宽卡/霓虹辉光/纯黑）
07高级交互名词库（导航/布局/卡片/滚动/画廊/排版/微交互七类模式名）
08Motion-Engine Bento 范式（配色/圆角/阴影具体数值 + 5 类卡的微动画规格）与交付前 7 项自检
3外部依赖
| 类型 | 依赖 |
|---|---|
| network | picsum.photos（禁用 Unsplash 后指定的占位图源） |
| package | Framer Motion（默认动效库，含 useMotionValue/useTransform/layout/AnimatePresence） |
| package | @phosphor-icons/react 或 @radix-ui/react-icons（唯一允许的图标包） |
| package | Tailwind CSS v3/v4（90% 样式来源，含版本锁与 v4 postcss 守则） |
| package | shadcn/ui（允许使用但禁止默认态） |
| package | GSAP（ScrollTrigger）与 ThreeJS/WebGL（仅限整页滚动叙事/画布背景，禁与 Framer Motion 混用） |
| package | lucide-react / zustand（被点名作为需先校验是否已安装的示例库） |
4风险提醒 风险提醒：绿色 · 放心使用
风险提醒：绿色 · 放心使用
- 冻结版本不再接收修复 — 作为 v1 兼容版，它不会跟进上游改进（v2 新增 brief 推断、设计系统映射、暗色模式协议、重设计审计与区块库）；使用者放弃的是这些后续修复与增强。
- 安装名≠目录名，易装错或找不到 — 必须用 install name design-taste-frontend-v1 安装；按目录名 taste-skill-v1 检索会失败。README 已说明，但对用户仍是摩擦点。
- 审美约束无程序化校验 — AI tells 禁用清单（假名字/假数字/纯黑/霓虹/3 列等宽卡）全靠模型自服从与 §10 自检，无法从 CI 层面强制。
- 产物引入外部资源与安装动作 — 生成页面引用 picsum.photos 占位图，并按需安装 framer-motion/GSAP/shadcn/ui 等包；离线环境或自审供应链的场景需替换。
风险提醒：绿色，放心使用。纯指令型 skill：文件内无脚本、无网络外发、无凭证读取；仅『读 package.json 校验依赖 + 写源码文件』这类宿主 coding agent 的常规行为，且该读取是 skill 明确要求的正确性检查（防止假设库存在）。对外接触点只有它规定产物页面使用的 picsum.photos 占位图与需自行安装的前端包。注意两点：① 作为 v1 冻结版，它不再接收修复，若上游 v2 修掉的缺陷在此仍存在；② 名词库里含大量第三方产品名（Dock/Gooey Menu 等）仅作模式指代，无商标使用风险。
5第二遍独立确认
- [ok] 『保留 v1 兼容』的定位是否有仓库级依据 — CHANGELOG 'The original release. Dial-driven philosophy, anti-slop rules, reference vocabulary of pattern names.' 与 README 'preserved for projects depending on its exact behavior' 双重印证；README 还给出钉版安装命令与 install name。
- [discrepancy] 安装名与目录名不一致（易用性坑） — 目录为 skills/taste-skill-v1，但 frontmatter name 与安装用的 install name 是 design-taste-frontend-v1。README 明确 'Install a single skill by its **install name** (the `name:` field inside the SKILL frontmatter, not the folder name)'——两者不一致是官方设计，但对用户是实际坑点，已记录。
- [ok] 外部依赖清单完整性 — token 扫描命中项全部核实为包名/图片源/工具类，无遗漏的隐藏端点：picsum.photos（§7）、framer-motion/lucide-react/zustand（§2 依赖校验示例）、@phosphor-icons/react 与 @radix-ui/react-icons（§2 Icons）、Tailwind v3/v4 与 @tailwindcss/postcss（§2 版本锁）、shadcn/ui（§7）、GSAP/ThreeJS（§8）。npm install 仅作为『缺包时需输出的命令』示例，非 skill 自行执行。
- [ok] 是否真的会读用户文件（file_writes/读取面） — §2 要求先检查 package.json 与已安装版本（只读），属技能明示的正确性前置；文中无其它文件读写指令。写入面全部是产物源码。
- [ok] 与批1 的 design-taste-frontend（v2）是否重复 — 同一 repo 两个不同 skill：v2 位于 skills/taste-skill（install name design-taste-frontend，brief 推断 + 设计系统映射 + 暗色模式/重设计协议/区块库），v1 位于 skills/taste-skill-v1（三档参数 + 名词库 + Framer Motion 栈）。CHANGELOG 视 v2 为 'substantial rewrite'；本次结论只对 pin commit 内的 v1 文件有效，不推广到 v2。
- [ok] 动画栈规定是否前后矛盾 — §4 强制 Framer Motion 用于 UI/Bento，§8 允许 GSAP/ThreeJS 但限定于整页滚动叙事/画布背景且禁止与 Framer Motion 同树混用——两处口径互补，无矛盾（与 gpt-taste 全面 GSAP 路线不同，属版本差异）。
- [ok] 元数据（license / stars / last_push / 路径 / commit） — gh api：MIT、87309 stars、pushed_at 2026-08-24T15:23:56Z；git ls-files 确认 skills/taste-skill-v1/SKILL.md；HEAD == origin/main == ccbc15639c97057cbfcf32ecebc38ef716e4bb37。
6结论
适合：已在生产中用 v1 跑通流程、不希望被 v2 重写打断的团队（钉版保行为）；需要『三档参数 + 名词库』式确定性约束、且偏好 Framer Motion 技术栈的前端；把它当反 AI 痕迹清单使用的人（假名字/假数字/营销废话/3 列卡/霓虹等禁用项可直接抄）；教学场景——它是理解该系列 skill 演进起点的原始材料。
不适合：新项目（应直接用当前默认 design-taste-frontend v2，或按需选 gpt-taste 的 GSAP 路线）；dashboard/数据密集型 UI（作者定位为 landing page / portfolio / redesign 取向）；不用 React/Next + Tailwind 的技术栈（§2 架构约定是强绑定）；需要程序化强制审美约束的 CI 工作流；短上下文模型（21 KB 指令 + 名词库开销）。
安装 agent 直装可复制
① 本站镜像 更新 2026-09-15
方式 A · 人下载镜像包下载 design-taste-frontend-v1.tar.gz
sha256:
方式 B · JSON 格式安装指南，复制给 agent470ab18897944ef0…agent 读 JSON 指南后会自动从本站下载安装，无需更多说明。
② 上游 GitHub · 原始来源
来源信息 GitHub 原始
作者 / 仓库leonxlnx / leonxlnx/taste-skill
原始 GitHubleonxlnx/taste-skill ↗
Stars87309
最近推送2026-08-24
本 skill commit
ccbc15639c许可MIT（仓库根 LICENSE，Copyright (c) 2026 Leonxlnx；GitHub API spdx_id=MIT）
本站信息
收录日期2026-09-06
分类设计
侦查报告AI 侦查 · 2 遍 · 2026-09-06
本站镜像与 GitHub 原始是不同来源：本站锁定 commit 快照经 /r2 分发；GitHub 为实时上游，内容可能已更新。