VS Code 官方给 AI 装的设计大脑——design-philosophy 让你的 AI 不再只会调 API

你跟 AI 说”这个按钮看起来怪怪的”，它是不是只会回”请问您想要什么颜色”？

微软最近给 VS Code 提交了一个 Skill，叫 design-philosophy，我看完直接破防了——这玩意儿是让 AI 学会用设计师的语言思考 UI，而不是整天对着像素表。

它干了件什么事？

这个 Skill 把 UI 设计拆成了三层词汇：

• 价值观（Values）：我们希望用户感受到什么。比如”专注”，那间距、圆角、动效都得朝这个方向靠。
• 原则（Principles）：怎么评判一个决定好不好。比如”这个圆角是第几级 elevation”，而不是”应该是 8px 还是 6px”。
• 操作（Moves）：具体可以怎么改。比如把某个元素从”raised”降级到”flat”，就能解决视觉冲突。

用这套框架，AI 不再只是执行命令，而是能参与设计讨论——”这个按钮的问题不是圆角大小，而是它的 elevation 和旁边卡片冲突了”。

为什么对 AI 开发者有用？

现在 AI 编程工具越来越强，但 AI 生成的 UI 十有八九”能用但丑”，核心原因是它只会调 API，没有审美框架。这个 Skill 等于是给 AI 装了一套设计坐标系，以后生成代码前先过一遍设计关。

怎么用？

px skills add https://github.com/microsoft/vscode --skill design-philosophy

装完之后，当你需要做 UI 设计决策、审查 UI 方案、或者给 AI 反馈视觉问题时，这个 Skill 就会自动激活。

说实话，VS Code 这套设计哲学文档我一直觉得写得很干，没想到被包装成 Skill 后，在 AI 编程场景下突然变得非常实用。推荐给所有做 AI 前端开发或者天天和 AI design review 打交道的朋友。

GitHub：https://github.com/microsoft/vscode/tree/main/.github/skills/design-philosophy

GitHub: https://github.com/microsoft/vscode/tree/main/.github/skills/design-philosophy