終于產(chǎn)出了一篇專業(yè)文，干貨有多少可能在表面上看不太出來，看官們可以仔細(xì)思考思考，如果有共鳴和不同的看法歡迎一起交流，這是我這段時(shí)間的產(chǎn)品設(shè)計(jì)心得，總結(jié)一下，現(xiàn)在的UI設(shè)計(jì)師真是太不容易了。

快速?zèng)Q策，但要深入思考

Decision And Thinking

在做產(chǎn)品設(shè)計(jì)的時(shí)候，往往大部分UI設(shè)計(jì)師會(huì)出現(xiàn)細(xì)節(jié)糾結(jié)癥，例如樣式的選擇、文字的細(xì)微調(diào)整、排版拿不定，有時(shí)覺得幾種布局、層次單獨(dú)看都有可圈可點(diǎn)之處，但是互相不能結(jié)合，而業(yè)務(wù)方看問題的角度不同，對(duì)于設(shè)計(jì)方案都能講出自己的道理來，這時(shí)候設(shè)計(jì)師就會(huì)被動(dòng)的陷入拿不定主意的漩渦，到底哪種方案最好。這里就會(huì)涉及到成本權(quán)衡和回歸目標(biāo)兩個(gè)問題上來。

所謂的成本包括開發(fā)、認(rèn)知、用戶還有業(yè)務(wù)，一個(gè)產(chǎn)品的最終呈現(xiàn)一定是成本權(quán)衡的結(jié)果，權(quán)衡成本之后迅速做出決策，也是設(shè)計(jì)師重要能力之一，否則大家都會(huì)陷入無限的糾結(jié)中去，影響判斷和效率。

同時(shí)需要注意的是一旦陷入權(quán)衡的漩渦之后，設(shè)計(jì)師能否立馬回到最初的背景及目標(biāo)再思考方案，這是一個(gè)比較容易忽略的一點(diǎn)。當(dāng)你深入細(xì)節(jié)又被細(xì)節(jié)糾纏住的時(shí)候不妨脫離方案本身來思考。

這里舉個(gè)case我們一起思考一下：

為了表現(xiàn)商品售賣的進(jìn)度，設(shè)計(jì)一個(gè)進(jìn)度條。講到進(jìn)度條大家心里一般會(huì)有一個(gè)刻板印象，就是他會(huì)有3種狀態(tài)：滿、不滿和空，那么為了表示商品售賣的進(jìn)度，第一反應(yīng)商品應(yīng)該是越買越少的，所以我們設(shè)計(jì)了一個(gè)進(jìn)度條由100%逐漸減少到0的過程的樣式，也符合恐懼營銷的的心里學(xué)理論，配合上庫存xxx的字段，應(yīng)該是一個(gè)不會(huì)錯(cuò)的方案。but，我們發(fā)現(xiàn)有部分電商應(yīng)用與之相反，他們采用的是進(jìn)度從0到100，突出的是熱賣程度，選用的字段是已搶xxx件／已售xxx件。

 

 

這個(gè)時(shí)候會(huì)出現(xiàn)兩種不一樣的感官和認(rèn)知，第一種給人的直觀感受是商品越來越少，即將售罄，很緊迫。第二種給人的直觀感受是買的人越來越多，激發(fā)用戶好奇心。兩種表現(xiàn)形式給用戶的感知。怎么選擇？

 

繼續(xù)思考，回過頭來看需求的目標(biāo)是什么？是希望用戶感受到商品的稀缺還是熱賣的程度？同時(shí)在做這個(gè)需求的時(shí)候做過一些簡單用戶調(diào)研，只有僅剩和已搶這一組字段變量，樣本選擇了自己設(shè)計(jì)組同事和幾個(gè)用戶，第一個(gè)問題是這兩種進(jìn)度條在第一反應(yīng)下，哪種你看的懂？一共8個(gè)樣本都選擇了第一種方案。第二個(gè)問題：第一反應(yīng)下你們更想買哪一組商品，這個(gè)問題其實(shí)不夠準(zhǔn)確，用戶給的反饋是都差不多，55開。

 

繼續(xù)思考，用戶角度是怎么看這個(gè)進(jìn)度條的？是仔細(xì)解讀，還是匆匆一瞥？這里又可以分為有目標(biāo)購物和無目標(biāo)購物兩種類型的用戶，有目標(biāo)購物的用戶進(jìn)度條對(duì)其刺激會(huì)更明顯，但這里無需進(jìn)一步探究。當(dāng)然我們還可以用ab測試來看看這兩種方案對(duì)轉(zhuǎn)化是不是有幫助。所以結(jié)合用戶的認(rèn)知感官和心理選擇不同的表現(xiàn)形式。

 

 

 

嚴(yán)選和考拉選擇的是第一種形式，淘寶和京東選擇的是第二種，沒有派別之爭，沒有對(duì)錯(cuò)，只有合適與否。

 

 

 

 

選擇方向，深入研究

Research

 

