Garden Skills五维度设计评审法完整指南0-10分打分标准详解【免费下载链接】garden-skillsConardLis open-source Skills collection, featuring web design, knowledge retrieval, image generation, and more.项目地址: https://gitcode.com/GitHub_Trending/we/garden-skillsGarden Skills 是 ConardLi 开源的 AI Agent 技能集合其中的 web-design-engineer 技能内置了一套五维度设计评审法从设计哲学一致性、视觉层次、工艺质量、功能性与原创性 5 个角度对网页设计逐项打出0–10 分并输出按严重程度排序的修改清单。本指南完整拆解每个维度的打分标准帮你把这个设计好不好看的模糊感受变成可量化、可执行的设计评审标准。一、五维度设计评审法是什么 当 AI 生成一个网页后完成不等于好看。web-design-engineer 技能在工作流第 7 步定义了 **Critique设计评审**环节对产物按 5 个维度逐一打分满分 10 分。五个维度分别回答一个核心问题维度英文核心评审问题设计哲学一致性Philosophy Alignment每个细节是否都源于选定的设计方向视觉层次Visual Hierarchy视线是否沿设计师预期的路径流动工艺质量Craft Quality对齐、间距、用色的像素级执行是否精准功能性Functionality每个元素是否挣得了它的位置原创性Originality是否避开俗套、又有意料之外但恰当的决策完整的打分细则、权重表和问题清单都收录在 critique-guide.md五维度的定义入口在 SKILL.md。 评审的黄金法则Critique the design, not the designer—— 评设计不评人。所有反馈要具体、可操作、有设计语言支撑而不是颜色有点怪这种模糊口味判断。二、0–10 分打分标准逐维详解2.1 设计哲学一致性从表面模仿到全面体现评审设计是否贯彻了选定的方向比如极简主义、瑞士网格、杂志编辑感而不是东拼西凑。分数标准9–10每个细节都在体现所选哲学没有任何从别处搬来的痕迹7–8方向正确、签名特征落地仅 1–2 处轻微漂移5–6意图可见但混入了外来元素稀释纯度如极简主义却每行排 6 张卡片3–4只有表面模仿不理解底层价值观1–2与任何既定方向都无可辨识的关联检查要点选定设计师/工作室的招牌手法是否真的在场色彩、字体、布局、动效是否指向同一套哲学有无自我矛盾的元素2.2 视觉层次眯眼测试是否通过 分数标准9–10视线自然沿预期路径流动读取信息零摩擦7–8主次清晰1–2 处层次模糊5–6标题与正文可区分但中间层副标题、图注塌在一起3–4信息平铺没有明确入口1–2混乱——观看者不知道先看哪里检查要点标题与正文字号比是否 ≥ 2.5 倍Hero 区理想 4–6 倍色彩/字重/大小是否构建了 3–4 个清晰层级眯眼测试Squint test——眯起眼睛看屏幕层次是否依然可读2.3 工艺质量8pt 网格与色彩纪律像素级执行的评审对齐、间距系统、色彩克制。分数标准9–10像素级完美对齐、间距、色彩无瑕疵7–8整体精细仅 1–2 处轻微对齐或间距问题5–6基本对齐但间距不一致、色彩使用不成体系3–4明显对齐错误、间距混乱、颜色过多1–2粗糙——看起来像草稿检查要点间距是否遵循 8pt 网格只取 8/16/24/32/48/64 这类值同类元素间距是否一致颜色数量是否 ≤ 4主色 点缀 中性色阶 1 个强调字体家族是否 ≤ 21 个展示字体 1 个正文字体2.4 功能性删除测试 ️分数标准9–10每个元素都服务于目标零冗余7–8整体以功能为先仅存可删的轻微装饰5–6可用但明显有装饰元素在争夺注意力3–4形式大于功能用户需要费力找信息1–2装饰淹没了内容传达检查要点对每个元素做删除测试——删掉它设计会变差吗若答案是否 → 删掉。CTA 和关键信息是否在最显著位置有没有因为好看而添加的元素信息密度是否匹配媒介幻灯片宜稀疏、PDF 可以密、落地页为转化服务2.5 原创性拒绝AI 味俗套 ✨分数标准9–10耳目一新在所选哲学内找到独特表达7–8有自己的想法不是按模板拼装5–6平庸——读起来像模板执行3–4大量俗套AI必配紫色渐变光球对话必配聊天气泡1–2纯模板/素材拼凑检查要点是否避开了AI 味清单紫粉渐变、emoji 充图标、左侧彩色边框卡片、Inter 当展示字体是否至少有一个意外但正确的决策有没有元素在尖叫这是 AI 做的更多上下文化的失败模式可查 failure-patterns.md。三、不同产物类型的权重策略不同产物的评审重点不同打分时应按下表调整权重完整表格见 critique-guide.md产物类型最重要次重要可放宽落地页 / 营销站功能性、视觉层次原创性无必须全面仪表盘 / 数据产品功能性、工艺质量视觉层次原创性清晰优先HTML 幻灯片视觉层次、功能性工艺原创性可读优先移动端原型功能性、工艺视觉层次哲学一致性可用性优先品牌发布动画 / Hero 片原创性、视觉层次哲学功能性它是时刻而非表单编辑设计 / 作品集原创性、哲学视觉层次功能性氛围最重要一句话理解落地页看转化仪表盘看清晰作品集看气质。四、Top 10 常见设计问题清单评审时可直接对照这张清单逐项检查完整问题清单含为什么是问题与修复方案见 critique-guide.md#问题快速修复1AI 科技感俗套渐变光球、机器人脸用抽象隐喻替代直白符号2字号层次不足标题 正文 2.5 倍正文 16px → 标题至少 48–64px3颜色过多≥ 5 色无主次限 1 主 1 次 1 点缀 灰阶4间距无系统只取 8pt 网格值5留白不足留白 ≥ 总面积 40%极简风 ≥ 60%6字体过多≥ 3 家族最多 2 个用字重/字号做变化7对齐不一致全局统一一种对齐方式通常左对齐8装饰压过内容做删除测试不加分就删9赛博霓虹滥用深色底 荧光色换更有辨识度的调色板10信息密度与媒介错配幻灯片每页 1 个核心观点五、评审报告输出模板评审完成后按固定模板交付一份结构化报告模板见 critique-guide.md总评Overall: X.X / 10并标注档位 —— 优秀8/ 良好6–7.9/ 待改进4–5.9/ 不及格4分维度得分5 个维度各 X/10附一句话理由Keep值得保留用设计语言说清哪里好、为什么好而非颜色不错Fix修改项按严重程度排序 ⚠️ 关键 → ⚡ 重要 → 打磨每项给出具体值如标题从 32px 提到 56px而不是把标题做大Quick Wins快速收益只有 5 分钟时先做的 3 件最高性价比修改六、评审反模式好点评 ≠ 模糊夸奖critique-guide 末尾专门列出了 6 个评审反模式新手最容易踩中❌模糊口味判断颜色不对 → ✅ 点缀色饱和度太高与主色抢注意力建议降低明度使其从属❌无细节的夸奖看起来很棒零学习价值——永远说清什么很棒、为什么❌混排严重程度关键层次错误和打磨级颜色微调不能混在一个列表里❌修改项超过 7 条认知过载同类问题要合并成一条❌批评设计师而非设计你没想清楚不解决任何问题七、上手路径与相关文件 想亲手体验Skill 开 / 关的评审差异可以直接打开仓库里的对比演示页 demo/web-design-demo/demo2/index.html同一提示词、有无技能加持各生成一页差异一目了然。核心文件导航评分细则 权重表 问题清单critique-guide.md七步工作流评审在第 7 步SKILL.md按产物类型的失败模式failure-patterns.md25 套风格配方库评审哲学一致性的参照系style-recipes/INDEX.md技能中文说明README.zh-CN.md掌握这套五维度 0–10 分打分体系后无论是自评 AI 生成的网页还是评审自己的设计稿你都有了同一把标尺——分数可比较、问题可排序、修改可验收。【免费下载链接】garden-skillsConardLis open-source Skills collection, featuring web design, knowledge retrieval, image generation, and more.项目地址: https://gitcode.com/GitHub_Trending/we/garden-skills创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Garden Skills五维度设计评审法完整指南：0-10分打分标准详解
Garden Skills五维度设计评审法完整指南0-10分打分标准详解【免费下载链接】garden-skillsConardLis open-source Skills collection, featuring web design, knowledge retrieval, image generation, and more.项目地址: https://gitcode.com/GitHub_Trending/we/garden-skillsGarden Skills 是 ConardLi 开源的 AI Agent 技能集合其中的 web-design-engineer 技能内置了一套五维度设计评审法从设计哲学一致性、视觉层次、工艺质量、功能性与原创性 5 个角度对网页设计逐项打出0–10 分并输出按严重程度排序的修改清单。本指南完整拆解每个维度的打分标准帮你把这个设计好不好看的模糊感受变成可量化、可执行的设计评审标准。一、五维度设计评审法是什么 当 AI 生成一个网页后完成不等于好看。web-design-engineer 技能在工作流第 7 步定义了 **Critique设计评审**环节对产物按 5 个维度逐一打分满分 10 分。五个维度分别回答一个核心问题维度英文核心评审问题设计哲学一致性Philosophy Alignment每个细节是否都源于选定的设计方向视觉层次Visual Hierarchy视线是否沿设计师预期的路径流动工艺质量Craft Quality对齐、间距、用色的像素级执行是否精准功能性Functionality每个元素是否挣得了它的位置原创性Originality是否避开俗套、又有意料之外但恰当的决策完整的打分细则、权重表和问题清单都收录在 critique-guide.md五维度的定义入口在 SKILL.md。 评审的黄金法则Critique the design, not the designer—— 评设计不评人。所有反馈要具体、可操作、有设计语言支撑而不是颜色有点怪这种模糊口味判断。二、0–10 分打分标准逐维详解2.1 设计哲学一致性从表面模仿到全面体现评审设计是否贯彻了选定的方向比如极简主义、瑞士网格、杂志编辑感而不是东拼西凑。分数标准9–10每个细节都在体现所选哲学没有任何从别处搬来的痕迹7–8方向正确、签名特征落地仅 1–2 处轻微漂移5–6意图可见但混入了外来元素稀释纯度如极简主义却每行排 6 张卡片3–4只有表面模仿不理解底层价值观1–2与任何既定方向都无可辨识的关联检查要点选定设计师/工作室的招牌手法是否真的在场色彩、字体、布局、动效是否指向同一套哲学有无自我矛盾的元素2.2 视觉层次眯眼测试是否通过 分数标准9–10视线自然沿预期路径流动读取信息零摩擦7–8主次清晰1–2 处层次模糊5–6标题与正文可区分但中间层副标题、图注塌在一起3–4信息平铺没有明确入口1–2混乱——观看者不知道先看哪里检查要点标题与正文字号比是否 ≥ 2.5 倍Hero 区理想 4–6 倍色彩/字重/大小是否构建了 3–4 个清晰层级眯眼测试Squint test——眯起眼睛看屏幕层次是否依然可读2.3 工艺质量8pt 网格与色彩纪律像素级执行的评审对齐、间距系统、色彩克制。分数标准9–10像素级完美对齐、间距、色彩无瑕疵7–8整体精细仅 1–2 处轻微对齐或间距问题5–6基本对齐但间距不一致、色彩使用不成体系3–4明显对齐错误、间距混乱、颜色过多1–2粗糙——看起来像草稿检查要点间距是否遵循 8pt 网格只取 8/16/24/32/48/64 这类值同类元素间距是否一致颜色数量是否 ≤ 4主色 点缀 中性色阶 1 个强调字体家族是否 ≤ 21 个展示字体 1 个正文字体2.4 功能性删除测试 ️分数标准9–10每个元素都服务于目标零冗余7–8整体以功能为先仅存可删的轻微装饰5–6可用但明显有装饰元素在争夺注意力3–4形式大于功能用户需要费力找信息1–2装饰淹没了内容传达检查要点对每个元素做删除测试——删掉它设计会变差吗若答案是否 → 删掉。CTA 和关键信息是否在最显著位置有没有因为好看而添加的元素信息密度是否匹配媒介幻灯片宜稀疏、PDF 可以密、落地页为转化服务2.5 原创性拒绝AI 味俗套 ✨分数标准9–10耳目一新在所选哲学内找到独特表达7–8有自己的想法不是按模板拼装5–6平庸——读起来像模板执行3–4大量俗套AI必配紫色渐变光球对话必配聊天气泡1–2纯模板/素材拼凑检查要点是否避开了AI 味清单紫粉渐变、emoji 充图标、左侧彩色边框卡片、Inter 当展示字体是否至少有一个意外但正确的决策有没有元素在尖叫这是 AI 做的更多上下文化的失败模式可查 failure-patterns.md。三、不同产物类型的权重策略不同产物的评审重点不同打分时应按下表调整权重完整表格见 critique-guide.md产物类型最重要次重要可放宽落地页 / 营销站功能性、视觉层次原创性无必须全面仪表盘 / 数据产品功能性、工艺质量视觉层次原创性清晰优先HTML 幻灯片视觉层次、功能性工艺原创性可读优先移动端原型功能性、工艺视觉层次哲学一致性可用性优先品牌发布动画 / Hero 片原创性、视觉层次哲学功能性它是时刻而非表单编辑设计 / 作品集原创性、哲学视觉层次功能性氛围最重要一句话理解落地页看转化仪表盘看清晰作品集看气质。四、Top 10 常见设计问题清单评审时可直接对照这张清单逐项检查完整问题清单含为什么是问题与修复方案见 critique-guide.md#问题快速修复1AI 科技感俗套渐变光球、机器人脸用抽象隐喻替代直白符号2字号层次不足标题 正文 2.5 倍正文 16px → 标题至少 48–64px3颜色过多≥ 5 色无主次限 1 主 1 次 1 点缀 灰阶4间距无系统只取 8pt 网格值5留白不足留白 ≥ 总面积 40%极简风 ≥ 60%6字体过多≥ 3 家族最多 2 个用字重/字号做变化7对齐不一致全局统一一种对齐方式通常左对齐8装饰压过内容做删除测试不加分就删9赛博霓虹滥用深色底 荧光色换更有辨识度的调色板10信息密度与媒介错配幻灯片每页 1 个核心观点五、评审报告输出模板评审完成后按固定模板交付一份结构化报告模板见 critique-guide.md总评Overall: X.X / 10并标注档位 —— 优秀8/ 良好6–7.9/ 待改进4–5.9/ 不及格4分维度得分5 个维度各 X/10附一句话理由Keep值得保留用设计语言说清哪里好、为什么好而非颜色不错Fix修改项按严重程度排序 ⚠️ 关键 → ⚡ 重要 → 打磨每项给出具体值如标题从 32px 提到 56px而不是把标题做大Quick Wins快速收益只有 5 分钟时先做的 3 件最高性价比修改六、评审反模式好点评 ≠ 模糊夸奖critique-guide 末尾专门列出了 6 个评审反模式新手最容易踩中❌模糊口味判断颜色不对 → ✅ 点缀色饱和度太高与主色抢注意力建议降低明度使其从属❌无细节的夸奖看起来很棒零学习价值——永远说清什么很棒、为什么❌混排严重程度关键层次错误和打磨级颜色微调不能混在一个列表里❌修改项超过 7 条认知过载同类问题要合并成一条❌批评设计师而非设计你没想清楚不解决任何问题七、上手路径与相关文件 想亲手体验Skill 开 / 关的评审差异可以直接打开仓库里的对比演示页 demo/web-design-demo/demo2/index.html同一提示词、有无技能加持各生成一页差异一目了然。核心文件导航评分细则 权重表 问题清单critique-guide.md七步工作流评审在第 7 步SKILL.md按产物类型的失败模式failure-patterns.md25 套风格配方库评审哲学一致性的参照系style-recipes/INDEX.md技能中文说明README.zh-CN.md掌握这套五维度 0–10 分打分体系后无论是自评 AI 生成的网页还是评审自己的设计稿你都有了同一把标尺——分数可比较、问题可排序、修改可验收。【免费下载链接】garden-skillsConardLis open-source Skills collection, featuring web design, knowledge retrieval, image generation, and more.项目地址: https://gitcode.com/GitHub_Trending/we/garden-skills创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考