模块:小程序 → 产品详情页 →「出行备品」组件 类型:体验优化(UI / 交互) 优先级:低 - 中
一、现象描述 「出行备品」模块当前一屏仅展示 3 个 SKU(如截图:晕车贴 / 创口贴 / 一次性牙线),实际数据可能多于 3 个,需要横向滑动才能查看后续内容。但当前 UI 无任何可滑动提示(无渐隐遮罩、无指示器、无引导文案),用户无法感知右侧还有更多内容,存在严重的信息隐藏问题。
二、期望行为 当「出行备品」列表项数量 > 一屏可展示数量(>3 个)时,需提供明确的横滑可视化提示,引导用户左滑查看全部。
三、建议方案(任选其一或组合) 右侧渐隐遮罩(推荐):列表右侧叠加一层从透明到白色的渐变蒙层,露出第 4 个 SKU 的"半张卡片",视觉上自然暗示"右侧还有内容"。 底部滑动指示器:列表下方增加滚动条 / 分页圆点 / 进度条,实时反映滑动位置。 文案 + 图标提示:模块右上角或底部增加「左滑查看更多 →」的文案与箭头图标,首次进入可加轻量动效引导。 首次进入轻微抖动:页面首次曝光该模块时,自动做一次小幅度的位移动画(右移再回弹),提示"此处可滑动"。 优先级排序:1 > 2 > 4 > 3
四、影响范围 仅前端(小程序)改动,无需后端接口调整。 排查:其他存在横向滚动的模块(如温馨提示横滑标签、推荐产品横滑卡片等)建议一并核查,统一交互规范。
五、验收标准 「出行备品」数量 ≤ 3 个时:不展示任何滑动提示 「出行备品」数量 > 3 个时:出现渐隐遮罩 / 指示器,用户可清晰感知存在更多内容 滑动到最右侧时:提示自动消失(代表已查看完毕)
没有设置依赖项。
该备注对被屏蔽的用户不可见。
删除分支是永久的。虽然已删除的分支在实际被删除前有可能会短时间存在,但这在大多数情况下无法撤销。是否继续?
模块:小程序 → 产品详情页 →「出行备品」组件
类型:体验优化(UI / 交互)
优先级:低 - 中
一、现象描述
「出行备品」模块当前一屏仅展示 3 个 SKU(如截图:晕车贴 / 创口贴 / 一次性牙线),实际数据可能多于 3 个,需要横向滑动才能查看后续内容。但当前 UI 无任何可滑动提示(无渐隐遮罩、无指示器、无引导文案),用户无法感知右侧还有更多内容,存在严重的信息隐藏问题。
二、期望行为
当「出行备品」列表项数量 > 一屏可展示数量(>3 个)时,需提供明确的横滑可视化提示,引导用户左滑查看全部。
三、建议方案(任选其一或组合)
右侧渐隐遮罩(推荐):列表右侧叠加一层从透明到白色的渐变蒙层,露出第 4 个 SKU 的"半张卡片",视觉上自然暗示"右侧还有内容"。
底部滑动指示器:列表下方增加滚动条 / 分页圆点 / 进度条,实时反映滑动位置。
文案 + 图标提示:模块右上角或底部增加「左滑查看更多 →」的文案与箭头图标,首次进入可加轻量动效引导。
首次进入轻微抖动:页面首次曝光该模块时,自动做一次小幅度的位移动画(右移再回弹),提示"此处可滑动"。
优先级排序:1 > 2 > 4 > 3
四、影响范围
仅前端(小程序)改动,无需后端接口调整。
排查:其他存在横向滚动的模块(如温馨提示横滑标签、推荐产品横滑卡片等)建议一并核查,统一交互规范。
五、验收标准
「出行备品」数量 ≤ 3 个时:不展示任何滑动提示
「出行备品」数量 > 3 个时:出现渐隐遮罩 / 指示器,用户可清晰感知存在更多内容
滑动到最右侧时:提示自动消失(代表已查看完毕)