AI设计师

SKILL前端设计
前端设计 未标注权限 许可证不明确
安装这个技能

基于需求文档和自定义基础样式,生成完全符合需求的图层设计稿,并自动上传至 Ardot;前端可直接在 Ardot 查看标注并完成页面开发。全程只需跟随提示回答或填写,简单易用。

一句话选型结论

按资料字段整理

AI设计师是前端设计类的 Agent Skill,安装方式未标注,权限级别未标注,许可证不明确,有可直接复制的安装命令。技能本质是给模型读的说明书,效果取决于模型与客户端;装完先用一个小任务验证,再放进正式流程。

分类前端设计 安装方式未标注 权限级别未标注权限 许可证许可证不明确
累计安装 未标注 本周 未标注
GitHub 星标 未标注 仓库 未标注
下载量 未标注 技能市场下载数
权限级别 未标注权限 安装前请确认风险范围
许可证 许可证不明确 未说明

安装

未标注
在支持 Skills 的客户端里执行,装完问一句「你有哪些技能」验证
skillhub install user_f0928a0c/os-0effa59cd8af46b0
  1. 1
    确认客户端支持

    确认你的客户端支持 Skills(Claude、Codex、Cursor 等),并升级到较新的版本。

  2. 2
    拿到技能文件

    执行上面的命令安装;也可以把仓库里的 SKILL.md 手动放进客户端的 skills 目录。

  3. 3
    刷新技能列表

    重新打开客户端,或刷新技能列表,让新放进来的技能被加载。

  4. 4
    验证是否生效

    问一句「你有哪些技能」,确认列表里出现它,再拿一个小任务试跑。

技能档案

前端设计
字段来自技能仓库与公开索引,中文说明由本站标注
作者 / 维护方user_f0928a0c仓库 未标注 · 版本 未标注
宿主客户端未标注技能可被这些客户端加载
安装方式未标注安装包 community
权限级别未标注权限安装前请确认风险范围
许可证未说明许可证不明确,商用前请自行确认条款
仓库可用性available技能仓库当前是否可访问
最近核验2026-11-06上游最后核验时间 · 数据更新 2026-11-06
正文体量15.5 KBSKILL.md 原文大小,越大说明说明书写得越细

典型使用场景

3 类
按分类整理的常见用法,具体以 SKILL.md 为准
出页面与组件

按描述生成页面结构和组件草稿。

调整样式与布局

改间距、配色与响应式布局。

生成设计说明

把设计稿整理成开发能接的说明。

选择建议

装之前先看这几条
按条目字段给出的判断,不替你决定用不用

值得选的地方

  • 有可直接复制的安装命令,不用自己翻文档找入口。

先想清楚的地方

  • 没有标注权限级别,实际能做什么要装好后确认。
  • 许可证不明确,商用或二次分发前先到仓库确认条款。
  • 没有做站内核验,内容以作者仓库为准。
  • 技能只是说明书,实际效果取决于模型与客户端,装完先用小任务试一遍。

更适合

  • 需要在前端设计场景里给模型补一套做法的人。
  • 愿意先读一遍 SKILL.md、确认它会让模型做什么的人。

不太适合

  • 对许可证要求很严、必须明确可商用的人。
  • 只想装完就自动变强、不打算看说明书的人。

同类对比

6 个同类
同分类里挑最接近的几条,字段以各自详情页为准
技能权限级别安装方式累计安装宿主客户端安装命令
AI设计师当前 未标注权限 未标注 未标注 未标注 有
前端设计 只读 GitHub 仓库 882.3 万 Codex、Claude、Cursor 有
Vercel 组合模式 联网访问 GitHub 仓库 385.9 万 Codex、Claude、Cursor 有
Vercel React native skills 前端 只读 GitHub 仓库 246.9 万 Codex、Claude、Cursor 有
adapt 搜索 浏览器控制 GitHub 仓库 202.7 万 Codex、Claude、Cursor 有
使用我的浏览器 浏览器控制 GitHub 仓库 184.8 万 Codex、Claude、Cursor 有

SKILL.md 全文

15.5 KB
模型实际读到的说明书原文,来自技能仓库

AI设计师

使用方式

对外只提供“AI设计师”一个技能入口,通用安装标识为 design-to-handoff。按阶段读取下表中的内部说明文件,在同一流程内执行,不另外调用或注册这些阶段为 skill,不需要新聊天或并发代理。

