CL4R1T4S Frontend Design Principles

Key Facts / Current Understanding

• 设计前先获取真实上下文：代码、设计系统、组件、品牌、截图、Figma。
• 设计不是默认做“网页皮肤”，而是根据任务选择合适媒介：原型、动画、交互稿、deck、视觉探索。
• 设计过程应先问问题，再出系统，再出变体，而不是直接拍脑袋出唯一方案。
• 变体应覆盖视觉、交互、布局、节奏、颜色处理、组件密度等多个维度。
• 应主动规避泛化 AI 风格：无脑渐变、千篇一律的卡片、过度圆角、默认科技紫、无上下文字体栈。
• 高质量设计依赖“已有视觉词汇”对齐，而不是从真空中乱造。
• HTML/原型产物应可运行、可验证、可继续 tweak，而不是一次性静态交付。

Relationships

• 这些原则直接强化 frontend-ui 的设计质量要求。
• 它们应服务于 personal-llm-wiki 中未来所有前端与原型任务。
• 具体执行时仍由 hermes-agent 负责落地与取舍。

Open Questions / Tensions

• 还需结合用户自己的品牌偏好，避免把外部 prompt 机械化套用。
• 当真实设计系统与这些原则冲突时，应优先真实项目上下文。
• 后续可将其沉淀为 Hermes 自定义 skill，而不是只存在于 wiki 中。

Source Notes

来源是 GitHub 上的公开提示词文件。这里记录的是吸收后的工作原则，而不是逐段转载原文。