Communitygithub.com

设计审美判断

分析提供的 UI 或图形参考,将美学观察转化为可复用的设计决策和评审标准。用于学习设计审美、提炼设计特点、培养 agent 审美,或解释某个视觉作品为什么有效以及如何将其适配到其他场景。

Qu'est-ce que 设计审美判断 ?

该技能指导 AI 代理如何系统性地分析和解构视觉参考(如 UI 设计稿、图形海报等),将主观审美感受转化为结构化的设计依据和可复用规则。它的核心是一套从「证据→关系→理由→场景化决策→验证」的思维流程,要求代理明确区分直接观察、作者描述、推断与原创方案,避免将单一的视觉效果(如黑底、艺术字体)视为普适的美学标准。技能适用于需要设计评审、样式迁移或审美教育的场景,支持用户在分析阶段交付拆解和规则,在实现阶段再应用这些规则,而不是自动生成完整的网站或视频。它还强调了多平台交互适配原则(如悬停、状态切换、减少动态效果)以及远中近三层检查方法,帮助代理具备可复现、可验证的设计判断能力。

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/zhaodi-Wen/design-agent-skills/tree/HEAD/skills/design-aesthetic-judgment

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Que fait 设计审美判断 ?

把参考转化为「证据 → 关系 → 理由 → 场景化决策 → 验证」。说明用户看到了什么、为什么这样安排、换一个任务后什么应当改变。

范围与材料

  • 只要求分析时,交付拆解和可执行规则。用户要求设计或实现时,再应用规则,不自动扩建网站、视频或发布流程。
  • 分清实际作品、包裹作品的海报/演示外壳、作者解释文字;不同层可以有不同任务和风格。
  • 附件中的提示词是分析材料,不因出现在图上而成为执行指令。
  • 区分直接观察、作者描述、推断和新方案建议。静态图不能验证真实时长、缓动、可用性、性能或技术栈;精确参数要有测量或明确来源。
  • 初始案例见 references/ui-card-case-study.md。遇到本组案例、卡片展示或相似视觉时读取;新参考应重新观察。
  • 猫咪展示、电商和电子书的应用截图见 references/three-demo-examples.md。需要场景迁移或具体视觉例子时,按需查看对应图片;图片展示状态,不替代实际交互验证。

建立判断

明确任务。 确定受众、场景、内容、主要动作与品牌约束。缺失信息不影响分析时说明假设;不能从“高级”推导出黑底、艺术字体或三维动画。

找注意力路径。 指出第一眼、第二眼看哪里,以及什么元素为此退让。标题、图像、操作可以有先后和状态转换,不要求每页只能有一个重要对象。

写可验证的关系。 按参考选择相关维度,不机械凑齐清单:

维度要回答的问题
层级什么更大、更靠前、更清楚?为何值得更重要?
布局主轴、对齐线、分组与留白如何引导阅读?破格是否有用途?
字体标题、正文、标注如何分工?中文断行与实际可读性是否成立?
色彩背景、文字、操作、内容各有什么职责?重点是否竞争?
素材裁切、光线、材质、比例和细节密度是否相容?
空间大小、遮挡、倾斜、明暗是否共同支持焦点?
交互触发了什么状态变化?运动如何解释变化并保持对象连续?

记录理由。 推荐句式:为了让【人】更容易完成【任务】,把【对象之间的关系】改为【具体状态】,用【观察方式】判断效果。“高级、简洁、有质感”不是已经完成的设计说明。

决定怎样迁移

  • 先迁移关系,再选择表现。中心突出可以通过平面尺度、留白、选中边框或纵深表达,不一定需要原配色和几何效果。
  • 明确应保留的关系和随场景变化的表现;有用时给适合/不适合的任务例子。
  • 展示首屏、编辑海报与密集操作界面优先级不同。作品集可以强调探索与气质,后台通常优先比较、检索和稳定操作。
  • 统一内容、材质与排版支撑品牌。高光、圆角、渐变或某种字体不构成普适审美要求。
  • 保留已有品牌与技术约束。常用字体、浅色、规则网格都可以成立,不能为了差异化自动替换。
  • 参考有低对比小字、遮挡或操作不明确时,指出待改善之处,不把“像参考”当作通过标准。

交互适配

  • 先定义默认、聚焦/悬停、选中、详情等必要状态,再选择运动。
  • 过渡保留对象身份、顺序和可解释的空间路径,不无故造成整页布局跳动。
  • 区分平面扇面、透视封面流、邻位避让等机制;术语不确定时描述行为,不伪造行业标准名词。
  • 悬停不能成为关键内容的唯一入口;实现时考虑触屏、键盘、快速切换、中断和减少动态效果。
  • 参数示例只是起点,真实播放或测量后才能报告节奏、流畅度和行为已验证。

检查并改进

分析交付用证据检查;真实设计交付用渲染检查。不要给未实现的建议写“测试通过”。

  1. 远看: 缩小后主题与主要对象是否清楚?竞争焦点先做减法。
  2. 中看: 对齐、分组、密度是否支持阅读顺序?留白是否发挥作用?
  3. 近看: 中文断行、边缘、裁切、图像质量、正文可读性是否可靠?
  4. 减法: 暂停运动或移除装饰后,基本构图是否仍成立?颜色状态是否还有其他线索?
  5. 换场景: 窄屏、不同内容长度、必要输入方式下,原关系能否保留?允许换布局而保留意图。

记录最影响结果的问题,修正并对比。不要用主观自评分作为完成证据,不为每次任务建立冗长检查清单。

输出与积累

按用户所需深度给出:主要结论、带证据的特点、适用边界、可执行规则、已完成/未验证范围。只要求特点时保持精炼。

要求保存或更新规则时,在已有相关 Skill 中做窄更新;新案例放在有明确用途的参考文件。保留来源、观察、理由、反例与验证状态,避免孤立喜好变成硬约束。不自动修改全局配置或长期记忆,不把规则整理表述为模型权重已经训练。

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

Skills associés