适合阅读对象：交互设计师，UX设计师
知识点：1）如何逆向一款产品用户体验设计 2）高雅类电商APP的设计思路和手段
前言
体验设计逆向的意思是从已发布的产品中反推出它的用户体验设计思路以及手段，从而提升自己的设计能力。
有一天你发现一款体验上让你怦然心动的产品，你想研究它是怎么设计的，你该怎么做？
这阵子我一直在琢磨这个问题。因为前短时间下载了网易严选，打开后就被它深深地吸引，把玩了一阵子（当然也购买了东西），体验上确实经得起考验，遂萌生了想深入学习它的想法。一开始我是从各种细节入手，但感觉自己的视野越来越窄，找出来的东西也是乱乱的。心情也是越来越郁闷。
纠结了好长时间，觉得再这么下去不行。于是停下来，好好思考了“学习一款产品的体验设计究竟要学习什么”这个充满人生哲学意义的问题。后茅塞顿开，发现了一个种方法可以不那么纠结的分析体验，这个方法的思路的核心是先找到产品体验设计中轴线，然后围绕关键任务取证分析，再根据取证结果确认（或修正）中轴线，最终根据中轴线提取产品的设计思路以及设计手段。
这里面起到关键作用的是体验设计中轴线，所谓中轴线，就是指的这款产品的体验调性，它是设计师根据产品定位（80%）以及品牌规范（10%），并结合自身思考（10%）之后确定的。
因为产品定位占据的比例要大得多，所以我们逆向的话，只要搞清楚产品定位，体验调性也就能知道个八九不离十了。
下面我就拿我自己分析网易严选为例来看看吧。
网易严选IOS版：2.5.0
Part1 寻找中轴线
这里有个小窍门，可以尝试2个捷径来寻找中轴线：1看产品说明书；2看产品slogan。
先来看看说明书，下面是截图（严选把定义放在了个人>帮助中心>服务协议里，好难找）：
服务协议
“原创生活类电商平台”这个说法成功的引起了我的注意，因为我没看懂......后来查阅万能的知乎才明白。意思是“我是个与众不同的地摊，摆的都是自产自销的生活用品”，范围有了，但是特色还不清晰，继续看slogan。
slogan
“好的生活，没那么贵”，意思是说“在我这儿可以用不贵的价格买到好货”，强调的是不贵和货好。那么最终结合之后，严选的描述应该是这样：“我是个与众不同的地摊，我摆的货都是自产自销，好而不贵的生活用品”。
“好而不贵”引起了我的思考。什么人会追求好而不贵的商品呢？如果粗犷的把消费人群分为3类：A收入不高，满足于能用就行，B收入适中，会在意品质，C收入很高，买东西不看价格只看逼格，那么很显然B类正好符合严选的目标用户。
所以一个初步推断是网易严选看到了消费升级时代的机会，为“财务不紧张，想提高生活品质的消费者”提供一个“可以买到有品质，且价格适中的生活用品”的地方。用户画像再进一步明晰的话应该是“30-40岁之间，女性，白领”。
所以推断网易严选的体验调性应该是“高雅的，品质的”，因为这样比较符合它的产品定位。
好，一个初步的中轴线就有了，接下来应该到产品里去验证一下想法对不对了。
Part2 取证、验证
取证的时候，不能乱点鸳鸯谱，也没必要一应俱全。
推荐一个方法，先确定关键任务（关键任务一定是设计师发力设计的地方），然后把所有关键任务涉及界面截图，最后再把重复的图剔除，然后摆在一起观察就可以了。
那么怎么确定关键任务呢？这又要回到产品定位上来思考了，网易严选本质上是一个电商产品，电商产品的本质就是交易，那么与交易行为有关的就都是它的关键任务。
所以我选取了：1）发现感兴趣的商品，2）浏览商品详情，3）删除购物车内商品（*），这几个点作为关键任务来取证。当然，删除购物车内商品这个点不是严格意义上的关键任务，但从这次分析目的来看的话，它绝对是个重要的点，至于为啥，卖个关子先，后面再说~
Mission1 发现感兴趣的商品
这里严选的做法比较传统，使用了常见的手段来帮助用户完成此任务，包括首页的首焦推荐，直供商推荐，新品推荐，人气推荐，二级品类导航浏览，专题推荐，品类检索，直接搜索。
Mission2 浏览商品详情
严选的做法也是采用比较传统的逐级深入法，先进入一个放大图界面，用户可以看看截图、评论，或者直接购买，然后继续上拉则进入产品的图文详情介绍。
Mission3 删除购物车内商品
解释一下为什么选这个任务，在某龙头购物APP上，删除购物车商品时，总会弹窗再确认一遍，在购物车已然是收藏夹的时代，删删减减是再正常不过的事，所以某宝的这种行为方式是很粗鲁的，我想看看严选是如何处理这种行为的。
购物车里删除就直接删了，没有二次确认或其它什么多余的步骤。
这3个任务所涉及到的界面是这些（图大慎点）：
mission1
mission2
mission3
接下来就是观察这些界面了，从3个要点观察：视觉感受，文案风格，做事方法。其中做事方法指的是设计师在设计用户任务时所采用的策略，例如担心用户不会操作而采取的遮罩箭头指引，例如担心降低转化率而设置的多余弹窗（碎碎念...）等等。
分析过程不说了，直接上结论：
视觉感受：布局简洁，留白大胆，配色干净，主体凸显（商品图片，专题图片等）。商品（或专题）的相关图片构图讲究，设计精巧，使人信任。整体感受非常优雅。
文案风格：详情和专题的文风趋于文艺范，在用力打造bigger。界面对话上的词汇基本都是平淡直白的诉说，没有造作（例如亲，主人等）。把那些有印象的话语串在脑海里，闭上眼睛感受，眼前浮现人物的居然是杨澜...
做事方法：最大的感受是沉稳。感受不到很热情的气氛，但也不会太过冷漠你，没有见到扑面而来的弹屏广告，没有见到强烈要求你替他分享的举动，删除购物车也毫不纠结，尤其是它对商品的呈现方式，就是大胆的凸显商品本身，这透露出来的讯息就是对商品的自信。
这样看来，跟前面推断的“高雅，品质”差别并不太大~
接下来就是要看看它究竟采用了那些具体手段来制造这些调性了。
Part3 罗列设计手段
布局突显内容图片
布局上最大的亮点就是中部那些超大的商品图空间了（图大出奇迹），另外顶部和尾部两个公共区域都是从面积和颜色两个方面尽可能的弱化，背景色采用白色，区块采用浅灰衬线（或无衬线）并且自己身面积很大留白也很大，结果就是整个界面第一眼看到的是图，第二眼看到的还是图，满眼都是图，这么做还是蛮符合网易“有态度”的风范。
布局特色
信息渐进呈现
对于主体对象-“商品”，信息呈现思路是按场景渐进，这样做的好处不用多说，因为凡是信息与场景不匹配，就会给用户制造“粗鲁”的感受。
按场景渐进呈现信息
基本上就是APP端电商传统套路，但是在每个环节似乎严选都在做一些减法，比如批量浏览环节，严选没有xxx人付款，xxx人评论这样的信息，没有给用户制造思考的杂音，感觉就是在自信而优雅的展示商品。比如在引起关注环节，没有放置相关推荐商品，说真的，对提升潜在购买行为没有帮助，但是对提升高雅的体验还真起了大作用，你去宝马5S店见过销售不要脸的给你推销这个推销那个吗？没有对比就没伤害啊。
文艺范的文风
很难说这算不算设计师眼里的“设计”，但至少跟设计师有关，因为设计师规定了体验风格，文案风格也要向体验风格靠拢吧。纵观整个严选，除了图，就是它的文了，按照网友的评价来说就是“要了命的文案”，情怀什么的都靠它的文案给拉起来的。
文艺范
有“心情”的字体
严选整个产品里出现的字体目测5种以上，主界面采用统一字体（默认），其余分布在不同商品的详情介绍里。乍一看不合理，但实际浏览后并没有不自然的感觉，我想这里是因为字体的选用跟用户当时浏览品类的预期有关吧。不过这种不统一是否利于塑造统一的体验呢？不得而知。
有心情的字体
有导购
几乎在所有的单品，ODM商的页面上都能找到一段灰色文字，在诉说着与众不同的东西。给人感觉就像是有位导购，时而幽默，时而正式的向你介绍厂商的优势，商品的优势。
导购化设计
这是严选极具特色的一点，也是它相较于其他友商创新的地方。估计它的背景也是因为设计师对“传统的做法无法第一时间传达商品的优势啊”的思考吧。其实人性就是这样，有时候一些东西经过人介绍和没经人介绍，对它的认知截然不同。比如，在没经历过最近的锤子发布会之前，谁知道讯飞输入法？就算看到了，谁觉得它比其它输入法好？so，关键在于吹。当然，如果网易严选也换成大咖吹，效果还能再拔一个层次...
把商品带入高雅场景
这里再一次印证了商品价传才是严选设计上的发力点，仔细观察会发现,每一个商品的5张放大图都会有它代入到生活场景里的画面，并且场景干净、布景讲究，拔高了商品段位，使人不得不对它产生遐想...
一把剪刀的bigger
行为上保持优雅
这一部分是看不到的设计，怎么说呢，就是把一些不礼貌，粗鲁的行为都放弃了。举例来说，严选没搞什么天降红包砸中你一类的东西，有促销也从来没搞个弹屏或牛掰动效来忽悠你，删除购物车商品等无害操作也没有做多余阻拦，而且它的加购物车动效的速度控制适中，没有太快，毕竟优雅的动作速度要的是稳重。
Part4 总结设计思路
1.轻形式重内容。以商品价传为设计核心，通过对商品列表，商品图片，和商品详情发力设计，来打造品质感。
2.保持克制，少即是多。表现层面的克制包括：比如商品列表界面同屏最大4个商品，比如整体界面用色就3个左右。行为方式上的克制：比如不强迫给用户做价传，不强烈引导用户分享，不强烈“要求”用户看系统推送消息等等。
3.文案上保持高bigger。毕竟产品80%的情感传递都是来自于文案。
最后一些感想
分析人家的设计，关键在于拆解的合理，而拆解又不能乱来，因此在Part3的时候反反复复的尝试了好多路子，搞的很苦闷。最终拆解的点也是较为松散。下一步就是在拆解方法上改良了，如果您有好的建议，也请不吝赐教，感激不尽。
(文章上线2天阅读量低的我都尿裤子了，听说标题很重要，换个新标题看看是否会有不同，原标题叫网易严选体验设计逆向)
网友评论