B2C商城的订单退款和售后流程——axure原型图详解
前一段时间接到任务，要做一个B2C的官方商城，自有品牌的，基于前面的电商经验，其他模块很快上手，唯独订单模块困扰了我好久，尤其是订单的退货退款和售后流程，与订单的正向流程密切相关，什么时候该展示什么数据，什么功能，退款单的状态对订单状态的影响等等，接下来我将用axure原型图一一讲解。在做订单流程这一块，参考了很多大神的文章，还有各种开源的商城软件，都过于理论化，实操性不强，对于新手来说没有一个实操的axure原型讲解，都是在用流程图告诉大家退款售后有哪些步骤，但是没有一个具体的案例来分析。相信我，你是不可能一上来就做到像很多文章里写得很完美订单管理系统的，况且文章中连原型图都没有。其实，即使是天猫和京东，在售后方面也是有取舍的，设定好规则才能让系统跑通，而不是说能够应付所有的异常情况。在设计之前，要考虑很多看似基础，却需要重视的规格，比如：
1.是否支持部分退款，部分退货？
2.是否支持换货？
3.是否支持多次申请退款/退货？
4.如果在售中时申请退款被拒绝了，还可不可以申请售后？
5.部分退款时，自动收货时间到了怎么办？如果退款申请拒绝了，订单状态怎么继续走？
我这些只是举例了冰山一角，对于订单管理的确有很多异常分支情况和用户错误操作。那我在这里既然说要用案例具体去讲订单的逆向流程，我就先要规定好我们商城的订单规则：
1.待发货前可以申请一次退款，发货后可以申请一次售后（退货/退款）
2.一笔订单多种商品只能分开申请退款，不支持对订单申请退款，意思是有一种商品时就是全退，有多种商品时就是只能部分申请退款。
3.订单中暂不含优惠券，只包括运费，在待发货时部分退款，最后一笔申请会退运费；在已发货后申请售后就不再退运费，其他原因走人工客服
以上就是我对订单的设置的前提条件，有了前提条件，我再去跟技术评审，就让他们心里也感觉到靠谱一些，毕竟第一次的时候他们提出了很多漫无边际，非常离谱但是也会出现的异常情况，一开始得时候我真的很苦恼，后来才发现是我没有设定规则，没有规则，技术同学当然怕出现出现异常情况程序不知道怎么跑了。
用户端订单页面
关于订单的具体流程我就不多讲了，大家都知道的，待付款，待发货，待收货，交易成功，待评价，那我们先来看看我是如何对订单设置布局的
图片所展示的，一笔订单分为商品操作栏，交易状态栏和操作栏，对于商品操作栏我是分开的，所以一笔订单有多种商品时在申请退款的时候，一定是单个申请的；交易状态栏是合并在一起的，这是对订单整体进度的状态显示，在部分退款时显示的订单状态；最后操作栏在确认收货前都是合并在一起的，对整个订单的签收，当状态为交易成功时，则会显示商品的评价入口。
那么这里就涉及这三块的状态和操作功能的切换，我们先来看一下 退款单过程状态 对商品操作栏的显示影响
我前面有讲，当处于待发货状态时，商品操作入口为“申请退款”；当已发货后，商品操作就为“申请售后”，那退款单的状态先去影响了商品操作栏的显示。具体的细分状态我在图片中已经详细列出来了，包括异常情况该如何处理。
在看完退款单对商品操作的影响后，再来看看退款单对订单状态的影响，注意，退款单与订单是多对一的关系，退款单和商品也是多对一的关系，所以才会有申请一次退款被拒绝了，还可以申请一次售后（退款/退货）。下图是 退款单结果状态 对订单状态的影响
可以看出来每一种订单都有部分和全部两种影响，这里要注意，全部并不是一次对订单提交的退款申请，而是查看到订单中是不是所有商品都有退款单，并且都有结果。通过这样表格的分析整理，会很清晰理解订单状态随退款单的变化。
用户端退款单界面
前面讲了订单页面中订单状态的变化，具体的订单详情我就不做过多说明了，因为大家参考其他网站也可以很直观的看到，接下来看退款管理的界面
根据我之前的设置的退款规则，这里的退款单一定是一种商品一个退款单（可能包含多件，因为规定申请退款是不能选择退款数量，要么全退，要么客服联系，因为后台可以修改退款金额）。退款单分为两种，仅退款和退货退款，在待发货时只能申请仅退款，在发货后可以选择申请退款或者是申请退货，但是只有一次机会！
这里很多人就会说我不考虑用户体验问题，首先我想说京东一上来退款退货规则也不完善，当然发展到今天他仍然还有很多不好的地方，当用户的退货申请被拒绝了你作为用户怎么办？京东的客服什么时候上线过，那个时候你只能网上发发牢骚。商城是从0到1，订单模块第一版的计划就是用户能下单，能退款，能退货。至于为什么用户不能一次申请所有商品的退款，为什么不能设置一种商品的退货数量等，后期会加上批量选择退款商品，设置退货数量等，不断优化退款和退货的流程图。
这篇文章很适合产品新人来了解基础的退款退货的原型图设计，毕竟这里不包含优惠券，没有拆单，也没有调仓等等，所以大家看了文章觉得还可以的点个赞~不喜勿喷
这里就没有展示具体的详情页面，所以可以底下留言找我要原型图~
绛旓細1銆侀鍏堣繘鍏ヤ含涓鍟嗗煄锛岀劧鍚庡湪椤堕儴閫夋嫨鈥滅櫥褰曗濇寜閽繘琛岀櫥褰曪紝涔嬪悗杈撳叆鐢ㄦ埛鍚嶅拰瀵嗙爜鐧诲綍鍗冲彲锛屽涓嬪浘鎵绀猴細2銆佺櫥褰曟垚鍔熶箣鍚庯紝鍦ㄧ綉绔欓《閮ㄦ壘鍒板苟锛岀偣鍑昏繘鍏モ滄垜鐨勮鍗鈥濓紝濡備笅鍥炬墍绀猴細3銆佽繘鍏ユ垜鐨勮鍗曚箣鍚庯紝灏卞彲浠ョ湅鍒板凡缁忚喘涔拌繃鐨勫晢鍝佷簡锛屾壘鍒伴渶瑕侀/鎹㈢殑鍟嗗搧锛岀劧鍚庨夋嫨閫鎹㈡搷浣滃嵆鍙紝濡備笅鍥炬墍绀猴細4銆佹帴涓...
绛旓細娣樺疂瀹閫璐ч娆剧殑娴佺▼鏄粈涔 娣樺疂缃戞槸闃块噷宸村反闆嗗洟鏃椾笅缃戠粶璐墿缃戠珯锛岀敱椹簯鍒涚珛浜2003骞5鏈堬紝鏄潰鍚戜腑鍥藉ぇ闄嗐佹腐婢冲彴銆侀┈鏉ヨタ浜氱瓑鍦版秷璐硅呯殑C2C璐墿缃戠珯锛B2C妯″紡缃戠珯澶╃尗宸叉媶鍑猴級銆傚涓嬩负娣樺疂瀹㈤璐ч娆剧殑娴佺▼锛屼粎渚涘弬鑰冿紒娣樺疂瀹㈤璐ч娆剧殑娴佺▼ 鑻ヤ氦鏄撻渶瑕侀娆撅紝鍒囧嬁鐐瑰嚮鈥滅‘璁ゆ敹璐р濓紝璇风敵璇烽娆撅紙濡傛灉浜ゆ槗宸...
绛旓細鑻ュ崠瀹跺湪涓夊ぉ鍐呮病澶勭悊锛岄挶灏变細鑷姩杩斿洖鍒版敮浠樺疂閲屻傜敵璇閫娆炬祦绋锛氬湪宸蹭拱鍒扮殑瀹濊礉涓紝鐐瑰嚮閫娆/閫璐锛屾帴鐫鐐瑰嚮閫娆撅紝骞惰緭鍏ラ娆鹃噾棰濆嵆鍙傚鍥撅細娣樺疂缃戞槸浜氬お鍦板尯杈冨ぇ鐨勭綉缁滈浂鍞晢鍦堬紝鐢遍樋閲屽反宸撮泦鍥㈠湪2003骞5鏈10鏃ユ姇璧勫垱绔嬨傛窐瀹濈綉鐜板湪涓氬姟璺ㄨ秺C2C锛堜釜浜哄涓汉锛夈B2C锛堝晢瀹跺涓汉锛変袱澶ч儴鍒嗐
绛旓細浜笢涓嬪崟鍚庢病鍙戣揣鍓 鏄彲浠ョ洿鎺ュ彇娑璁㈠崟銆傚厛璺熷晢瀹舵矡閫氫笅锛岀‘瀹氬晢瀹惰揣鐗╄繕鏈彂璐э紝鍦ㄨ鍗曢〉闈緷鎹彁绀烘潵杩涜閫璐銆備箣鍚庯紝鑱旂郴鍗栧纭閫娆锛岀‘璁ゆ椤瑰凡缁忛杩樸
绛旓細鏄寚鐢辨窐瀹鍟嗗煄鐨鍟嗘埛锛堜笅绉"鍟嗗"锛変娇鐢ㄦ窐瀹濇彁渚涚殑鎶鏈敮鎸佸強鏈嶅姟鍚戝叾涔板鎻愪緵鐨勪竴绉鍞悗鏈嶅姟銆傚叿浣撲负鐢ㄦ埛锛堜互涓嬬畝绉"涔板"锛夐氳繃鏀粯瀹濇湇鍔′粯娆捐喘涔板晢鎴风殑鍟嗗搧鍚庯紝浠庣鏀跺晢鍝佺墿娴佷箣鏃惰捣璁7澶╁唴锛堝鏈夊噯纭鏀舵椂闂寸殑锛屼互璇ョ鏀舵椂闂村悗鐨168灏忔椂涓7澶╋紱濡傜鏀舵椂闂翠粎鏈夋棩鏈熺殑锛屼互璇ユ棩鍚庣殑绗簩澶╅浂鏃朵负...
绛旓細杩欎釜缇庡洟澶栧崠鎬庝箞閫鍗曢棶棰樻垜涔嬪墠閬囧埌杩,鎸哄鏄撹В鍐崇殑,鎺ヤ笅鏉ュ氨璺熷ぇ瀹惰璁插簲璇ユ庝箞鎿嶄綔: 宸ュ叿:iPhone13 缇庡洟11.6.8.3, 绗竴姝,鍦ㄦ垜浠殑鎵嬫満涓墦寮缇庡洟,鐐瑰嚮搴曢儴鐨勮鍗,閫夋嫨瑕佺敵璇閫娆鐨勫鍗栬鍗曠偣鍑昏繘鍘汇(濡備笅鍥炬墍绀) 绗簩姝,璁㈠崟鐣岄潰涔嬪悗,鐐瑰嚮鐢宠鍞悗銆(濡備笅鍥炬墍绀) 绗笁姝,寮瑰嚭鐣岄潰涔嬪悗,鐐瑰嚮鐢宠閫娆,鍙互鍏...
绛旓細1銆佷含涓滄嫆鏀朵細鍏ㄩ閫娆剧殑銆備含涓滃晢鍝璁㈠崟鎷掓敹鍚庯紝绛夋嫆鏀剁殑鍟嗗搧閫鍥炲幓涔嬪悗锛屽緟浜笢鍞悗閫娆瀹℃牳鎴愬姛鍚庯紝浜笢鍟嗗煄鍞悗浼氭妸閫娆鹃噾棰濆叏棰濆師璺繑杩樸傚鏋滄槸浜笢鐨勭涓夋柟鍗栧鍙戣揣锛岃鍗曚細鏍规嵁鍗栧鏄惁鍖呴偖杩涜閫娆惧彈鐞嗭紝杩愯垂棰嗗绠楃殑璇濓紝涓嶆槸璐ㄩ噺闂闇涔板鎵挎媴杩愯垂銆2銆佷含涓滐紙JD.com锛夋槸涓浗鐨勪竴瀹惰嚜钀ュ紡缃戠粶闆跺敭...
绛旓細閫娆浜烘寚鑷繁锛堝鏋滀綘鏄晢瀹剁殑璇濓紝閭ｄ箞閫娆句汉灏辨槸瀵规柟銆傦級閫娆剧殑澶ц嚧娴佺▼锛1.A鐢ㄦ埛鍦˙鍟嗘埛骞冲彴閫夎喘鍟嗗搧骞跺彂璧锋敮浠樿姹傦紱2.B鍟嗘埛灏嗘敮浠璁㈠崟閫氳繃B2C缃戝叧鏀舵鎺ュ彛浼犻佽嚦C鏀粯骞冲彴锛3.鐢ㄦ埛閫夋嫨缃戦摱鏀粯鍙婇摱琛岋紝鏀粯骞冲彴灏嗚鍗曡浆閫佽嚦鎸囧畾閾惰缃戝叧鐣岄潰锛4.鐢ㄦ埛鏀粯瀹屾垚锛岄摱琛屽鐞嗙粨鏋滃苟鍚戝钩鍙拌繑鍥炲鐞嗙粨鏋滐紱5....
绛旓細杩涘叆缁撶畻绋嬪簭锛岀涓灏辨槸閫夋嫨浠樻鏂瑰紡锛屼粯娆炬柟寮忔湁澶氱锛氾紙1锛変娇鐢ㄧ涓夋柟鏀粯宸ュ叿銆傚锛氭敮浠樺疂銆佽储浠橀氾紙閮借鍙﹀娉ㄥ唽锛夛紝杩欐槸甯哥敤鐨勪粯娆炬柟寮忋備拱鏂瑰湪浠樻鏃讹紝閽遍鍏堣浆鍒扮涓夋柟鏀粯宸ュ叿锛岀瓑鏀跺埌鍟嗗搧鍚庯紝鍐嶇偣鍑讳粯娆剧‘璁わ紝閽卞啀杞埌鍗栨柟璐︽埛銆傚鏋滃晢鍝佽川閲忔湁闂锛屾垨鑰呭崠鏂规病鏈夊彂璐э紝灏卞彲浠ョ敵璇閫娆銆傦紙2锛夎揣...
绛旓細鐒跺悗鐐瑰嚮鏀惧叆璐墿杞︼紝濡傛灉瑕佺户缁喘鐗╁氨鐐圭户缁紝涓嶉渶瑕佸氨鐐瑰幓璐墿杞︾粨绠椼傚湪璐墿杞﹂噷浣犲彲浠ョ湅鍒拌缁嗙殑鍟嗗搧淇℃伅锛岀‘璁ゆ棤璇偣鍘荤粨绠椼傜偣鍑诲悗浠栦細鎻愮ず濉啓璇︾粏鐨勬敹璐т俊鎭紝濉ソ鍚庢寜淇濆瓨锛岀劧鍚庨夋嫨鏀粯鏂瑰紡锛屼繚瀛樹箣鍚庡啀娆璁㈠崟鏃犺鍚庢寜鎻愪氦璁㈠崟锛屾彁浜よ鍗24灏忔椂涔嬪唴浠樻灏卞彲浠ヤ簡锛屽惁鍒欎細琚彇娑堟帀璁㈠崟銆