UI設(shè)計(jì)師這個(gè)角色現(xiàn)在的生存環(huán)境越來嚴(yán)峻，比較尷尬的一點(diǎn)是交互能力沒有交互強(qiáng)，視覺能力沒有視覺強(qiáng)，有時(shí)候又什么都要做，但是又什么都做不精。所以我一直認(rèn)為UI設(shè)計(jì)師可以走兩條路，一條是視覺，一條是綜合。如果選擇做視覺，你需要精通各種風(fēng)格的表現(xiàn)，能夠輕松駕馭，形成并打造自己的品牌。如果選擇綜合，需以用戶體驗(yàn)為目標(biāo)，深入探究業(yè)務(wù)、行業(yè)、用戶之間的相關(guān)關(guān)系，核心能力是交互、產(chǎn)品、以及用戶研究。

 

我們會(huì)發(fā)現(xiàn)，越來越多的重復(fù)工作被做成了工具化，智能化，并不只是banner可以被工具化。我們是否可以預(yù)想到在不遠(yuǎn)的將來，大部分產(chǎn)品可以同質(zhì)化，通過設(shè)置參數(shù)來定義顏色，大小，通過庫來選擇相應(yīng)的組件和控件，我們正在做的組件庫、dpl其實(shí)就是這些工具的基礎(chǔ)模型。那時(shí)候UI設(shè)計(jì)師的價(jià)值就會(huì)非常低，一切都將變得更懶更簡單，說不下去了，焦慮。

設(shè)計(jì)規(guī)范的思考

Guide

很多團(tuán)隊(duì)都建立起了較為成熟的設(shè)計(jì)規(guī)范系統(tǒng)，平臺(tái)越大越需要有系統(tǒng)化的規(guī)范來整合不同業(yè)務(wù)之間所呈現(xiàn)出來的對(duì)內(nèi)或者對(duì)外的文化。設(shè)計(jì)規(guī)范的作用想必大家都明白，我們需要根據(jù)規(guī)范來保持統(tǒng)一，但又需要根據(jù)規(guī)范來創(chuàng)新，來延展。規(guī)范不僅僅是針對(duì)某一個(gè)產(chǎn)品而言的，而是整一個(gè)企業(yè)的文化以理性的方式呈現(xiàn)在產(chǎn)品上。把規(guī)范比作橡皮泥，對(duì)外，他可以形成許多中不同的形狀，但他的本質(zhì)還是一個(gè)黑色質(zhì)地柔軟的橡皮泥，而不是黑色的橡膠，也不是藍(lán)色的橡皮泥。對(duì)內(nèi)，他捏成的形狀都差不多大小，外觀或許有差異，有不同的調(diào)性，但是組成都是黑色的橡皮泥。

借用馮叔在站酷文章中引用的一個(gè)例子，如何讓你天馬行空的想象，在這小小的區(qū)域中，加上各種限制條件作出合理的設(shè)計(jì)。一個(gè)產(chǎn)品或許能夠輕而易舉的整理出一套規(guī)范，但是這不是成熟體，他是否擁有可擴(kuò)展性、可包容性、可變化性是真正在產(chǎn)出規(guī)范時(shí)要注意的。

比較困難的是如何在多個(gè)產(chǎn)品上使用一套規(guī)范從而出現(xiàn)的變化和統(tǒng)一性的把控。舉個(gè)例子，例如有n條產(chǎn)品線，有些產(chǎn)品的調(diào)性接近，有些業(yè)產(chǎn)品的差異很大，那么該如何統(tǒng)一每個(gè)產(chǎn)品線之間的設(shè)計(jì)規(guī)范，比如一個(gè)表單高度，在制作規(guī)范時(shí)不能只定義一個(gè)表單高度的值，而是需要將可擴(kuò)展的屬性和適用的場景都列舉出來，這樣其他人在不同場景或者在不同產(chǎn)品線上設(shè)計(jì)時(shí)都能做到相應(yīng)的靈活性。給規(guī)范一個(gè)嚴(yán)格的基礎(chǔ)值，在這個(gè)值上可以擴(kuò)散出多樣化，那么基礎(chǔ)值一定是要可經(jīng)得起推敲，能夠追溯的。

 

 

即便在一個(gè)產(chǎn)品中也會(huì)出現(xiàn)多種場景需要同一控件的不同樣式的使用，這里我們最好使用一下歸類的方法，看一看是否這些場景真的屬于完全獨(dú)立的場景，還是屬于同一場景的不同分支，還是完全都獨(dú)立的不同場景。像這樣的判斷和決策需要設(shè)計(jì)leader和各主設(shè)一起把握，會(huì)有很多種方法，我們也還在逐步摸索中，如何能夠讓設(shè)計(jì)規(guī)范成為企業(yè)產(chǎn)品的一根魔法棒，螞蟻的企業(yè)級(jí)ant design是個(gè)很好的例子，設(shè)計(jì)語言不僅僅可以在一個(gè)企業(yè)中輻射，也可以輻射到整個(gè)行業(yè)或者商業(yè)生態(tài)圈，在把握了原則和遵循一些自然規(guī)律之后，都會(huì)衍生出屬于自己產(chǎn)品的特點(diǎn)。

