Yida Page Design

SKILL开发规范
开发规范 未标注权限 许可证不明确

宜搭单页设计子流程。用于已有应用里的单个自定义页面美化、页面重构、视觉升级、表单入口体验优化和主题证据读取。

一句话选型结论

按资料字段整理

Yida Page Design是开发规范类的 Agent Skill,安装方式:GitHub 仓库,权限级别未标注,许可证不明确,没有现成安装命令,需按说明手动放置 SKILL.md。技能本质是给模型读的说明书,效果取决于模型与客户端;装完先用一个小任务验证,再放进正式流程。

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

安装

GitHub 仓库
在支持 Skills 的客户端里执行,装完问一句「你有哪些技能」验证
  1. 1
    确认客户端支持

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

  2. 2
    拿到技能文件

    按安装说明或仓库 README,把 SKILL.md 放到客户端的 skills 目录(一般一个技能一个文件夹)。

  3. 3
    刷新技能列表

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

  4. 4
    验证是否生效

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

技能档案

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

典型使用场景

3 类
按分类整理的常见用法,具体以 SKILL.md 为准
统一代码规范

把团队约定写成模型能执行的检查项。

做代码审查

按规范逐条检查改动。

写提交与文档规范

统一提交信息与文档模板。

选择建议

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

值得选的地方

  • 基础信息齐全,可以先按说明装一个试试。

先想清楚的地方

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

更适合

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

不太适合

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

同类对比

6 个同类
同分类里挑最接近的几条,字段以各自详情页为准
技能权限级别安装方式累计安装宿主客户端安装命令
Yida Page Design当前 未标注权限 GitHub 仓库 未标注 未标注 无
Firebase auth basics 邮件管理 接触敏感数据 GitHub 仓库 89.6 万 Codex、Claude、Cursor 有
时差 联网访问 GitHub 仓库 79.8 万 Codex、Claude、Cursor 有
内存卫生 联网访问 ClawHub 市场 67.9 万 OpenClaw 有
及时的工程专家 只读 ClawHub 市场 55.8 万 OpenClaw 有
FastAPI templates 测试 联网访问 GitHub 仓库 37.2 万 Codex、Claude、Cursor 有

SKILL.md 全文

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

page-design

单页设计子流程。用于已有自定义页面的美化或设计:页面美化、视觉升级、官网首页、列表、看板、大屏、详情、工作台和表单入口体验优化。

Step 1:读取应用主题与功能契约

单页设计和页面重构先确认当前应用主题,同时记录现有功能契约。页面美感提升默认属于 UI-only 改造:调整布局、密度、间距、视觉层级、素材和图标表达,业务功能保持原样。

证据来源 读取内容 写入设计补充
用户给出的应用 URL、appType、页面 URL、resource context 目标应用、目标页面、页面所处业务上下文 appType、pageFormUuid、themeEvidence.source
project/config.json、.cache/<项目名>-schema.json、.openyida-page.json 已记录的 app/page/form、themeProfile、页面视觉摘要 themeEvidence.source=workspace
当前应用配置中的 colour、themeColor、navTheme 当前应用主色和导航明暗 currentAppTheme
已有 Page Spec / 页面源码中的 themeProfile、应用主题消费方式 页面正在消费的应用主题 token currentPageTheme
已有 Page Spec / 页面源码 / 用户描述中的按钮、筛选、数据源、表单入口、跳转、权限、状态 当前页面功能契约和业务动作 functionContract

主题证据齐全时,页面重构、局部美化、列表/看板/详情优化沿用当前应用 colour / themeColor。主题证据缺失时,记录 themeEvidence.status=missing,根据行业、品牌、业务情绪和视觉目标生成应用主题文件,不固定回到 podBlue / #1677ff,也不套用行业刻板配色。

共享主题消费

先读取当前应用的 design.md,沿用已确认主题和组件规则;不重新选型或为单页另建主题库。尚无主题契约且本次需要确定风格时,按 共享主题选择规则 只读 主题索引 摘要,选中后读取一份完整主题,再补当前页面的项目化设计。局部美化仍保持应用主题、导航和功能契约。

完整步骤

步骤 复用文件 单页执行重点
1 本文件:读取应用主题与功能契约 获取 currentAppTheme、currentPageTheme、themeEvidence、functionContract
2 读取整理后的用户需求 聚焦当前页面的用户、任务、业务对象和 UI-only 改造目标;没有完整应用需求文件时使用当前页面上下文
3 选择主题色和 token 基于 Step 1 的应用主题;需要换色时生成或更新应用主题文件
5 页面结构和交互设计 明确布局骨架、主操作、详情抽屉、表单提交入口和 PC/移动端差异
6 UI 视觉和状态设计 细化当前页视觉、素材、图标、空态、加载态、错误态和业务化自检
7 写入 design.md 输出当前页面的设计补充,交给 yida-canvas-custom-page 实现;业务或页面契约变化时交给 yida-prd 更新 PRD

主题决策口径

  • 当前应用主题清楚:themeDecision=follow-app 或 page-enhance,themeProfile.name 使用当前应用主题 key,themeColorSource=application-theme,页面按业务需要调整构图、密度、素材和辅助视觉。
  • 当前页面存在页面级主题 token:由 yida-design 将主色和语义变量收敛到应用主题文件。
  • 页面重构/局部美化:以当前应用主题为基准,使用 design.md 确定的品牌色阶和语义变量。
  • 页面美感提升/改 UI:functionContract 保持稳定,现有数据源、字段映射、按钮动作、筛选逻辑、提交 URL、权限和业务状态按原有实现交付。
  • 用户明确要求换主色时,执行 openyida sample yida-design app-theme --output <app-theme.css> --design-file prd/<项目名>/design.md 复制模板并按 design.md 自动替换 token;严禁重新生成或覆盖整份 CSS。
  • 用户明确要全应用换肤:将诉求回到 yida-design 的主题色和 token 分支,输出应用主题 CSS、themeColor 和 navTheme。
  • 单页只做局部美化:保持平台导航和应用主题稳定,直接使用当前主题变量。

输出补充字段

在 design.md 输出格式 基础上补充:

- themeEvidence:<source/status/currentAppTheme/currentPageTheme>
- currentAppTheme:<colour/navTheme/config.COLOUR 或 missing>
- currentPageTheme:<当前应用主题变量或 missing>
- themeDecision:<follow-app / page-enhance / app-theme-update>
- functionContract:<保留的数据源/字段映射/按钮动作/筛选逻辑/提交 URL/权限/状态>
- changeScope:<UI-only:颜色/布局/密度/间距/视觉层级/素材/图标>

常见问题

5 问
答案由本站依据条目字段整理
Yida Page Design怎么安装?

没有现成安装命令:按安装说明或仓库 README,把 SKILL.md 放进客户端的 skills 目录(一般一个技能一个文件夹)。

Yida Page Design支持哪些客户端?

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

Yida Page Design权限高吗,安全吗?

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

Yida Page Design收费吗?

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

Yida Page Design用什么许可证?

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

热门专题

按场景挑技能
全部专题 →

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