Frontend Strategy 是一个网站战略规划技能，用于在“我需要一个网站”与真正编写代码之间架起桥梁。它通过结构化的客户调研，产出专业的战略交付物，并在定义的交接点调用专业智能体协作。
用途与定位 该技能负责发现与战略阶段。当准备进入构建阶段时，交接给 frontend-engineer 智能体；如果目标是改进现有前端代码库，则应改用 /frontend:review-design。
心理学基础 四项原则贯穿每个阶段和交付物，每条建议都必须至少关联其中一项：
- 光环效应——用户约在50毫秒内形成对网站的印象，这一印象会影响对后续一切的判断。应用包括为每个关键落地页定义“3秒光环时刻”，刻意设计首屏区域，并追问“访客在最初50毫秒应感受到的唯一情绪是什么”。参考案例：Apple。
- 认知负荷与认知流畅性——大脑倾向节能，高认知负荷显得紧张且不专业，而易于处理的内容会被解读为更好、更可信、更高质量。应用包括主导航最多7项（米勒定律）、任意内容最多3次点击深度、渐进式披露、每个区块一个主要目标、留白作为自信与专属感的心理暗示。参考案例：Hermes/Bottega Veneta、Stripe/Figma。
- 包容性设计与无障碍——无障碍设计并非事后补充，它能降低所有用户的认知负荷。应用包括所有文字/背景组合至少满足 WCAG AA 对比度、语义化标题层级与地标区域、所有交互元素可键盘访问且有可见焦点状态、在设计方向阶段记录焦点顺序与 Tab 序列、图片替代文本策略。参考案例：Gov.uk、Apple。
- 微交互与峰终定律——人们记住体验靠最强烈的点（峰值）和结束方式。应用包括每个页面以强有力的有意时刻结束、为每个用户旅程识别3-5个“峰值时刻”并刻意设计、确认/成功页面作为正向峰值、避免静态无生气。参考案例：Apple、优质 SaaS。
阶段0：客户发现 结构化访谈，在所有问题回答并确认前不得推进。发现模板包含：业务、目标、受众、竞争对手、语气、品牌资产、独特价值主张、现有网站、预算范围、时间线、成功指标。硬性门槛：在用户确认所有发现答案前不得进入阶段1；若答案含糊，需追问具体细节，尤其是受众、目标和成功指标。
阶段1：网站简报 将发现整理为专业简报文档，使用 references/website-brief-template.md 模板。章节包括：执行摘要、目标受众画像、竞争对手分析表、价值主张、品牌个性、技术需求、光环时刻定义、范围校准（预算低于5k倾向标准布局与原生 UI 组件；预算高于20k可推进高级 CSS 交互、WebGL、滚动驱动动画与 View Transitions）。随后向 seo-specialist 智能体发起“SEO 竞争分析”交接，并将发现纳入简报的竞争对手分析部分。
阶段2：站点地图与用户流程 信息架构阶段，使用 references/sitemap-template.md 模板。章节包括：页面清单、页面层级、导航结构、用户流程、转化漏斗。认知负荷规则：主导航最多7项、任意内容最多3次点击深度、渐进式披露、每页一个主要目的与一个主要 CTA。交接序列：先调用 frontend-design 验证信息架构与用户流程并优化转化漏斗（应用 LIFT 模型），再调用 frontend-layout 定义页面布局构成、网格系统、响应式断点策略与首屏内容优先级。两个智能体需顺序运行，先验证优化流程，再设计页面结构。
阶段3：设计方向 视觉识别阶段，使用 references/design-direction-template.md 模板。对于品牌主导的界面（落地页、活动页、营销站、作品集），还需参考 references/brand-register.md 获取字体选择流程、反射拒绝清单、色彩策略与品牌禁令。交付物层面参考 token-architecture.md、component-specs.md、states-and-variants.md、tailwind-integration.md。章节包括：色彩调色板、排版、视觉情绪板、间距系统、组件风格方向、灵感参考。规则包括：调色板必须创造光环时刻定义的情绪反应、所有颜色组合满足 WCAG AA 对比度、排版优先可读性、间距系统创造呼吸空间、组件风格保持连贯、记录焦点状态与键盘交互模式、尊重已有品牌资产。随后向 frontend-design 智能体发起“CSS 架构”交接。
阶段4：内容策略 信息与文案策略阶段，使用 references/content-strategy-template.md 模板。章节包括：信息层级、逐页文案策略表、CTA 放置清单、SEO 关键词地图、内容类型、语气指南。峰终定律应用：每页以强 CTA 或明确下一步结束、确认与感谢页作为正向峰值、识别3个最具情绪冲击的时刻并专门撰写文案、错误状态作为恢复机会。随后依次向 content-marketer 智能体发起“信息与 CTA 策略”交接，向 seo-specialist 智能体发起“关键词映射”交接（第二次调用，此时已有阶段2的站点地图上下文），并将两者输出合并到内容策略文档。
阶段5：最终打包 将所有阶段输出编译为单一总括文档，使用 references/final-package-template.md 模板。结构包括：目录、执行摘要、网站简报、信息架构、设计方向、内容策略、实施路线图、成功 KPI、心理学应用总结表。将最终包写入文件（如 website-strategy.md 或大型时使用目录结构）。
交付物撰写规则 全程专业咨询语气，面向客户；使用 Markdown 格式，含清晰标题、表格和列表；每条建议关联至少一项心理学原则并说明原因；不输出代码；具体可执行（如“最小48px区块内边距、24px元素间距”而非“使用充足留白”）；竞争对手引用需包含具体观察；所有交付物作为可交给独立设计/开发团队的独立文档撰写。
限制 该技能仅覆盖发现与战略阶段，不负责构建实现；构建需交接给 frontend-engineer 智能体。改进现有前端代码库应使用 /frontend:review-design。具体收费、价格、平台支持等信息暂未提供。