需求、方向、参考、全局设计基础、设计及平台交付继续分文件维护,但放在本技能的 references/ 中,均为普通 Markdown;这些模块不带 SKILL.md、独立技能元数据或 agents 入口。全局设计基础是流程内的补充模块,不要求用户另装或调用第二个 skill。安装与分发只复制完整的 design-to-handoff 文件夹,包含 references/、scripts/ 和入口配置。

面向用户统一称“AI设计师”。进度用“整理需求”“确定设计方向”“分析参考”“确定全局设计基础”“生成设计”“交付 Figma/Ardot”等业务阶段,不播报内部模块名、路径或“切换/调用子 skill”。用户明确询问实现细节时可说明,遵守宿主对外部必需技能的披露要求。

交付对象为含真实文字、容器、矢量和内容图片图层的在线设计文件。整页 PNG、PDF、画在图片上的红线、Code/Make 运行预览都不能代替分层文件。代码标注是元素样式片段,不是完整业务代码。

提问节奏

以下是所有智能体宿主共用的交互规则,适用于 Codex、Claude Code、CodeBuddy(插件/IDE/CLI)、WorkBuddy、Cursor、OpenCode 及其他兼容宿主;不是某一产品的可选特例。开始收集输入前读取内置问答约定,本入口及所有内部阶段统一遵守。

需要询问用户时,必须优先使用当前宿主可用的原生结构化问答,提供可点击选项和自定义输入;不要用 final/完成工具或纯文本菜单代替可用的问答控件。开放的文档地址使用独立输入题;宿主要求题目必须带选项时保留其原生自定义输入入口。用户回答后在当前流程自动继续,不要求再说“继续”或重新调用 skill。各宿主只适配工具名称、参数和等待方式,不改变提问顺序、必填性、跳过规则及单入口。确实没有可用原生问答时,明确说明当前能力缺口后才降级,不能默默改为纯文本提问。

每阶段按工具容量组织问题,复用已知信息,不一口气索取全部问卷。全局设计基础将相近参数合为一组,一次问答确定一组;不同维度分开询问,不因工具能容纳更多题而混在同轮。支持本组采用推荐、指定某项其余推荐或剩余全部推荐;其他阶段可按工具容量合并。用户说“你推荐”时采用并说明建议;可选项提供“跳过”。必要回答缺失保持待答,不能把超时、默认预选或工具返回空值当成答案。

所有宿主的首次文档收集均拆成两道独立问答,按顺序发起;不要合并成一个文本框,也不要要求用户按“需求:…;补充:…”填写:
1. 【需求文档】必填:收集实际文件路径、目录、在线链接或已提供附件。没有有效来源时留在本题,不能用空值、“跳过”、选项标签或 AI 推荐替代。
2. 【补充文档】可选:需求来源确定后单独询问,提供“跳过(无补充文档)”及填写地址的方式。用户明确跳过、回答“无”或主动提交空白可选题后继续,不强求补充文件;未作答与已提交空白要区分。

复用已提供的文档及明确的“无补充”选择,仅询问缺失题。地址可以是文件、目录或在线链接;不要只收集“本地/在线”类型。多版本目录用真实候选作为后续选项。CodeBuddy 插件按插件问答适配,WorkBuddy 按桌面端适配调用各自的原生问答工具。

不将技能创建者在其他聊天中的业务、语言和设计偏好视为本次需求。

宿主与操作系统

本技能应在 Codex、Claude Code、CodeBuddy、WorkBuddy 等支持 Agent Skills 的宿主中使用,不依赖作者本机。第一次运行按运行兼容说明识别宿主、操作系统与工具。使用宿主自身的提问、读文件、浏览器和 MCP 能力,按实际暴露的工具及模式限制选择问答接口。Windows、macOS Intel 和 Apple Silicon 共用同一份正文;不强制使用 Bash、macOS 桌面自动化或某个芯片专用程序。

首次使用结合运行条件与数据使用说明文档读取、本地保存和所选设计平台的数据去向。通过技能界面安装后直接调用本技能,按当前宿主的实际能力完成问答、连接与交付。

按顺序执行

