解读跨境电商网站完整的需求制作流程(2)

一般我们竞品分析分为两种，一种是完整的竞品分析，我们需要进入一个新市场，或者开一条新产品线，那么我们要完完整整的从战略，产品架构，产品功能点，产品界面设计等等层面去解构，这也就是我们在各大网站上最常见的竞品分析报告；然而从实际工作中来看，这种分析报告确实不怎么常用（但是这种分析一般用来锻炼一下自己的产品思维是有帮助的）；我们常用的是针对功能点或者模块的针对性竞品分析，而这种分析又分为两种：

而我们这次应当采用第二种方法，对竞品的功能进行总体分析评价，从而新增我们的活动体系。

竞品分析过程中….（此处省略几千字和N张图）

根据我们对京东和1号店的活动体系进行分析，得出以下关键结论：

一般的加购类活动类型包括以下几个：

而这么多活动规则如何有序的在购物车进行聚合展示呢？除了每个网站固有的分级策略外，一般的活动优先级展示是这样的：

至于为什么是这么个顺序，有兴趣可以自行去研究下，笔者在此就暂不阐述啦，除了以上关键路径外，我们还对关键节点页面的活动展示，交互方式，规则说明等做了详细的研究和参考。在分析的过程中我们发现一个很严重的问题，这么复杂的活动，翻译成英语的话，还真没几个人能懂。。。打个比方，”加价购”怎么翻译？我专程问过好几个国外同事，也没人能简洁的描述出来的，没有一个词来形容这个词，他们甚至没有听过这种活动。

所以，如果直接按照国内的加价购，完完整整的展示出来的话，那么我的1版本草稿业务逻辑方案是这样事儿的：

这仅仅只是一个满额减的完整的流程，里面还涉及到阶梯满减的概念，那么除了满额减，还有满额赠，满量增，满量减，满额折，满量折，每一个都这么来一遍？中国人都绕晕了吧，何况还得翻译成英文，还得通俗易懂短小精悍，即使不考虑技术成本，如果这个作为第一个版本就这么个推出，基本就GG了。

所以，在功能框架一定的情况下，如果照搬国内的设计并且直接推出全套版本显然不能满足我们的需求，我们要另辟蹊径，站在国外友人的脑海里去考虑问题，去考虑他们的思考方式和语言特点，虽然我们要重新教育用户，但是要尽可能的将用户理解成本降至最低。

因此最终此功能的第一版大致方案框架是这样事儿的：

暂时舍去阶梯概念，舍去满折方式，以一个Icon为节点，囊括满额，满量两种活动方式，我们需要教育客户一看到这个Icon就知道这是类似于加价购的活动，不再在标识上区分满额，满量概念，在用户的购物动线上，从Icon，文案一步步引导用户，完成对活动的理解和参与，整个过程是个很自然的引导过程，不用再去让用户纠结规则，也不再去设置长篇大论的活动引导页。

到了这里，我们就不再出现加价购这个名词了，我们称之为APA活动体系，去养成用户对于APA活动的认知和使用习惯。

这个需求在原型制作环节整个页面展示虽然简单，但是涉及到多规则，后台设计多流程。前端页面动态数据较多，尤其注意规则说明以及异常说明详细无遗漏，否则到时候做完了测试的时候就不可避免的开怼。并且与用户的交互也比较多，所以我采取了低保真交互原型，并且把交互方式录成GIF放在原型包里面，（必须要特意去提醒开发和设计某些按钮是可以点的！！！）具体的原型这里就不放了（不要打我，我一般做低保真交互模型的原则是做出特定的交互方式，对于界面元素只是标注下信息层级关系，不会去加色彩以及按钮样式诱导设计师，每个人都有每个人的原型写法，如果有感兴趣的同学可以跟笔者交流下），在跟设计和开发反复沟通交流以及后两次评审会之后，我们的第一版前端成品是这样的：

商品列表页Icon展示：

由于以前设计规范的缺失，在商品列表页我们补充并且制定了活动功能的Icon规范，采用红底白字的Icon方式展示活动，这为后续的其他活动功能留下扩展空间，鼠标移入会有简短说明。

商品详情页活动规则以及选购商品展示：

商品详情页首先展示的是一段引导性文案，我们不会上来就告诉用户活动详细规则，因为第一英文解释起来实在太麻烦，二来过于繁琐的文案也会造成页面混乱。我们把既定的规则放入展开模块当中。这个页面涉及到的程序规则就是页面展示的相应文案，根据后台配置的活动类型不同而变化，比如满减活动，这里就会提示 “You have a chance to get this following fashion items in a low price:”

如果后台配置的是满赠活动，这里就会提示”You have a chance to get this items for free”,同时按钮文案也会变成 “See the freeitems”,里面的规则说明也会相应变化。

这个链接会引导客户去一个专门为APA活动定做的专题落地页当中，可供用户选择更多APA商品，当然这个专题落地页模板的制作也又是一个比较好玩的事情了，直接上部分设计稿吧（Low-price items里面的图标文案超出图标范围是因为我在截图的时候只是缩小了页面，但是文案是用html写的，不是图片，所以字体缩小不了）

商品专题页页面截图（部分）

购物车页展示：

示例截图1

示例截图2

购物车里面我们参考了部分竞品的分栏方式，并且转化成我们自己的分栏方式，这里尤其要提的是购物车里面的逻辑较为复杂，除了文案、提示语的变化，以及达到目标值之后的商品状态变化，按钮样式变化以外，比较无语的是在和技术沟通的过程中，发现了很多历史遗留的逻辑问题，以及与其他系统对接留下来的未解决问题。

编辑：未知