AgentSkillsCN

ui-aesthetic-generator

将 ui-aesthetic-skill.md 中的审美标准、风格预设与验收要点转化为“生成导向”技能,服务于页面/组件的视觉生产。

SKILL.md
--- frontmatter
name: ui-aesthetic-generator
description: 将 ui-aesthetic-skill.md 的审美标准、风格预设与验收要点落地为“生成导向”技能,服务页面/组件视觉生产。

UI Aesthetic Generator

目标:按审美规范直接生成可执行视觉规范,不只做点评。

SSOT

  • ../../ui-aesthetic-skill.md

核心能力

  1. 审美标准应用
  • 视觉层级、色彩系统、排版系统、间距系统、圆角与阴影。
  1. 风格预设选择
  • 根据场景匹配风格并给出理由与风险。
  1. 组件审美规范
  • 按钮、卡片、输入等基础组件规范化定义。
  1. 生成验收闭环
  • 执行审美检查清单并输出修复建议。

执行流程

  1. 输入解析:产品类型、品牌调性、目标人群。
  2. 风格策略:确定视觉方向与令牌范围。
  3. 组件规范:给出核心组件视觉规则。
  4. 质量回看:输出审美分和优化项。

输出约定

  1. 风格方向与设计理由
  2. 令牌建议(色彩/排版/间距/圆角/阴影)
  3. 关键组件视觉规范
  4. 审美风险与修复清单

协作关系

  • ui-aesthetic-coach 区分:
    • ui-aesthetic-coach 更偏诊断与改进
    • 本 skill 更偏生成与规范落地
  • ui-generation-workflow-runner 联动用于 Step 2 实现阶段。