这个 Skill 不画图，它先逼你想清楚「页面到底要干嘛」

你有没有这种感觉——设计师给了你一堆 moodboard 和风格参考，你点头说”嗯嗯不错”，但心里完全不知道最终会出来什么？

大多数 AI 设计工具就是这个节奏：给个 prompt，等几秒，一堆图出来了，然后你再从里面挑。这种”先出图再说”的逻辑，本质上还是在拼手气，而不是在做设计。

今天挖到一个不一样的——visual-design-web，来自独立开发者 leyros，定位是”视觉策略 + 艺术指导”，专门在代码出来之前，把设计的「为什么」想清楚。

它不画图，它先「问问题」

这个 Skill 的工作流分 6 个阶段，但最核心的是开头两件事：

Phase 1：收集输入——你不是设计师吗？先告诉我：谁是这个页面的用户？他们的情绪状态是什么（是焦虑地在比较，还是随便逛逛）？这个页面的唯一任务是什么？内容现在到位了吗，还是还在”想法”阶段？

听起来像在填表格，但这是整个流程里最值钱的一步。很多设计最后翻车，不是审美问题，是从一开始就搞错了”这个页面到底要干嘛”。

Phase 2：构建 Page Thesis——用一句话把页面的使命说清楚。比如：”这个页面帮助电商用户快速判断产品适不适合自己，从而降低退货率。”不是”这是一个产品详情页”，而是”它要解决什么问题”。

3-5个方向，不是3-5张图

大多数 AI 生成工具给你的是”3个配色方案”或”3套字体搭配”。这个 Skill 给你的是3-5个「概念领地」（Concept Territories）——每个方向背后有完整的设计逻辑：communicative stance（这个方向传达什么情绪）、design-school lens（借鉴了哪个设计流派，为什么这个场景用它是合理的）、风险提示（哪个方向容易搞砸）。

选方向不是选美，是选策略。

适合谁用

• UX 设计师：在动手之前把设计策略想清楚，避免被 AI 带着跑
• 产品经理：需要快速判断一个设计方案是否在正确的方向上
• AIGC 创作者：不想纯靠 prompt 抽奖，想建立自己的设计决策框架

怎么安装

npx skills add https://github.com/leynos/visual-design-web-skill --skill visual-design-web

Trigger 关键词：”visual direction”、”page design strategy”、”design critique”、”plan visual hierarchy”、”choose type/colour/image strategy”。

GitHub：https://github.com/leynos/visual-design-web-skill

GitHub: https://github.com/leynos/visual-design-web-skill