適合閱讀對象：交互設計師熬的，UX設計師
知識點：1）如何逆向一款產(chǎn)品用戶體驗設計 ?2）高雅類電商APP的設計思路和手段
前言
體驗設計逆向的意思是從已發(fā)布的產(chǎn)品中反推出它的用戶體驗設計思路以及手段押框，從而提升自己的設計能力。
有一天你發(fā)現(xiàn)一款體驗上讓你怦然心動的產(chǎn)品盒揉，你想研究它是怎么設計的刚盈，你該怎么做挂脑？
這陣子我一直在琢磨這個問題。因為前短時間下載了網(wǎng)易嚴選谴分，打開后就被它深深地吸引牺蹄，把玩了一陣子（當然也購買了東西）薄翅，體驗上確實經(jīng)得起考驗，遂萌生了想深入學習它的想法鼎天。一開始我是從各種細節(jié)入手斋射，但感覺自己的視野越來越窄，找出來的東西也是亂亂的涧至。心情也是越來越郁悶桑包。
糾結了好長時間哑了，覺得再這么下去不行。于是停下來窄陡，好好思考了“學習一款產(chǎn)品的體驗設計究竟要學習什么”這個充滿人生哲學意義的問題泳梆。后茅塞頓開榜掌，發(fā)現(xiàn)了一個種方法可以不那么糾結的分析體驗乘综，這個方法的思路的核心是先找到產(chǎn)品體驗設計中軸線，然后圍繞關鍵任務取證分析胞皱，再根據(jù)取證結果確認（或修正）中軸線九妈，最終根據(jù)中軸線提取產(chǎn)品的設計思路以及設計手段萌朱。
這里面起到關鍵作用的是體驗設計中軸線，所謂中軸線酒贬，就是指的這款產(chǎn)品的體驗調性，它是設計師根據(jù)產(chǎn)品定位（80%）以及品牌規(guī)范（10%）蠢莺，并結合自身思考（10%）之后確定的躏将。
因為產(chǎn)品定位占據(jù)的比例要大得多考蕾，所以我們逆向的話辕翰，只要搞清楚產(chǎn)品定位，體驗調性也就能知道個八九不離十了沟沙。
下面我就拿我自己分析網(wǎng)易嚴選為例來看看吧矛紫。
網(wǎng)易嚴選IOS版：2.5.0 ?
Part1 尋找中軸線
這里有個小竅門牌里，可以嘗試2個捷徑來尋找中軸線：1看產(chǎn)品說明書牡辽；2看產(chǎn)品slogan。
先來看看說明書麸澜，下面是截圖（嚴選把定義放在了個人>幫助中心>服務協(xié)議里炊邦，好難找）：
“原創(chuàng)生活類電商平臺”這個說法成功的引起了我的注意馁害，因為我沒看懂......后來查閱萬能的知乎才明白蹂匹。意思是“我是個與眾不同的地攤，擺的都是自產(chǎn)自銷的生活用品”炉媒，范圍有了吊骤，但是特色還不清晰白粉，繼續(xù)看slogan。
“好的生活眷细，沒那么貴”溪椎，意思是說“在我這兒可以用不貴的價格買到好貨”恬口，強調的是不貴和貨好祖能。那么最終結合之后，嚴選的描述應該是這樣：“我是個與眾不同的地攤雁芙，我擺的貨都是自產(chǎn)自銷兔甘，好而不貴的生活用品”筛圆。
“好而不貴”引起了我的思考太援。什么人會追求好而不貴的商品呢扳碍？如果粗獷的把消費人群分為3類：A收入不高笋敞，滿足于能用就行，B收入適中赛惩，會在意品質喷兼，C收入很高，買東西不看價格只看逼格吠各，那么很顯然B類正好符合嚴選的目標用戶贾漏。
所以一個初步推斷是網(wǎng)易嚴選看到了消費升級時代的機會纵散，為“財務不緊張隐圾，想提高生活品質的消費者”提供一個“可以買到有品質教届，且價格適中的生活用品”的地方因惭。用戶畫像再進一步明晰的話應該是“30-40歲之間俘闯，女性垛贤，白領”趣倾。
所以推斷網(wǎng)易嚴選的體驗調性應該是“高雅的儒恋，品質的”，因為這樣比較符合它的產(chǎn)品定位禀酱。
好剂跟，一個初步的中軸線就有了，接下來應該到產(chǎn)品里去驗證一下想法對不對了鳍置。
Part2 取證墓捻、驗證
取證的時候坊夫，不能亂點鴛鴦譜环凿，也沒必要一應俱全智听。
推薦一個方法，先確定關鍵任務（關鍵任務一定是設計師發(fā)力設計的地方）考赛，然后把所有關鍵任務涉及界面截圖颜骤，最后再把重復的圖剔除捣卤，然后擺在一起觀察就可以了董朝。
那么怎么確定關鍵任務呢子姜？這又要回到產(chǎn)品定位上來思考了，網(wǎng)易嚴選本質上是一個電商產(chǎn)品牧抽，電商產(chǎn)品的本質就是交易阎姥，那么與交易行為有關的就都是它的關鍵任務。
所以我選取了：1）發(fā)現(xiàn)感興趣的商品，2）瀏覽商品詳情衣赶，3）刪除購物車內商品（*）府瞄，這幾個點作為關鍵任務來取證遵馆。當然丰榴，刪除購物車內商品這個點不是嚴格意義上的關鍵任務四濒，但從這次分析目的來看的話盗蟆，它絕對是個重要的點，至于為啥觉吭，賣個關子先亏栈，后面再說~
Mission1 發(fā)現(xiàn)感興趣的商品
這里嚴選的做法比較傳統(tǒng)绒北，使用了常見的手段來幫助用戶完成此任務察署，包括首頁的首焦推薦贴汪，直供商推薦扳埂，新品推薦，人氣推薦梅尤，二級品類導航瀏覽巷燥，專題推薦缰揪，品類檢索，直接搜索抛姑。
Mission2 ?瀏覽商品詳情
嚴選的做法也是采用比較傳統(tǒng)的逐級深入法定硝，先進入一個放大圖界面喷斋，用戶可以看看截圖星爪、評論粉私，或者直接購買诺核，然后繼續(xù)上拉則進入產(chǎn)品的圖文詳情介紹窖杀。
Mission3 刪除購物車內商品
解釋一下為什么選這個任務入客，在某龍頭購物APP上桌硫，刪除購物車商品時，總會彈窗再確認一遍卓舵，在購物車已然是收藏夾的時代掏湾，刪刪減減是再正常不過的事忘巧，所以某寶的這種行為方式是很粗魯?shù)模?/i>我想看看嚴選是如何處理這種行為的砚嘴。
購物車里刪除就直接刪了涩拙，沒有二次確認或其它什么多余的步驟兴泥。
這3個任務所涉及到的界面是這些（圖大慎點）：
接下來就是觀察這些界面了如绸，從3個要點觀察：視覺感受怔接，文案風格扼脐，做事方法奋刽。其中做事方法指的是設計師在設計用戶任務時所采用的策略，例如擔心用戶不會操作而采取的遮罩箭頭指引佣谐，例如擔心降低轉化率而設置的多余彈窗（碎碎念...）等等狭魂。
分析過程不說了趁蕊，直接上結論：
視覺感受：布局簡潔掷伙，留白大膽，配色干凈任柜，主體凸顯（商品圖片卒废，專題圖片等）沛厨。商品（或專題）的相關圖片構圖講究，設計精巧摔认，使人信任逆皮。整體感受非常優(yōu)雅。
文案風格：詳情和專題的文風趨于文藝范参袱，在用力打造bigger电谣。界面對話上的詞匯基本都是平淡直白的訴說，沒有造作（例如親剿牺，主人等）。把那些有印象的話語串在腦海里环壤，閉上眼睛感受晒来，眼前浮現(xiàn)人物的居然是楊瀾...
做事方法：最大的感受是沉穩(wěn)。感受不到很熱情的氣氛郑现，但也不會太過冷漠你湃崩，沒有見到撲面而來的彈屏廣告，沒有見到強烈要求你替他分享的舉動接箫，刪除購物車也毫不糾結攒读，尤其是它對商品的呈現(xiàn)方式，就是大膽的凸顯商品本身列牺，這透露出來的訊息就是對商品的自信整陌。
這樣看來，跟前面推斷的“高雅瞎领，品質”差別并不太大~
接下來就是要看看它究竟采用了那些具體手段來制造這些調性了泌辫。
Part3 羅列設計手段
布局突顯內容圖片
布局上最大的亮點就是中部那些超大的商品圖空間了（圖大出奇跡），另外頂部和尾部兩個公共區(qū)域都是從面積和顏色兩個方面盡可能的弱化九默，背景色采用白色震放，區(qū)塊采用淺灰襯線（或無襯線）并且自己身面積很大留白也很大，結果就是整個界面第一眼看到的是圖驼修，第二眼看到的還是圖殿遂，滿眼都是圖，這么做還是蠻符合網(wǎng)易“有態(tài)度”的風范乙各。
信息漸進呈現(xiàn)
對于主體對象-“商品”墨礁，信息呈現(xiàn)思路是按場景漸進，這樣做的好處不用多說耳峦，因為凡是信息與場景不匹配恩静，就會給用戶制造“粗魯”的感受。
基本上就是APP端電商傳統(tǒng)套路，但是在每個環(huán)節(jié)似乎嚴選都在做一些減法驶乾，比如批量瀏覽環(huán)節(jié)邑飒，嚴選沒有xxx人付款，xxx人評論這樣的信息级乐，沒有給用戶制造思考的雜音疙咸，感覺就是在自信而優(yōu)雅的展示商品。比如在引起關注環(huán)節(jié)风科，沒有放置相關推薦商品撒轮，說真的，對提升潛在購買行為沒有幫助丐重，但是對提升高雅的體驗還真起了大作用腔召，你去寶馬5S店見過銷售不要臉的給你推銷這個推銷那個嗎杆查？沒有對比就沒傷害啊扮惦。
文藝范的文風
很難說這算不算設計師眼里的“設計”，但至少跟設計師有關亲桦，因為設計師規(guī)定了體驗風格崖蜜，文案風格也要向體驗風格靠攏吧】颓停縱觀整個嚴選豫领，除了圖，就是它的文了舔琅，按照網(wǎng)友的評價來說就是“要了命的文案”等恐，情懷什么的都靠它的文案給拉起來的。
有“心情”的字體
嚴選整個產(chǎn)品里出現(xiàn)的字體目測5種以上备蚓，主界面采用統(tǒng)一字體（默認）课蔬，其余分布在不同商品的詳情介紹里。乍一看不合理郊尝，但實際瀏覽后并沒有不自然的感覺二跋，我想這里是因為字體的選用跟用戶當時瀏覽品類的預期有關吧。不過這種不統(tǒng)一是否利于塑造統(tǒng)一的體驗呢流昏？不得而知扎即。
有導購
幾乎在所有的單品，ODM商的頁面上都能找到一段灰色文字况凉，在訴說著與眾不同的東西谚鄙。給人感覺就像是有位導購，時而幽默刁绒，時而正式的向你介紹廠商的優(yōu)勢闷营，商品的優(yōu)勢。
這是嚴選極具特色的一點膛锭，也是它相較于其他友商創(chuàng)新的地方粮坞。估計它的背景也是因為設計師對“傳統(tǒng)的做法無法第一時間傳達商品的優(yōu)勢啊”的思考吧蚊荣。其實人性就是這樣，有時候一些東西經(jīng)過人介紹和沒經(jīng)人介紹莫杈，對它的認知截然不同互例。比如，在沒經(jīng)歷過最近的錘子發(fā)布會之前筝闹，誰知道訊飛輸入法媳叨？就算看到了，誰覺得它比其它輸入法好关顷？so糊秆，關鍵在于吹。當然议双，如果網(wǎng)易嚴選也換成大咖吹痘番，效果還能再拔一個層次...
把商品帶入高雅場景
這里再一次印證了商品價傳才是嚴選設計上的發(fā)力點，仔細觀察會發(fā)現(xiàn),每一個商品的5張放大圖都會有它代入到生活場景里的畫面平痰，并且場景干凈汞舱、布景講究，拔高了商品段位宗雇，使人不得不對它產(chǎn)生遐想...
行為上保持優(yōu)雅
這一部分是看不到的設計昂芜，怎么說呢，就是把一些不禮貌赔蒲，粗魯?shù)男袨槎挤艞壛嗣谏瘛Ｅe例來說，嚴選沒搞什么天降紅包砸中你一類的東西舞虱，有促銷也從來沒搞個彈屏或牛掰動效來忽悠你欢际，刪除購物車商品等無害操作也沒有做多余阻攔，而且它的加購物車動效的速度控制適中砾嫉，沒有太快幼苛，畢竟優(yōu)雅的動作速度要的是穩(wěn)重。
Part4 總結設計思路
1.輕形式重內容焕刮。以商品價傳為設計核心舶沿，通過對商品列表，商品圖片配并，和商品詳情發(fā)力設計括荡，來打造品質感。
2.保持克制溉旋，少即是多畸冲。表現(xiàn)層面的克制包括：比如商品列表界面同屏最大4個商品，比如整體界面用色就3個左右。行為方式上的克制：比如不強迫給用戶做價傳邑闲，不強烈引導用戶分享算行，不強烈“要求”用戶看系統(tǒng)推送消息等等。
3.文案上保持高bigger苫耸。畢竟產(chǎn)品80%的情感傳遞都是來自于文案州邢。
最后一些感想
分析人家的設計，關鍵在于拆解的合理褪子，而拆解又不能亂來量淌，因此在Part3的時候反反復復的嘗試了好多路子，搞的很苦悶嫌褪。最終拆解的點也是較為松散呀枢。下一步就是在拆解方法上改良了，如果您有好的建議笼痛，也請不吝賜教裙秋，感激不盡。
(文章上線2天閱讀量低的我都尿褲子了晃痴，聽說標題很重要残吩，換個新標題看看是否會有不同，原標題叫網(wǎng)易嚴選體驗設計逆向)
