HH SaaS电商系统移动端商城，买家选择商品规格的交互设计

未完整选择商品规格时 商品图如何显示

显示SPU的主图，HH SaaS商城系统1应该显示SPU的营销主图，此图来自于“使用中”的素材模板

库存如何显示

显示SPU的总库存，即隶属的全部SKU的销售库存总和

价格如何显示

显示SKU的最小价格和最大价格，如果全部SKU的价格一样，就显示一个价格

选择规格提示文案如何显示

未完整选择规格，就是提示：请选择规格，如果已完整选择规格，则将已选的规格显示出来

原型图

已选完整选择商品规格时 商品图如何显示

显示已选规格的商品图，此图来自于SKU的营销图

库存如何显示

显示已选规格（SKU）的销售库存

价格如何显示

显示已选规格的售价，这里是指商品的 现售价

原型图

SKU下架后如何显示

举例说明： 如果规格为红色/XXL的商品已下架，那么根据买家选择规格的顺序，前端要禁用相关的规格值，也就是说买家先选择“红色”，那么规格值“XXL”就不可选，界面通常呈现灰色的禁用视觉效果

原型图

购买数量如何交互

• 默认显示数量1，不论规格是否完整选择可以任意添加数量
• 购买数量为1时，“-”号被禁用
• 加入购物车，立即购买，发起拼团时需要判断购买数量是否超过“限购数”，若超过提示：非常抱歉，每人限购5件哦~

1. 好获严选专属的SaaS电商系统 ↩︎