嘗試綜合性工作

Try More

你想在某方面能力有所成就，首先必須知道它是怎么運(yùn)作的，光知道還不夠必須親身參與，甚至主導(dǎo)。當(dāng)你真實(shí)參與過或者主導(dǎo)過一個(gè)項(xiàng)目之后，你的收獲遠(yuǎn)遠(yuǎn)比只做UI執(zhí)行要大的多。在幾個(gè)月前接手了一個(gè)項(xiàng)目，接手之前還不知道是個(gè)多燙手的山芋，真實(shí)扎進(jìn)去做了之后會(huì)發(fā)現(xiàn)水很深，當(dāng)然水越深鍛煉效果就更好。嘗試和大家聊聊我是怎么做這個(gè)項(xiàng)目的，以及收獲的一些經(jīng)驗(yàn)和大家分享。調(diào)研過程就不發(fā)了會(huì)涉及到商業(yè)機(jī)密。

 

 

1.梳理需求的目標(biāo)，挖掘存在的問題，明確定位

這次接道的需求是基于業(yè)務(wù)和戰(zhàn)略方向的產(chǎn)品改版，沒錯(cuò)，是ued推動(dòng)的一個(gè)版本，我們的產(chǎn)品分為賣家端和買家端，目前產(chǎn)品側(cè)重于賣家，而我負(fù)責(zé)的則是買家端，具體步驟就不贅述了，在這個(gè)大項(xiàng)目的前提下，目標(biāo)其實(shí)是很明確的，就是提高轉(zhuǎn)化率，一個(gè)很玄的目標(biāo)，看起來簡單，實(shí)則水很深。然后我們需要去分析目前存在哪些問題導(dǎo)致轉(zhuǎn)化率低，通過分析數(shù)據(jù)和用戶調(diào)研等一系列方法論之后，我們大致清楚了問題的所在：板塊分割太多，用戶對(duì)板塊的內(nèi)容敏感性差，對(duì)c端的產(chǎn)品定位不夠明確，核心功能被弱化大大降低了用戶購物的效率。

2.確定可用的資源并牽頭協(xié)調(diào)確認(rèn)

一個(gè)好的產(chǎn)品設(shè)計(jì)師，溝通協(xié)調(diào)能力是非常重要的，這是我一直在鍛煉的方面。一個(gè)需求是否順利同樣會(huì)牽扯到許許多多的因素，例如：

1.需求產(chǎn)生的節(jié)點(diǎn)在整個(gè)項(xiàng)目迭代中的那一部分，是否有其他需求和其有沖突（當(dāng)時(shí)正值雙十一）。

2.該需求的價(jià)值是否明確，老板和高管是否對(duì)該需求的價(jià)值、產(chǎn)品定位都認(rèn)同 。

3.資源是否都已協(xié)調(diào)到位，資源跟進(jìn)日期和對(duì)接人是否到位，各資源方交付         deadline是否確認(rèn)，并且通過郵件確認(rèn)。

5.輸出的方案是否有數(shù)據(jù)和研究結(jié)果的導(dǎo)入和支撐。方案是否能形態(tài)化，而不是臨時(shí)解決問題的方案。

6.方案的容錯(cuò)性、新老版本兼容 。

7.開發(fā)周期的確定是否需要跨版本，技術(shù)評(píng)審中遇到的問題如何解決，是否有可替代方案等

3.做讓用戶上癮的產(chǎn)品

在做這個(gè)方案的時(shí)候，過程挺坎坷，只考慮到了聚焦和效率兩個(gè)原則，但是對(duì)于電商的c端用戶來說是不夠的，某些功能和模塊需要有他存在的價(jià)值，以及如何讓用戶上癮，通過觸發(fā)、行動(dòng)、酬勞、投入4個(gè)節(jié)點(diǎn)讓用戶持續(xù)產(chǎn)出，做出對(duì)用戶來說有價(jià)值的東西，而不是冰冷無感的東西。上癮模型之前有人在網(wǎng)上發(fā)過類似的文這里就不再贅述了，大家也可以去看看《上癮》這本書。我們需要做符合人性而不僅僅是符合邏輯的產(chǎn)品。

4.反饋及復(fù)盤

30天內(nèi)日均下單轉(zhuǎn)化提高了4個(gè)百分點(diǎn)，用戶滿意度也提高了不少，這是一個(gè)還算不錯(cuò)的成績了。上線之前的埋點(diǎn)必不可少，上線后的數(shù)據(jù)跟蹤有利于我們繼續(xù)優(yōu)化產(chǎn)品。項(xiàng)目總結(jié)就是全程參與并和產(chǎn)品一起主導(dǎo)了整個(gè)改版，收獲頗豐，不足之處還是有很多比如對(duì)于業(yè)務(wù)并不是非常深入、產(chǎn)品底層邏輯的了解不夠?？傊绻袡C(jī)會(huì)建議大家都去嘗試一些綜合性的工作，有挑戰(zhàn)也有很多樂趣與成就感。

來源：UI中國