第 11 屏 | 额度与会员商城(全状态画板)

微信小程序二级页 · 375 × 812 pt
系统蓝 #007AFF 警示橙 #FF9500 淡蓝卡 #E8F2FF 底色 #F2F2F7
严格负向约束:商品绝不展示图片与标签,只呈现名称、描述、售价与原价 SF Symbols 线性风格图标体系(皇冠/相机/星星/衣柜/衣架) 包含:商城全量服务、2×2额度网格预警、以及「订单确认」收银级二级子页面
状态 1 · 额度与会员商城首页(二级页 · 375×812)
9:41
5G
我的
额度与会员

月度会员

VIP

有效期至 2025-05-15

我的额度 剩余 < 20% 时高亮预警
上传额度
13 / 20
AI 推荐额度
18 / 50
社区分享额度
2 / 20
衣柜分享额度
4 / 10
额度明细
近30天消耗流水
额度与会员充值

月度会员

开通后 30 天内无限使用 AI 推荐

¥19.00 ¥29.00

AI识图上传 20次包

智能精准抠图与属性标签解析

¥6.00 ¥10.00

AI 穿搭推荐 30次包

根据天气与场景一键定制穿搭方案

¥9.90 ¥15.00

衣柜分享额度 5次包

支持生成整橱与精选快照给好友

¥3.00 ¥5.00

社区搭配分享 10次包

将个人穿搭方案公开发布至社区展示

¥4.50 ¥8.00
状态 2 · 二级子页面:订单确认(375×812)
9:41
5G
额度与会员
订单确认
实付金额
¥19.00
微信支付官方安全环境
购买商品明细 单号: ZT202504159821

月度会员服务

服务期限:30天(支付成功后即时生效)

¥19.00
¥29.00
包含尊享会员权益:
无限次使用 AI 智能穿搭推荐
每月额外赠送 50 次高清抠图上传额度
专属会员身份标识与好友衣橱全量快照权限
商品总价 ¥29.00
限时立减优惠 -¥10.00
支付方式
微信支付

点击「微信支付」即代表你同意《会员增值服务协议》。充值额度与会员服务为虚拟数字化商品,开通后不支持退款。

实付应结:
实付 ¥19.00
状态 3 · 状态对比:非会员用户视角的顶部会员卡
若当前用户为普通未付费用户,顶部展示状态如下:

开通会员

解锁更多 AI 与上传权益

业务映射机制:
• 点击「立即开通」后将平滑呼起右侧「订单确认」页面完成支付。
• 支付完成后,卡片切换为淡蓝 #E8F2FF 底,并展示有效期至 30 天后。
第 11 屏 额度与会员商城设计核查表与规则映射 (严格遵守产品约束与微信小程序 HIG)
1. 明确负向约束恪守
商品卡彻底移除任何形式的商品展示图片与标签,仅展示名称、精简描述、加粗系统蓝售价「¥ + 两位小数」与灰色删除线原价。
2. 2×2 额度网格与预警
上传、AI推荐、社区分享、衣柜分享 4 卡。展示「剩余/总量」等宽大字;进度条默认系统蓝,剩余低于 20% 时自动转为警示橙 #FF9500。
3. SF Symbols 线性映射
严格对齐:会员=皇冠(crown)、上传=相机(camera)、AI=星星(sparkles)、衣柜分享=衣柜(closet)、搭配分享=衣架(hanger)。
4. 订单确认二级链路
包含单号、商品摘要卡、权益清单、优惠核销、实付金额与固定底部「微信支付」主操作,形成真实完整的变现转化漏斗。