卡包流程设计:切合实际场景做产品

今天小编给大家带来的文章是卡包流程设计--切合实际场景做产品,本篇文章是作者针对自己在工作中的一个实际落地项目,卡包流程设计过程中的思考与方法总结,一起来看看吧!

卡包流程设计:切合实际场景做产品

01、概述/使用场景

之前做的一个游乐园项目:

在现有小程序的基础上,针对单个会员线下拥有多张会员卡的场景,在产品中加入了“卡包”功能。

卡包中可以绑定多张不同门店的会员卡,用户可以使用不同储值的会员卡进行线下游玩。

02、整理需求

经过与客户沟通核查,整理得出以下需求:

1、因为会员卡属于个性化产品,支持商家在后台更换“卡面”图片;

2、卡面信息包含:会员注册名称、卡号、会员级别;

3、会员卡包括:金币、代币、积分、彩票四种储值。用户通过扣除会员卡对应的储值(其中一种)进行线下游玩。

4、需要把各项储值列出来,方便用户筛选。

03、执行

不同平台的各种“卡包”:

卡包流程设计:切合实际场景做产品

在最初,我们定了几个方案:

Plan A

卡包流程设计:切合实际场景做产品

该方案中把卡面露出上半截,附上会员昵称和卡号,下半截把各个储值列出来。但缺点是页面信息过载,没有重点。

基于这个方案,顺带提一下文字信息在复杂图案上的识别性问题:

因为会员信息写在卡面上,为保证文字层的识别性,需要在卡面和文字层之间增加一层遮罩,增加对比度。

卡包流程设计:切合实际场景做产品

另外,在此方法下,我们要对卡面背景有所要求:针对显示文字的区域,背景不能太过花俏,适宜用简单的纹理/单色。

卡包流程设计:切合实际场景做产品

但是,根据一段时间的使用反馈,我们发现,虽然我们在后台把“图片上传要求”写出来了,但严格执行的用户并不多,对于他们来说,“上传一张背景,这个区域不能有文字,不能用复杂图案…”这样的操作成本太高,不好用(跟我们产品用户的使用习惯有关系)。

他们更多的是用手机把实体会员卡拍下来,上传作为线上会员卡背景,简单直接,没有多余的操作。

这样一来,会员卡的样式就不可控了,文字层的识别性也会受到影响。

Plan B

基于以上反馈,我们更新了方案,把会员卡缩小单独放置,文字层(用户名称/卡号)提出来:

卡包流程设计:切合实际场景做产品

根据这一反馈,我们更新了方案,把会员卡缩小单独放置,文字层(用户名称/卡号)提出来:

那么,这个页面就结束了吗?

还能继续优化

(有时候多走两步,或许就能想到一个更好的方案╮( ̄▽ ̄””)╭)

分析一下这个页面:

  1. 视觉重点:卡面 > 绑定按钮 > 会员名称/卡号 > 储值数据;
  2. 哪张卡储值有多少,全列出来,一目了然,但有种信息过载的感觉;

但有更好的方案吗?

当思路打不开的时候,不妨退出来看看整体,回归使用场景:什么情况下会“更换会员卡”?我们通过收集了五百多名用户数据,发现将近3/4的人在“储值不够”的场景下去“更换会员卡”。

卡包流程设计:切合实际场景做产品

基于这一数据,我们梳理了优化的方向:

  • 功能上方便用户筛选储值数据,可以由多到少进行排序;
  • 视觉重点:储值数据 > 卡面 > 绑定按钮 > 会员名称/卡号;
  • 仅显示当前用户需要的储值数据,减少其他不必要的信息(必要时可以收进下级页面)。

卡包流程设计:切合实际场景做产品

在页面当中,我们把四种储值类型拆分开来,增加筛选栏进行筛选排序。

把当前储值数据提取出来加重,弱化会员名/卡号。

把该会员卡的其他信息归到下级页面。

从而节省了操作流程:第一步储值类型进行排序,第二步筛选会员卡完成绑定。

卡包流程设计:切合实际场景做产品

至此,这个小需求的交互流程就基本确定了。整个项目流程就是针对需求不停的进行验证,发现问题,剖析问题,最后解决问题,循环往复。

这篇文字纯碎记录提炼需求后我的思考过程,思路/方法还有很多,在这里抛砖引玉。

本文由 新媒体之家 作者:应谋鬼计 发表,其版权均为原作者所有,文章内容系作者个人观点,不代表 新媒体之家 对观点赞同或支持,未经许可,请勿转载,题图来自Unsplash,基于CC0协议。
0

发表评论