阶段 读取并执行 完成条件
1 需求 需求整理,按需求保真建清单 展示浓缩需求、页面清单、功能覆盖表和重要未决问题
2 设计上下文 前置上下文 确认新建/补充/修改;已有链接、基准、关键冲突在生成前确定
3 方向 设计方向 只确定终端、用途与大方向;商城项目确认经营模式、品类、交易范围和视觉取向;品牌规范/组件库已确认(无则按参考站/原型推导,有则已读取);继承已有约束
4 参考 参考分析 已分析可选参考或明确跳过
5 全局设计基础 基础问答,商城加读商城范式 参考后按同类参数分组确定或授权推荐;适用时 F21 商城维度已解析,完整规范和 token 已落档;同站设计继承已有版本
6 保存选择 本入口下文 知道是否保留本地交付副本;已说明规范的持久落点
7 设计 设计生成,按视觉质量自检 前置上下文 ready;覆盖脚本通过、逐页功能核对和视觉自检完成;正式文档与预览已核对
8 上传选择 本入口下文 无预连接也先提供平台问答;新建选择平台,补充复用已有目标,确认是否上传或暂缓
9 平台交付与规范归档 云端交付,再读 Figma / Ardot 授权验证、自动建文件/追加、上传及远端读回通过;覆盖证据完整;按项目规范约定保存可复用规范与真实链接;多人查看单独记录

摘要展示后先识别新建还是补充/修改。补充已有设计时,主动在生成前索取尚缺的项目/文件/画板链接,读回样式与组件、解决冲突并固定基准,再进入方向和生成;不能等到上传阶段才首次核对。用户同时可纠正摘要,不为已明确步骤重复确认。

需求保真与视觉质量

需求文档是功能合同。页面、控件、字段、操作、状态、权限和业务文案必须全部落地;排版可以优化,功能不能减少、合并、替换或隐藏。原型、线框图和页面截图按功能来源处理,不当作单纯的排版建议。完整规则见需求保真。

  • 生成前建立页面清单、页面功能卡和 REQ 覆盖表;生成任一页面前重读该页原文与原型,不只凭摘要或记忆。
  • 页面根标 data-view,功能元素标 data-req;生成后用 check_coverage.py 校验,再逐页看图核对。覆盖未通过不得上传。
  • 所有页面按视觉质量基线自检;商城/零售项目同时按线上商城业务范式处理价格、商品卡、SKU、购物车、结算、订单和售后状态。需求没提的页面不自行增加。
  • 需求含糊、业务规则不明或平台限制导致无法实现时,列出具体影响并询问,不静默删功能或用默认业务逻辑填空。

可选本地保存

参考分析和全局设计基础确定之后、生成之前用内置问答提供“不保留本地副本”“保留到指定目录”,并允许自由输入目录。默认交付内容包含设计文档、带版本的全局规范、tokens.json、覆盖表与 coverage.json、HTML/CSS、预览和交付记录。上传前说明:设计文件中也交付可编辑“设计规范”页/区域,记录全部全局规则与 token,供同站扩展复用。不保留本地副本不等于省略规范;本地、云端和仅聊天交付的持久性区别见项目规范约定。选保留但未提供目录时,在同一问答流程补问目录。

明确选择不保留才不写本地交付副本;未回答保持待答,不自动保存到桌面。允许在许可的临时目录渲染、转换、检查;成功后只清理本次创建且不再需要的临时文件。上传受阻且没有副本时,说明临时文件仍在,询问保留位置或改选平台,避免丢失。不要承诺删除宿主聊天、系统缓存和平台云文件。

指定目录后创建项目子目录,不覆盖同名文件;权限不足使用宿主审批机制。原生文件只有平台实际支持且真正导出成功才列入交付,不猜测 Ardot 扩展名,不重命名其他格式冒充。

平台、授权与自动交付

新建设计可以先设计、后选择上传平台。补充/修改已有设计必须先按前置上下文收集链接并读取目标,必要的 OAuth 授权及只读连接提前执行;此阶段不创建云文件、不上传、不修改旧内容。确认最终是否上传仍可留到设计验收后。

完成设计后,新建先用原生问答确定“上传 / 暂不上传”,上传平台题只提供 Figma / Ardot 两项;不再提供蓝湖、Penpot 或“两者”选项。已有明确选择直接执行,不重复问。尚未连接、未加载平台工具、未配置 MCP 都不能省略或过滤平台选择。补充/修改复用已绑定的目标,缺少上传意愿时才问“上传到该目标/暂不上传”。用户中途变更为补充已有目标时返回前置上下文,只重做受影响部分。

