ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

Garden Skills 设计方向顾问:AI 网页风格怎么选,3 个跨流派方向说清楚

Garden Skills 设计方向顾问:AI 网页风格怎么选,3 个跨流派方向说清楚 Garden Skills 设计方向顾问AI 网页风格怎么选3 个跨流派方向说清楚【免费下载链接】garden-skillsConardLis open-source Skills collection, featuring web design, knowledge retrieval, image generation, and more.项目地址: https://gitcode.com/GitHub_Trending/we/garden-skills你跟 AI 说帮我做个页面好看就行风格我说不清。它大概率会回你一个熟悉的组合Inter 字体、蓝色按钮、紫粉渐变像全公司都用同一个模板。Garden Skills 里的 web-design-engineer 技能内置了设计方向顾问Design Direction Advisor模式就是专门解决这类风格怎么选的问题。一句话说清这个顾问是干嘛的它是 web-design-engineer 技能里的兜底模式你说不清要什么风格时启用。别的工具会反过来问你喜欢冷色还是暖色它直接给你一份菜单上面列 3 道明显不同的菜你夹哪道都行。不审问品味只给选项这就是定位。为什么直接给选项而不是问你一堆品味问题问品味问题有个死结用户连简约风都未必说得清十个问题问完答案还是一团浆糊。顾问模式的做法是把选择题直接抛给你——从六大流派里挑 3 个方向且 3 个必须分属 3 个不同流派。差异肉眼可见选择才有意义。每个方向都带 4 要素一个具名设计师或工作室锚点比如Pentagram 式信息架构而不是简约风这种空话2–3 行为什么适合你的场景3–4 个标志性视觉特征配色、字体、布局、动效各点一下可选项一件知名的参考作品一条硬规则写在技能文件里3 个推荐绝不能来自同一个流派。同流派的 3 个方向用户分不出差别顾问机制直接失效。六大设计流派速查表流派气质代表锚点最适合信息架构理性、克制、层级分明Pentagram、Edward Tufte、VignelliB2B、数据产品、要可信度编辑/极简留白、精致字体、安静MUJI原研哉、Apple、Aesop高端、生活方式品牌现代工具/SaaS发丝细节、暖黑底、单一强调色Linear、Vercel、Raycast开发者工具、AI 工具动效/实验大胆、生成式、感官冲击Field.io、Active Theory、Resn发布时刻、品牌大片粗野主义反设计、生猛、不加修饰Balenciaga、Are.na差异化、亚文化温暖人文亲切、有机、手作感Mailchimp、Stripe Press、Headspace教育、社区、健康产品流派定义和推荐话术模板在 references/design-directions.md 里每个流派还附了一段推荐时说这几句的样例文案。选定之后你拿到什么从风格到配方你选中的流派会变成后续所有设计步骤的上下文并写进项目里的brand-spec.md。后面每一步决策都以这份文件为准不会做着做着跑偏。接下来顾问不会停在选流派。它会从 25 份风格配方的目录里挑出该流派下的 2–3 个具名方案给你确认。每份配方对应一个真实品牌或设计师写满可以直接用的数值配色值、字体、间距阶梯、圆角/阴影/动效特征外加签名式细节。以 linear.md 为例底色#08090A带暖调的近黑不是纯黑强调色 Linear 紫#5E6AD2全页占比不超过 5%边框是 1px 发丝线圆角最大 16阴影几乎不存在签名细节键盘快捷键 chips、等宽字体代码块也就是说风格在这里落地成了一页可对照的数值清单AI 照着执行你照着验收。配方目录和三重索引按流派、按适用场景、按明暗模式见 style-recipes/INDEX.md。哪些情况下顾问会自动让位三种情况会自动切入顾问模式需求极模糊帮我做个好看的东西我不知道想要什么风格没有任何设计上下文你也提供不了参考素材你主动开口推荐个风格给我几个方向反过来出现下面任一情况顾问直接跳过你已经给了 Figma、截图或品牌参考你点名了Linear 风格Aesop 感觉这类具体锚点——技能会直接读对应的那一份配方文件开工。机制细节见 SKILL.md 的 Fallback 一节。三条红线用 AI 做页面时别做的事INDEX 里有一组贯穿全部 25 份配方的反模式清单最值得记的是这三条❌别在一页里混搭两个配方。Linear 的骨架加 Aesop 的点缀通常被读成混乱而不是原创。混搭只在用户明确提出、且你能说清两者为何合拍时才成立。❌粗野主义、Y2K 这类风格要么全力投入要么别选。半吊子执行出来的效果是没做完不是先锋。❌别擅自加 AI 默认装饰。配方说无阴影就别加阴影说无渐变就别加渐变。每多加一笔默认装饰页面就往趋同均值上滑一分。走一遍一次完整对话场景帮我做个开发者工具的落地页风格没想法。顾问给出 3 个方向Linear 式现代工具美学暖黑底 发丝边框 单一紫色强调、Pentagram 式信息架构排版即视觉主体、Are.na 式粗野主义系统字体、无圆角、直给。每个方向附两三行为什么适合开发者工具加上 3–4 个标志性视觉细节。你选 1 个也可以混合 2 个但要说清混合理由顾问会先把混合方案复述一遍确认。Agent 读取对应配方输出完整设计系统声明配色、字体、间距、圆角、阴影、动效。你确认后它才写第一行代码——确认前动不了。第一版是带占位符的 v0 草稿先给你纠偏方向v0 通过后再进入完整构建。方向、系统、草稿每一步都卡一个确认点。方向错了代价最小所以它被放在最前面。相关资料在哪找资料路径技能主文件顾问模式触发与机制skills/web-design-engineer/SKILL.md六大流派分类与推荐话术skills/web-design-engineer/references/design-directions.md25 份风格配方目录 三重索引 反模式清单skills/web-design-engineer/references/style-recipes/INDEX.md设计校准Design Read 与五个旋钮skills/web-design-engineer/references/design-calibration.mdAI 失败模式与修复方法skills/web-design-engineer/references/failure-patterns.md技能说明文档skills/web-design-engineer/README.md我说不清要什么本来是一道开放题。Garden Skills 设计方向顾问把它变成了一道选择题3 个方向里挑 1 个剩下交给配方。【免费下载链接】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),仅供参考
返回列表