第 7 屏 | AI 穿搭推荐

二级页面 · 规范级高保真 iPhone 375 × 812 pt · 微信小程序规范

从穿搭页进入,涵盖场景选择半屏弹窗、生成中全屏动效、AI推荐结果页及伴生三态异常与180秒频率保护机制。

主色:#007AFF 辅助:#5856D6 靛蓝
阶段 1 · 场景选择半屏弹窗 (可跳过)
9:41
AI 推荐

选择推荐场景

结合你的衣橱 128 件衣物精准匹配

每日推荐 默认

按今日白羊座运势、天气与衣橱自动搭配

自定义场景

为特定活动或出行场合量身打造

剩余 AI 推荐额度:5 次 额度说明

半屏 Sheet 规范:375pt 贴合底边,支持点击遮罩/跳过直接按每日推荐生成。

阶段 2 · 生成中全屏动效页
9:41
智能匹配中

AI 正在为你搭配…

结合今日白羊座运势与你的 128 件衣物

预计耗时 2~3 秒,正在分析色彩和谐度

生成中全屏态:中央矢量线稿交替,融合星座运势文案,增强感知价值。

阶段 3 · AI 推荐结果页 (核心态)
9:41
AI 专属运势匹配 4 件单品组合
米白开衫
白色纯棉T
直筒牛仔裤
皮质乐福鞋
点击单品可查看衣物详情

晴日轻复古通勤组合

通勤
今日综合运势 4 星

适合以米白针织开衫搭配直筒牛仔裤,清爽又有层次,兼顾室内空调温度与户外舒适度。

生成时间:今日 09:41 风格:法式轻复古 · 简约
推荐单品清单 (4) 向右滑动查看

米白针织开衫

上装 · 针织

白色纯棉T恤

上装 · T恤

复古高腰牛仔

下装 · 牛仔裤

换一套将再消耗 1 次推荐额度 · 受 180 秒频控保护

结果页:顶部大拼图 + 4星运势推荐语 + 单品横滑 + 底部固定双操作栏。

第 7 屏伴生交互状态与三种异常态规范

微信小程序异常设计规范 (Empty States & Alerts)
异常态 1 · 缺少素材 前置校验拦截

还没有可用衣物

先上传几件处理成功的衣物吧,AI 至少需要 2~3 件单品才能为您搭配

异常态 2 · 商业化额度 弹窗 Alert 态
AI 推荐额度不足

本月免费推荐额度已用完。开通会员或购买加油包,解锁无限次 AI 专属穿搭灵感。

符合 Apple IAP / 微信小程序虚拟支付合规指引

异常态 3 · 180秒频控保护 防抖 & HTTP 429
正在生成中,请稍候 (倒计时 142s)

上一套生成后 180s 内点击不向后端发起请求,仅轻提示

保存交互规范:点击「保存到我的穿搭」后弹出轻提示「已保存到我的穿搭」,并平滑跳转至穿搭详情,标签由「待保存」变为「已保存」。