选定平台即进入必经交付流程:先读取云端交付和对应的 Figma 或 Ardot 说明,并加载宿主要求的相关技能,再发现连接、启动必要授权、创建/写入和远端读回。不得以“本机没安装”“没有预连接”“初始工具列表为空”跳过流程、默认换平台或把本地预览当成交付。无客户端时优先核查官方远程 MCP;实际执行发现与必要连接引导后仍有明确缺口,才报告该平台“上传未完成”及恢复点。用户取消或明确暂缓则停止相应写入,不绕过取消。上传时只复核身份、权限及相关基线漂移,不首次访谈风格。

默认由智能体负责创建云端文件/必要目录、自动命名、上传或原生构建、远端读回及返回链接。不让用户自行新建目录、手动导入或改名来替代自动交付。新建设计默认创建新的设计文件,不把文件与团队 Project 混为一谈;实际创建的目标与权限须有证据。

WorkBuddy 须读取桌面端连接适配,优先通过 ToolSearch 加载并调用宿主原生 workbuddy_request_mcp_connection,按真实声明标识请求选定平台,不以通用聊天提示代替连接卡片。原生连接卡片已经接管授权等待时复用该卡片及其结果,不额外打开另一套授权流程。没有受管卡片、采用浏览器直连时,由宿主正式连接机制启动授权/登录/连接设置,打开可见浏览器,再用原生问答提供“完成授权”“重新打开授权”“暂不上传”。用户完成后继续本流程,并实际探测账号、连接和目标权限;点击“完成授权”本身不是写入凭据。已有有效连接时复用,不重复授权。

Ardot 优先使用官方云端 MCP https://ardot.tencent.com/mcp,无需本机安装客户端;按平台说明配置所选宿主并完成 OAuth,不沿用旧版 Penpot 密钥题。Figma 同样优先核查可用官方远程连接。浏览器已登录不等于 MCP 已授权或目标可写。

目标落点已说明且用户选择平台/交付方式后,即授权在该落点创建并上传本次设计;不重复审批相同动作。已有项目默认追加,保留原有内容与权限;明确覆盖或删除的范围缺失时先展示具体方案再问。公开分享、扩大权限、付费升级不从上传选择中推断。

不主动回显密钥、含凭证的连接 URL、密码或 Cookie;这些信息不进入源设计、仓库和交付记录。连接配置仅作用于本次所选宿主和服务,不覆盖其他连接。无写入能力时先发现可用连接器或浏览器路线,说明缺口并保持可恢复,不能默认把上传任务转交用户后宣称完成。

状态与完成

按会话记录约定维护流程信息,可在会话内;未选保存不写本地持久检查点。项目规范独立按项目规范约定随设计交付,上传后回写真实链接、版本及实际差异。后续同站模块先读取此规范及相关设计,只补缺项,不重做整套访谈。需求变更仅重做受影响阶段。两平台共用一版需求、规范和 viewId。

记录每次云写入返回的文件/节点 ID。部分失败先读回再续写,修正根因后最多重试两次;宿主对授权取消/失败有更严格的停止规则时优先遵守;仍失败保留具体阻塞和继续点,不盲目制造重复文件。

分别报告:仅本地完成、已上传但标注待验收、本人检查通过但多人查看待验收、多人标注交付验收通过。给出真实链接、覆盖页面及缺项。没有第二账号验证,不声称多人查看已实测。需求覆盖与视觉自检单独列状态:REQ 总数、已覆盖/缺项/不适用、覆盖脚本结果、视觉未通过项;不能用平台上传成功代替这两项。

本包提供两个可选平台,不表示各宿主或当前账号已完成线上实测。Ardot 宿主可行性及条件见交付评估;执行时以真实工具契约、宿主技能约束和官方权益为准。

常见问题

5 问
答案由本站依据条目字段整理
AI设计师怎么安装?

在支持 Skills 的客户端里执行:skillhub install user_f0928a0c/os-0effa59cd8af46b0。安装方式为未标注。装完刷新技能列表或重开客户端。

AI设计师支持哪些客户端?

资料没有标注宿主客户端,但只要客户端支持 Skills(Claude、Codex、Cursor 等),一般都能加载。

AI设计师权限高吗,安全吗?

权限级别为未标注权限。安装前先看它会读取或写入哪些内容。

AI设计师收费吗?

本站不代收费用,也没有标注具体价格。是否收费取决于技能本身和所用的模型或客户端,正式使用前按作者说明确认。

AI设计师用什么许可证?

许可证标注为 未说明(许可证不明确)。商用或二次分发前请到仓库确认条款原文。

热门专题

按场景挑技能
全部专题 →

技能内容以作者仓库为准;分类、权限级别与许可证状态的中文说明为中文整理,最近核验 2026-11-06。