核心用法
火一五前端设计技能（v2.2.0）是专为中国市场定制的高保真 UI 原型生成系统，覆盖 Web、移动端 H5、APP 及微信/支付宝小程序全场景。用户通过触发词（"做网站""做 APP""做小程序"等）激活后，系统强制执行「设计四问」思考框架：目的、基调、约束、差异点，确保产出具备明确设计意图而非模板套用。
技能采用 六大美学流派 强制选边机制：
- BOLD-MINIMAL（勇敢极简）：Stripe/Linear 风格，大留白双色系
- EDITORIAL（编辑杂志）：衬线字纵向栅格，NYT 式叙事感
- BRUTALIST（野兽派）：等宽字粗黑线，打破网格的先锋表达
- RETRO-FUTURE（复古未来）：像素字 CRT 光晕，80s 霓虹美学
- ORGANIC（有机自然）：手绘感暖色柔边，适用于生活方式品牌
- MOBILE-NATIVE（移动原生）⭐v2.2 核心：iOS HIG / Material Design 3 / HarmonyOS 三套平台规范，含微信/支付宝小程序子集
工作流遵循 Junior/Full 两趟渲染：阶段 1 从 examples/ 起手快速出骨架占位，阶段 2 补真实文案与图片精调细节，阶段 4 通过 Playwright CLI 或微信开发者工具/支付宝 IDE 完成自验证。
显著优点
1. 反 AI Slop 硬红线（15 条）：系统性规避 2023-2024 年 AI 生成内容的视觉陈词滥调——禁用紫色渐变、emoji 图标、圆角卡片+彩色竖条、全局 16px 圆角、滥用 backdrop-blur 玻璃态等，输出具备专业设计师水准
2. 本土化小程序深度支持：v2.2 新增微信/支付宝双平台 starter，覆盖 wxml/wxss 与 axml/acss 语法差异，提供 wx:→a: 前缀转换指南，解决小程序字体加载限制（禁用 @font-face，退至 PingFang SC/思源黑体）
3. 平台规范原生对齐：MOBILE-NATIVE 流派内置 iOS HIG（iPhone 16 Pro 393×852 viewport）、Material Design 3（Pixel 8 412×915）、HarmonyOS 三套安全区与触控规范，强制 safe-area-inset 与 rpx 适配
4. 可验证产出：每次交付含可直接运行的代码 + 3 行设计说明（流派/关键选择/差异点）+ Playwright 截图命令或 IDE 调试流程，确保「能跑、能看、能评」
潜在缺点与局限性
- 美学门槛：强制「极端方向」选边对初级用户存在认知负担，若用户无法明确偏好，需并行生成 3 方向 Junior pass 对比，增加交互轮次
- 小程序生态限制：平台禁止 web font 加载，数字/英文差异化需依赖 base64 子集或字号字重调节，复杂字体表现力弱于 Web 场景
- 验证工具链依赖：Playwright 需 Node.js 环境，微信/支付宝 IDE 需安装专用开发者工具，纯浏览器用户无法完整走完自验证流程
- 内容占位现实：Junior pass 阶段使用 Lorem Ipsum 与 Unsplash 占位图，若用户未提供真实品牌素材（需调用
huo15-openclaw-brand-protocol），Full pass 易停滞
适合人群
- 前端开发者：需要快速产出高保真原型供评审，避免从零写 CSS
- 产品经理/创业者：验证 APP/H5/小程序 MVP 视觉方向，输出可直接给开发的标注稿
- 独立设计师：建立个人作品集网站，需规避「AI 感」建立专业 credibility
- 品牌方市场团队：制作营销落地页、产品详情页、活动 H5，要求「不像 AI 生成的」质感
常规风险
- 平台审核风险：小程序场景使用非官方组件库（如自绘 tabBar 而非 native）可能导致审核驳回，需严格遵循红线 #14-15 的 token 定制与
<page-meta>规范 - 性能风险：oklch 色空间与复杂动效在低端安卓机或旧版 webview 存在渲染压力，建议关键路径提供降级方案
- 版权风险：Unsplash/Picsum 占位图需明确标注「待替换」，商用前必须替换为授权素材
- 品牌一致性风险：若未联动
huo15-openclaw-brand-protocol抓取品牌规范，易出现配色/字体与品牌手册冲突