将外部 Claude 设计技能隔离到生产代码中的构建流水线
TuBrief 편집팀
2026년 9월 11일
0
Computing/Software원본 영상을 바탕으로 AI의 도움을 받아 작성했습니다. 원본 영상이 기준입니다.
커뮤니티의 다른 글
댓글 (0)
Log in to leave a comment
아직 작성된 글이 없습니다
원본 영상을 바탕으로 AI의 도움을 받아 작성했습니다. 원본 영상이 기준입니다.
Log in to leave a comment
아직 작성된 글이 없습니다
对于没有设计师、独自开发全栈服务的开发者来说，外部设计技能文档极具吸引力。把从 Twitter 或 GitHub 上收集的 5000 行设计系统提示词复制到 Claude 系统指令中，似乎能让界面变得干净整洁。
然而实际结果却恰恰相反。刚发送第一条消息，就会弹出 Token 额度警告，API 响应等待时间也无休止地延长。模型生成的代码要么在组件中强行塞入不明身份的内联样式，要么引入项目中从未安装过的 Framer Motion 模块。最终只能通宵手动修复损坏的 UI，然后灰头土脸地回退到原本的 shadcn/ui 默认模板。
问题不在于模型的审美能力，而是将非结构化的长篇 Markdown 直接倾倒进系统提示词中的这种做法本身。我们需要构建一条流水线，将自然语言风格描述转换为机器可读的 Token 规范，并在模型生成的代码接触到生产文件之前进行隔离测试。
如果把设计系统 Markdown 原封不动地贴进提示词中，会造成严重的 Token 浪费。“给用户带来信任感的深海军蓝”这类美学修饰词对布局生成没有任何用处。这些句子会蚕食语言模型内部本来应该留给 TypeScript 接口或验证逻辑的运算资源。
我们应该剔除自然语言描述，使用 W3C Design Tokens Community Group (DTCG) 规范的 JSON 对象来重构系统提示词，只保留颜色、间距和圆角曲率。