前言¶

让模型写界面，最常见的问题是视觉质量不稳定：配色随便、间距不统一、层级混乱，最后还得手改。界面设计工坊（@user_49d9b6a1/premium-ui）做的事，是把大厂级、高级简约、品牌化 UI 的设计与生成流程固定成一个 Skill，让生成结果从一开始就落在可接受的视觉水位上。下面介绍这个 Skill 的定位、能力和使用方式。

这是什么¶

界面设计工坊是一个 community 来源的 Skill，发布者为 user_49d9b6a1，版本 1.0.0，分类 design-media，坐标 @user_49d9b6a1/premium-ui，官方地址 https://api.skillhub.cn/user_49d9b6a1/premium-ui 。它解决的问题是：当用户需要生成新界面、优化现有 UI、设计单个组件，或要求高质量前端代码且在意视觉质量时，把这类需求路由到对应的协议流程，而不是让模型随意发挥。

核心功能¶

按官方简介，Skill 覆盖四类需求，并按用途分派三个协议：

• 从零生成新界面：落地页、Dashboard、移动端、B 端、作品集。
• 优化现有 UI 或设计稿截图。
• 设计单个组件：按钮、卡片、表单、导航、Tab、Modal、Toast。
• 输出高质量 HTML / CSS / React 前端代码，且在意视觉质量。

三个协议按用途分派：生成（generate）、审查（audit）、单组件（component）。官方简介未公开每个协议的具体输入输出与参数细节，使用时以 SKILL.md 为准。

安装与启用¶

官方资料未公开安装命令、目录规则或配置字段，Cursor / Codex CLI / Claude Code 的差异也未核实到，这里不写推测内容。Skill 基于通用 SKILL.md 格式，获取方式是从 SkillHub 页面拿到 SKILL.md，再按你所用 Agent 的 Skill 放置规则启用。标签 requires_api_key=false，说明不强制依赖 API Key。

SkillHub 页面：https://www.skillhub.cn/skills/user_49d9b6a1/premium-ui

典型用法¶

官方简介把需求分成三类，对应三个协议。下面是从简介归纳的用法，不是完整 prompt 或输出示例：

• 生成场景：用户提出「做一个 SaaS 落地页」，走 generate 协议，从零生成界面。
• 审查场景：用户给出「现有 UI 截图，帮忙优化」，走 audit 协议，对现有界面做审查与调整。
• 单组件场景：用户要求「设计一个品牌按钮 / 卡片 / Toast」，走 component 协议，聚焦单个组件。

具体触发方式、参数和输出格式，以 SKILL.md 为准，本文不展开未核实的细节。

适用场景与注意¶

适合需要批量或反复生成界面、且对视觉一致性有要求的场景，例如落地页、Dashboard、B 端界面。由于 Skill 不强制 API Key（requires_api_key=false），接入门槛较低。

需要注意：这是 community 来源的 Skill，发布者为个人（user_49d9b6a1），SkillHub 显示评分 100000、下载 1225、安装 0。安装数为 0 说明目前还没形成规模化使用，质量与稳定性需要自行验证后再投入正式流程。官方简介未公开协议参数、安装命令与配置字段，接入前建议先通读 SKILL.md。

结尾¶

界面设计工坊的价值在于把 UI 生成的流程约束成三个协议，让模型不再每次从头发挥，输出的视觉水位更稳定。如果你的工作里经常需要生成落地页、Dashboard 或组件，且在意视觉质量，可以先把 SKILL.md 跑通再决定是否纳入流程。

官方地址：https://api.skillhub.cn/user_49d9b6a1/premium-ui