國際用戶體驗(yàn)設(shè)計(jì)（阿里國際站用戶體驗(yàn)設(shè)計(jì)案例）

國際用戶體驗(yàn)設(shè)計(jì)阿里國際站用戶體驗(yàn)設(shè)計(jì)案例目錄\h上篇專業(yè)設(shè)計(jì)師之路\h做好基礎(chǔ)\h設(shè)計(jì)，你也可以\h互聯(lián)網(wǎng)產(chǎn)品的骨骼與皮膚——產(chǎn)品+運(yùn)營\h用體驗(yàn)解決商業(yè)問題，P4P后臺(tái)改造\h設(shè)計(jì)需求分析及模板\h如何做好交互設(shè)計(jì)的專家評(píng)審\h理論到實(shí)踐\h讓你的界面有視覺層次\h用戶難觸及？數(shù)據(jù)幫你大膽假設(shè)，小心求證\h設(shè)計(jì)影響行為，行為決定結(jié)果\h像心理學(xué)家思考，提升設(shè)計(jì)效益\h精通細(xì)節(jié)\h跨屏體驗(yàn)設(shè)計(jì)\h如何設(shè)計(jì)一套優(yōu)秀的響應(yīng)式頁面——A的響應(yīng)式設(shè)計(jì)經(jīng)驗(yàn)\h操作平臺(tái)設(shè)計(jì)\h無線表單設(shè)計(jì)\h表單設(shè)計(jì)：簡單設(shè)計(jì)背后的動(dòng)機(jī)思考\h下篇國際化設(shè)計(jì)，專業(yè)與團(tuán)隊(duì)協(xié)作\h跨文化設(shè)計(jì)\h禪意設(shè)計(jì)——5分鐘貫通國際化簡潔設(shè)計(jì)——互聯(lián)網(wǎng)簡潔設(shè)計(jì)與文化審美之間的關(guān)系及視覺設(shè)計(jì)方法\h從數(shù)據(jù)到設(shè)計(jì)——多語言改版探索\h廣告中的文字設(shè)計(jì)\h西文字體的差異化應(yīng)用\h如何打造一款跨境電商B2BApp\hBC差異化研究——運(yùn)營活動(dòng)設(shè)計(jì)\h系統(tǒng)化協(xié)作\h給馬云的一幅畫\h敏捷設(shè)計(jì)\h從現(xiàn)在開始關(guān)心設(shè)計(jì)模式吧\h外包項(xiàng)目那些事兒\h14年的管理歷程\h附錄A：多語言國家研究成果上篇專業(yè)設(shè)計(jì)師之路做好基礎(chǔ)設(shè)計(jì)，你也可以文/鄭安嬰阿里巴巴國際站（A）對(duì)一個(gè)普通人而言也許有點(diǎn)陌生，我們的理想是讓天下沒有難做的生意，讓世界各地的生意人在這里相遇、發(fā)現(xiàn)商機(jī)、溝通、促成生意，建立起長久的合作關(guān)系。大型機(jī)械、電子產(chǎn)品、服裝、醫(yī)療產(chǎn)品……你能想到的各個(gè)行業(yè)的生意人都在這兒有自己的線上店鋪，來自世界各地的買家在這里大批量采購他們的商品。這里是一個(gè)商機(jī)四起的虛擬世界，促成的卻是真金白銀的真實(shí)交易。在未來，貿(mào)易將越來越脫離地域的局限和語言的障礙。甚至，不同地域就是商機(jī)本身所在?？缇迟Q(mào)易將成為貿(mào)易的趨勢，生意人憑借聰明智慧玩轉(zhuǎn)沒有國界的生意場，讓世界各地神奇的產(chǎn)品運(yùn)轉(zhuǎn)流通。為了讓這個(gè)偉大的理想變成現(xiàn)實(shí)，我和一群充滿熱情和智慧的伙伴在一起奮斗。我們每天做的工作，就是發(fā)現(xiàn)這些神秘的生意人到底會(huì)遇到哪些困擾并幫助他們解決困擾，幫助他們成功，幫助他們成為更出色的生意人。美國、印度、澳大利亞、葡萄牙……他們來自世界各地，使用不同的語言，有著不同的文化，他們的習(xí)慣和思維方式和普通人一樣嗎？日理萬機(jī)，使用互聯(lián)網(wǎng)打開線上渠道的生意人都無比睿智，他們關(guān)注的事物和普通人關(guān)注的一樣嗎？他們做事的方式和普通人又相似嗎？他們充滿了神秘，這些撲朔迷離的問題也恰恰是我們感興趣的。阿里巴巴有一條深入公司每位員工內(nèi)心的原則——擁抱變化。因?yàn)槲覀兌枷嘈?，機(jī)會(huì)隱藏在混亂中，成功萌芽于適應(yīng)變化中。然而，熱情只能成為源動(dòng)力，只有科學(xué)的方法才能解決實(shí)際問題。我們的公司由各種職能的智囊團(tuán)組成，市場部、產(chǎn)品部、運(yùn)營部、銷售部、法務(wù)部、設(shè)計(jì)部、測試部、技術(shù)開發(fā)部……如此豐富的職能造就了復(fù)雜的集體知識(shí)體系。在共同協(xié)作中，我們共同探索著最有效率的解決方法。這本書講述的是作為一名優(yōu)秀的設(shè)計(jì)師，怎樣在復(fù)雜的業(yè)務(wù)環(huán)境下拆解問題、總結(jié)經(jīng)驗(yàn)，為我們的用戶創(chuàng)造最流暢的體驗(yàn)。設(shè)計(jì)部在阿里巴巴叫做用戶體驗(yàn)部（UserExperienceDesign），也是與阿里巴巴“客戶第一”原則關(guān)聯(lián)最緊密的部門。如果對(duì)藝術(shù)設(shè)計(jì)稍有理解，你一定會(huì)好奇，作為通常是藝術(shù)創(chuàng)意背景出身的設(shè)計(jì)工作者，要如何在充滿著“交易”、“合同”、“通關(guān)”、“退稅”此類關(guān)鍵詞的環(huán)境下發(fā)揮設(shè)計(jì)創(chuàng)意，從而巧妙地解決問題呢？事實(shí)上，所有設(shè)計(jì)師的靈魂就是稱為“設(shè)計(jì)思維”的思維方式，一個(gè)設(shè)計(jì)師之所以可以勝任這個(gè)工作，也是因?yàn)樗邆浣鉀Q這些問題的能力。因此，我們不介意面對(duì)復(fù)雜的信息和環(huán)境，因?yàn)槲覀兩鷣砭褪翘幚硭鼈兊?。每個(gè)人面對(duì)問題的處理方法都不同，效率也不同。下文我會(huì)簡單介紹一些我常用的思維模式，也許可以為你提供一些參考。我有信心向你承諾，只要形成自己解決問題的方法——設(shè)計(jì)，你也可以。一、發(fā)現(xiàn)問題一個(gè)好問題才會(huì)有一個(gè)好答案，想找到一個(gè)為你賺錢的好答案，你要先知道如何發(fā)現(xiàn)一個(gè)好問題。在阿里巴巴國際站，如何讓帶著大筆訂單、猶猶豫豫的買家，和有著豐富產(chǎn)品、帶著懷疑、同時(shí)時(shí)間極少的賣家，以最快的速度順利溝通起來，進(jìn)一步形成信任，最后達(dá)成越來越多的交易。這件事是我們產(chǎn)品團(tuán)隊(duì)最大的問題。甚至為了快速得到答案，比起普通人來說，我們的產(chǎn)品團(tuán)隊(duì)不惜進(jìn)行多次嘗試，直到獲得正確答案。當(dāng)我們遇到像上述這樣無法簡單解答的大問題時(shí)，第一個(gè)方法就是拆解、細(xì)分問題。最基本的方法就是按照以下維度拆分。1.發(fā)生問題的用戶是誰？2.發(fā)生問題的時(shí)間和場景是怎樣的？3.用戶來到這個(gè)具體的場景要做什么？4.他在操作和遇到問題時(shí)的流程順序是怎樣的？這類似于6W1H原則，也是你認(rèn)識(shí)一個(gè)具體問題的真正含義的最佳思考途徑。這些問題只是一個(gè)良好的開始，你可以順著這個(gè)拆解的思路層層深究，直到你清晰地了解了你的用戶真正面臨的事件的來龍去脈。舉個(gè)例子，比如第一個(gè)問題：發(fā)生問題的用戶是誰？這個(gè)相對(duì)寬泛的問題就可以被繼續(xù)降解為更細(xì)的維度。（1）用戶的國家、性別、年齡等基本背景是怎樣的？（2）用戶所在的公司和職位是怎樣的？（3）用戶從事這個(gè)職位的年限是怎樣的？諸如此類。當(dāng)你感到問題被降解到一個(gè)非常具體的程度時(shí)，恭喜你，你離提出一個(gè)真正的好問題也就不遠(yuǎn)了。一般而言，在阿里巴巴這樣的大型互聯(lián)網(wǎng)公司，或者任何一個(gè)重視大數(shù)據(jù)的公司，都會(huì)在產(chǎn)品不斷上線迭代的過程中積累用戶的行為數(shù)據(jù)。比如，一個(gè)頁面一天有多少用戶來訪，有多少用戶停留超過10分鐘，有多少用戶不足30秒就離開了，這些具體信息都可以通過數(shù)據(jù)部門獲得。產(chǎn)品經(jīng)理通常也就是通過挖掘這些數(shù)據(jù)來發(fā)現(xiàn)上述細(xì)分問題的初步答案，這些答案不一定就是絕對(duì)正確的，但是它們所提供的參考一定會(huì)提高產(chǎn)品的精確性。與此同時(shí)，你還可以從其他渠道獲得問題的答案，比如服務(wù)部，他們每天都在面對(duì)用戶的投訴和意見，這是最好的信息獲得渠道。與服務(wù)部溝通，也可以為你提供一些答案。當(dāng)你降解細(xì)分的問題收獲到足夠多的答案以后，你就可以重新回到你最初遇到的大問題上。這時(shí)候，原先的那個(gè)大問題就會(huì)因?yàn)榧?xì)分問題的解答而產(chǎn)生很多邊界，從而變得容易回答。舉個(gè)例子，你想知道：蘋果樹為什么不結(jié)果子？這是一個(gè)非常寬泛而難以回答的問題，但是當(dāng)你通過與各種各樣的人溝通，了解了各種信息，這個(gè)問題就變成了：種在中國杭州阿里巴巴公司停車庫旁邊、曬不到太陽、熱帶品種、樹齡3年的蘋果樹為什么不結(jié)果子？這時(shí)，你腦海中認(rèn)為可能正確的答案是否一下就清晰起來了呢？所以，問題解決不了，是因?yàn)槲覀儾涣私膺@個(gè)問題的方方面面、來龍去脈。一個(gè)好問題才會(huì)獲得一個(gè)好答案，而互聯(lián)網(wǎng)人的基本技能就是發(fā)現(xiàn)問題。想要做一個(gè)好的設(shè)計(jì)師，先從你面臨的問題開始。在阿里巴巴，我們通常把和產(chǎn)品經(jīng)理一起討論解決問題的過程叫作“聊產(chǎn)品需求”，產(chǎn)品需求通常已經(jīng)落實(shí)到了一個(gè)產(chǎn)品經(jīng)理推理出來的解決方案，但是我們會(huì)通過閱讀他的解決方案，來進(jìn)一步探討他真正想解決的問題。這個(gè)過程，也就是我們通過設(shè)計(jì)思維來配合產(chǎn)品經(jīng)理梳理思路的過程。二、做出假設(shè)種在中國杭州阿里巴巴公司停車庫旁邊、曬不到太陽、熱帶品種、樹齡3年的蘋果樹為什么不結(jié)果子？對(duì)于這個(gè)問題的正確答案，你有什么猜測？可能是由于蘋果樹曬不到太陽，可能是由于停車庫旁邊廢氣太重，可能是由于蘋果樹本身還沒成熟……這些猜測就可以成為你的假設(shè)，一個(gè)假設(shè)的提出形式通常是“假如我們這樣做……，就可以……?！崩纾杭偃缥野堰@棵蘋果樹搬到太陽底下，它就會(huì)結(jié)果子了。所以你看，當(dāng)你有了一個(gè)好問題，要做一個(gè)假設(shè)其實(shí)是很容易的。但是要做好這個(gè)假設(shè)并不容易，就以上的例子，很顯然，就算把蘋果樹搬到太陽光下照射它也不會(huì)瞬間結(jié)出果子。有經(jīng)驗(yàn)的人就會(huì)做更細(xì)致的假設(shè)，為這個(gè)假設(shè)設(shè)置更多細(xì)分條件。這個(gè)做法就和我們剛才降解問題的方法一樣。什么時(shí)間、什么地點(diǎn)、什么具體情況下，假設(shè)我這樣做，會(huì)獲得結(jié)果A。另一種條件下，假設(shè)我這樣做，會(huì)獲得結(jié)果B。這些細(xì)致的、分類討論的假設(shè)，最終能很好地回答一個(gè)很嚴(yán)謹(jǐn)?shù)膯栴}。面對(duì)一個(gè)嚴(yán)謹(jǐn)?shù)膯栴}，你要做同樣嚴(yán)謹(jǐn)?shù)募僭O(shè)。但其實(shí)做出嚴(yán)謹(jǐn)?shù)募僭O(shè)只是最基本的能力，好的設(shè)計(jì)師需要做出極富創(chuàng)意的假設(shè)。比起蘋果怎么結(jié)果子，我們平時(shí)的假設(shè)常常是假設(shè)某個(gè)圖片、某個(gè)功能區(qū)塊放在什么位置，使用什么顏色，就可以為用戶帶來怎樣的體驗(yàn)?；蛘呤羌僭O(shè)我們?yōu)橛脩舭才乓幌盗械牟僮髁鞒蹋涂梢詾橛脩艚鉀Q某種具體的問題。這種假設(shè)比較復(fù)雜，通常會(huì)牽扯到各種事件間的相互關(guān)聯(lián)與作用。這種情況下要想做出極富創(chuàng)意的假設(shè)，你就需要一個(gè)智囊團(tuán)。他們可以是你的同事、朋友或者家人，挑選一些性格和你非常相似，以及截然相反的人，你能獲得更豐富的建議。這些建議會(huì)引發(fā)你的思考，從而做出一個(gè)全面、嚴(yán)謹(jǐn)，同時(shí)又充滿創(chuàng)意的假設(shè)。始終記住，寫下假設(shè)的人是你，可以聽取建議，但是不要隨意被影響。尤其重要的是，當(dāng)你強(qiáng)烈地感到一個(gè)假設(shè)非常具有可行性，但是遭遇了比較嚴(yán)重的打擊時(shí)，保護(hù)好你的創(chuàng)意，不要輕易放棄它。后面我們會(huì)談到如何科學(xué)地證明你的假設(shè)是否正確。在阿里巴巴國際站UED，我們很幸運(yùn)有一支由50多人組成的專業(yè)且龐大的團(tuán)隊(duì)。通常，當(dāng)我們了解一個(gè)產(chǎn)品經(jīng)理希望和我們一起解決的問題時(shí)，我們會(huì)迅速拉上幾個(gè)同事，然后一起頭腦風(fēng)暴，畫一些概念稿。這些概念稿可以很大膽，充滿想象，不受拘束，這也是設(shè)計(jì)師最喜愛的環(huán)節(jié)。有時(shí)候正確答案往往藏在你覺得最不可思議的方案中。三、大膽試錯(cuò)你有了一個(gè)嚴(yán)謹(jǐn)?shù)膯栴}，有了一個(gè)嚴(yán)謹(jǐn)?shù)募僭O(shè)，但也不能保證你現(xiàn)在做的這個(gè)假設(shè)就是正確答案。在你的假設(shè)變成一個(gè)真正的解決方案，被驗(yàn)證成功或是失敗之前，你可以先用你的假設(shè)去大膽試錯(cuò)，因?yàn)檫@時(shí)你犯錯(cuò)的成本是最小的。比起項(xiàng)目上線收益慘淡，現(xiàn)在聽聽別人對(duì)你方案的負(fù)面抨擊，簡直輕如鴻毛。可用性測試是我們喜愛用的一個(gè)方式，把你的設(shè)計(jì)稿做成一個(gè)仿真原型，交給你招募來的目標(biāo)用戶，聽聽他們的反饋。你會(huì)發(fā)現(xiàn)他們使用一個(gè)產(chǎn)品的方式和你設(shè)計(jì)它的思路完全不一樣，你的用戶會(huì)讓你驚訝，給你靈感，他們的反饋是你最好的參考資料。在阿里巴巴，我們有專門的用研團(tuán)隊(duì)，他們經(jīng)常提供給設(shè)計(jì)師一些訪談技巧的培訓(xùn)，也有很多招募用戶的渠道、方法。用戶體驗(yàn)設(shè)計(jì)師的職能也不僅僅局限于美學(xué)、藝術(shù)、排版、布局，我們更接近用戶，我們需要對(duì)用戶進(jìn)行了解研究，我們設(shè)計(jì)的不是產(chǎn)品而是體驗(yàn)。我最近親自組織了一次海外用戶的訪談與測試，用戶來自印度、新加坡、英國等地，親自與使用著英語母語或非英語母語的真正國際用戶交談。他們彬彬有禮，他們吼叫發(fā)泄；他們條理清晰，他們喋喋不休；他們友好，他們不耐煩……他們甚至比你有更好的互聯(lián)網(wǎng)產(chǎn)品思維。走進(jìn)你的用戶，你會(huì)發(fā)現(xiàn)這些用戶帶給你的不僅僅是對(duì)產(chǎn)品的重新思考，更重要的是為你帶來了同理心。真正意識(shí)到你設(shè)計(jì)出來的作品是會(huì)被用戶認(rèn)真使用，這件事本身，比其他任何東西都更能促成你做出一個(gè)好的設(shè)計(jì)。當(dāng)然，有時(shí)候我們也會(huì)遇到困難，比如：沒有資源讓我們把產(chǎn)品原型給用戶來試錯(cuò)，找不到愿意來測試的國際用戶，沒有時(shí)間，沒有人配合。各種各樣的問題限制著我們嚴(yán)謹(jǐn)?shù)赝瓿梢粋€(gè)項(xiàng)目的步伐。產(chǎn)品經(jīng)理的催促永遠(yuǎn)像個(gè)定時(shí)鬧鐘一樣環(huán)繞在耳邊。你也一定會(huì)遇到一樣的問題，想出了也許可以解決問題的辦法，但來不及試錯(cuò)，立馬就要拿出來用。這種時(shí)候我比較鼓勵(lì)的是，在你的能力范圍內(nèi)盡可能地嘗試試錯(cuò)，即使只是很小的嘗試。你可以采取的最簡單的辦法，就是請和你一樣了解問題的人就你的假設(shè)方案進(jìn)行討論。一個(gè)被討論過5分鐘的假設(shè)，也要?jiǎng)龠^一個(gè)匆匆拿去實(shí)踐的假設(shè)。我們做的所有努力，都是為了降低假設(shè)的出錯(cuò)率，哪怕只降低了0.01%也是成功的一步。四、實(shí)現(xiàn)構(gòu)想說到這里你會(huì)發(fā)現(xiàn)我沒有提過任何一句有關(guān)圖形、美學(xué)、軟件應(yīng)用等方面的技能。當(dāng)我們談?wù)摰秸嬲涯愕臉?gòu)想落地為產(chǎn)出的時(shí)候，我們就要聊一聊這個(gè)話題了。其實(shí)實(shí)現(xiàn)手段只是一個(gè)設(shè)計(jì)師的多種能力之一，并不是掌握了圖形處理就意味著你成為了一個(gè)設(shè)計(jì)師。技能只是幫助你把構(gòu)想實(shí)現(xiàn)為現(xiàn)實(shí)的工具。假設(shè)你有很好的構(gòu)想，又找得到可以為你實(shí)現(xiàn)的合作伙伴，你同樣可以成功創(chuàng)作出漂亮的設(shè)計(jì)作品。當(dāng)然，如果你想做一個(gè)具備獨(dú)立創(chuàng)作能力的設(shè)計(jì)師，那么你就必須要去學(xué)習(xí)相關(guān)領(lǐng)域的專業(yè)知識(shí)。比如網(wǎng)頁設(shè)計(jì)，你至少需要學(xué)習(xí)平面設(shè)計(jì)、界面設(shè)計(jì)等知識(shí)，掌握任何一項(xiàng)頁面及設(shè)計(jì)軟件工具作為起步。工具和專業(yè)知識(shí)是幫助你做得更好的最好戰(zhàn)友，當(dāng)你左手擁有縝密的設(shè)計(jì)思維，右手擁有熟練的技能時(shí)，你才可以有信心地說，你可以獨(dú)當(dāng)一面，為復(fù)雜的問題提供完整的解決方案。在阿里巴巴國際站UED，我們設(shè)計(jì)師的職能分為交互和視覺兩種，這兩種都只是職位名稱，如果你愿意嘗試學(xué)習(xí)更多的技能，通過同事之間互相交流學(xué)習(xí)、利用項(xiàng)目機(jī)會(huì)磨練技能，你就可以快速掌握。視覺可以學(xué)習(xí)交互技能，交互也可以學(xué)習(xí)視覺技能，甚至還可以向用研團(tuán)隊(duì)學(xué)習(xí)如何和你的用戶訪談。在Facebook，設(shè)計(jì)師的職位名稱叫作產(chǎn)品設(shè)計(jì)師，通常同時(shí)擔(dān)任交互和視覺兩種職能。所以，職位只是公司用來管理員工的類目，你并不需要因?yàn)槁毼粸樽约涸O(shè)定太多局限，最重要的是做你想做的事。說完這些，假設(shè)你已經(jīng)具備了獨(dú)立設(shè)計(jì)的能力，或者你已經(jīng)找到了可以幫助你把構(gòu)想實(shí)現(xiàn)的助手。在具體設(shè)計(jì)的時(shí)候，下面幾個(gè)要素值得你在執(zhí)行中特別注意。1.是否符合各項(xiàng)邏輯就像句子有語法，畫作有構(gòu)圖與結(jié)構(gòu)。你在完成一個(gè)設(shè)計(jì)的時(shí)候，也要從多種角度思考自己的產(chǎn)出物是否經(jīng)得起推敲。我列舉幾個(gè)維度的邏輯作為參考。推導(dǎo)邏輯：設(shè)計(jì)產(chǎn)物的推導(dǎo)邏輯，其實(shí)就是我們整篇文章前半段一直討論的——從發(fā)現(xiàn)問題、做出假設(shè)到大膽試錯(cuò)，這整個(gè)過程中你不斷修正自己對(duì)問題的解決方案，獲得了一系列對(duì)調(diào)整方案有價(jià)值的信息，判斷篩選這些信息，從而完成對(duì)方案的修改，就已經(jīng)具備了基本邏輯嚴(yán)謹(jǐn)?shù)臈l件。在這個(gè)基礎(chǔ)上，再審視每個(gè)細(xì)節(jié)決定，諸如每個(gè)頁面之間的關(guān)系，每一段文字、圖片、控件擺放的位置，每個(gè)動(dòng)畫效果出現(xiàn)的速度和時(shí)機(jī)，等等。大到網(wǎng)站架構(gòu)，小到一個(gè)文字的色值，你安排他們的方式是否有切實(shí)可靠的原因。物理邏輯：你的設(shè)計(jì)產(chǎn)物會(huì)根據(jù)觸發(fā)條件的不同，發(fā)生不同的改變，從而和用戶產(chǎn)生交互。在互聯(lián)網(wǎng)產(chǎn)品出現(xiàn)之前，人們每天打交道的都是自然世界中的實(shí)物。所謂物理邏輯，其實(shí)就是結(jié)構(gòu)、色彩、材料、運(yùn)動(dòng)軌跡等這些你日常接觸的物體的屬性與規(guī)律。經(jīng)?？剂磕愕脑O(shè)計(jì)是否巧妙利用了一些物理隱喻，或者是否違背了一些基本物理邏輯，對(duì)你的設(shè)計(jì)會(huì)有很大的提升。舉個(gè)例子，蘋果產(chǎn)品中，iPhone電量不足時(shí)金屬絲斷裂的音效，MacBook刪除文件時(shí)捏紙團(tuán)的音效，就很好地模仿了自然環(huán)境中相應(yīng)的聲音，從而令用戶毫不費(fèi)力地理解自己當(dāng)前的操作。行為邏輯：行為邏輯是最重要也是和用戶最為相關(guān)的邏輯。在設(shè)計(jì)之前的具體推導(dǎo)過程中，我們就已經(jīng)了解了用戶的行為。這時(shí)有兩種做法：第一種，在設(shè)計(jì)前就把所有類型用戶的行為流程進(jìn)行整理，根據(jù)他們行為的發(fā)生順序和互相之間的聯(lián)動(dòng)來決定你之后的設(shè)計(jì)產(chǎn)出；第二種，在產(chǎn)出設(shè)計(jì)后，整理用戶行為的流程，驗(yàn)證你的設(shè)計(jì)是否可靠，從而進(jìn)行修改。2.是否符合人機(jī)交互原則由于我們是作為用戶體驗(yàn)設(shè)計(jì)師在履行我們的職責(zé)，所以一定要時(shí)刻記得先考慮可用性和易用性，其次再考慮美學(xué)層面的視覺和諧。這里的可用性和易用性，都要從用戶使用的終端出發(fā)。你的設(shè)計(jì)在手機(jī)、電腦或是手表等不同界面上展示，都將影響你最終產(chǎn)物的組合形式。因?yàn)橛脩艉筒煌K端產(chǎn)生交互時(shí)遇到的情況是不同的。一個(gè)小竅門：雖然你是從可用性和易用性出發(fā)，但當(dāng)你推敲獲得的最終產(chǎn)物看上去不太美觀的時(shí)候，通常是它本身有一定的不合理性。這個(gè)竅門并不總是正確，但是可以給你提供一些幫助。3.是否具有可拓展性這里我們只討論界面設(shè)計(jì)，但其實(shí)可拓展性適用于一切產(chǎn)品。一般來說，軟件或者互聯(lián)網(wǎng)產(chǎn)品都會(huì)經(jīng)過好幾個(gè)版本的迭代，有些是徹底地改版，有些是做細(xì)微的調(diào)整。這時(shí)候控制好你設(shè)計(jì)的第一個(gè)版本是否具有可拓展性就十分重要。它意味著你之后做設(shè)計(jì)調(diào)整時(shí)會(huì)不會(huì)花費(fèi)很多重復(fù)勞動(dòng)，以及負(fù)責(zé)實(shí)現(xiàn)設(shè)計(jì)的前端工程師會(huì)不會(huì)付出更多修改成本。在阿里巴巴國際站UED，當(dāng)我們正式進(jìn)入開始實(shí)現(xiàn)構(gòu)想的環(huán)節(jié)時(shí)，一般來說都有比較標(biāo)準(zhǔn)的執(zhí)行流程來保障上述的要點(diǎn)。首先，我們把前期發(fā)現(xiàn)問題、做出假設(shè)以及大膽試錯(cuò)的內(nèi)容都用規(guī)范格式記錄下來，保證我們在向別人講解設(shè)計(jì)時(shí)有足夠充分的佐證。然后，我們開始整理用戶的任務(wù)流程（TaskFlow）。例如，用戶：小學(xué)生，任務(wù)：上學(xué)，任務(wù)流程：起床—整理書包—坐720路巴士—到達(dá)學(xué)校。通過這個(gè)任務(wù)流程的關(guān)鍵節(jié)點(diǎn)，又能推導(dǎo)出通過什么樣的設(shè)計(jì)形式承載，比如“坐720路巴士”的行為需要“一輛巴士”承載，而一個(gè)“提交申請”的行為則需要“一個(gè)含有申請表單和提交按鈕的頁面”承載。這樣一來，整個(gè)項(xiàng)目需要涉及多少個(gè)頁面就一目了然了。進(jìn)入頁面內(nèi)，就需要安排這個(gè)頁面的信息層級(jí)，哪些是需要用戶在第一時(shí)間了解的內(nèi)容，哪些屬于輔助類型的非重要信息。確定了信息層級(jí)后，再通過布局來根據(jù)優(yōu)先級(jí)安排哪些信息放置在哪些位置。這樣依次完成每個(gè)頁面的布局，完成視覺層面潤色的細(xì)節(jié)調(diào)整，再對(duì)各個(gè)頁面上會(huì)發(fā)生的交互變化、視覺上的間距等細(xì)節(jié)做出標(biāo)注，一份完整的設(shè)計(jì)文檔就完成了。前端工程師根據(jù)這份文檔，將我們的設(shè)計(jì)變成用戶真正可以使用的網(wǎng)頁。當(dāng)然，這個(gè)過程因人而異，最后搭建出一個(gè)漂亮好用的網(wǎng)站，可以通過許多不同的方式來達(dá)成。你在構(gòu)想一個(gè)設(shè)計(jì)時(shí)經(jīng)過了最初設(shè)計(jì)，在實(shí)現(xiàn)的過程中又完成了第二次設(shè)計(jì)。堅(jiān)持把你的構(gòu)想做出來，這樣才能發(fā)現(xiàn)它真正可能遇到的問題。五、事實(shí)驗(yàn)證這部分我不再贅述，因?yàn)闋可娴酱髷?shù)據(jù)、用戶研究等專業(yè)領(lǐng)域。但是需要強(qiáng)調(diào)的是，你必須認(rèn)識(shí)到，設(shè)計(jì)投入使用之后其實(shí)才是漫長的設(shè)計(jì)迭代過程的開始。你的用戶真正和你的產(chǎn)品發(fā)生了交流，有了真正的看法，給你真實(shí)的反饋，你才會(huì)知道下一步設(shè)計(jì)怎么進(jìn)行調(diào)整。在阿里巴巴，我們有數(shù)據(jù)團(tuán)隊(duì)和用戶研究團(tuán)隊(duì)。在產(chǎn)品上線后，他們通過讀取用戶在網(wǎng)頁上行動(dòng)所產(chǎn)生的數(shù)據(jù)，或者回收用戶反饋的問卷，或者主動(dòng)訪談?dòng)脩?，獲悉他們對(duì)上線產(chǎn)品的反饋，從而了解用戶對(duì)我們的設(shè)計(jì)真正的看法。因此，要在用戶體驗(yàn)這個(gè)領(lǐng)域成為一個(gè)出色的設(shè)計(jì)師，你還必須了解很多橫向知識(shí)。包括如何從各種數(shù)據(jù)中提取出最能指導(dǎo)驗(yàn)證設(shè)計(jì)的指標(biāo)，如何從訪談中了解用戶對(duì)一個(gè)設(shè)計(jì)形式的真正看法。事實(shí)證明，你的設(shè)計(jì)可能不那么成功，看上去似乎之前的一切努力都白費(fèi)了，但其實(shí)這才是最好的結(jié)果。我們知道了一種錯(cuò)誤的可能，就獲得了一條更清晰的界限。紙上談兵不如立刻嘗試，設(shè)計(jì)師的工作并不是那么不切實(shí)際的天馬行空，而恰恰是實(shí)實(shí)在在地解決問題。即使你沒有從事過任何設(shè)計(jì)相關(guān)的職業(yè)，但只要懷著一份把身邊事物變得更好的熱情，使用正確的方法和工具，最后為更多的人帶來便利，你就是一個(gè)出色的設(shè)計(jì)師。我在從事設(shè)計(jì)工作的過程中獲得了很多人生、自我上的啟發(fā)，這份職業(yè)也帶給我出人意料的驚喜和快樂。在之后的更多篇章里，你會(huì)看到我的那些充滿智慧的同事們?nèi)绾谓鉀Q形形色色的復(fù)雜問題?？缇迟Q(mào)易或許是你的興趣所在，又或許不是。但是無論如何，我們在阿里巴巴國際站這個(gè)產(chǎn)品生態(tài)中面臨的復(fù)雜問題，就和我們面臨的所有復(fù)雜問題一樣，最終都有切入點(diǎn)，使我們可以迎難而上，讓問題迎刃而解。最后贈(zèng)送一句我最喜歡的美劇《Suits》中的臺(tái)詞：做律師就像做醫(yī)生，在病人身上一直試探性地按壓，直到病人喊痛（Youkeeppressinguntilithurts.Thenyouknowwheretolook）。做設(shè)計(jì)也是一樣，掌握方法，你也可以。作者郵箱：amber.zheng@互聯(lián)網(wǎng)產(chǎn)品的骨骼與皮膚——產(chǎn)品+運(yùn)營文/駱蕓眾所周知，學(xué)有所長，在做過很多類型的設(shè)計(jì)工作后應(yīng)該會(huì)有自己最擅長的東西。自己做設(shè)計(jì)也有7年了，從動(dòng)漫設(shè)計(jì)、游戲設(shè)計(jì)、平面設(shè)計(jì)、運(yùn)營設(shè)計(jì)，最終轉(zhuǎn)為產(chǎn)品設(shè)計(jì)，其實(shí)筆者也有不少心得，希望通過此篇文章與大家分享。我身邊有不少朋友都是設(shè)計(jì)師，但設(shè)計(jì)種類各有不同。那些沒有接觸過產(chǎn)品設(shè)計(jì)的朋友，還是會(huì)對(duì)產(chǎn)品設(shè)計(jì)這個(gè)名詞感到一頭霧水。普通的產(chǎn)品與互聯(lián)網(wǎng)產(chǎn)品有什么區(qū)別？其實(shí)互聯(lián)網(wǎng)產(chǎn)品的概念是從傳統(tǒng)意義上的“產(chǎn)品”概念延伸而來的，是在互聯(lián)網(wǎng)領(lǐng)域產(chǎn)生用于經(jīng)營的商品，例如：阿里的“支付寶”、騰訊的“微信”。由于智能手機(jī)的普及，越來越多的互聯(lián)網(wǎng)產(chǎn)品被人們熟知。從類型上來講，互聯(lián)網(wǎng)產(chǎn)品也分為PC端、無線端等。產(chǎn)品設(shè)計(jì)就好比一個(gè)人的骨架，好的產(chǎn)品架構(gòu)能夠給一個(gè)產(chǎn)品帶來堅(jiān)實(shí)的基礎(chǔ)。一般產(chǎn)品設(shè)計(jì)主要有三個(gè)階段——策劃、開發(fā)、運(yùn)營。細(xì)分來講，先是有商業(yè)需求，然后做市場分析和用戶調(diào)研，接下來出產(chǎn)品策劃方案，正式投入產(chǎn)品設(shè)計(jì)和產(chǎn)品開發(fā)，最后進(jìn)行產(chǎn)品的推廣營銷。我們以正式投入產(chǎn)品設(shè)計(jì)為切入點(diǎn)。1.設(shè)計(jì)準(zhǔn)備由于筆者做的是視覺設(shè)計(jì)的工作，因此在接到設(shè)計(jì)需求時(shí)，通常已經(jīng)接到了一份比較完整的交互設(shè)計(jì)稿。在了解產(chǎn)品的大致需求后，需要時(shí)間消化，并且對(duì)比市面上的同類產(chǎn)品。然而更多的靈感來源于平時(shí)的積累，可以是對(duì)各大設(shè)計(jì)網(wǎng)站及書籍的瀏覽，因?yàn)榍叭说慕?jīng)驗(yàn)是寶貴的財(cái)富，可以幫你解決很多問題。當(dāng)然，靈感也來源于平日里對(duì)生活的捕捉和對(duì)美感的提煉。你也可以隨手準(zhǔn)備一個(gè)小本子，把平日里的小靈感全都記錄進(jìn)去，不局限于寫寫畫畫。另外，收集好圖也是一個(gè)很好的習(xí)慣，各種素材都可以在接到新的需求時(shí)去查看，會(huì)給到自己帶來新的靈感。然而B2B的產(chǎn)品大多使用場景都沒有出現(xiàn)在我們的日常生活當(dāng)中，因此了解更多專業(yè)類的知識(shí)對(duì)一個(gè)設(shè)計(jì)B2B產(chǎn)品的設(shè)計(jì)師來說顯得尤為重要。2.開始動(dòng)手設(shè)計(jì)在一個(gè)完整的產(chǎn)品設(shè)計(jì)過程中，交互框架與風(fēng)格確定之后，就要開始著重于組件的統(tǒng)一以及視覺規(guī)范的遵守。這些都影響到這個(gè)產(chǎn)品最終的用戶體驗(yàn)。在我們B2BUED有設(shè)計(jì)師們自己搭建的DPL平臺(tái)（統(tǒng)一的控件與組件庫），里面包含細(xì)化到每一個(gè)button的應(yīng)用，大大地節(jié)省了設(shè)計(jì)頁面的時(shí)間，提高了設(shè)計(jì)效率，并且也更方便前端與后端對(duì)產(chǎn)品進(jìn)行開發(fā)。我們還有一個(gè)元素設(shè)計(jì)小組，不斷產(chǎn)出統(tǒng)一的設(shè)計(jì)元素，可以簡單方便地應(yīng)用到頁面設(shè)計(jì)中。認(rèn)識(shí)到元素與視覺規(guī)范的重要性，提高自有產(chǎn)品的品牌感與統(tǒng)一性，設(shè)計(jì)師再發(fā)揮一些自己的創(chuàng)意，就能很好地搭配出風(fēng)格相對(duì)一致的網(wǎng)頁產(chǎn)品或移動(dòng)端產(chǎn)品了。3.設(shè)計(jì)評(píng)審聽取專業(yè)意見在設(shè)計(jì)完成后，我們會(huì)把自己的作品抄送到自己所在的專業(yè)組，聽取小組內(nèi)各位專業(yè)人士提出的意見，以便對(duì)自身設(shè)計(jì)的產(chǎn)品做出更完善的改動(dòng)。要學(xué)會(huì)多聆聽別人的意見，從不同的角度看待問題。4.最終輸出稿整理規(guī)范的圖層組。在我們把PSD提交給前端之前，記得養(yǎng)成整理一下自己的圖層以及圖層組的好習(xí)慣，那樣會(huì)讓下一個(gè)接手這個(gè)項(xiàng)目的人感到方便、快捷，也可以大大節(jié)約需求完成的時(shí)間。搭好了骨架之后我們該干什么呢？接下來就讓我們來聊聊什么是運(yùn)營設(shè)計(jì)吧。運(yùn)營好比一個(gè)人的皮膚，沒有好的運(yùn)營，可能準(zhǔn)備得很完善的產(chǎn)品也不一定會(huì)有很多用戶。所以在產(chǎn)品發(fā)布新版本及重大的活動(dòng)、節(jié)日時(shí)都需要優(yōu)秀的運(yùn)營設(shè)計(jì)，例如產(chǎn)品網(wǎng)站的Banner、活動(dòng)專題頁面、線下宣傳海報(bào)等。有了好的產(chǎn)品設(shè)計(jì)加上好的運(yùn)營設(shè)計(jì)，一個(gè)人的“骨骼”和“皮膚”才算完整！1.有故事內(nèi)容的設(shè)計(jì)創(chuàng)意是關(guān)鍵。如果你僅僅只是在做一個(gè)Banner，圖中沒有內(nèi)容，沒有故事，可想而知，你打動(dòng)不了你的用戶。簡單地來說，如果運(yùn)營策劃給的是一個(gè)方案，那么就要由設(shè)計(jì)師去完成那畫龍點(diǎn)睛的一筆。2.提取核心關(guān)鍵詞，找到合適的風(fēng)格自己做的產(chǎn)品架構(gòu)，肯定最清楚產(chǎn)品風(fēng)格是怎樣的。那么在做產(chǎn)品的運(yùn)營設(shè)計(jì)時(shí)就要統(tǒng)一風(fēng)格，盡可能讓別人一眼就可以認(rèn)出，類似于蘋果、KFC。這里就要講到品牌化，B2BUED也一直在努力實(shí)現(xiàn)品牌化。3.運(yùn)營視覺規(guī)范運(yùn)營設(shè)計(jì)也有相對(duì)的設(shè)計(jì)規(guī)范。當(dāng)我們面對(duì)大批量的運(yùn)營需求時(shí)，規(guī)范可以很好地節(jié)省時(shí)間，并且可以使雜亂無章的各類Banner、EDM、運(yùn)營活動(dòng)等都有很好的統(tǒng)一性。無論是小型項(xiàng)目還是大型項(xiàng)目，產(chǎn)品還是運(yùn)營，視覺規(guī)范都有其存在的必要性。無論是對(duì)自己，還是對(duì)同事，都能起到很好的規(guī)范作用，避免不一致的設(shè)計(jì)。4.效果跟蹤一次運(yùn)營的結(jié)束并不是產(chǎn)品宣傳的終止，要想下次還能獲得好的宣傳效果就必須總結(jié)經(jīng)驗(yàn)。效果跟蹤：觀察用戶的反饋，記錄相關(guān)點(diǎn)擊量，從中獲知你的設(shè)計(jì)存在的問題。也許你原以為很滿意的設(shè)計(jì)，實(shí)際獲得的轉(zhuǎn)化率卻比其他時(shí)候少很多，那就要仔細(xì)分析原因了。效果跟蹤可以作為自己階段性工作的一種沉淀。規(guī)范沉淀：總結(jié)制定設(shè)計(jì)規(guī)范，這樣下次運(yùn)營設(shè)計(jì)的時(shí)候，就有很多元素可以復(fù)用，圖片的尺寸也有統(tǒng)一的標(biāo)準(zhǔn)，可以大大提高效率，也能方便其他人使用。做好產(chǎn)品設(shè)計(jì)與運(yùn)營，骨骼和皮膚都搭建好，那么這個(gè)產(chǎn)品離成功也不會(huì)太遠(yuǎn)了！作者郵箱：34334991@用體驗(yàn)解決商業(yè)問題，P4P后臺(tái)改造文/向許源設(shè)計(jì)師能夠給業(yè)務(wù)帶來的，絕不僅僅只有界面層的優(yōu)化。在一些以業(yè)務(wù)為導(dǎo)向的，或者以技術(shù)為導(dǎo)向的公司，用戶體驗(yàn)或許很難從一開始就占據(jù)最高的優(yōu)先級(jí)。作為阿里巴巴的設(shè)計(jì)師，我們不否認(rèn)這種情況，畢竟，從短期來看，可以轉(zhuǎn)化為利潤的商業(yè)數(shù)據(jù)和可以明確計(jì)算的技術(shù)成本，更能左右項(xiàng)目的方向。一個(gè)很平常的場景：產(chǎn)品經(jīng)理拿著一張草圖，把商業(yè)目標(biāo)和想要實(shí)現(xiàn)的功能告訴設(shè)計(jì)師，設(shè)計(jì)師進(jìn)行思考后提出用戶體驗(yàn)最好的方案。產(chǎn)品經(jīng)理面露難色：“這個(gè)方案是很好，但是我們必須要讓這個(gè)按鈕出現(xiàn)在更醒目的位置?！币?yàn)榭赡苓@個(gè)按鈕的背后，是某條業(yè)務(wù)線重要的商業(yè)利益。這種情況下，如果不是有嚴(yán)重的體驗(yàn)問題，設(shè)計(jì)師可能就要開始考慮拿出兼顧商業(yè)目標(biāo)和用戶體驗(yàn)的方案了。通常，這種方案的用戶體驗(yàn)不會(huì)是最好的。這樣的場景在項(xiàng)目過程中，時(shí)有發(fā)生，設(shè)計(jì)師會(huì)陷入用戶體驗(yàn)和業(yè)務(wù)目標(biāo)的抉擇中，并且把產(chǎn)品經(jīng)理、開發(fā)工程師當(dāng)做對(duì)立方——為了達(dá)到最好的用戶體驗(yàn)，需要說服他們。設(shè)計(jì)師很容易產(chǎn)生“為什么他們不懂用戶體驗(yàn)”的感慨。但是，實(shí)際情況是，產(chǎn)品經(jīng)理當(dāng)然了解用戶體驗(yàn)，甚至他們也知道，自己所需要的方案不能給用戶帶來最好的體驗(yàn)。而設(shè)計(jì)師看到的功能文檔，很有可能是產(chǎn)品經(jīng)理在權(quán)衡了商業(yè)利益、數(shù)據(jù)指標(biāo)、技術(shù)難度之后，給出的他認(rèn)為最平衡的方案。我們不能苛求他們把用戶體驗(yàn)放在第一位，那應(yīng)該是我們的工作。但是，理解不代表認(rèn)同，用戶體驗(yàn)除了為商業(yè)目標(biāo)讓步之外，還有另一條路可以嘗試，那就是比現(xiàn)在更好地達(dá)到商業(yè)目標(biāo)。國際UED中認(rèn)為，設(shè)計(jì)師有能力提出讓產(chǎn)品經(jīng)理“無法拒絕”的方案。當(dāng)然這需要一定的條件。設(shè)計(jì)師需要對(duì)業(yè)務(wù)非常熟悉，并且了解技術(shù)實(shí)現(xiàn)的相關(guān)知識(shí)，從而擴(kuò)大自己的覆蓋面，以更全局的方式參與項(xiàng)目——從項(xiàng)目流程上而不單純是界面上，用體驗(yàn)解決商業(yè)問題。在阿里巴巴，一個(gè)普遍的流程是這樣的：產(chǎn)品經(jīng)理通過對(duì)效果數(shù)據(jù)、用戶研究的分析，得出商業(yè)假設(shè)，根據(jù)商業(yè)假設(shè)提出功能需求；設(shè)計(jì)師根據(jù)需求設(shè)計(jì)出交互方案，制作成設(shè)計(jì)稿（包括交互設(shè)計(jì)稿和視覺設(shè)計(jì)稿）；前端工程師和后端工程師根據(jù)功能邏輯和界面邏輯，實(shí)現(xiàn)功能。如果設(shè)計(jì)師安于這樣的流程，等待產(chǎn)品經(jīng)理的功能需求文檔，那么他很容易陷入之前所說的兩難局面。但如果設(shè)計(jì)師嘗試在流程上向前或者向后覆蓋，那么可能會(huì)產(chǎn)生超出期望的效果。在國際UED中流傳的兩句話，可以代表我們的態(tài)度：“對(duì)于好的設(shè)計(jì)師，用戶體驗(yàn)僅僅是下限”、“交互設(shè)計(jì)師是半個(gè)產(chǎn)品經(jīng)理”。我們鼓勵(lì)設(shè)計(jì)師多了解業(yè)務(wù)背景，補(bǔ)充商業(yè)方面的知識(shí)，參與到產(chǎn)品功能的決策中去?；蛟S設(shè)計(jì)師不能像產(chǎn)品經(jīng)理一樣，隨時(shí)保持著敏銳的商業(yè)嗅覺或者熟悉各種算法，但是設(shè)計(jì)師獨(dú)特的體驗(yàn)視角，以及跳出單個(gè)業(yè)務(wù)看待產(chǎn)品的思考方式，有時(shí)候會(huì)令項(xiàng)目中的難點(diǎn)迎刃而解。我們曾完成過的一個(gè)項(xiàng)目體現(xiàn)了這一點(diǎn)。在阿里巴巴國際站中，P4P（PayForPerformance）是廣告產(chǎn)品的重要形式。賣家通過競價(jià)排名，購買產(chǎn)品在搜索List、行業(yè)專區(qū)中的展示位，而網(wǎng)站則根據(jù)廣告的效果向用戶收取費(fèi)用（按照點(diǎn)擊來收費(fèi)）。賣家需要把自己的產(chǎn)品導(dǎo)入如圖1所示的P4P后臺(tái)，并給產(chǎn)品關(guān)聯(lián)上買家在阿里巴巴上可能會(huì)搜索的關(guān)鍵詞，不同的關(guān)鍵詞的價(jià)格不同，賣家需要對(duì)這些關(guān)鍵詞設(shè)置自己的出價(jià)（愿意為一次點(diǎn)擊付出的價(jià)格）。在P4P業(yè)務(wù)中，用戶后臺(tái)的設(shè)計(jì)一直是難點(diǎn)。面對(duì)后臺(tái)各式各樣的操作，用戶不知道哪些操作能夠提升自己的排名，同時(shí)用戶無法直觀地感受到后臺(tái)操作和前臺(tái)效果之間的關(guān)系。這樣，兩方面問題互相影響、惡性循環(huán)，不利于建立P4P平臺(tái)的權(quán)威性和培養(yǎng)用戶操作的積極性。在P4P業(yè)務(wù)里，一個(gè)重要的商業(yè)目標(biāo)就是要提升用戶的操作數(shù)量。如果按照普遍的流程，設(shè)計(jì)師要做的應(yīng)該是等待產(chǎn)品經(jīng)理提出相關(guān)的需求，然后再開始行動(dòng)，那么最終的產(chǎn)出，可能是一到兩個(gè)更漂亮的運(yùn)營活動(dòng)頁面（之前P4P后臺(tái)一直以運(yùn)營活動(dòng)來提升用戶操作，當(dāng)然，這也是一個(gè)有效的辦法）。而如果設(shè)計(jì)師想發(fā)揮更大的作用，用體驗(yàn)解決商業(yè)問題，應(yīng)該怎么辦呢？1.更了解業(yè)務(wù)、技術(shù)，在有限制的條件下設(shè)計(jì)用體驗(yàn)解決商業(yè)問題，首先就不能只從體驗(yàn)出發(fā)。設(shè)計(jì)師提出的方案，不能超越了商業(yè)和技術(shù)的承受范圍。試想設(shè)計(jì)師在感慨產(chǎn)品經(jīng)理“不懂用戶體驗(yàn)”的時(shí)候，說不定產(chǎn)品經(jīng)理也在抱怨設(shè)計(jì)師“不懂技術(shù)”。設(shè)計(jì)師常在提出一個(gè)美妙的方案后得到“這個(gè)沒法做”的技術(shù)反饋，這時(shí)候設(shè)計(jì)師需要根據(jù)遇到的技術(shù)難題來修改設(shè)計(jì)方案。對(duì)于P4P，設(shè)計(jì)師尤其需要做出全面的考慮。首先，在P4P后臺(tái)中，技術(shù)占到一個(gè)比較重要的位置，例如需要程序員開發(fā)計(jì)算眾多關(guān)鍵詞排名的算法。當(dāng)一個(gè)用戶調(diào)整對(duì)關(guān)鍵詞的出價(jià)時(shí)，他是否能排上前5名或者前10名？或者當(dāng)一個(gè)用戶調(diào)整自己每日平均花費(fèi)上線時(shí)，他的賬戶整體預(yù)期效果會(huì)不會(huì)提升？這些技術(shù)可能會(huì)影響到后臺(tái)性能——如果用戶每次都需要等待幾秒鐘才能得到效果數(shù)據(jù)，整體的用戶體驗(yàn)就會(huì)大打折扣。因此，需要增加Loading狀態(tài)以及相應(yīng)的文案，讓用戶意識(shí)到系統(tǒng)正在處理他們的請求，并且禁用其他操作，預(yù)防多個(gè)操作同時(shí)出現(xiàn)，如圖2所示（見下面）。在這種狀況下，設(shè)計(jì)師要習(xí)慣由于技術(shù)和業(yè)務(wù)限制而“帶著腳鐐跳舞”，設(shè)計(jì)師不是藝術(shù)家，本來就應(yīng)該在資源有限的情況下盡量滿足各方的需求。2.以體驗(yàn)的方式實(shí)現(xiàn)商業(yè)目標(biāo)前文已經(jīng)提到，用戶體驗(yàn)也許可以幫助實(shí)現(xiàn)商業(yè)目標(biāo)。在這里需要引入的一個(gè)觀點(diǎn)是，商業(yè)目標(biāo)和用戶體驗(yàn)其實(shí)本就是為了實(shí)現(xiàn)同一個(gè)目的：滿足用戶需求。無論是商業(yè)目標(biāo)還是用戶體驗(yàn)的目標(biāo)，都必須盡量去滿足用戶需求。設(shè)計(jì)師要證明設(shè)計(jì)方案有價(jià)值，就不能單單告訴產(chǎn)品經(jīng)理“用戶體驗(yàn)更好”，而是進(jìn)一步做到“設(shè)計(jì)更好地滿足了用戶需求，從而促進(jìn)了商業(yè)目標(biāo)”。在P4P產(chǎn)品中，我們給用戶提供了產(chǎn)品選擇、關(guān)鍵詞選擇、關(guān)鍵詞調(diào)價(jià)、產(chǎn)品質(zhì)量優(yōu)化等各種功能，但是根據(jù)線上數(shù)據(jù)和實(shí)地調(diào)研結(jié)果顯示，用戶并沒有按照我們所期望的頻率去使用這些工具（涉及商業(yè)原因，數(shù)據(jù)未予展示）。如圖3所示，有些用戶對(duì)質(zhì)量優(yōu)化工具的作用有疑問。是因?yàn)檫@些工具不能幫助用戶達(dá)到目標(biāo)嗎？顯然不是。P4P產(chǎn)品中的各種優(yōu)化工具，如果使用得當(dāng)?shù)脑?，能夠幫助用戶用最少的錢帶來最好的廣告效果。那是什么原因造成了這種現(xiàn)象呢？在網(wǎng)頁調(diào)查的過程中，設(shè)計(jì)師發(fā)現(xiàn)，這些功能的使用方法、使用后的效果，并沒有很好地傳達(dá)給用戶。在一次實(shí)地調(diào)研時(shí)，用戶就因?yàn)闊o法理解產(chǎn)品質(zhì)量在排名中的意義，在我們面前錯(cuò)誤地使用了我們提供的一個(gè)工具。一方面，用戶沒有從頁面上很好地了解工具的使用方法，我們也沒有對(duì)功能和流程進(jìn)行足夠的優(yōu)化讓一切變得簡便；另一方面，用戶沒有得到足夠的數(shù)據(jù)效果反饋，無法對(duì)功能產(chǎn)生認(rèn)同感，很難形成操作習(xí)慣。根據(jù)“新手用戶、中間用戶、專家用戶”的理論，我們沒能很好地引導(dǎo)用戶從新手用戶轉(zhuǎn)變?yōu)橹虚g用戶。找到了問題所在，我們開始討論解決方案。之前，P4P后臺(tái)一直使用彈窗和Banner的形式來刺激用戶使用功能，這兩種方式也在數(shù)據(jù)上取得了比較好的效果。的確，剛進(jìn)入網(wǎng)頁就有一個(gè)彈窗提醒你使用功能，一旦不采納，下次進(jìn)入網(wǎng)頁還會(huì)彈出來，這種情況下有一部分用戶會(huì)選擇點(diǎn)擊那個(gè)醒目的橙色“確認(rèn)”按鈕。不過，采用這種方式，用戶即使點(diǎn)擊了確認(rèn)，使用了功能，其實(shí)還是沒有弄清楚到底P4P產(chǎn)品的各項(xiàng)功能分別是什么。這一點(diǎn)上，P4P后臺(tái)沒有做到“授人以漁”。我們發(fā)現(xiàn)，這似乎是一個(gè)可以用優(yōu)化用戶體驗(yàn)的方式解決的問題。如果我們能夠讓用戶更了解P4P產(chǎn)品，那么用戶的活躍度就會(huì)提升。基于這樣一個(gè)假設(shè)，設(shè)計(jì)師提出了“游戲化”的用戶培育模式。游戲化，簡單來說是指用游戲機(jī)制來解決非游戲場景中的問題，讓用戶在交互中找到樂趣，包括的要素有：成就機(jī)制、獎(jiǎng)勵(lì)機(jī)制、任務(wù)機(jī)制等。例如百度貼吧的連續(xù)簽到、支付寶的搶紅包等，都是典型的游戲化設(shè)計(jì)。對(duì)于P4P后臺(tái)，我們不能設(shè)計(jì)得過于“可愛”，但是這不妨礙我們用游戲化的方式調(diào)動(dòng)用戶的積極性。例如，用更夸張的成功反饋，提升用戶完成任務(wù)時(shí)的愉悅度，這完全是可以做到的。我們的設(shè)計(jì)主要圍繞“任務(wù)機(jī)制”和“獎(jiǎng)勵(lì)機(jī)制”，根據(jù)用戶的不同級(jí)別，設(shè)計(jì)了不同的任務(wù)讓用戶去完成，并給予不同的任務(wù)獎(jiǎng)勵(lì)。如圖4所示，用戶在完成任務(wù)的過程中既熟悉了后臺(tái)的各種操作，也獲得了獎(jiǎng)勵(lì)。為了保證用戶真正了解P4P產(chǎn)品，我們引用了引導(dǎo)游戲新手的做法——邊學(xué)邊做。在這里，新手引導(dǎo)不再是一段需要閱讀的文字或者單純地點(diǎn)擊“下一步”就能略過的Tips。用戶需要以完成任務(wù)為目的去主動(dòng)學(xué)習(xí)P4P產(chǎn)品的使用方式，這樣結(jié)合學(xué)與做，用戶記憶和理解的效果會(huì)遠(yuǎn)勝于單純的閱讀說明（想想有多少用戶在點(diǎn)擊“我知道了”來關(guān)閉窗口時(shí)，是真正“知道”了呢？），如圖5所示。關(guān)于用戶等級(jí)和獎(jiǎng)勵(lì)的劃分，產(chǎn)品經(jīng)理比設(shè)計(jì)師更專業(yè)，因?yàn)樗麄儗?duì)于產(chǎn)品的整體把控要強(qiáng)于設(shè)計(jì)師。眾所周知，游戲的難度設(shè)計(jì)是一個(gè)重點(diǎn)，對(duì)于P4P產(chǎn)品而言更是如此，畢竟用戶的心理預(yù)期是面對(duì)一款嚴(yán)肅的商業(yè)產(chǎn)品，一些調(diào)動(dòng)積極性的互動(dòng)會(huì)很有意思，但是如果任由游戲搶走了用戶真實(shí)任務(wù)的地位，那么游戲化就會(huì)變成累贅，做得越好，越累贅。同樣，盡管要推行游戲化的設(shè)計(jì)思路，但是由于用戶都是比較務(wù)實(shí)的商務(wù)人員，我們也不能奢望一些榮譽(yù)成就，比如“冠軍用戶”或者“P4P專家”這樣的頭銜，能夠打動(dòng)用戶，雖然這些在社交類產(chǎn)品中通常能夠吸引到大批用戶。我們應(yīng)從始至終地貫徹“現(xiàn)金紅包”的實(shí)惠獎(jiǎng)勵(lì)。確定好了方向，一些細(xì)節(jié)上的設(shè)計(jì)，可以讓這個(gè)游戲更“耐玩”一些。因此，我們在設(shè)計(jì)時(shí)遵守了幾條準(zhǔn)則：確保任務(wù)線路要短，減少用戶中途中斷的可能性；在用戶主動(dòng)觸發(fā)任務(wù)時(shí)才展示，而不是強(qiáng)制讓用戶參與；保證游戲化與P4P產(chǎn)品主要功能的獨(dú)立性，即使用戶不參與任務(wù)，也能完整地使用P4P產(chǎn)品。目前，游戲化的P4P培育模式已經(jīng)上線，并取得了很好的效果。數(shù)據(jù)顯示有效操作的用戶人數(shù)提升了很多，客戶服務(wù)端也表示用戶反饋較好。運(yùn)用設(shè)計(jì)思維解決商業(yè)問題，我們不敢斷言一定會(huì)取得成功，但是這讓我們看到了設(shè)計(jì)與業(yè)務(wù)合作的更多可能，正如文章開頭所說，絕不僅僅只有界面層的優(yōu)化。希望對(duì)您有所啟發(fā)。作者郵箱：xuyuan.xiangxy@設(shè)計(jì)需求分析及模板文/姜俊科學(xué)的設(shè)計(jì)過程可以體現(xiàn)設(shè)計(jì)價(jià)值。在設(shè)計(jì)中，需求分析是重要且必需的，是對(duì)用戶和商業(yè)深入理解的過程，只有弄清楚商業(yè)目標(biāo)和用戶訴求，才能形成正確的設(shè)計(jì)假設(shè)，定義用戶需要的體驗(yàn)感受，就如KellyHoppen（凱麗赫本）所說：“我很擅長于想像人們可能希望在這個(gè)空間中感受什么，設(shè)計(jì)不只是放一個(gè)床墊或者放一把椅子那么簡單，需要考慮整個(gè)空間會(huì)是怎樣的，并且還要想象人們在那個(gè)空間中會(huì)有怎樣的感覺，我認(rèn)為這就是你確保設(shè)計(jì)成功的辦法。”設(shè)計(jì)是理性的思考、感性的表達(dá)，設(shè)計(jì)的最終目的是解決問題，設(shè)計(jì)需要“超以象外，得其圓中”的思考。在商業(yè)設(shè)計(jì)活動(dòng)中，設(shè)計(jì)要驅(qū)動(dòng)業(yè)務(wù)增長，只有設(shè)計(jì)才能讓100萬增值到1000萬。讓設(shè)計(jì)產(chǎn)生溢價(jià)是設(shè)計(jì)的目標(biāo)之一。好的設(shè)計(jì)要從科學(xué)的需求分析開始。本文向大家介紹一套設(shè)計(jì)模板，包括需求分析思路、模板結(jié)構(gòu)等內(nèi)容。我們從設(shè)計(jì)流程開始了解，它包括：Idea、ConceptualDesign、Kickoff、DetailedDesign、Development、Test、Release，如圖1所示。圖作者：王哲歆本文所講的需求分析思路是在Idea和ConceptualDesign（Checkpoint1）階段，設(shè)計(jì)文檔模板應(yīng)用在DetailedDesign階段，其他節(jié)點(diǎn)內(nèi)容不是本文重點(diǎn)。了解設(shè)計(jì)需求分析在設(shè)計(jì)流程中所處的位置，我們再看設(shè)計(jì)需求分析本身的思維框架。1.商業(yè)方面明確商業(yè)目標(biāo)。明確商業(yè)目標(biāo)要理解：需求來源（背景）、現(xiàn)狀（定性定量）。2.用戶方面明確用戶目標(biāo)（訴求）。用戶目標(biāo)得出過程是：找出目標(biāo)用戶，形成用戶訴求。3.設(shè)計(jì)方面（1）形成設(shè)計(jì)假設(shè)。形成設(shè)計(jì)假設(shè)要理解：原始商業(yè)目標(biāo)、原始商業(yè)假設(shè)、用戶訴求。補(bǔ)充一下，為什么說是假設(shè)呢？因?yàn)樵谖幢蛔C明正確有效之前，我們都認(rèn)為這是假設(shè)。（2）明確設(shè)計(jì)關(guān)鍵點(diǎn)。設(shè)計(jì)關(guān)鍵點(diǎn)得出過程：設(shè)計(jì)假設(shè)、所有使用場景、形成典型場景、分解用戶任務(wù)、推導(dǎo)設(shè)計(jì)關(guān)鍵點(diǎn)。需要注意的是，設(shè)計(jì)關(guān)鍵點(diǎn)是優(yōu)先考慮用戶主任務(wù)，這也影響了視覺設(shè)計(jì)的層次表達(dá)。（3）明確產(chǎn)生的現(xiàn)象和指標(biāo)。指標(biāo)不僅是商業(yè)指標(biāo)，還包括用戶行為和態(tài)度指標(biāo)，指標(biāo)是量化可衡量的，它可設(shè)定為“目標(biāo)類型+產(chǎn)生的現(xiàn)象+具體指標(biāo)”，例如，易用性，提升發(fā)布表單填寫完整率至90%；效率，提升用戶填寫表單用時(shí)從3分鐘縮短至2分鐘。以上就是設(shè)計(jì)需求分析思路，概括起來如圖2所示。另外，評(píng)估指標(biāo)方面，因不是本文的重點(diǎn)，只做簡單描述，其評(píng)估的維度包括以下方面，如圖3所示?！袢蝿?wù)完成維度（Tasksuccess）●接受維度（Adoption）●留存維度（Retention）●情感愉悅維度（Happiness）●產(chǎn)品（品牌）認(rèn)知維度（Identification）設(shè)計(jì)需求分析思路對(duì)應(yīng)到設(shè)計(jì)文檔結(jié)構(gòu)，如圖4所示。基于以上的分析思路和設(shè)計(jì)文檔結(jié)構(gòu)，現(xiàn)通過一個(gè)應(yīng)用實(shí)例幫助大家更好地理解，不用太關(guān)注應(yīng)用案例的細(xì)節(jié)，因?yàn)樾枰Y(jié)合業(yè)務(wù)背景才能理解，如圖5至圖9所示。以上案例文檔結(jié)構(gòu)比較完整，比較適合一個(gè)大型的或新的業(yè)務(wù)項(xiàng)目，我們在日常工作中多數(shù)為快速迭代的中小型項(xiàng)目，為提高設(shè)計(jì)效率，我們通常會(huì)簡明扼要地呈現(xiàn)設(shè)計(jì)分析過程，如圖10所示。從簡版設(shè)計(jì)文檔中可以發(fā)現(xiàn)，只是呈現(xiàn)的簡化，設(shè)計(jì)分析其實(shí)是完整的，其中包括：背景、目標(biāo)、用戶路徑、設(shè)計(jì)關(guān)鍵點(diǎn)、頁面框架、衡量指標(biāo)、可能的風(fēng)險(xiǎn)。層層分解，層層關(guān)聯(lián)，一頁就能看明白分析的邏輯。需要說明一下，其中的“頁面框架”和“可能的風(fēng)險(xiǎn)”，這兩塊其實(shí)不在設(shè)計(jì)需求分析環(huán)節(jié)內(nèi)，它是具體設(shè)計(jì)階段的工作，有些側(cè)重呈現(xiàn)整體方案的要點(diǎn)。我們?nèi)粘９ぷ髦薪?jīng)常遇到的是頁面、頻道改版類項(xiàng)目，側(cè)重用戶認(rèn)知和行動(dòng)轉(zhuǎn)化率。這里也給大家展示一個(gè)頁面瀏覽型案例的設(shè)計(jì)分析過程作為參考，新奇頻道首頁設(shè)計(jì)案例，如圖11至圖14所示。競品分析。通過商業(yè)假設(shè)關(guān)鍵點(diǎn)和競品分析，設(shè)計(jì)思考如圖14所示。頁面中這些模塊是常見的，看似普通的背后卻有著深入的思考和定義。這些設(shè)計(jì)分析思路需要多多實(shí)踐，萬變不離其宗。請記住，度的把握是不同設(shè)計(jì)師之間的變量。設(shè)計(jì)分析過程是方案的一部分，設(shè)計(jì)方案需要有文檔格式，作為UED團(tuán)隊(duì)也有必要統(tǒng)一輸出格式，我們制定了設(shè)計(jì)文檔模板和標(biāo)注規(guī)范，如圖15至圖21所示。最后，需求分析是設(shè)計(jì)思維的體現(xiàn)，我們需要有意識(shí)地練習(xí)并提升這種從具象到抽象的歸納能力，再從抽象到具象的應(yīng)用能力，把握本質(zhì)舉一反三。我們在提升設(shè)計(jì)效率方面建立了DPL庫，把基礎(chǔ)通用和業(yè)務(wù)組件封裝固化，這樣就可以把具體“做”的時(shí)間減到最少，把更多精力放在設(shè)計(jì)分析和研究中，一起努力吧！特別感謝：謝孟庭、楊文波、曹逸、王哲歆、毛并楠，沒有他們的案例和幫助本次分享不能形成，謝謝！作者郵箱：6116306@如何做好交互設(shè)計(jì)的專家評(píng)審文/曹逸無論身處哪一個(gè)UED團(tuán)隊(duì)之中，交互設(shè)計(jì)師在完成交互稿后都會(huì)面臨各種各樣的設(shè)計(jì)評(píng)審，有UED成員參與的內(nèi)部評(píng)審，也有整個(gè)項(xiàng)目成員參與的外部評(píng)審等。一般來說，內(nèi)部評(píng)審作為把控交互產(chǎn)出的第一道關(guān)卡，必須要能夠高效、精準(zhǔn)地給出評(píng)審意見。這樣一方面可以提高交互稿的產(chǎn)出質(zhì)量，增加外部評(píng)審的一次通過率；另一方面也可以幫助設(shè)計(jì)師們在評(píng)審中提高自身的專業(yè)水平。在阿里巴巴國際站UED的日常工作流程中，根據(jù)使用場景的不同，交互設(shè)計(jì)的組內(nèi)評(píng)審會(huì)有不同方式：站內(nèi)評(píng)審、郵件評(píng)審、專家評(píng)審……在本章節(jié)中，我們會(huì)著重介紹專家評(píng)審這種方式。作為組內(nèi)評(píng)審的一種方式，專家評(píng)審擁有評(píng)審結(jié)果客觀、精準(zhǔn)等諸多優(yōu)點(diǎn)。那么，該如何做好一場專家評(píng)審呢？一、什么是專家評(píng)審在進(jìn)入專家評(píng)審的流程之前，首先要了解什么是專家評(píng)審。專家評(píng)審由“協(xié)作式啟發(fā)性評(píng)估（CollaborativeHeuristicEvaluation）”的方法演變而來，它的核心目的是通過檢查現(xiàn)有產(chǎn)品（或原型），找出用戶在與之交互的過程中可能遇到的所有可用性問題。一般而言，該方法適用于所有中、大型項(xiàng)目，如果時(shí)間充裕，小型項(xiàng)目也可以采用。二、評(píng)審前的準(zhǔn)備階段在進(jìn)行專家評(píng)審之前，被評(píng)審人需要提前準(zhǔn)備好以下事項(xiàng)。1.采集并明確目標(biāo)用戶的相關(guān)信息。2.梳理出目標(biāo)用戶需要通過該產(chǎn)品（或原型）完成的相關(guān)任務(wù)。對(duì)于第一條而言，我們往往采用用戶素描（Persona）的方式來對(duì)采集好的用戶信息進(jìn)行展示，在此就不做過多的展開；對(duì)于第二條，有多種方法可以選擇，包括故事板（StoryBoard）、用例（UseCase）、情景板（ScenarioBoard）等。一般來說，如果用戶通過產(chǎn)品（或原型）需要完成的任務(wù)不止一個(gè)，則按照任務(wù)的優(yōu)先級(jí)來進(jìn)行排序——優(yōu)先考慮主要場景下的主要任務(wù)。三、評(píng)審中的進(jìn)行階段第一步，被評(píng)審人召集3～5個(gè)UED的小伙伴（包括被評(píng)審人自己）充當(dāng)專家評(píng)審員，大家尋覓一個(gè)不受干擾的場所（如會(huì)議室等私密空間）進(jìn)行接下來的評(píng)審工作。第二步，被評(píng)審人將準(zhǔn)備階段中準(zhǔn)備好的目標(biāo)用戶信息及需要完成的相關(guān)任務(wù)告知每一位專家評(píng)審員，即“什么樣的人”通過待評(píng)審的原型要完成“什么樣的任務(wù)”。第三步，從除了被評(píng)審人以外的專業(yè)評(píng)審員中選出一位充當(dāng)“駕駛員（Driver）”，負(fù)責(zé)將之前定義好的相關(guān)任務(wù)作為目標(biāo)，來使用被評(píng)估的產(chǎn)品（或原型）。在執(zhí)行所有任務(wù)的整個(gè)過程中，被評(píng)審人不能提示駕駛員如何完成任務(wù)或達(dá)成目標(biāo)，但其他專家評(píng)審員可以要求駕駛員執(zhí)行一些和達(dá)成任務(wù)相關(guān)的交互動(dòng)作，比如“我覺得點(diǎn)擊那個(gè)按鈕可以進(jìn)入下一步操作，請點(diǎn)一下試試”，如圖1所示。第四步，在駕駛員使用產(chǎn)品的過程中，任何一位專家評(píng)審員都可以在任意時(shí)刻打斷并提出一個(gè)他所發(fā)現(xiàn)的可用性問題，如：“我覺得這個(gè)按鈕太不明顯了，用戶根本發(fā)覺不了”。問題提出以后評(píng)審員們需要商量一下應(yīng)該如何恰當(dāng)?shù)孛枋鲈搯栴}，然后由被評(píng)審人將這個(gè)問題記錄下來。比如之前的例子，最終可能會(huì)以“詳情頁面上的主行動(dòng)點(diǎn)太弱，用戶無法感知”的形式被記錄下來。第五步，記錄完成后被評(píng)審人可以將所有問題按順序標(biāo)上序號(hào)，寫成小卡片并粘在墻上，方便所有的評(píng)審員查看，如圖2所示。在這之后即進(jìn)入到打分環(huán)節(jié)，由每一位專家評(píng)審員結(jié)合目標(biāo)用戶的相關(guān)信息和需要完成的任務(wù)，對(duì)所有貼在墻上的可用性問題的嚴(yán)重性進(jìn)行打分。這里需要注意的是，打分環(huán)節(jié)中每位專家評(píng)審員不要交頭接耳，而是應(yīng)該獨(dú)立客觀的對(duì)每一個(gè)問題的嚴(yán)重性進(jìn)行打分，打分標(biāo)準(zhǔn)如下。0分：該問題無任何嚴(yán)重性，在打分者看來完全不存在可用性問題。1分：該問題有輕微的嚴(yán)重性，雖不影響用戶完成預(yù)定任務(wù)，但無法實(shí)現(xiàn)效率最大化。2分：該問題有一定的嚴(yán)重性，雖不影響用戶完成預(yù)定任務(wù)，但效率（或準(zhǔn)確率）低下，用戶體驗(yàn)不夠良好。3分：該問題較嚴(yán)重，用戶在某些情況或場景下無法順利完成預(yù)定任務(wù)。4分：該問題非常嚴(yán)重，直接導(dǎo)致用戶有極大的可能性無法順利完成預(yù)定任務(wù)。打分完成后，由被評(píng)審人負(fù)責(zé)整理和記錄所有問題的分?jǐn)?shù)，如圖3所示。如果有專家評(píng)審員打出了較高的分?jǐn)?shù)（大于或等于2分），可以順便寫下針對(duì)該問題的解決方案（如果當(dāng)時(shí)想到了的話）。四、評(píng)審后的統(tǒng)計(jì)和分析階段當(dāng)整個(gè)評(píng)審環(huán)節(jié)完成后，被評(píng)審人需要對(duì)專家評(píng)審員提出的所有的問題及嚴(yán)重性打分進(jìn)行整理和分析，往往采用如下表所示的形式進(jìn)行統(tǒng)計(jì)。其中的“序號(hào)”是所有記錄下來的問題序號(hào)?！皢栴}描述”就是被評(píng)審者對(duì)該問題的解釋說明，通常將專家評(píng)審員較口語化的語言轉(zhuǎn)換為更為書面的文字?！八陧撁妗敝傅氖窃搯栴}在產(chǎn)品（或原型）中所處的位置，可以用諸如“首頁”、“列表頁”、“詳情頁”等進(jìn)行說明?！蔼?dú)立打分”一般根據(jù)專家評(píng)審員的數(shù)量被縱向分割為若干列，如果一共有3位評(píng)審員，則分為3列，以此類推。每一列中的數(shù)字代表了每一位評(píng)審員的獨(dú)立打分?！捌骄帧笔菍⑺性u(píng)審員的獨(dú)立打分取均值。需要注意的是，如果使用Excel等工具來記錄問題和分?jǐn)?shù)，可以在“平均分”這一列加入計(jì)算公式，這樣可以更高效地完成統(tǒng)計(jì)和分析工作?！胺讲睢奔赐ㄟ^計(jì)算，求得某一行所有獨(dú)立打分的方差數(shù)值。和“平均分”類似，被評(píng)審員也可以通過在列表中加入公式的方法來高效完成計(jì)算工作。列表的最后一列是“建議的解決方案”，這一列并不是必填項(xiàng)，只有當(dāng)提出問題的專家評(píng)審員恰好想到了解決問題的方案時(shí)，才會(huì)由被評(píng)審員記錄下來，作為未來優(yōu)化產(chǎn)品（或原型）的參考。完成了所有的統(tǒng)計(jì)工作后，開始進(jìn)入列表的分析階段。重點(diǎn)需要分析的數(shù)值有兩個(gè)——“平均分”和“方差”。首先，所有平均分大于或等于2分的問題（高嚴(yán)重性問題），都需要被評(píng)審人特別關(guān)注，因?yàn)檫@類問題往往具有比較嚴(yán)重的可用性問題，需要進(jìn)行優(yōu)化或修改。其次，方差大于或等于2的問題需要由被評(píng)審人考慮是否需要進(jìn)行重新評(píng)審，因?yàn)楦髟u(píng)審員對(duì)該問題的嚴(yán)重性打分有著較大的分歧。重新評(píng)審時(shí)既可以由被評(píng)審人根據(jù)自己的經(jīng)驗(yàn)并結(jié)合產(chǎn)品的實(shí)際情況來給該問題最終定性（低嚴(yán)重性或高嚴(yán)重性），也可以由被評(píng)審人和專家評(píng)審們再次溝通（通常由專家評(píng)審們闡述自己打分的原因及依據(jù)），重新確定這類問題的最終打分。五、優(yōu)化設(shè)計(jì)根據(jù)上一環(huán)節(jié)中統(tǒng)計(jì)和分析的最終結(jié)果，被評(píng)審者制訂出優(yōu)化產(chǎn)品（或原型）的設(shè)計(jì)方案。該設(shè)計(jì)方案應(yīng)該能夠很好地解決所有高嚴(yán)重性的可用性問題，并應(yīng)以郵件或其他形式通知到之前參加評(píng)審的其他專家評(píng)審員，確保該方案的合理性得到他們的認(rèn)可。作者郵箱：caoyi.cy@理論到實(shí)踐讓你的界面有視覺層次文/陳雪梅人眼在觀察外界事物時(shí)，并不是一次性完成的。比如圖1中的兩張圖，（a）為相機(jī)拍攝的效果，（b）為人眼不移動(dòng)時(shí)看到的效果?？梢园l(fā)現(xiàn)，人眼不能同時(shí)產(chǎn)生多個(gè)焦點(diǎn)，把視線停留在多個(gè)地方，所以設(shè)計(jì)師需要考慮的是讓用戶通過眼球移動(dòng)，按照一定的順序獲取信息，幫助用戶高效自然地獲取和理解信息。要想讓我們設(shè)計(jì)的界面能抓住用戶眼球，讓用戶有興趣了解更詳細(xì)的內(nèi)容，一步步遞進(jìn)，那么，界面本身需要有清晰的視覺層次，而不能憑感覺以漂亮為目的來進(jìn)行設(shè)計(jì)。本文會(huì)分成兩部分，一是做到界面有視覺層次不可缺少的前期分析環(huán)節(jié)，二是通過一個(gè)具體的項(xiàng)目來看看實(shí)踐的過程。一、前期了解和分析在開始設(shè)計(jì)前，除了對(duì)項(xiàng)目本身的背景目標(biāo)有所了解外，視覺設(shè)計(jì)師也需要了解一些具體的頁面內(nèi)容以把握后面設(shè)計(jì)的指導(dǎo)方向，包括頁面定位、氛圍營造、信息優(yōu)先級(jí)和用戶核心行為。1.頁面定位頁面定位是幫助分析頁面信息優(yōu)先級(jí)、核心行為的前提，通常包括以下幾方面?！裼脩羰钦l？●用戶來自哪里，即從什么渠道來到該頁面？●頁面內(nèi)容定位，提供什么、不提供什么？●頁面作用。舉個(gè)例子：我們在設(shè)計(jì)網(wǎng)站一個(gè)服務(wù)的新首頁時(shí)，雖然頁面是給新老買家共用的，但我們通過分析當(dāng)時(shí)平臺(tái)用戶對(duì)服務(wù)的熟知度，發(fā)現(xiàn)大部分新用戶對(duì)服務(wù)本身還不太了解，而有一定熟知度的老用戶一般會(huì)通過其他入口參與行為，所以確定了首頁最核心的目標(biāo)用戶是新買家。明確了目標(biāo)用戶，就知道該提供什么內(nèi)容給他們。對(duì)于新用戶來說，讓其了解服務(wù)的利益點(diǎn)，介紹并做出第一次行動(dòng)來感知服務(wù)帶來的效果，是核心的目標(biāo)。這部分分析會(huì)有PD、更多的交互參與并給出分析的結(jié)論，但視覺也需要了解，并知道分析的過程。2.了解頁面需要營造的氛圍它能幫助我們判斷哪些元素能達(dá)到目標(biāo)。氛圍可以通過內(nèi)容本身來營造，也可以通過視覺元素設(shè)計(jì)來營造，但必須注意營造的氛圍不應(yīng)強(qiáng)過用戶關(guān)注的內(nèi)容本身。氛圍可能有：●新年主題大促●低折扣●信息鮮活●用戶活躍等圖2是我們團(tuán)隊(duì)大促活動(dòng)的正式頁面，圖2-a延續(xù)了預(yù)熱期嘉年華的氛圍，但到活動(dòng)開始階段氛圍已經(jīng)不是重點(diǎn)，用戶更關(guān)心商品及折扣本身，圖2-b為調(diào)整后將氛圍的營造和類目圖片相結(jié)合的效果，很好地解決了氛圍和內(nèi)容的關(guān)系問題。3.分析信息優(yōu)先級(jí)（1）一級(jí)信息吸引用戶。假設(shè)用戶只會(huì)在這個(gè)頁面停留3～5秒，最能夠吸引用戶繼續(xù)瀏覽的是頁面的核心賣點(diǎn)，是一級(jí)信息，它必須少而精，在設(shè)計(jì)上要重點(diǎn)展示。（2）二級(jí)信息幫助理解。有了一級(jí)信息的吸引，用戶進(jìn)一步了解內(nèi)容可能會(huì)停留3～5分鐘，這時(shí)展示二級(jí)信息，即提煉的精華內(nèi)容，幫助用戶在盡量短的時(shí)間內(nèi)理解信息。（3）三級(jí)信息詳細(xì)了解。前兩類信息基本上能幫助用戶獲取足夠的信息，用戶如果繼續(xù)停留更長的時(shí)間去詳細(xì)了解，這類信息會(huì)更多，在設(shè)計(jì)上視覺層級(jí)會(huì)靠后，或通過交互方式展示、提供入口跳轉(zhuǎn)。信息分級(jí)如圖3所示。4.分析用戶核心行為不同類型用戶會(huì)在不同階段產(chǎn)生行為，需要在適當(dāng)?shù)碾A段出現(xiàn)合適的內(nèi)容，最終導(dǎo)向的都應(yīng)該是核心行為，如圖4所示。（1）第一類用戶已經(jīng)非常了解產(chǎn)品，來到頁面后不需要查看主體內(nèi)容也會(huì)產(chǎn)生行為，這個(gè)行為可以稱為該頁面的核心行為，針對(duì)它設(shè)計(jì)的入口必須能被快速找到，如商品詳細(xì)頁面的購買按鈕。（2）第二類用戶屬于有一定意愿的，他會(huì)先看一些提煉的信息，然后產(chǎn)生核心行為。（3）第三類用戶會(huì)對(duì)詳細(xì)的信息進(jìn)行全面了解后再?zèng)Q定是否行動(dòng)，如用戶在決定購買商品前會(huì)查看評(píng)價(jià)、查看歷史交易等行為，但這些行為最終是為了導(dǎo)向“購買”這個(gè)核心行為。有了這些分析，視覺設(shè)計(jì)前我們會(huì)先確定大模塊的信息優(yōu)先級(jí)和用戶行為優(yōu)先級(jí)，如圖5所示。在進(jìn)行細(xì)節(jié)設(shè)計(jì)前，視覺還需要對(duì)每個(gè)模塊內(nèi)的具體內(nèi)容進(jìn)行優(yōu)先級(jí)的分析，產(chǎn)出如圖6所示的示意圖并和交互設(shè)計(jì)師及業(yè)務(wù)方確認(rèn)，這些都是幫助視覺設(shè)計(jì)過程不偏離方向的重要產(chǎn)出物。二、MyAlibaba后臺(tái)導(dǎo)航改版實(shí)例2012年第三季度時(shí)，我們有個(gè)項(xiàng)目是對(duì)海外賣家版MyAlibaba（以下簡稱MA）首頁進(jìn)行改版，當(dāng)時(shí)MA后臺(tái)的視覺已有規(guī)范，但很陳舊，如圖7所示。如果按照原來的規(guī)范進(jìn)行設(shè)計(jì)，也能順利地完成需求，但我們的前臺(tái)頁面經(jīng)過2012年轟轟烈烈地改版已經(jīng)有了全新的面貌，風(fēng)格也趨向于平面、寬松、簡約，后臺(tái)還是多年未變的樣式，體驗(yàn)相對(duì)陳舊而且不統(tǒng)一，同時(shí)集團(tuán)提出workinAlibaba的概念，也是時(shí)候?qū)笈_(tái)進(jìn)行一些改版優(yōu)化了。當(dāng)然統(tǒng)一視覺風(fēng)格不是發(fā)起一個(gè)改版項(xiàng)目的唯一目的，最根本的目的是要分析目前界面存在的問題，通過解決問題對(duì)界面進(jìn)行優(yōu)化。我把當(dāng)前的MA后臺(tái)的大多數(shù)頁面分為兩個(gè)模塊：一級(jí)二級(jí)導(dǎo)航區(qū)、內(nèi)容操作區(qū)。從縮略圖可以看出，目前的設(shè)計(jì)導(dǎo)航區(qū)的視覺層級(jí)高于內(nèi)容操作區(qū)，如圖8所示。為了重新確定界面視覺層級(jí)，先問自己三個(gè)問題并回答：從以上問題的解答可初步得出結(jié)論：MA后臺(tái)的導(dǎo)航并不是用戶來到后臺(tái)首要關(guān)注的元素，它是可以弱化的，但要固定導(dǎo)航的位置，同時(shí)清晰表達(dá)當(dāng)前的位置。為了驗(yàn)證這個(gè)分析思路的合理性，我們還需要看看其他網(wǎng)站的做法。1.支付寶首頁的改版。如圖9所示，老版的支付寶首頁視覺層級(jí)最高的是導(dǎo)航及推廣的活動(dòng)。但是，來到支付寶首頁最常用的功能是什么？作為老用戶，我們主要是進(jìn)行登錄操作。新版首頁針對(duì)新用戶強(qiáng)調(diào)了支付寶的核心價(jià)值，針對(duì)老用戶強(qiáng)調(diào)登錄操作，而原先視覺層級(jí)很高的導(dǎo)航被弱化，但仍然不失導(dǎo)航的作用。2.Google+界面。Google+界面是典型的以內(nèi)容為中心，導(dǎo)航在左側(cè)被弱化，但用戶需要切換時(shí)也能快速找到，同時(shí)也清晰地表明了當(dāng)前的位置，如圖10所示。經(jīng)過前面的界面分析及競品分析，后面就可以根據(jù)得出的結(jié)論進(jìn)行設(shè)計(jì)了。在設(shè)計(jì)過程中，視覺需要解決的主要問題是：導(dǎo)航被弱化后，如何才能做到內(nèi)容和導(dǎo)航的分離，使用戶來到MA后臺(tái)后，能快速定位到自己關(guān)注的內(nèi)容模塊。我們也前后嘗試了好幾種方案來達(dá)到這個(gè)目的。版本1：將一級(jí)導(dǎo)航和頁頭統(tǒng)一用灰色底，形成一個(gè)整體，和內(nèi)容分離，如圖11所示。版本2：將導(dǎo)航弱化成灰色，100%通欄設(shè)計(jì)，如圖12所示。最后，我們考慮到MA首頁及子頁面的適用性，得出設(shè)計(jì)終稿，如圖13所示。在項(xiàng)目推進(jìn)過程中，因?yàn)楹笈_(tái)涉及多個(gè)業(yè)務(wù)方，而且導(dǎo)航的視覺層級(jí)從原來最高降到較低，變化很大，大家雖然覺得前面的分析很有道理，但還是不免擔(dān)心因?yàn)橐曈X層級(jí)降低，用戶找不到導(dǎo)航?；跇I(yè)務(wù)方及用戶的接受度，我們借助用研團(tuán)隊(duì)的在線調(diào)研工具來驗(yàn)證哪個(gè)設(shè)計(jì)更優(yōu)。用研同事選取了上千名海外用戶，將新老版本圖片平均分別發(fā)給用戶，并設(shè)置了兩項(xiàng)任務(wù)：1.首先看到的是MA首頁，需要對(duì)自己的產(chǎn)品進(jìn)行管理，讓用戶點(diǎn)擊圖片上的區(qū)域（驗(yàn)證一級(jí)導(dǎo)航）。2.進(jìn)入產(chǎn)品管理頁面，用戶需要發(fā)布新產(chǎn)品，再次點(diǎn)擊（驗(yàn)證二級(jí)導(dǎo)航）。從調(diào)研結(jié)果看：在內(nèi)容定位上，新版本導(dǎo)航用戶點(diǎn)擊率高于老版本，如圖14所示。用戶尋找導(dǎo)航的速度，新版本也大大快于老版本，如圖15所示。用研的數(shù)據(jù)，驗(yàn)證了新設(shè)計(jì)的體驗(yàn)更優(yōu)于老版本，對(duì)之后我們推進(jìn)這個(gè)設(shè)計(jì)方案落地執(zhí)行并上線，給予了很大的幫助。這個(gè)項(xiàng)目整個(gè)過程比較完整，我同時(shí)扮演了一次項(xiàng)目經(jīng)理的角色，從項(xiàng)目發(fā)起到最終上線全程牽頭，受益很多，讓我看到如何從視覺專業(yè)角度想辦法促進(jìn)產(chǎn)品體驗(yàn)。我們的設(shè)計(jì)是可被衡量的，我們也可以主導(dǎo)發(fā)起需求，來提升用戶體驗(yàn)甚至促進(jìn)業(yè)務(wù)目標(biāo)達(dá)成。同時(shí)，視覺設(shè)計(jì)師的價(jià)值不僅僅是把界面做得漂亮，更重要的是通過視覺設(shè)計(jì)引導(dǎo)用戶的瀏覽路徑，提高用戶獲取和理解信息的效率，這樣才能對(duì)用戶、對(duì)業(yè)務(wù)有可衡量的作用。作者郵箱：42261647@用戶難觸及？數(shù)據(jù)幫你大膽假設(shè)，小心求證文/王中在時(shí)間人力成本都有限的前提下，如何快速抓準(zhǔn)海外用戶的真實(shí)訴求？在前期無法充分驗(yàn)證設(shè)計(jì)提案的情況下，如何保證設(shè)計(jì)的有效性？在每日上百萬訪問量的壓力下，如何降低設(shè)計(jì)改版帶來的體驗(yàn)過渡風(fēng)險(xiǎn)？希望通過A網(wǎng)站的產(chǎn)品詳情頁面的一次改版設(shè)計(jì)，來解答上述問題，總結(jié)“有效的數(shù)據(jù)分析”，給設(shè)計(jì)師寶貴的指引。一、為何改版——數(shù)據(jù)大膽假設(shè)用戶痛點(diǎn)在做任何一次產(chǎn)品改版之前，業(yè)務(wù)方和設(shè)計(jì)方需要共同明確改版的目標(biāo)和方式。我們往往會(huì)碰到一些改版動(dòng)機(jī)不清晰的情況，甚至還會(huì)有為了改版而改版的極端案例。因此，在投入具體改版設(shè)計(jì)之前，我們需要有理有據(jù)地分析確定改版需要解決哪些問題。而互聯(lián)網(wǎng)產(chǎn)品快速迭代的特性，往往容不得我們在前期投入大量時(shí)間、人力成本，來針對(duì)市場和用戶進(jìn)行的大量的調(diào)研和分析驗(yàn)證，特別是針對(duì)海外用戶的產(chǎn)品，直接接觸用戶的成本更高，如何在最短的時(shí)間抓準(zhǔn)用戶的訴求和痛點(diǎn)是設(shè)計(jì)師在真正設(shè)計(jì)前要思考的重中之重。好在對(duì)于單頁面的設(shè)計(jì)，數(shù)據(jù)往往是我們的利器。單頁面的數(shù)據(jù)獲取成本低，且能反映的用戶行為情況較為全面，能快速幫助我們識(shí)別用戶在使用產(chǎn)品時(shí)碰到的痛點(diǎn)。在這個(gè)階段，設(shè)計(jì)師需要基于用戶在該頁面的訴求目標(biāo)（快速找到自己中意的產(chǎn)品）梳理出用戶核心的行為路徑，再對(duì)應(yīng)找出能反映這些行為路徑使用情況的數(shù)據(jù)指標(biāo)。例如在產(chǎn)品詳情頁面改版前期，我們會(huì)和業(yè)務(wù)方一起將頁面沉淀的所有數(shù)據(jù)梳理出來，如圖1所示。從目標(biāo)用戶出發(fā)，將用戶初步劃分為兩種，一種是在網(wǎng)站其他場景，如產(chǎn)品列表頁，初步篩選了一輪產(chǎn)品的用戶，另一種是未初步篩選產(chǎn)品的用戶，如SEO直接Landing到產(chǎn)品詳情頁的用戶。兩種用戶到達(dá)該頁面的動(dòng)機(jī)和行動(dòng)都不相同，我們將不同的行為總結(jié)成用例（UserCase），并將能反映用例情況的頁面內(nèi)容和功能的點(diǎn)擊率、轉(zhuǎn)化率以及上下游頁面等各方面的數(shù)據(jù)列舉出來，推斷出現(xiàn)在頁面的主要問題以及可能的原因，比如從數(shù)據(jù)上發(fā)現(xiàn)，頁面底部的推薦模塊點(diǎn)擊率很高，如圖2所示，而SEO渠道的用戶首屏蹦失率偏高，因此可以做出假設(shè)——首次Landing用戶（特別是SEO渠道用戶），對(duì)當(dāng)前產(chǎn)品不滿意的情況很多并無法快速找到其他產(chǎn)品?；谶@些分析假設(shè)，我們接下來就可以和業(yè)務(wù)方一起討論如何解決這些痛點(diǎn)。二、如何改版——數(shù)據(jù)小心求證，修正設(shè)計(jì)明確了改版的目標(biāo)和基本解決方案，落到具體設(shè)計(jì)層面，設(shè)計(jì)師的個(gè)人經(jīng)驗(yàn)為我們提供了有效預(yù)測的能力，但我們也要時(shí)常保持懷疑態(tài)度，特別是面對(duì)百萬訪問量的產(chǎn)品，一個(gè)設(shè)計(jì)判斷失誤對(duì)用戶體驗(yàn)的負(fù)面影響不可估量。因此我們需要借助小量數(shù)據(jù)迭代驗(yàn)證的方法來保證設(shè)計(jì)的最終質(zhì)量。我們在這次改版的設(shè)計(jì)初期，由于忽略了用戶習(xí)慣的力量，就遇到了類似的經(jīng)驗(yàn)判斷不準(zhǔn)的情況。為了讓用戶更清晰地獲取供貨信息，也為了日后的拓展性，我們嘗試打破現(xiàn)在的頁面框架，采用類似Amazon的框架結(jié)構(gòu)，將信息和行動(dòng)區(qū)左右分隔，如圖3所示。但因?yàn)檫@種設(shè)計(jì)的變動(dòng)很大，作為設(shè)計(jì)師必須提高警惕，避免判斷錯(cuò)誤，因此我們沒有全量上線而是選取了很小部分的流量來進(jìn)行A/B測試，監(jiān)控用戶在頁面中核心行為的數(shù)據(jù)變化。數(shù)據(jù)的真實(shí)情況出乎我們的意料。新的結(jié)構(gòu)讓老用戶和新用戶的正向行動(dòng)率都有所下降。而當(dāng)我們恢復(fù)回原來的頁面結(jié)構(gòu)時(shí)，行動(dòng)率也隨之上升。回過頭來反思，這大概就是用戶習(xí)慣的威力。我們對(duì)海外主要電商網(wǎng)站的頁面結(jié)構(gòu)進(jìn)行了競爭分析，如圖4所示。兩種頁面結(jié)構(gòu)都存在，但還是前一種結(jié)構(gòu)占主流。這也許就是為什么我們結(jié)構(gòu)的調(diào)整會(huì)讓用戶難以接受，甚至新用戶的接受度更低。除了大框架設(shè)計(jì)的數(shù)據(jù)驗(yàn)證，設(shè)計(jì)細(xì)節(jié)的數(shù)據(jù)驗(yàn)證也是必不可少的，往往能幫助設(shè)計(jì)，起到四兩撥千斤的作用。通過一輪A/B測試，我們能清晰地對(duì)比不同設(shè)計(jì)細(xì)節(jié)在數(shù)據(jù)表現(xiàn)上的差異，特別是頁面上可交互的元素，其點(diǎn)擊或hover率的變化能指導(dǎo)我們調(diào)整對(duì)應(yīng)的設(shè)計(jì)細(xì)節(jié)。例如，在圖5左圖中，我們發(fā)現(xiàn)整個(gè)區(qū)域的點(diǎn)擊率下降，且StartOrder等灰色鏈接的點(diǎn)擊率下降比較明顯，因此我們初步判斷，視覺上的弱化影響到了用戶，部分用戶可能未發(fā)現(xiàn)這些鏈接。因此我們立即響應(yīng)，做了一輪快速調(diào)整，即將字體顏色從灰色變?yōu)榱怂{(lán)色，如圖5右圖，點(diǎn)擊率立刻回升。這種多次A/B測試識(shí)別設(shè)計(jì)問題并迭代驗(yàn)證的數(shù)據(jù)驗(yàn)證方法能指導(dǎo)設(shè)計(jì)師快速修正設(shè)計(jì)方案細(xì)節(jié)，使產(chǎn)品有好的體驗(yàn)和商業(yè)效果?；诓煌a(chǎn)品，數(shù)據(jù)驗(yàn)證的策略會(huì)有所不同，但基本原則是一致的，即排除可能的干擾因素，建立具有可比性的產(chǎn)品驗(yàn)證環(huán)境，迭代調(diào)整設(shè)計(jì)變量來達(dá)到滿意的設(shè)計(jì)效果。但值得注意的是，我們在針對(duì)設(shè)計(jì)細(xì)節(jié)進(jìn)行數(shù)據(jù)分析假設(shè)時(shí)，不能一葉蔽目，需要從整理數(shù)據(jù)變化出發(fā)，判斷細(xì)節(jié)數(shù)據(jù)的變化是否合理，并不是某個(gè)鏈接的點(diǎn)擊率下降就一定是壞事，而要分析這個(gè)鏈接的點(diǎn)擊下降是否牽動(dòng)了其他更重要的行動(dòng)?？偠灾脩艉貌攀钦娴暮?，如果點(diǎn)擊率的下降能讓用戶更好地通過產(chǎn)品滿足其訴求，我們無須一味追求點(diǎn)擊率的提升。三、改版之外——設(shè)計(jì)師的科學(xué)精神互聯(lián)網(wǎng)信息時(shí)代作為雙刃劍，一方面讓人與人之間的面對(duì)面交流變少，另一方面卻又沉淀收獲了海量用戶的全方位數(shù)據(jù)信息。設(shè)計(jì)師應(yīng)該抓住這個(gè)契機(jī)，利用數(shù)據(jù)觸及數(shù)據(jù)背后代表的一個(gè)個(gè)真實(shí)的用戶，用科學(xué)的精神，大膽假設(shè)、小心求證用戶的每一個(gè)潛在訴求。同樣，數(shù)據(jù)也是雙刃劍，不同的解讀可能南轅北轍，作為集感性和理性于一身的設(shè)計(jì)師，不能讓數(shù)據(jù)來決定設(shè)計(jì)，而應(yīng)不忘初心回歸用戶，通過科學(xué)地解讀數(shù)據(jù)來指導(dǎo)佐證設(shè)計(jì)，讓數(shù)據(jù)真正成為設(shè)計(jì)師的利器。作者郵箱：chuan33@設(shè)計(jì)影響行為，行為決定結(jié)果文/董志舟做交互已有幾年了，在做互聯(lián)網(wǎng)交互設(shè)計(jì)之前，在華為做了一段時(shí)間的工業(yè)設(shè)計(jì)，雖說領(lǐng)域不同，但設(shè)計(jì)理念都一樣——以人文本、解決問題、以用戶為中心。無論是工業(yè)設(shè)計(jì)還是交互設(shè)計(jì)，在工作中都會(huì)看到設(shè)計(jì)師與業(yè)務(wù)方之間的的各種抱怨、交鋒。設(shè)計(jì)師認(rèn)為業(yè)務(wù)方不從用戶角度考慮，肆意踐踏用戶體驗(yàn)，業(yè)務(wù)方覺得設(shè)計(jì)師沒有商業(yè)sense，觀點(diǎn)過于偏執(zhí)，總是用一個(gè)空洞的“體驗(yàn)”來說事，是不懂商業(yè)和需求的小朋友。兩撥人暗自爭得面紅耳赤誰也說服不了誰，當(dāng)然之前這種事情在我自己身上也發(fā)生過。后來工作久了，有了更為深刻的認(rèn)識(shí)，所以想對(duì)設(shè)計(jì)師和業(yè)務(wù)方說一句：“本是同根生，相煎何太急”?！案笔鞘裁矗亢芏嗤瑢W(xué)會(huì)說“用戶需求”。其實(shí)我認(rèn)為還應(yīng)該有更深層次的理解——商業(yè)成功。說出這四個(gè)字的時(shí)候，我心里其實(shí)已經(jīng)準(zhǔn)備好接受大家的質(zhì)疑了。不過，先聽我給你講述一個(gè)幾個(gè)月前我經(jīng)歷的項(xiàng)目。在這個(gè)項(xiàng)目中我和業(yè)務(wù)方合作得非常愉快，既提升了體驗(yàn)又拿到了業(yè)務(wù)結(jié)果，皆大歡喜。項(xiàng)目做完之后，自我總結(jié)了一下，有一些關(guān)于設(shè)計(jì)和商業(yè)之間的思考，說出來給大家聽聽。這個(gè)項(xiàng)目是對(duì)某個(gè)產(chǎn)品的搜索結(jié)果列表頁（簡稱List）進(jìn)行改版。對(duì)于電商網(wǎng)站，首頁、列表頁、詳情頁、購物車、訂單、支付、物流、評(píng)價(jià)，這些就是基本流程。列表頁在這條鏈路中負(fù)責(zé)的就是幫助用戶高效查找、對(duì)比產(chǎn)品，最終體現(xiàn)在衡量標(biāo)準(zhǔn)上，業(yè)務(wù)上的核心指標(biāo)就是L-D（List-Detail，列表頁到詳情頁）的轉(zhuǎn)化率，實(shí)際的意義就是讓更多的用戶去看某一個(gè)的產(chǎn)品的詳細(xì)情況，從而決定購買或其他交易行為。我是怎么做的呢？之前的一些需求和背景分析、數(shù)據(jù)分析、設(shè)計(jì)目標(biāo)在這里就不多說了，最終設(shè)計(jì)方案如下。一、優(yōu)化關(guān)鍵詞輸入，提高關(guān)鍵詞輸入效率。解決方案是關(guān)鍵詞自動(dòng)填充、智能聯(lián)想、相關(guān)搜索等。改進(jìn)前：沒有優(yōu)化關(guān)鍵詞輸入，如圖1所示。改進(jìn)后：優(yōu)化關(guān)鍵詞輸入，如圖2所示。二、提高篩選項(xiàng)的使用率。解決方案是將下拉式調(diào)整為平鋪式，排序規(guī)則選項(xiàng)更為顯性化。改進(jìn)前：下拉式篩選項(xiàng)，如圖3所示。改進(jìn)后：平鋪式篩選項(xiàng)，如圖4所示。三、調(diào)整Item信息的內(nèi)容及展現(xiàn)方式，突出核心信息展示。解決方案是增加對(duì)買家有吸引的內(nèi)容及視覺要素，并且將默認(rèn)的大圖模式（Gallery）改為列表模式（List），便于用戶對(duì)比產(chǎn)品，聽起來是不是很有邏輯？先記住它，這是個(gè)伏筆。以一個(gè)產(chǎn)品為例。改進(jìn)前：默認(rèn)大圖模式（Gallery），如圖5所示。改進(jìn)后：列表模式（List），如圖6所示。在這里還通過視覺樣式去引導(dǎo)用戶點(diǎn)擊關(guān)鍵行動(dòng)點(diǎn)，比如整個(gè)Item添加鼠標(biāo)hover時(shí)的陰影、鼠標(biāo)hover在標(biāo)題上會(huì)出現(xiàn)下畫線、產(chǎn)品圖片尺寸加大，等等。四、類目及屬性篩選優(yōu)化，因?yàn)檫@是用戶最常用的。解決方案是將類目篩選與屬性篩選做明顯的視覺區(qū)分，讓用戶更容易注意并使用類目篩選。改進(jìn)前：類目及屬性篩選不明顯，如圖7所示。改進(jìn)后：把用戶使用頻率最高的類目區(qū)域強(qiáng)化，如圖8所示。五、改進(jìn)推薦產(chǎn)品規(guī)則，加強(qiáng)推薦的精準(zhǔn)性（這個(gè)是業(yè)務(wù)范疇，在此不做詳細(xì)闡述）。六、其他一些改進(jìn)。產(chǎn)品功能做了這么多改進(jìn)，每個(gè)都能對(duì)用戶體驗(yàn)有所提升。那么理論上L-D（列表頁到詳情頁）的轉(zhuǎn)化率一定會(huì)大幅上升。但是上線后，轉(zhuǎn)化率居然并沒有明顯提升！這是為什么呢？我和業(yè)務(wù)方的產(chǎn)品經(jīng)理都感到很詫異，找來上線后幾天的數(shù)據(jù)仔細(xì)分析，發(fā)現(xiàn)了以下幾個(gè)現(xiàn)象。1.篩選、排序等功能的使用率提升了5～6倍。2.改版前后第一頁的產(chǎn)品數(shù)量沒有變化，但是從前到后（從第1個(gè)到第30個(gè)）產(chǎn)品點(diǎn)擊率的衰減趨勢有很大不同。如圖9所示，具體數(shù)據(jù)不方便在此披露，僅僅用示意圖來展示一下趨勢。通過圖9可以看出，相比大圖模式來講，列表模式下流量會(huì)更多地集中在前邊幾個(gè)產(chǎn)品上?？傮w來講，用戶看的產(chǎn)品少了，看到感興趣的產(chǎn)品的幾率變小了，轉(zhuǎn)化率自然就降低了。但是為什么列表模式下用戶看的產(chǎn)品更少？我們仔細(xì)對(duì)比了兩種不同排版的頁面，如圖10所示。稍微觀察一下不難發(fā)現(xiàn)，在相同的屏幕尺寸下，大圖模式比列表模式展示的產(chǎn)品更多，難道是因?yàn)檫@個(gè)原因嗎？有問題不可怕，可怕的是不知道問題是什么。有了假設(shè)，我們就來驗(yàn)證一下。為了謹(jǐn)慎，我們選擇了3C類目做了測試，恢復(fù)為默認(rèn)大圖模式，別的功能都沒更改。幾天后，3C類的轉(zhuǎn)化率果然上升了，比原來的老版本還高了不少。問題找到了，原來雖然別的改進(jìn)點(diǎn)都促進(jìn)了轉(zhuǎn)化率，但是列表模式拉低了轉(zhuǎn)化率，導(dǎo)致整體轉(zhuǎn)化率變低。原來用戶連滾動(dòng)鼠標(biāo)滾輪這點(diǎn)成本都不愿意付出。這時(shí)候又出現(xiàn)一個(gè)疑問，如果是這樣，那其他網(wǎng)站（淘寶、天貓、亞馬遜）為什么默認(rèn)為列表模式呢？因?yàn)槭莿e人的產(chǎn)品，所以沒法用數(shù)據(jù)來驗(yàn)證。但是我猜想，原因可能有兩個(gè)。一、產(chǎn)品搜索結(jié)果相關(guān)性是影響轉(zhuǎn)化率的因素里最重要的一個(gè)，而我們這個(gè)探索型業(yè)務(wù)中相關(guān)性還做得不夠，在這個(gè)條件下，其他的因素就可能比較重要了。這個(gè)猜想，需要改進(jìn)搜索算法提升相關(guān)性后才能驗(yàn)證。二、這塊業(yè)務(wù)新用戶比較多，用戶本身的留存也不高。這個(gè)看一下不同訪客類型的點(diǎn)擊數(shù)據(jù)可以驗(yàn)證，尤其是新老用戶的對(duì)比。出于資源和時(shí)間考慮，后續(xù)沒有針對(duì)猜想做驗(yàn)證。但是把每頁產(chǎn)品數(shù)量增加到45個(gè)之后，轉(zhuǎn)化率又上升了一些，更佐證了前邊的結(jié)論——“滾動(dòng)鼠標(biāo)滾輪也是成本”。好了，案例看完了，回到剛開始我的觀點(diǎn)，設(shè)計(jì)師和業(yè)務(wù)方那個(gè)共同的“根”其實(shí)應(yīng)該是“商業(yè)目標(biāo)”?；仡欉@個(gè)項(xiàng)目，你看出來交互和產(chǎn)品經(jīng)理存在明顯的職責(zé)劃分了嗎？是不是很多都融合到一起了？我和產(chǎn)品經(jīng)理的關(guān)注點(diǎn)都是一致的，提升轉(zhuǎn)化率。只不過我側(cè)重用優(yōu)化體驗(yàn)的方式，比如篩選的可用性、信息的層級(jí)突顯、不同的信息框架。產(chǎn)品經(jīng)理側(cè)重于功能，比如搜索相關(guān)性的提高。作為交互設(shè)計(jì)師，我沒有糾結(jié)于篩選項(xiàng)用下拉列表是否更簡潔，也沒有糾結(jié)于產(chǎn)品信息用列表從邏輯上是否更符合用戶的對(duì)比需求。因?yàn)檫@都是邏輯推斷，可能用戶并不在意，所以我從結(jié)果數(shù)據(jù)去分析用戶的行為，然后通過設(shè)計(jì)的手段去改進(jìn)，這種方法有理有據(jù)，不管是內(nèi)部設(shè)計(jì)師、產(chǎn)品還是運(yùn)營，大家都能明白是怎么一回事。在和產(chǎn)品經(jīng)理的合作過程中沒有常見的“爭論”，有的只是對(duì)同一個(gè)目標(biāo)的追求，遇到問題互相討論解決，合作得很愉快，并且最終商業(yè)目標(biāo)也達(dá)成了，用戶的體驗(yàn)也得到了改善。看似沒什么，其實(shí)我是有自己的一套理念的，大概的表述如圖11所示。用一句話解讀這個(gè)圖：功能、設(shè)計(jì)、性能這些都有會(huì)影響產(chǎn)品的具體形態(tài)，產(chǎn)品的具體形態(tài)進(jìn)一步影響了用戶怎么去使用產(chǎn)品，用戶的行為決定了產(chǎn)品的成敗，最終，影響到公司愿景的實(shí)現(xiàn)?？炊诉@張圖，你就知道了設(shè)計(jì)師的價(jià)值在哪兒，也可以解決很多工作中的疑問。下面再來深度解讀一下這張圖。首先，體驗(yàn)和商業(yè)根本不沖突。一家成功的公司，一款成功的產(chǎn)品，用戶的需求和公司的需求從來就不曾有過矛盾，公司都是通過滿足用戶的需求來實(shí)現(xiàn)自己的目標(biāo)的。產(chǎn)品能提供用戶所需之物，這本身就是一種良好的用戶體驗(yàn)，即使產(chǎn)品本身界面不是很好用也不夠漂亮，比如早期的快的打車和滴滴打車，只顧當(dāng)前數(shù)據(jù)漂亮而誘導(dǎo)用戶去使用，也是只完成了自己的KPI，跟公司要滿足的需求還相去甚遠(yuǎn)。優(yōu)秀的體驗(yàn)也可以讓更多用戶使用產(chǎn)品并