人机优化前端设计

技能简介

该技能通过联合优化视觉美学、动态图形与用户体验，生成兼具视觉吸引力与操作流畅度的前端界面。采用量化评分机制对排版、色彩、布局、动效等维度进行系统性评估与迭代优化。

能做什么

• 根据明确指令重新设计完整前端界面
• 建立统一的审美方向与交互哲学体系
• 制定包含字体层级、色彩系统、空间布局的完整规范
• 设计符合认知负荷原则的动效与反馈机制
• 输出可量化的设计质量评分与迭代建议

使用说明

激活条件：用户须明确提及”use human-optimized-frontend”、”redesign frontend”或”redesign interface”等触发词，并指定调用本技能名称。

执行流程：

1. 信息接收：获取界面相关背景信息；若信息缺失，默认按通用功能产品处理
2. 方向锁定：选定单一审美方向与交互哲学（如清晰优先、流程驱动、探索引导）
3. 初始设计：按规范生成排版、色彩、布局、背景深度、动效及UX结构方案
4. 量化评估：对7个维度0-10分评分，计算加权总分，和谐度须≥8
5. 迭代优化：优先调整最低分项，每轮最多调整两个维度，上限5轮
6. 规格输出：交付完整前端设计规范文档

安装指令：本技能为声明式规范生成工具，无需本地安装，直接通过技能调用接口使用。

输入与输出

见下方输入与输出表格。

风险提示

• 仅响应完整界面重设计请求，不处理概念讨论、代码实现、灵感参考或组件级需求
• 未提供品牌、受众心理或商业目标时，按中性假设处理，可能偏离实际业务场景
• 动效设计存在性能开销，需结合目标平台能力评估可行性
• 量化评分为内部迭代工具，非行业通用标准

来源信息

原始链接：https://github.com/openclaw/skills/tree/main/skills/vishnubedi3/human-optimized-frontend/SKILL.md
来源类型：GitHub 技能仓库