mcpField
U
uinaf-design

uinaf-design

github.com/uinaf设计与 UI186 次安装1 天前更新
代码仓库

关于 uinaf-design

uinaf-design 是一项手动使用的技能，用于在明确限定的工作范围内应用 uinaf 设计系统和品牌指南。它获取相关的实时设计资料，必要时改用链接中的 Markdown，并将产品专属实现留在所属仓库中。

主要功能

  1. 01获取实时设计资料
  2. 02MCP 不可用时回退到 Markdown
  3. 03复用已提供的设计系统
  4. 04产品界面工作留在所属仓库
  5. 05运行仓库现有的 design:check

适用场景

  1. 01查询页面、组件或设计令牌
  2. 02在限定任务中应用 uinaf 结构与样式
  3. 03使用仓库的检查流程验证设计变更

MCP 相关

连接后，它通过 uinaf design MCP 服务获取页面、模板、模式、令牌和指南。若服务不可用，则改为获取相关 Markdown 资料。

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/uinaf/design --skill uinaf-design

安装后在 Claude Code 中输入/uinaf-design确认已加载。

附带文件agents/openai.yaml

详细介绍

uinaf 设计

这是一项手动技能。它的存在绝不授权在明确限定范围的 uinaf 工作之外使用 uinaf 样式。

工作流

  1. 由其所属方负责实现。 此软件包提供设计系统和通用品牌指南。特定产品的 UI 和文案应放在该产品的代码库中。
  2. 动笔前获取一份实时来源。 如果已连接，优先使用 MCP 服务 https://design.uinaf.dev/mcp：
    • 完整产品界面 → get_page
    • uinaf.dev 页面或导出画板 → get_template
    • 组件 → list_patterns，然后是 get_pattern
    • 令牌值 → get_tokens
    • 语气或通用规则 → 使用一个精确主题（如 voice、type、color、layout 或 motion）调用 search_guidelines
  3. 无法使用 MCP 时，查阅 Markdown，而不是凭记忆。 读取 https://design.uinaf.dev/llms.txt，选择一个相关链接并获取其内容。语气和通用指南请使用 /design.md，软件包设置请使用 /readme.md。不要加载整个目录。如果这两种方式都无法访问，请停止并说明缺少设计上下文。
  4. 复用已发布的系统。 导入 @uinaf/design/css，复制获取的结构并调整内容。不要根据文字描述重新创建组件。
  5. 通过所属代码库的检查流程完成工作。 使用代码库声明的包管理器运行现有的 design:check 脚本。如果缺少该脚本，请查阅 /readme.md；未经批准，不要安装依赖、创建棘轮机制或扩大任务范围。

评论

支持 Markdown