B2C网站购物流程中优惠券的交互设计优化方案

　　我们在互联网上经常买东西，也会经常收到优惠券，最近有空做了一个小调研，在一个网站上，有30%的用户拥有超过10张的生效优惠券，但是，当我们使用优惠券的时候，我们发现一个问题，很多网站在购物结算页面只能显示10张优惠券，那么，如果多于10张优惠券后，我们怎么选择使用呢?

　　我模拟一个用户，当我去一家超市，我购买了很多或者单件商品后，我发现我包包里有N张优惠券，我开始纠结了，我该使用那张呢?于是，我开始翻包里的优惠券，看看哪张快过期了，哪张是我这次想用的，我下次使用的，平时呢，不会理这些优惠券，只有当使用的时候才会看一眼。

　　我看过国内N多B2C站，在优惠券上，都没有做过这样的交互

　　但是我发现这样用户，随着网购的逐渐增多，越来越多有人有更多的优惠券

　　所以，我在来做这个交互

　　到了B2C，我们怎样满足这些用户的需求呢?

　　解决方案有几种:

　　1,为了好看和前端页面加载不是很多，就限制10张，结果就是30%的用户不能使用显示外的优惠券

　　2，为了使用，30%的用户会看到好几页的优惠券，找起来也很麻烦

　　现在我们理一下逻辑关系

　　1，做优惠券的交互设计解决那些问题?

　　答：

　　做优惠券的交互设计是为了满足自己B2C站上30%有多于10张优惠券的用户使用优惠方便，简单

　　2做优惠券的交互设计是为了让70%没有多于10张优惠券的用户使用起来简单，易懂

　　2，做优惠券的交互设计有什么好处?

　　答：

　　做优惠券的交互设计，可以满足网上有拥有多于10张优惠券的用户的复杂选择，同时又不会给拥有少于10张优惠券减少操作复杂，同时增进用户体验，使用户用起来舒服，不会生气

　　首先，我们来解决排序问题，根据大部分网名的数据来看，按照结束时间倒序排列，是我比较倾向的一种排序方式

　　在支付环节中，列出优惠券的时候，可以根据订单金额，商品，首先筛选出符合使用的优惠券，例如你买的东西是100元的那些 200-50的就不用显示出来了。

　　其次，如果有同一种优惠券，则一行显示就好了。有个小+号展开。不然都是 200-100 同一时期领的。全部显示看起来头疼怎么排序都头疼

　　我们先来解决如果优惠券少于10张的用户的优惠券选择需求

　　这些用户很简单，我们设置优惠券默认显示5张，如果有5张以内，那么我们就全部显示出来就可以了，而且页面也很美观

　　当然，也有一些用户是大于5张优惠券却少于10张的，他点击更多后会有下面这样图的显示

　　从上面这张图上可以看出，显示10张优惠券，已经很多了，

　　这时候，我手中有张我想使用的优惠券，怎么办?作为用户，我很自然的想到，添加优惠券呗

　　那么用户点击增加新优惠券，就可以解决添加优惠券的需求了，因为，在支付环节中，真正增加新优惠券的用户，只有35%，所以，我淡化了增加新优惠券按钮，使用户可以更清晰的使用

　　但是添加后再哪里呢?

　　问题就来了

　　优惠券的排列顺序大致有这几种

　　1，按照有效时间的开始时间排序

　　2，按照有效时间的结束时间排序

　　3，最后一张激活的排列的最上面

　　其实，这些都不是主要的，因为根本就没有解决用户的需求

　　用户的需求就是，我想用哪张，就用哪张，我自己来挑

　　所以就有了我这个新的页面，当用户的优惠券多于10张，就会有更复杂的交互

　　当用户点击更多筛选条件后

　　在开始做的时候，我对两个事情很纠结，

　　1，要不要翻页功能，最后被我否定了，因为翻页功能对于一次只使用一张优惠券的支付页面来说，太厚重了，不需要

　　2，要不要增加激活时间呢，也就是有的用户想查看他刚刚激活的优惠券，怎么办呢?最后也被我否定了，我想，如果他刚刚激活，那么，优惠券号他输入后就可以查出来了，如果他想查看，他可以点击您共有X张优惠券，可以新页面打开用户中心优惠券页面，自己慢慢看就好了

　　3，其实，用户用的翻页功能和查看都不是他目前最想做，他目前最想做的就是选定一张优惠券，使用就可以了，所以，查出来用，这样就可以了

补充：web前端 , HTML/CSS  ,