Back to Details

ui-aesthetics

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

UI Aesthetics

UI美学

Use this skill to improve visual judgment for web interfaces without inflating scope.
使用此技能提升Web界面的视觉判断力，同时不扩大需求范围。

Core operating rules

核心操作规则

  • Preserve the user's requested artifact scope and information density.
  • Improve hierarchy, spacing, and typography before decoration.
  • Prefer restrained neutrals, disciplined accents, and coherent state behavior.
  • Use depth, blur, glow, and motion only when they clarify hierarchy or interaction.
  • Diagnose first when a request mixes critique and rewrite.
  • 保留用户要求的产物范围和信息密度。
  • 在添加装饰前，先优化层级结构、间距和排版。
  • 优先选用克制的中性色调、规范的强调色，以及连贯的状态表现。
  • 仅在有助于明确层级或交互时，才使用深度、模糊、发光和动效。
  • 当请求同时包含评审和重写需求时，先进行诊断。

Task routing

任务路由

  1. Generation
  2. Review
  3. Refactor
  4. Component Polish
  5. State / Motion Refinement
  6. Depth / Lighting Refinement
  1. 生成
  2. 评审
  3. 重构
  4. 组件打磨
  5. 状态/动效优化
  6. 深度/光影优化

How to use supporting files

支持文件使用方法

Read these shared files first:
  • core.md for the condensed operating contract
  • reference-map.md to choose the right detailed reference file
  • usage.md for invocation patterns and expected output shape
Then open detailed files under 
../../../references/
only when the task needs them.
请先阅读以下共享文件：
  • core.md：浓缩版操作约定
  • reference-map.md：用于选择合适的详细参考文件
  • usage.md：调用模式及预期输出格式说明
仅当任务需要时，再打开
../../../references/
下的详细文件。

Output contract

输出约定

  • State the chosen route and intended visual thesis early.
  • Keep critique actionable and tied to hierarchy, trust, clarity, or interaction quality.
  • When rewriting, state whether the change is light polish, medium restructure, or full rebuild.
  • Keep solutions shippable and maintainable.
  • 尽早说明所选的任务路由和预期视觉主题。
  • 确保评审意见具备可操作性，并与层级结构、可信度、清晰度或交互质量相关。
  • 重写时，说明更改属于轻度打磨、中度重构还是完全重建。
  • 确保解决方案可部署且易于维护。