為什么那么多人覺(jué)得應(yīng)該先學(xué)UI設(shè)計(jì)再學(xué)交互設(shè)計(jì)，因?yàn)閁I門檻低所以入手快。其實(shí)交互比UI更早出現(xiàn)，從需求理論可以看出人們?cè)谧分鹬饔^體驗(yàn)的感受，在基礎(chǔ)需求未被滿足前是不會(huì)出現(xiàn)更高層次的需求的。所以UI設(shè)計(jì)讓更多用戶感受到了舒適和更好的體驗(yàn)。殊不知，如果底層的交互和產(chǎn)品的可用性未被滿足，那么UI做的再好也是徒勞。
市面上大量出現(xiàn)同質(zhì)化產(chǎn)品、設(shè)計(jì)，就是因?yàn)榇蠹叶荚诎凑宅F(xiàn)有的，常用的模版在設(shè)計(jì)，現(xiàn)在其實(shí)比早兩年會(huì)好很多，很多設(shè)計(jì)師已經(jīng)開(kāi)始從美化工作逐漸深挖到區(qū)分甚至自我驅(qū)動(dòng)或者價(jià)值探尋的工作。
例如下面的案例，這是一個(gè)電瓶車電池租賃的一個(gè)產(chǎn)品。
從美觀角度，左側(cè)的界面更加簡(jiǎn)潔信息也有規(guī)律，有美觀的banner和看起來(lái)讓人有點(diǎn)擊欲望的大按鈕以及“令人覺(jué)得很熱門”的熱門租賃板塊。當(dāng)我不放出右側(cè)的對(duì)比圖時(shí)，大家在第一反應(yīng)中，有多少人可以重啟自己的視角，還是說(shuō)已經(jīng)被這個(gè)頁(yè)面所拉入到不可自拔的漩渦中去了呢？
如果讓你盯著第一個(gè)界面進(jìn)行改版，我相信還是會(huì)有很多小伙伴可能只是會(huì)把底下的信息流挪上來(lái)，或者新增一些“我們覺(jué)得”有用的板塊。但其實(shí)這整個(gè)形態(tài)就是錯(cuò)的，即便將錯(cuò)誤路徑3改成了路徑2，你以然還是在錯(cuò)誤的路徑上，本質(zhì)沒(méi)變。所以為什么我們說(shuō)要做正確的事而不是正確的做事。
交互不僅僅能夠讓產(chǎn)品好用的，也要讓產(chǎn)品走對(duì)方向。
另外，UI也是交互的一部分，屬于看的懂。好用可以分為看得懂，學(xué)的快，用的會(huì)，交互體現(xiàn)在人們?nèi)粘Ｋ佑|到的大部分媒介，并且與之產(chǎn)生聯(lián)系。例如一把水壺，水壺的設(shè)計(jì)形式首先通過(guò)視覺(jué)讓你感知這是一個(gè)水壺，如果把水壺的外形做成一個(gè)馬桶，你覺(jué)得它還是一個(gè)水壺嗎，這叫看的懂。學(xué)的快指的是當(dāng)我看懂了之后我馬上就可以對(duì)這個(gè)產(chǎn)品進(jìn)行基礎(chǔ)操作，例如裝水、倒水。而用的會(huì)就是這個(gè)水壺更多的附加功能，例如燒水、定時(shí)、調(diào)溫等等。
交互的媒介是不可缺少的，大家是否去研究過(guò)為什么古代人們撰寫文字是從上至下，從右往左而現(xiàn)代人的習(xí)慣是從左右的？古代受限于工具、媒介，竹簡(jiǎn)是主流的記錄文字信息的媒介， 有人會(huì)說(shuō)竹簡(jiǎn)可以從做往右寫不是非要從上往下啊，但是大家可以看到人們是如何打開(kāi)進(jìn)行閱讀的，如果是橫著閱讀但是打開(kāi)是上下展開(kāi)就會(huì)非常不自然了。
所以在當(dāng)時(shí)人們?yōu)榱诉m應(yīng)非常有限的工具資源，改變了自然的操作方式。但現(xiàn)代社會(huì)如果說(shuō)你的產(chǎn)品不為用戶的使用和場(chǎng)景去考慮，那基本也就涼涼了。
從2g到5g時(shí)代的發(fā)展，除了生活方式發(fā)生翻天覆地的變化外，我們所接觸到的媒介也發(fā)生了變化，從2g時(shí)代以文字為主的信息到5g時(shí)代視頻、游戲、影音等為主的信息化進(jìn)步，讓人們對(duì)信息的獲取更加方便快捷。除了內(nèi)容，外對(duì)于像移動(dòng)手機(jī)這樣的設(shè)備用戶對(duì)其操作方式和習(xí)慣也有了更多的變化，從當(dāng)初的搬磚按鍵手機(jī)到支持ar等新技術(shù)的超智能化手機(jī)，改變了我們的認(rèn)知也改變了我們的生活方式。
平臺(tái)遷移的交互成本，很多同學(xué)可能都玩過(guò)moba類游戲-dota，這是一款在電腦端戰(zhàn)術(shù)競(jìng)技類游戲。在dota中我們經(jīng)常使用的交互形式主要分為鍵盤和鼠標(biāo)的控制，鍵盤用來(lái)控制技能的釋放和其他快捷物品的使用，都是通過(guò)按按鍵的形式進(jìn)行釋放。通過(guò)鼠標(biāo)右鍵來(lái)控制人物的移動(dòng)和左鍵選擇技能和物品釋放的目標(biāo)，這是端游中基本的交互行為與操作。
在現(xiàn)在非常火熱并且模式和dota相似度很高的王者榮耀手游中，我們看到了，如何從端游到手游的交互遷移。從鼠標(biāo)控制移動(dòng)到左手拇指來(lái)控制移動(dòng)，右手拇指來(lái)控制技能的釋放，在這里大家要注意，在端游中技能的釋放是可以非常精準(zhǔn)的，并且可以指向性釋放在某一個(gè)角色中，但手游不行。鼠標(biāo)擁有移動(dòng)、視角、釋放技能、使用物品多個(gè)功能，但是在手游中我們無(wú)法做到選中某一個(gè)技能再點(diǎn)擊到某一個(gè)角色上，所以手游中只能進(jìn)行非指向性的預(yù)判技能釋放。
同樣在端游和手游的吃雞游戲中，端游鍵盤控制人物移動(dòng)，鼠標(biāo)控制射擊與視角，但是在手游中控制射擊與視角就需要2個(gè)手指來(lái)完成非常不方便，也很影響射擊的精度，但是如果做成吸附式準(zhǔn)星那么也就失去了很多的樂(lè)趣。所以很多的廠商為了解決的這個(gè)用戶痛點(diǎn)開(kāi)發(fā)出了吃雞專用的輔助設(shè)備，專門用來(lái)給多余的手指進(jìn)行射擊操作。
另外，大家如果做b端的同學(xué)應(yīng)該也深有感觸，平臺(tái)遷移的成本非常高。想要把集成非常復(fù)雜的業(yè)務(wù)后臺(tái)切換到移動(dòng)端是一件很麻煩的事，因?yàn)樵诰W(wǎng)頁(yè)端我們有大量的空間和更自由的控件形式去承載信息，比如聯(lián)動(dòng)的左側(cè)標(biāo)簽導(dǎo)航和頂部聯(lián)動(dòng)的標(biāo)簽導(dǎo)航，在增刪改查的操作中顯得清晰高效。但是到移動(dòng)端上雖然可以到做聯(lián)動(dòng)導(dǎo)航，但是頁(yè)面顯示實(shí)在有限，很多的信息完全無(wú)法在一個(gè)界面中呈現(xiàn)，所以要么將頁(yè)面進(jìn)行左右滑動(dòng)，要么拆分進(jìn)行多步操作。但本身?yè)碛袕?fù)雜業(yè)務(wù)功能的后臺(tái)系統(tǒng)就不適宜遷移到移動(dòng)端上。
web端的工具和網(wǎng)頁(yè)通常都會(huì)有撤銷操作，按CMD（ctrl）+Z大部分都可進(jìn)行撤銷上一步操作，但是在移動(dòng)端我們無(wú)法通過(guò)特定、或者統(tǒng)一的手勢(shì)進(jìn)行撤銷，所以很多時(shí)候在表單輸入的時(shí)候會(huì)有一鍵刪除圖標(biāo)，卻無(wú)法進(jìn)行撤銷。所以我在想是不是可以在用戶一鍵刪除信息后，刪除按鈕變?yōu)槌蜂N按鈕，有待考量。
到底什么是交互設(shè)計(jì)，這個(gè)問(wèn)題其實(shí)是比較復(fù)雜的，也是我一直在思考的問(wèn)題。所以也翻閱了很多文獻(xiàn)，嘗試做更多的案例來(lái)解釋。交互設(shè)計(jì)的概念真的挺多的，光網(wǎng)上能夠找到的定義就不下5種，這些對(duì)交互設(shè)計(jì)的定義中，比較頻繁出現(xiàn)的是行為、場(chǎng)景、用戶等詞匯，交互設(shè)計(jì)到底設(shè)計(jì)的是用戶的行為，還是設(shè)計(jì)用戶正在交互的媒介或者是用戶正在使用媒介這件事情，我覺(jué)得可能還是沒(méi)有能夠解釋清楚交互設(shè)計(jì)的本質(zhì)。
中國(guó)歷史文字的演變，它并不是一個(gè)模仿的過(guò)程，而是一個(gè)從底層對(duì)文化、自由、精神、環(huán)境、人的深刻理解而發(fā)生的一種進(jìn)化過(guò)程。但現(xiàn)在其實(shí)很多的交互形式都是來(lái)源于一些大流量產(chǎn)品的模仿，更多的是擔(dān)心用戶成本過(guò)高而妥協(xié)為滿足用戶預(yù)期。
事實(shí)上，為什么我們講不清楚什么是交互設(shè)計(jì)，其實(shí)UI設(shè)計(jì)也一樣，她絕不可能單純的指代用工具繪制出用戶界面，其實(shí)是因?yàn)樾畔⒉粚?duì)成、詞不達(dá)意或者叫做你說(shuō)的比人聽(tīng)不懂。我可以舉例的是我們的漢語(yǔ)
例如“你可以意思一下”，單就這句話，我們大概知道最關(guān)鍵的是“意思”二字，包含了特別多的含義，含義需要通過(guò)語(yǔ)境、使用場(chǎng)景來(lái)區(qū)分，說(shuō)者的“意思”是想告訴聽(tīng)者什么呢？沒(méi)人知道，是一口氣干完一瓶酒，還是喝一口？還是送一點(diǎn)禮還是？應(yīng)付一下？
當(dāng)然這句話中的“可以”也很有講究，加上“可以”說(shuō)明你也能選擇不“意思”，是不是覺(jué)得這7個(gè)字讓我們整一句話都活了起來(lái)，說(shuō)者與聽(tīng)者如果不在一個(gè)境中，聽(tīng)著就壓根不知道說(shuō)者的具體表達(dá)含義。
同樣的，在設(shè)計(jì)領(lǐng)域，很多設(shè)計(jì)師喜歡用大氣、高級(jí)、逼格、有呼吸感描述的自己的感受。 說(shuō)出來(lái)自己都要笑出聲，還有什么五彩斑斕的黑等等。就比如呼吸感這樣的詞，這個(gè)詞聽(tīng)起來(lái)比較抽象，讓聽(tīng)者都有點(diǎn)不太好意思追問(wèn)什么是呼吸感，其實(shí)你問(wèn)了，說(shuō)者也不知道怎么描述?？赡苷f(shuō)者覺(jué)得現(xiàn)在信息太密集讓人無(wú)法呼吸，但設(shè)計(jì)者覺(jué)得現(xiàn)在剛好，所以本身就沒(méi)有一個(gè)標(biāo)準(zhǔn)，更多的就是主觀的感受，讓你不得不接受這個(gè)建議的原因是因?yàn)閮烧叩纳矸荨?
我們用我們能夠講述的語(yǔ)言去描繪我們不懂的事物，再例如設(shè)計(jì)師和開(kāi)發(fā)還原只會(huì)說(shuō)往左移動(dòng)10px，而不會(huì)說(shuō)給這個(gè)view加上padding left 10px。還有你和開(kāi)發(fā)為什么溝通起來(lái)那么累就是因?yàn)槟銈z完全無(wú)法站在對(duì)方的角度對(duì)這件事達(dá)成共識(shí)，設(shè)計(jì)師通常喜歡描述從左到右或者從上到下，但是在開(kāi)發(fā)的語(yǔ)音認(rèn)知理，他需要知道的是空間坐標(biāo)，并且具體的移動(dòng)單位。所以為什么我們那么鼓勵(lì)廣大設(shè)計(jì)師去學(xué)習(xí)一些開(kāi)發(fā)知識(shí)，開(kāi)發(fā)也盡可能的去補(bǔ)充設(shè)計(jì)背景。
在這里，交互設(shè)計(jì)師產(chǎn)出的交互說(shuō)明文檔就是能夠幫助設(shè)計(jì)師與開(kāi)發(fā)有一個(gè)更好的溝通，所以能力較強(qiáng)的交互設(shè)計(jì)或者視覺(jué)設(shè)計(jì)都能夠把自己想表達(dá)的信息表達(dá)的很清楚。
再舉個(gè)例子，不知道大家有沒(méi)有編輯過(guò)問(wèn)卷或者做過(guò)用戶訪談，很多時(shí)候是不是覺(jué)得收集到的信息無(wú)效、無(wú)用，其實(shí)很多的原因是因?yàn)槲覀兒陀脩魧?duì)于這些問(wèn)題壓根不在一個(gè)頻道，比如：你的問(wèn)卷問(wèn)的是，您喝酒的頻率是多少，選項(xiàng)有：從不、偶爾、經(jīng)常，在用戶的眼里偶爾可能是1年喝一次，而我們覺(jué)得差不多1個(gè)月喝一次算偶爾，再比如訪談的時(shí)候問(wèn)用戶這個(gè)問(wèn)題：您覺(jué)得您喜歡下面哪個(gè)頁(yè)面的風(fēng)格？用戶：“什么是風(fēng)格？”
所以交互設(shè)計(jì)師有一個(gè)能力久顯得很重要了：讓萬(wàn)物都可與之對(duì)話的能力，對(duì)話需要什么，是語(yǔ)言。
我們都知道，語(yǔ)言是我們溝通的根本，語(yǔ)言是由詞匯按照一定的語(yǔ)法結(jié)構(gòu)在不同的語(yǔ)境中所組成的復(fù)雜系統(tǒng)。不同的種族有不同的語(yǔ)言，不同的專業(yè)有不同的語(yǔ)言例如在圍棋中有長(zhǎng)、立、并、空、頂?shù)鹊?，例如在模型手辦中有分線、滲線、勾線、補(bǔ)土等，這也都是在特頂專業(yè)領(lǐng)域中的一些術(shù)語(yǔ)，但這些并不是語(yǔ)言，只是在某個(gè)領(lǐng)域中大家總結(jié)出來(lái)便于溝通的文字符號(hào)。
所以我們?cè)倩氐缴戏娇匆幌露x，首先語(yǔ)言是由詞匯所組成，詞匯是由符號(hào)做組成，大家可能都聽(tīng)說(shuō)過(guò)比如樂(lè)高啊、原子理論這樣的組件搭建方法，但這些都僅僅只是規(guī)范，而并不是語(yǔ)言。語(yǔ)言擁有更強(qiáng)的普適性和通用性。
那么我所認(rèn)為的語(yǔ)言他首先包含了能夠組成詞匯的符號(hào)，這些符號(hào)大概就是指：點(diǎn)、線、面、體、色彩由這些點(diǎn)線面體可以組成的詞匯有：按鈕、文字、圖標(biāo)、圖片等。但是光有詞匯不行，在漢語(yǔ)中有12種詞類：名詞、動(dòng)詞、形容詞，在由句子組成的詞匯中包含了不同的成分：主、謂、賓、定、狀、補(bǔ)...這里不過(guò)多敘述。
語(yǔ)言很重要的一點(diǎn)它具有語(yǔ)境，語(yǔ)言的運(yùn)用包含了看聽(tīng)讀寫4個(gè)方面，看和聽(tīng)指的是輸入，讀和寫指的是輸出，那么交互設(shè)計(jì)語(yǔ)言中，也包含輸入和輸出兩種屬性，例如輸入指的是由不同“詞匯”組成的“句子”，比如由標(biāo)題、箭頭、色塊組成的一個(gè)itme，是一個(gè)可被理解、看懂的輸入屬性的控件。輸出指的是該控件可被出發(fā)并且進(jìn)行狀態(tài)的變化和所進(jìn)行的任務(wù)跳轉(zhuǎn)。
這里的控件雖然有兩個(gè)屬性，但是還需要語(yǔ)境來(lái)幫助我們理解，一個(gè)是它本身所能夠輸出的默認(rèn)狀態(tài)的，比如點(diǎn)擊之后的跳轉(zhuǎn)頁(yè)面，另外他也可以具備產(chǎn)品賦予的自定義屬性，例如底部滑出picker。
還有，在漢語(yǔ)中“去買兩個(gè)桃子吧”，這里的“兩”肯能是虛數(shù)也可能是實(shí)數(shù)，但是在交互設(shè)計(jì)中，我們?nèi)绾伪硎军c(diǎn)擊1下和兩下或者是多次呢，一般單擊的屬性通常可以有一些特性的符號(hào)屬性所表示出來(lái)，例如加下劃線的文字、一個(gè)帶箭頭的item、一個(gè)圖標(biāo)、一個(gè)帶有主色的文案等等，那么雙擊的話可以用雙箭頭來(lái)表示嗎，當(dāng)然不可以，雙擊在移動(dòng)端的手勢(shì)中具有放大、點(diǎn)贊、返回頂部、定位消息、定位光標(biāo)等功能。
那我們發(fā)現(xiàn)如果把交互設(shè)計(jì)能夠做成類似于語(yǔ)言的系統(tǒng)是非常有意思，并且有用的。這會(huì)讓更多信息不對(duì)稱的情況消失，不僅僅是設(shè)計(jì)師，在產(chǎn)品團(tuán)隊(duì)中大家都能夠有一套共性的交互語(yǔ)言系統(tǒng)，無(wú)疑是一件非常提高效率的事。但是目前的很多交互規(guī)范的文檔中，大多都是多種元素的拼合，給出常用的、可復(fù)用的控件、組件，但是大家依然還是無(wú)法從語(yǔ)言角度去創(chuàng)新，這就導(dǎo)致了很難會(huì)有新的、有用的交互形式的出現(xiàn)，比如很多搜索控件都是承載在頂部導(dǎo)航欄中，那么在做規(guī)范的時(shí)候也只能在這個(gè)組件上去微調(diào)，殊不知搜索這個(gè)控件的“語(yǔ)境”并不單單只能在頁(yè)面頂部，例如高德地圖做的就很好。這樣一來(lái)，這個(gè)組件的常規(guī)規(guī)范形式就能和很多產(chǎn)品區(qū)分開(kāi)來(lái)了，當(dāng)然要視產(chǎn)品形態(tài)不同。
市面上有許多的新零售電商產(chǎn)品，頁(yè)面中的信息流也是大同小異，但是無(wú)論是交互還是產(chǎn)品在做設(shè)計(jì)師必須要考慮的就是產(chǎn)品定位與當(dāng)前狀態(tài)。例如目前我們看到的都是以下的信息流樣式，但是我們要知道，30000個(gè)sku和3000個(gè)sku的展示策略肯定是不同的根據(jù)算法的瀑布流在30000個(gè)sku中可以隨意展示，但是3000個(gè)就不行了，很可能在算法的過(guò)程中用戶會(huì)頻繁看到重復(fù)的商品。所以使用雙列布局的方法并不合適。
所以這樣的產(chǎn)品首屏策略就顯得非常關(guān)鍵。我們可以看到常規(guī)的電商產(chǎn)品中，首屏基本上都是呈現(xiàn)這樣的策略，從頂部的搜索、分類、banner、分流入口、cta、營(yíng)銷瓷片區(qū)這樣的布局，從基本上能夠滿足一個(gè)大量sku電商產(chǎn)品的所有需求，但是如果用戶定位和產(chǎn)品本身的基礎(chǔ)無(wú)法支撐起這樣的場(chǎng)景又該如何去做首屏策略呢？
從交互角度入手，那么既然我們無(wú)法做到大而全，那么我們至少可以做到精準(zhǔn)、限時(shí)，讓用戶上癮的策略，上癮模型這邊不再贅述。所以類似云集在首屏的策略可以概括為整合搜索與banner、分流入口、cta、營(yíng)銷瓷片以及以時(shí)間為緯度展示的大圖信息流。重點(diǎn)在于可隨意控制的營(yíng)銷工具，以及時(shí)間軸的商品推薦，讓有限的資源呈現(xiàn)更多的形式變化以及讓用戶有時(shí)間概念，每天固定時(shí)間來(lái)進(jìn)行活躍。
通過(guò)交互手段我們也可以給運(yùn)營(yíng)工具更加靈活化打基礎(chǔ)。例如我們經(jīng)?？吹降臓I(yíng)銷瓷片可以劃分為非常多樣式與可能性，并且在后臺(tái)工具中靈活控制，同時(shí)除了日常的營(yíng)銷目的之外，在大促或者活動(dòng)需求下更可以將整一個(gè)首屏切換為極具氛圍的信息呈現(xiàn)。
最后總結(jié)一下，我認(rèn)為交互設(shè)計(jì)也包含了視覺(jué)，所以我們?cè)跊Q定用什么樣的設(shè)計(jì)形式之前需要考慮更多，入業(yè)務(wù)、用戶價(jià)值等等，從而用更加有價(jià)值的交互策略提出問(wèn)題、解決問(wèn)題會(huì)比單純的用規(guī)范去搭建界面更加有效。
不管是做UI設(shè)計(jì)還是畫插畫，有很多同學(xué)覺(jué)得自己是因?yàn)樘熨x不夠所以對(duì)色彩的敏感度不夠，其實(shí)不然。一個(gè)可能是大家總結(jié)的太少，從來(lái)都是憑感覺(jué)和運(yùn)氣去配色，但其實(shí)都是有講究的。本文不會(huì)給大家重復(fù)講解什么是rgb，什么是hsb，什么是cmyk或者什么三原色，這些大家都可以從某度中直接搜到。我今天要給大家分享的是人們是如何認(rèn)識(shí)色彩，并且在產(chǎn)品設(shè)計(jì)中使用的。
大家都知道，對(duì)于不同的顏色，我們對(duì)其的感知是不同的，有人覺(jué)得暖色在前，冷色在后。暖色更醒目，冷色不醒目。那這是什么原因呢？首先我們要知道我們眼睛內(nèi)存在兩種感光細(xì)胞：視錐細(xì)胞和視桿細(xì)胞，視桿細(xì)胞能夠感知光線強(qiáng)弱但無(wú)法感知顏色，而視錐細(xì)胞卻相反，視錐細(xì)胞內(nèi)還有3種對(duì)不同頻率光敏感的細(xì)胞。我們經(jīng)常會(huì)用到視錐細(xì)胞，而視桿細(xì)胞卻用的少，更多的是在黑暗的環(huán)境中使用的多。
視錐細(xì)胞的三種類型分別是低頻、中頻和高頻視錐細(xì)胞，分別對(duì)紅、綠、藍(lán)三種顏色的光敏感。而且這三個(gè)視錐細(xì)胞分別也有重合的部分。低頻視錐細(xì)胞對(duì)整個(gè)可見(jiàn)光頻譜都敏感，它的范圍包含的比較廣，特別是對(duì)于頻譜中段的黃色到紅色部分更加敏感。但是像高頻的紫色幾乎只有藍(lán)視錐細(xì)胞可以感知。
大家在平時(shí)生活中都能看到，在馬路上、機(jī)動(dòng)車道上以及一些警示牌都會(huì)采用黃色、橙色等標(biāo)識(shí)，因?yàn)檫@些非常醒目。更容易被紅視錐細(xì)胞感知到，但如果你的標(biāo)識(shí)用的是冷色調(diào)那這個(gè)交通事故可能要發(fā)生的頻繁的多。
我們來(lái)做個(gè)實(shí)驗(yàn)，如下圖，大家覺(jué)得在中間的灰色塊是純色還是漸變色，可能很多同學(xué)看上去都會(huì)覺(jué)得是個(gè)漸變色，但其實(shí)它就是一個(gè)純色，不信的同學(xué)可以自己在工具中嘗試一下。
但如果你把這個(gè)色塊拿出來(lái)后，不在這個(gè)環(huán)境中直接進(jìn)行邊緣對(duì)比，那就不會(huì)出現(xiàn)漸變的情況了。那光說(shuō)原理，我們也來(lái)看一下在產(chǎn)品設(shè)計(jì)中需要注意的地方，因?yàn)樵赨I界面設(shè)計(jì)中我們通常需要把一些圖片、卡片疊加放置，這樣就會(huì)造成邊緣視覺(jué)的對(duì)比，本來(lái)不明顯的兩個(gè)元素重疊之后變的很明顯。所以例如一些標(biāo)簽的背景色和頁(yè)面整體的背景色。
如果你想要讓兩個(gè)顏色接近的元素具有識(shí)別度，那么最好將這兩個(gè)元素進(jìn)行重疊擺放而不是分開(kāi)擺放。另外，如果是卡片樣式的設(shè)計(jì)，背景色一定不要過(guò)于灰暗也不要過(guò)于淺白，過(guò)于深的話會(huì)讓卡片輪廓過(guò)于明顯而導(dǎo)致整體看上去顯臟以及很明顯的對(duì)比，顯得不自然和舒適。如果過(guò)于淺的話也會(huì)導(dǎo)致信息的不聚焦。
還有，為什么被框起來(lái)的文字會(huì)看上去更加有點(diǎn)擊的欲望其實(shí)也是這個(gè)道理，因?yàn)槲淖趾捅尘隘B加產(chǎn)生的輪廓只是文字的輪廓，在我們的第一印象中只是一種符號(hào)，當(dāng)它被賦予顏色之后我們才會(huì)意識(shí)到它需要我們?nèi)プ⒁饣蛘呖杀稽c(diǎn)擊，但依然還是不夠明顯，所以為了強(qiáng)化可點(diǎn)擊這個(gè)感覺(jué)，我們才用了線框、背景色、箭頭等方式。
一般來(lái)說(shuō)，產(chǎn)品都會(huì)有一個(gè)品牌的主色。而這個(gè)品牌的主色也通常會(huì)運(yùn)用在外面的產(chǎn)品界面中，所以例如閑魚、馬蜂窩等，主色都采用了黃色，黃色具有非?；顫?、有趣、好玩的特性，無(wú)論是線上還是線下都使用了這個(gè)品牌黃色，從每一個(gè)線上元素的主色，到線下包裝的印刷色。
但一定要注意的是，如果品牌的主色偏灰偏暗的話，可能不太適合線上的產(chǎn)品進(jìn)行通用。例如之前的嚴(yán)選、云集、711便利店、宜家等產(chǎn)品的主色都是偏深和暗的，所以在線上的界面用起來(lái)會(huì)非常不和諧，和整體偏淺色、輕的風(fēng)格對(duì)比起來(lái)太強(qiáng)烈，引起不適。
而且線上覺(jué)得還OK的顏色，由于印刷的原理，實(shí)物也會(huì)更加偏低飽和和偏暗。
我們?cè)谏弦黄f(wàn)個(gè)為什么文章里提到了人們?nèi)绾伍喿x信息，提到了一個(gè)視覺(jué)凹的概念。所以在界面中，什么樣的地方使用色彩是有講究的。所以在這里通常會(huì)需要使用顏色的地方在于希望引導(dǎo)用戶和吸引用戶注意的地方才會(huì)使用色彩。例如下方產(chǎn)品，使用了高亮色來(lái)引導(dǎo)用戶視覺(jué)。
當(dāng)然色彩的運(yùn)用也會(huì)講整個(gè)頁(yè)面的層級(jí)凸顯出來(lái)，而不單純的用中性色來(lái)區(qū)分層級(jí)。
同樣是上兩張圖，大家可以清晰的看到，美團(tuán)中的附近熱賣好點(diǎn)、滿減標(biāo)簽、價(jià)格，其實(shí)都只具備信息的呈現(xiàn)，但不具備交互的特征和狀態(tài)。但淘票票中的“4.7萬(wàn)”和“展開(kāi)”卻不一樣，“展開(kāi)”使用了輔助藍(lán)色，這里的展開(kāi)就具備這個(gè)文案所描述的這個(gè)控件具備的交互特性-點(diǎn)擊后將隱藏的文字展示出來(lái)。藍(lán)色一般我們都會(huì)使用在某個(gè)可點(diǎn)的鏈接上，當(dāng)然也會(huì)有其他的色彩來(lái)表示可點(diǎn)擊。
所以不是所有的元素都要賦予顏色，這樣會(huì)使整個(gè)頁(yè)面非?；靵y
另外，UI設(shè)計(jì)中主色除了引導(dǎo)用戶的作用外，也可以表示當(dāng)前正被激活的信息狀態(tài)。例如愛(ài)奇藝app中播放詳情頁(yè)面，當(dāng)前板塊標(biāo)簽和正在播放劇集的激活狀態(tài)。
色彩除了上方所述的字段中的不同使用，在圖片和整體氛圍營(yíng)造中也起了很大的作用，目前很多2c的產(chǎn)品往往會(huì)在界面氛圍的營(yíng)造中運(yùn)用一些手段。例如導(dǎo)航欄、底部標(biāo)簽欄上的圖標(biāo)，或者在首頁(yè)營(yíng)銷板塊的瓷片區(qū)域都會(huì)用品牌色在活動(dòng)時(shí)段內(nèi)進(jìn)行氛圍打造
在色彩的心理學(xué)上，大家都知道每個(gè)顏色具有一定的性格特征和表達(dá)。而且都會(huì)有正反兩面，可以看下方多種色彩的描述。
然而其實(shí)很多的產(chǎn)品使用的色彩和我們所認(rèn)知的會(huì)有一些差別，比如咖啡品牌的主色選擇，在我們常規(guī)人之中，咖啡應(yīng)該是褐色、棕色，但是大家看到星巴克、瑞幸、漫咖啡其實(shí)都用了和咖啡本質(zhì)沒(méi)什么關(guān)系的顏色
在瑞幸剛出來(lái)的時(shí)候，很多人其實(shí)不太習(xí)慣把這個(gè)藍(lán)色和咖啡結(jié)合起來(lái)，但是為了塑造品牌差異化，瑞幸一直將“藍(lán)色”作為品牌的主基調(diào)，“小藍(lán)杯”這一稱呼不但讓消費(fèi)者感到親切，也在眾多的咖啡中有了屬于自己的記憶點(diǎn)。在這支廣告片中，主基調(diào)同樣是使用藍(lán)色，不但符合了當(dāng)下消費(fèi)者的視覺(jué)偏好，也在為用戶留下記憶點(diǎn)之后，也讓用戶在看到藍(lán)色時(shí)自然而然的想到瑞幸咖啡。
但凡各位使用了這樣的配色，保證各位過(guò)不了試用期，相信我。所以大家千萬(wàn)要避開(kāi)。
會(huì)讓人產(chǎn)生“幻覺(jué)”！讓人產(chǎn)生視覺(jué)疲勞，例如我將餓了么這個(gè)界面的色調(diào)調(diào)整一下大家看一下，不亮瞎算我輸。
為什么很多時(shí)候我們總覺(jué)得界面臟兮兮的。是因?yàn)槲覀冊(cè)诮缑婊蛘吲渖惺褂昧诉^(guò)多的低飽和度、灰度較多的配色。所以這個(gè)也是要避免的
讓界面或者插畫看起來(lái)非常混亂。一般來(lái)說(shuō)顏色的使用也需要有側(cè)重點(diǎn)，所以我們常用的方法是6、3、1的色彩配比。
熒光色絕對(duì)不可以使用在UI界面中，尤其是主色。會(huì)讓你瞬間失明！
在很多dribbble的飛機(jī)稿中，經(jīng)常能看到這樣的配色和練習(xí)。無(wú)論是在練習(xí)中還是實(shí)際項(xiàng)目中，這樣的界面也完全無(wú)法讓用戶看到想看的信息，沒(méi)有重點(diǎn)且輕飄飄的感覺(jué)。
說(shuō)真的，這樣的風(fēng)格確實(shí)耳目一新，但個(gè)人覺(jué)得可能不會(huì)成為主流。因?yàn)樗秃偷谖宸N一樣：信息可識(shí)別性很差。就不說(shuō)色弱的人群，就正常的用戶來(lái)說(shuō)大面積的白色+飽和度低的元素結(jié)合感覺(jué)就是得了“白內(nèi)障”。另外我們常說(shuō)的一點(diǎn)就是所有元素都強(qiáng)調(diào)就等于什么都沒(méi)有強(qiáng)調(diào)，這樣的風(fēng)格在每一個(gè)元素都具有陰影的情況下都在爭(zhēng)先恐后讓用戶感知，原則是輕量化卻又需要那么多陰影，這樣就有點(diǎn)自相矛盾的感覺(jué)。
為了營(yíng)造這樣的“新擬物”的輕量氛圍，還不得不在整個(gè)界面中簡(jiǎn)化大部分元素，能不加文字就不能加文字，說(shuō)的好聽(tīng)叫做使用了奧卡姆剃刀原則，有一句話一直非常影響我做設(shè)計(jì)：“設(shè)計(jì)是需要被簡(jiǎn)化的，但是簡(jiǎn)化的過(guò)程一定不簡(jiǎn)單”。所以不是單純的簡(jiǎn)化所有元素為了達(dá)到這個(gè)風(fēng)格的目的。
例如下方，兩種對(duì)抗色重疊后會(huì)引起視覺(jué)閃爍的感覺(jué)。是不是覺(jué)得我有點(diǎn)帥的晃眼
首先我們必須要說(shuō)，色彩肯定是需要結(jié)合產(chǎn)品和用戶的定位去指定和提煉的，所以前期會(huì)需要去做一些研究例如用戶畫像，品牌沖刺或者是情緒板等方法。得到幾類“真實(shí)的虛擬用戶”，從而確定一些主色的方案。然后我們?cè)谥魃倪x擇中需要避開(kāi)上面體到的坑，并且對(duì)市面上的app進(jìn)行總結(jié)，我們發(fā)現(xiàn)大部分的產(chǎn)品色，簡(jiǎn)單來(lái)講在我們HSB模式中去色都在一個(gè)固定的范圍，就像這樣。
在上文中也說(shuō)到用色比例的631法則，所以在選取輔助色的時(shí)候我們需要定義好輔助色可以用在什么地方。例如知乎，其實(shí)輔助色沒(méi)有非常明顯的1種或者兩種，都是多色的輔助色方案，都在一個(gè)配色的系統(tǒng)中選取顏色即可。大部分產(chǎn)品目前都是這樣的策略，一個(gè)主色搭配多個(gè)輔色，如果有其他獨(dú)立的板塊可能需要重新定義專屬的配色策略。
其次再定義中性色，比如字體和線條以及背景色。字體是為了讓信息有對(duì)比，顯示層級(jí)，那么通常給2-3種層級(jí)即可，至少2種，至多3種。在選擇3個(gè)層次的中性色文字是，給大家一個(gè)建議：標(biāo)題/正文文字顏色HSB的B值不要大于20.備注和次要文字b值不要大于50，默認(rèn)文字不要大于80，大家可以去嘗試一下，且中性色不得使用純黑。
文章來(lái)源：站酷 作者：應(yīng)駿
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
你是否有在聽(tīng)別人說(shuō)某某原理法則時(shí)一臉懵B的時(shí)候？明明知道這個(gè)原理卻說(shuō)不出它的名字？不要緊，本文就來(lái)介紹與人機(jī)交互設(shè)計(jì)相關(guān)的15個(gè)常見(jiàn)的設(shè)計(jì)心理學(xué)原理，約13000字，幫助你了解產(chǎn)品的定位，需求目的和交互邏輯，洞悉用戶的各種行為，也為自己的設(shè)計(jì)予以理論支撐。
1956年美國(guó)科學(xué)家米勒對(duì)人類短時(shí)間記憶能力進(jìn)行了研究，他注意到年輕人的記憶廣度為5-9個(gè)單位，就是7±2法則。與席克定律類似，神奇數(shù)字 7±2 法則也經(jīng)常被應(yīng)用在移動(dòng)應(yīng)用交互設(shè)計(jì)上。
因?yàn)槿四X處理信息的能力有限，所以它通過(guò)把信息分成塊和單元來(lái)處理復(fù)雜問(wèn)題。7±2法則應(yīng)用很廣泛，例如iPhone通訊錄中的手機(jī)號(hào)碼被分割成”xxx-xxxx-xxxx“的形式，還有銀行卡號(hào)、身份證號(hào)，我們總是喜歡把一長(zhǎng)串?dāng)?shù)字拆分開(kāi)來(lái)讀寫，目的就是降低記憶成本，提高信息的易讀性，從而達(dá)到視覺(jué)防錯(cuò)的作用。
Web導(dǎo)航欄選項(xiàng)卡數(shù)量不超過(guò)9個(gè)
在設(shè)計(jì)網(wǎng)頁(yè)導(dǎo)航時(shí)，如果希望用戶記住導(dǎo)航區(qū)域的內(nèi)容或者一個(gè)路徑的順序，那么數(shù)量應(yīng)該控制在7個(gè)左右（不超過(guò)9個(gè)），如蘋果、Dribbble、behance等網(wǎng)站的導(dǎo)航分類。
Web導(dǎo)航欄選項(xiàng)卡數(shù)量過(guò)多時(shí)
如果導(dǎo)航或選項(xiàng)卡內(nèi)容很多，可以用一個(gè)樹(shù)狀層級(jí)結(jié)構(gòu)來(lái)展示各級(jí)別關(guān)系，但要注意其廣度和深度的平衡。例如人人都是產(chǎn)品經(jīng)理和Dribbble，把更多子類別收在二級(jí)目錄里。
移動(dòng)端選項(xiàng)卡導(dǎo)航
在移動(dòng)端應(yīng)用設(shè)計(jì)中，常見(jiàn)的電商app例如奈雪和樂(lè)凱撒分類模塊，兩個(gè)產(chǎn)品的商品分類布局形式很相似，都是用了選項(xiàng)卡的方式來(lái)分類商品，層級(jí)明確，相應(yīng)的提升了用戶找尋單品的效率。
Tabbar區(qū)標(biāo)簽最多不超過(guò)5個(gè)
在移動(dòng)應(yīng)用設(shè)計(jì)中，底部Tabbar最少3個(gè)，最多為5個(gè)（幾乎沒(méi)幾個(gè)超過(guò)5個(gè)），這樣做除了減輕用戶記憶負(fù)擔(dān)，超過(guò)5個(gè)會(huì)降低視覺(jué)和操作上的體驗(yàn)。事實(shí)上就算只有4個(gè)，我們也經(jīng)常想不起微信底部的4個(gè)Tab分別是啥。
頂部導(dǎo)航欄頁(yè)簽
我們看到的大部分app頂部導(dǎo)航欄的頁(yè)簽數(shù)量都嚴(yán)格遵循了7±2法則，雖然在橫軸可無(wú)限滑動(dòng)，
但在顯示區(qū)域只保持7±2法則的顯示數(shù)量，例如馬蜂窩、飛豬旅行等。
金剛區(qū)圖標(biāo)不超過(guò)8個(gè)
我們常說(shuō)的“八大金剛”就是一屏顯示8個(gè)圖標(biāo)，超過(guò)的則放在第二屏。如果兩行10個(gè)，往往第十個(gè)是“更多”入口，總的來(lái)說(shuō)也沒(méi)超過(guò)9個(gè)。
banner文案不超過(guò)9個(gè)字
產(chǎn)品運(yùn)營(yíng)banner主文案字?jǐn)?shù)通?？刂圃?個(gè)字以內(nèi)，在設(shè)計(jì)時(shí)也通常把長(zhǎng)標(biāo)題一分為二排兩行，便于用戶快速閱讀，提升點(diǎn)擊率。
在交互設(shè)計(jì)中，7±2法則是減少用戶認(rèn)知負(fù)荷，提升用戶體驗(yàn)的重要環(huán)節(jié)。同時(shí)還強(qiáng)調(diào)了在設(shè)計(jì)過(guò)程中對(duì)產(chǎn)品的預(yù)見(jiàn)性，避免在不斷為產(chǎn)品添加功能時(shí)，破壞原有的視覺(jué)基礎(chǔ)。
0無(wú)需說(shuō)明書
喬布斯曾說(shuō)過(guò)：“蘋果應(yīng)該創(chuàng)造所有人都可以使用的產(chǎn)品，即使沒(méi)有用戶指南”。
1 一看就會(huì)
簡(jiǎn)單易懂，看一眼就明白你想說(shuō)什么，不用教學(xué)就知道怎么用。
2秒法則
所謂“2秒法則”，是指用戶在使用某類系統(tǒng)時(shí)的等待時(shí)長(zhǎng)不超過(guò)2秒。在極短的時(shí)間內(nèi)展示重要信息，給用戶留下深刻的第一印象。這里的2秒只是一個(gè)象征意義上的表達(dá)，也許有一點(diǎn)隨意，但是這卻是一個(gè)合理的數(shù)量級(jí)。我們熟知的“F”瀏覽模式其實(shí)就是間接縮短用戶看到重要信息的時(shí)長(zhǎng)，達(dá)到快速瀏覽的目的。
進(jìn)入App的首頁(yè)加載時(shí)間如果過(guò)長(zhǎng)就會(huì)導(dǎo)致用戶產(chǎn)生厭煩情緒，很容易退出甚至卸載App的行為。因此我們看到許多應(yīng)用將首頁(yè)加載時(shí)的空白頁(yè)進(jìn)行占位圖設(shè)計(jì)。
下拉刷新也是一個(gè)設(shè)計(jì)點(diǎn)，為避免刷新時(shí)間過(guò)長(zhǎng)，設(shè)計(jì)師通常會(huì)在加載動(dòng)畫上做文章。充滿趣味性的動(dòng)效能安撫用戶焦躁不安的心情，無(wú)形中降低了用戶對(duì)等待時(shí)間的感知。
APP里面的banner設(shè)計(jì)要有視覺(jué)沖擊力，如果兩秒之內(nèi)沒(méi)有抓住用戶的眼球，可能就被用戶忽略了。
因此，在設(shè)計(jì)互聯(lián)網(wǎng)產(chǎn)品的頁(yè)面時(shí)，用戶等待的時(shí)間越短，用戶體驗(yàn)越佳。反之，就會(huì)讓用戶產(chǎn)生焦慮的情緒。
3次點(diǎn)擊法則
用戶在3次點(diǎn)擊之內(nèi)如果還沒(méi)有找到他們想要的信息或了解網(wǎng)站特色，他們就會(huì)離開(kāi)該網(wǎng)站。這條原則突出了清晰的導(dǎo)航，符合邏輯的結(jié)構(gòu)和易于理解的網(wǎng)站層級(jí)的重要性。(來(lái)自《眾妙之門》P133)
其實(shí)在交互體驗(yàn)中，點(diǎn)擊的次數(shù)往往是無(wú)關(guān)緊要的。只要每次點(diǎn)擊都是無(wú)需思考的，毫不費(fèi)力地順勢(shì)進(jìn)行，那么用戶的挫敗感就會(huì)大大降低。如果你的網(wǎng)站能夠讓用戶知道他在哪里，從哪里來(lái)，要到哪里去，并且能夠讓用戶了解如何完成目標(biāo)，這樣的點(diǎn)擊即使有10次也是沒(méi)有問(wèn)題的。例如，在京東購(gòu)買一件商品需要經(jīng)過(guò)“立即購(gòu)買>確定>提交訂單>選擇支付方式”4次點(diǎn)擊才能到訂單支付頁(yè)面完成購(gòu)買，這過(guò)程中可能還穿插其他的點(diǎn)擊行為（比如選擇地址、優(yōu)惠券），用戶并沒(méi)有感受到不方便，使用過(guò)程流暢而自然。
在可用性測(cè)試領(lǐng)域，“三次點(diǎn)擊”定律一直是一個(gè)很具爭(zhēng)議內(nèi)容。體現(xiàn)在以下幾點(diǎn)：
·研究表明，用戶在超過(guò)3次點(diǎn)擊還沒(méi)到達(dá)想去的頁(yè)面時(shí)，往往并沒(méi)有退出網(wǎng)站，而是會(huì)繼續(xù)多點(diǎn)幾次；
·當(dāng)把一個(gè)3次點(diǎn)擊就能到達(dá)的流程改為4次點(diǎn)擊的時(shí)候，用戶發(fā)現(xiàn)目標(biāo)頁(yè)面的能力反而提升了600%；
·合理的導(dǎo)航系統(tǒng)比點(diǎn)擊次數(shù)更重要；
·比起“3次點(diǎn)擊”，有人提出了“1次點(diǎn)擊”定律，即用戶的每一次點(diǎn)擊都應(yīng)該讓他們更接近目標(biāo)，同時(shí)盡量減少能干擾實(shí)現(xiàn)這一目標(biāo)的因素；
·用戶抱怨要花很長(zhǎng)時(shí)間才能找到某個(gè)產(chǎn)品，實(shí)際上他們是在抱怨無(wú)法找到想要的東西，如果用戶找到了想要的東西，他們就不會(huì)抱怨點(diǎn)擊的次數(shù)了；
英國(guó)心理學(xué)家William Edmund Hick認(rèn)為，在簡(jiǎn)單的判斷場(chǎng)景中：一個(gè)人所面臨的選擇越多，做出決定所花的時(shí)間就越長(zhǎng)。有時(shí)候在選擇中花費(fèi)太長(zhǎng)時(shí)間從而導(dǎo)致決策失敗。
生活中我們也經(jīng)常會(huì)面臨選擇困難癥，比如早上起床就糾結(jié)今天穿什么？中午去食堂就會(huì)糾結(jié)吃什么？造成我們?nèi)绱思m結(jié)的原因就是因?yàn)檫x擇太多了（遠(yuǎn)古人就沒(méi)這些煩惱，尋找食物時(shí)逮著什么就吃什么）。
在設(shè)計(jì)中的應(yīng)用
應(yīng)用到界面設(shè)計(jì)中也是如此，選項(xiàng)越多，意味著用戶做出決策的時(shí)間越長(zhǎng)。
例如APP Store首頁(yè)，改版前的首頁(yè)把眾多app平鋪出來(lái)，對(duì)目的不明確的用戶來(lái)說(shuō)選擇有點(diǎn)多。改版后的首頁(yè)大幅減少了App的數(shù)量，卡片的設(shè)計(jì)方式簡(jiǎn)潔且目標(biāo)清晰。
不得不面對(duì)較多選項(xiàng)時(shí)， 對(duì)主要和次要的選項(xiàng)做視覺(jué)權(quán)重區(qū)分，做好設(shè)計(jì)上的歸類，提升用戶做決定的效率。例如美團(tuán)外賣金剛區(qū)第一行5個(gè)入口的圖標(biāo)在尺寸和表現(xiàn)手法上都比下面的入口圖標(biāo)要大更醒目?！拔业摹表?yè)面把一些低頻率功能或不太重要的功能收納到“設(shè)置”里，此外還可以通過(guò)置灰、鎖定等方法間接減少選項(xiàng)，降低干擾。
對(duì)于多流程的任務(wù)進(jìn)行分步操作，讓用戶專注眼前任務(wù)。 例如Clubhouse注冊(cè)時(shí)，把需要用戶選擇的選項(xiàng)分步引導(dǎo)完成，讓用戶能專注當(dāng)前行為。
對(duì)于多種類別的選項(xiàng)應(yīng)當(dāng)做二次分類的區(qū)分，我們都知道電商平臺(tái)的品類繁多，僅通過(guò)單一分類是不夠的，比如數(shù)碼頻道下面還分相機(jī)、影音娛樂(lè)、數(shù)碼配件、智能設(shè)備、電子教育等大的分類。商品詳情頁(yè)的篩選功能也是貼合使用場(chǎng)景來(lái)設(shè)計(jì)的，所以分類不怕多，就怕混亂。
適用邊界
雖然選擇越少，用戶做決策的時(shí)間越短，但這并不是提高用戶體驗(yàn)的唯一標(biāo)準(zhǔn)，過(guò)度的減少選項(xiàng)，可能導(dǎo)致負(fù)面效果。
如上圖右，如果在刪除App的彈窗中只有一個(gè)“刪除”選項(xiàng)，沒(méi)有明顯的取消之類的途徑，那么用戶會(huì)覺(jué)得特別難受，感覺(jué)被強(qiáng)迫去刪除。如果當(dāng)下有急需使用手機(jī)處理一些事情，那么這樣會(huì)把這種負(fù)面情緒給無(wú)限放大，讓用戶抓狂。
?？硕芍饕苡绊懹谶x項(xiàng)的多少，但是它不適用于需要高難度閱讀的任務(wù)。例如考試試題每道題只給你A、B兩個(gè)選項(xiàng)（學(xué)渣竊喜），那也太容易蒙了，這就是?？硕稍诖鸢冈囶}中的局限性。
?？硕墒且粋€(gè)可以適用于設(shè)計(jì)的指南，記住要盡量減少用戶在一次決策中要做的選項(xiàng)，因?yàn)闆Q策效率是一個(gè)產(chǎn)品導(dǎo)致用戶流失的重要原因之一。引導(dǎo)用戶在明確的選項(xiàng)之間進(jìn)行選擇，以便快速將他們送到某個(gè)地方（例如賬單支付），這將大大提升用戶體驗(yàn)并達(dá)到你的目標(biāo)。
費(fèi)茨定律由心理學(xué)家Paul Fitts提出，用來(lái)預(yù)測(cè)從任意一點(diǎn)到目標(biāo)中心位置所需時(shí)間與該點(diǎn)到目標(biāo)的距離和大小有關(guān)，距離越大時(shí)間越長(zhǎng)，目標(biāo)越大時(shí)間越短。舉例來(lái)說(shuō)，你伸手去拿桌子上的咖啡杯，開(kāi)始你的手臂迅速地往杯子位置移動(dòng)，接著你會(huì)放慢速度直至找到杯子把手，這個(gè)杯子把手的大小與你“抓住”它有著一定的關(guān)系。
如上圖所示，如果光標(biāo)現(xiàn)在在任易地點(diǎn)想要去點(diǎn)擊目標(biāo)target，最短路徑一定是D，最短路徑上容錯(cuò)的最長(zhǎng)路徑是D+W，只要水平上移動(dòng)超過(guò)了D+W你就點(diǎn)不到了，而這個(gè)點(diǎn)擊動(dòng)作所耗的時(shí)間是一個(gè)常數(shù)加上一個(gè)以D為正比W為反比的函數(shù)的和。
詳細(xì)解釋如下，圖中紅色方塊代表點(diǎn)擊目標(biāo)，虛線代表移動(dòng)路徑，此時(shí)因?yàn)榧t色方塊目標(biāo)較大，所以用戶從任何一處點(diǎn)擊都很容易（可以用鼠標(biāo)在屏幕任意點(diǎn)移至紅色方塊試試）。
相反，紅色方塊目標(biāo)變小，快速點(diǎn)擊就會(huì)困難很多，很難一次到位。
但如果紅色方塊目標(biāo)很小距離很近的話，因?yàn)橐苿?dòng)范圍小，也能準(zhǔn)確的點(diǎn)擊到。
按鈕越大越容易點(diǎn)擊
在頁(yè)面中，大而近的目標(biāo)區(qū)域意味著用戶不需要做太精細(xì)的調(diào)整就可以輕易的觸達(dá)目標(biāo)。比如頁(yè)面中的大按鈕。
將按鈕放置在離開(kāi)始點(diǎn)較近的地方
夸克瀏覽器的搜索欄就放在離手最近的屏幕底部區(qū)域，相比常見(jiàn)頂部搜索欄更方便操作，效率更高。
相關(guān)按鈕之間距離近點(diǎn)更易于點(diǎn)擊
注冊(cè)登錄界面，通常將「注冊(cè)」和「登錄」放到一起，不僅可以在視覺(jué)上增強(qiáng)用戶對(duì)他們相關(guān)性的認(rèn)知，還可以減少在他們之間的距離 。
適用邊界
費(fèi)茨定律鼓勵(lì)減少距離，增加目標(biāo)大小以提升用戶效率，但反過(guò)來(lái)亦適用。比如iPhone關(guān)機(jī)按鈕，沒(méi)有使用點(diǎn)擊關(guān)閉，而采用滑動(dòng)操作，還把按鈕放在屏幕頂部，這樣明顯增加了操作難度，進(jìn)而避免了用戶誤操作。
App彈窗經(jīng)常把“關(guān)閉”按鈕放在卡片的右上角離手遠(yuǎn)的地方，希望用戶先完成彈窗提示的任務(wù)。還有啟動(dòng)頁(yè)廣告，喜歡把“跳過(guò)”按鈕放在難以點(diǎn)擊的右上角（恰飯重要），以提高用戶的誤觸機(jī)率提高轉(zhuǎn)化。
思考小結(jié)
按鈕越大越容易點(diǎn)擊，因此在程序開(kāi)發(fā)中，會(huì)增加按鈕點(diǎn)擊的熱區(qū)范圍，減輕用戶精準(zhǔn)點(diǎn)擊的壓力。但也不能過(guò)分的大，容易引起誤觸；
讓相關(guān)聯(lián)的內(nèi)容更靠近彼此，用視覺(jué)手法增強(qiáng)用戶對(duì)它們相關(guān)性的認(rèn)知。距離產(chǎn)生美，注意不要靠的太近，會(huì)出事；
將按鈕放置在離出發(fā)點(diǎn)較近的地方，比如頁(yè)面主按鈕一般會(huì)放在屏幕底部易操作區(qū)域；
屏幕的邊角很適合放置像菜單欄和按鈕這樣的元素，因?yàn)樵谄聊贿吘壓徒锹湮恢糜?strong style="outline:0px;margin:0px;padding:0px;">“無(wú)限可選中”的屬性，可以大膽操作而無(wú)需“微調(diào)”，參見(jiàn)macOS底部dock欄；
定律的反向使用可以適用一些特殊場(chǎng)景，比如想達(dá)到某種目的而降低按鈕被點(diǎn)擊的可能；
“任何事物都具有其固有的復(fù)雜性，無(wú)法簡(jiǎn)化”。
泰斯勒定律（Tesler’s Law）由Larry Tesler于1984年提出，也稱「復(fù)雜度守恒定律」。
該定律認(rèn)為：每一個(gè)過(guò)程都有其固有的復(fù)雜性，存在一個(gè)臨界點(diǎn)，超過(guò)了這個(gè)點(diǎn)過(guò)程就不能再簡(jiǎn)化了，你只能將固有的復(fù)雜性從一個(gè)地方移動(dòng)到另外一個(gè)地方。
生活中很多我們習(xí)以為常，感覺(jué)便捷方便的生活方式，是無(wú)數(shù)卓越的數(shù)學(xué)家、工程師、設(shè)計(jì)師等無(wú)數(shù)的時(shí)間投入，才實(shí)現(xiàn)的某個(gè)小功能，是他們把這些復(fù)雜性轉(zhuǎn)移到自己身上替我們簡(jiǎn)化了。
說(shuō)回移動(dòng)端，每個(gè)應(yīng)用中都有其無(wú)法簡(jiǎn)化的復(fù)雜度，也不能按照我們個(gè)人意愿去除這些功能。這就是為什么飛機(jī)稿都簡(jiǎn)潔好看，而一搬到線上就面目全非。常見(jiàn)的復(fù)雜性轉(zhuǎn)移有：“查看更多”、“查看全部”、“查看詳情”、“展開(kāi)和收起”之類的文字做轉(zhuǎn)移跳轉(zhuǎn)，比如：頂部導(dǎo)航欄的更多圖標(biāo)，就是將常用的功能整合并隱藏在首頁(yè)設(shè)計(jì)的更多功能模塊中，把用戶的操作范圍轉(zhuǎn)移到另一個(gè)地方。
除此之外，還有一些降低操作復(fù)雜度的方法：
刪除、組織、隱藏
視覺(jué)層面的“降噪”方法，刪除會(huì)干擾用戶操作的選項(xiàng)；功能分類明確，圍繞用戶行為組織信息內(nèi)容；隱藏那些不常用而又不能少的功能，延遲及階段性展示?？偟膩?lái)說(shuō)就是將復(fù)雜的信息收起來(lái)，展示重要且簡(jiǎn)潔的界面。
簡(jiǎn)化交互設(shè)計(jì)
可以用代碼節(jié)省用戶操作時(shí)間的地方，是互聯(lián)網(wǎng)人一致的追求。例如，B站的一鍵三連，用戶長(zhǎng)按點(diǎn)贊按鈕，會(huì)同時(shí)觸發(fā)點(diǎn)贊、投幣和收藏，省時(shí)省力。
算法解放“生產(chǎn)力”
個(gè)性化算法就是通過(guò)技術(shù)手段，將用戶復(fù)雜度降低，而轉(zhuǎn)移到開(kāi)發(fā)者身上。抖音為什么會(huì)讓人上癮？是算法知道了你的喜好，專推給你喜歡的內(nèi)容而不用自己去找，誰(shuí)都喜歡私人定制。這對(duì)用戶來(lái)說(shuō)是一件好事，但就像魯迅說(shuō)的：“你覺(jué)得好，一定是有人在負(fù)重前行”，這里的簡(jiǎn)化復(fù)雜的難度就轉(zhuǎn)移到設(shè)計(jì)和開(kāi)發(fā)身上了，還逼得機(jī)器去學(xué)習(xí)。例如抖音、淘寶、知乎首頁(yè)推薦的內(nèi)容都是基于你的喜好定制化推薦給你的。
我們常說(shuō)以用戶為中心去設(shè)計(jì)，就需要從用戶角度出發(fā)，在交互設(shè)計(jì)中盡量簡(jiǎn)化操作的復(fù)雜度，降低學(xué)習(xí)成本。但如“復(fù)制粘貼之父” Larry Tesler (1945-2020) 所說(shuō)：“任何事物都具有其固有的復(fù)雜性，無(wú)法簡(jiǎn)化”。因此，如何取得復(fù)雜度的“平衡點(diǎn)”就是重要的部分，是讓工程師及設(shè)計(jì)師花費(fèi)大量時(shí)間去降低產(chǎn)品的使用難度，還是在設(shè)計(jì)中保留一定的復(fù)雜度是我們需要思考的事。
該原理是由麥肯錫國(guó)際管理咨詢公司顧問(wèn)Barbara Minto提出的理論，她強(qiáng)調(diào)結(jié)論先行，論點(diǎn)自上而下。
你是否遇到過(guò)這樣的場(chǎng)景，部門開(kāi)會(huì)時(shí)有人口若懸河的講了半天，到最后你都不知道他想說(shuō)什么。所以如果開(kāi)會(huì)時(shí)你會(huì)走神，這不怪你，只怪講演者說(shuō)話沒(méi)有邏輯，沒(méi)有重點(diǎn)。
金字塔原理指示結(jié)構(gòu)化表達(dá)遵循結(jié)論先行的原則，即任何問(wèn)題都能歸納出一個(gè)中心點(diǎn)，讓受眾能夠第一時(shí)間清楚你想談?wù)摰闹黝}。然后由數(shù)個(gè)論據(jù)作支撐，而這些一級(jí)論據(jù)可以繼續(xù)由數(shù)個(gè)二級(jí)論據(jù)支撐，如此延伸，狀如金字塔。自上而下，上層影響下層。
應(yīng)用到交互設(shè)計(jì)上，即將信息展示的重點(diǎn)與交互行為的主任務(wù)優(yōu)先展示，再根據(jù)用戶在這個(gè)界面上所愿意停留時(shí)間逐級(jí)給予更多細(xì)節(jié)補(bǔ)充。以京東的商品詳情頁(yè)為例，首先金字塔的最上層是用戶目標(biāo)明確直接進(jìn)行“立即購(gòu)買”的底部全局按鈕，其次是商品的頭圖和用戶評(píng)價(jià)這些，讓用戶了解更多信息，進(jìn)一步促成購(gòu)買，最后一層是提供商品相關(guān)的全部信息、參數(shù)、評(píng)分等，確保交易的最終完成。在這個(gè)過(guò)程中，用戶在每一層花的時(shí)間也在逐級(jí)增加，呈金字塔狀。
映射到設(shè)計(jì)師身上也是如此，從設(shè)計(jì)新人到設(shè)計(jì)總監(jiān)，中間差的就是一個(gè)完整的設(shè)計(jì)技能金字塔。就像升級(jí)打怪，每完成一項(xiàng)任務(wù)獲得相應(yīng)的經(jīng)驗(yàn)值，累積的經(jīng)驗(yàn)值幫助我們更快的升到下一級(jí)。當(dāng)把工作中的需要攻克的難題一一解決之后，你的設(shè)計(jì)水平會(huì)在不知不覺(jué)中更加精進(jìn)，形成一套自己的設(shè)計(jì)風(fēng)格，成為一名優(yōu)秀的設(shè)計(jì)師。
有趣的是，把金字塔模型倒過(guò)來(lái)就成了“用戶漏斗模型”。自上而下，激勵(lì)用戶成長(zhǎng)。它告訴我們：
用戶的需求是永遠(yuǎn)滿足不完的，所以什么值得做，什么是可分階段去實(shí)現(xiàn)的是決策人需要明白的。如喬布斯所說(shuō)：“消費(fèi)者并不知道自己需要什么，直到我們拿出自己的產(chǎn)品，他們就發(fā)現(xiàn)，這是我要的東西”；
不斷完善主要功能，以滿足金字塔頂?shù)暮诵挠脩羧?。決策者常常添加一些自己想要的而不是用戶想要的需求，比如在信息流中添加一個(gè)廣告位；
如何優(yōu)化完善產(chǎn)品架構(gòu)，檢驗(yàn)產(chǎn)品策略的合理性和完整性；
防錯(cuò)原則由世界著名的品質(zhì)管理專家新鄉(xiāng)重夫提出，即在過(guò)程失誤發(fā)生之前加以防止，是一種在作業(yè)過(guò)程中采用自動(dòng)作用、報(bào)警、標(biāo)識(shí)等手段。使操作人員不用特別注意也不會(huì)失誤的方法。
防錯(cuò)原則認(rèn)為大部分的意外都是由于設(shè)計(jì)的疏忽，而不是人為操作失誤，可以通過(guò)優(yōu)化設(shè)計(jì)把過(guò)失降到最低。該原則最初用于工業(yè)管理，后來(lái)應(yīng)用于界面交互設(shè)計(jì)中，當(dāng)使用條件沒(méi)有滿足時(shí)，常常通過(guò)功能失效來(lái)表示。
自動(dòng)檢測(cè)提示
bilibili在登錄時(shí)輸入框沒(méi)有內(nèi)容或沒(méi)有輸密碼時(shí)，登錄按鈕處于禁用的置灰狀態(tài)，只有兩者都滿足了才可以正常點(diǎn)擊。此外登錄功能就可能會(huì)有用戶名錯(cuò)誤、密碼錯(cuò)誤、網(wǎng)絡(luò)超時(shí)、郵箱錯(cuò)誤等不同的錯(cuò)誤。通常必須賬號(hào)和密碼同時(shí)滿足且匹配才能成功。
Twitter發(fā)帖時(shí)只允許用戶輸入140個(gè)字，為了提醒用戶，其解決辦法是在鍵盤上方的工具欄上顯示還能輸入幾個(gè)字符，超過(guò)會(huì)以負(fù)數(shù)警示。知乎發(fā)布文章標(biāo)題過(guò)長(zhǎng)時(shí)也會(huì)提示錯(cuò)誤預(yù)警。
消除可能的失誤
防錯(cuò)法則認(rèn)為大部分的出錯(cuò)都是產(chǎn)品設(shè)計(jì)的不夠優(yōu)秀，而不該責(zé)怪用戶操作疏忽，通過(guò)設(shè)計(jì)手法可以把出錯(cuò)率降到最低。防錯(cuò)法則的核心觀點(diǎn)是，如何有效的在用戶出錯(cuò)之前就盡量避免錯(cuò)誤的發(fā)生。比如，美團(tuán)外賣在接受短信驗(yàn)證碼時(shí)，系統(tǒng)會(huì)自動(dòng)提取驗(yàn)證碼在鍵盤上方顯示，用戶點(diǎn)一下就可以自動(dòng)填寫，省去了跳出應(yīng)用——打開(kāi)短信——記住驗(yàn)證碼——再輸入的繁瑣過(guò)程，有效預(yù)防了出錯(cuò)的機(jī)率。還有微信在綁定銀行卡時(shí)也是通過(guò)掃描銀行卡自動(dòng)提取賬號(hào)，避免手動(dòng)輸入的出錯(cuò)率。
將失誤降至最低
二次確認(rèn)，在一些比較重要的場(chǎng)景讓用戶二次確認(rèn)，通常以彈窗的形式告知用戶再次讓用戶考慮自己的行為結(jié)果，進(jìn)一步降低出錯(cuò)率。例如，最近大家都在用的報(bào)稅App，會(huì)在提交信息前再次確認(rèn)。
視覺(jué)暗示
可在視覺(jué)（置灰或隱藏）上屏蔽那些不能選的選項(xiàng)，避免用戶點(diǎn)擊后才報(bào)錯(cuò)或點(diǎn)擊沒(méi)反應(yīng)。
其次，一些不可恢復(fù)的操作，視覺(jué)上通常會(huì)給強(qiáng)標(biāo)識(shí)。例如，刪除短信時(shí)的文字顏色“變紅”。
為用戶犯的錯(cuò)買單
當(dāng)用戶輸入錯(cuò)誤信息時(shí)，比如打錯(cuò)字，系統(tǒng)應(yīng)該給予用戶想要的信息，而不是無(wú)動(dòng)于衷，冷漠視之。
范圍限制
其實(shí)限制用戶的選擇并不是一個(gè)好主意，但是如果有明確的規(guī)則來(lái)定義可接受的選項(xiàng)，那么限制用戶可以輸入的類型是一個(gè)很好的策略。例如，Airbnb訂房可選日期和設(shè)置鬧鐘時(shí)的時(shí)間范圍。
研究得出，使用產(chǎn)品時(shí)有77.7%的錯(cuò)誤都是人為的，防錯(cuò)法則可以幫助設(shè)計(jì)師站在用戶體驗(yàn)的角度考慮設(shè)計(jì)方案，做到操作前、中、后都有及時(shí)的反饋，預(yù)測(cè)到他們有可能發(fā)生的誤操作狀態(tài)，讓用戶更快完成目標(biāo)，幫助用戶減少出錯(cuò)率。
每次拿起U盤插入電腦時(shí)，我就呆住了，到底朝那個(gè)方向才是對(duì)的？
防呆（Fool-proofing）是一種預(yù)防矯正的行為約束手段，運(yùn)用避免產(chǎn)生錯(cuò)誤的限制方法，使出錯(cuò)的機(jī)會(huì)降至最低，進(jìn)而達(dá)到“第一次就把工作做對(duì)”之境界。
設(shè)計(jì)師應(yīng)謹(jǐn)記：不要認(rèn)為用戶是專家。比如，我們都知道“漢堡”圖標(biāo)就是菜單，點(diǎn)擊這個(gè)按鈕就會(huì)調(diào)出某些功能。但是設(shè)計(jì)師忘記了普通用戶可能并不理解什么是漢堡包圖標(biāo)、什么是面包屑、什么是抽屜式導(dǎo)航、什么是3Dtouch、怎樣雙指滑動(dòng)。更何況普通用戶并不會(huì)研究App，在他們眼中產(chǎn)品只是眾多工具中的一個(gè)。因此，一定要把交互和設(shè)計(jì)做的簡(jiǎn)單，通用的圖標(biāo)、功能和交互方式最好保持用戶熟悉的樣子，減輕用戶重復(fù)學(xué)習(xí)的負(fù)擔(dān)。每個(gè)頁(yè)面應(yīng)強(qiáng)調(diào)一個(gè)重要的功能而不應(yīng)該讓用戶做選擇題，這些都是有效防呆的好方法。
△頁(yè)面的中主按鈕更突出
防呆設(shè)計(jì)是預(yù)防錯(cuò)誤發(fā)生的方法，讓非專業(yè)、無(wú)經(jīng)驗(yàn)的用戶可以高效完成正確操作，不要讓用戶去思考，而是我們時(shí)時(shí)為用戶思考。
又被稱作“簡(jiǎn)單有效原理”：“如無(wú)必要，勿增實(shí)體?！?
通俗點(diǎn)去理解“如無(wú)必要，勿增實(shí)體”可以理解為“不要浪費(fèi)較多東西去做用較少的東西同樣可以做好的事情?！被蛘弑硎鰹椤霸谄渌麠l件相同的情況下，要求得越少的那個(gè)就越好，越有價(jià)值”。
應(yīng)用到設(shè)計(jì)學(xué)領(lǐng)域，該法則認(rèn)為做產(chǎn)品時(shí)功能上不可過(guò)于繁瑣，應(yīng)該保證簡(jiǎn)潔和工具化。例如，產(chǎn)品中為用戶提供了收藏功能是否就不再需要喜歡？提供了喜歡是不是不再需要收藏？一定要保證功能上的克制。不必要的設(shè)計(jì)元素會(huì)導(dǎo)致使用效率降低，還會(huì)增加不可預(yù)知的后果。建議在不損及功能的前提下，干掉多余的元素，當(dāng)兩個(gè)設(shè)計(jì)方案都能達(dá)到設(shè)計(jì)目的時(shí)，選擇較為簡(jiǎn)單的那一個(gè)有利于更好地傳達(dá)內(nèi)容更好地用戶體驗(yàn)。
總的來(lái)說(shuō)，我們可以結(jié)合《簡(jiǎn)約至上》一書中提到的刪除、組織、隱藏、轉(zhuǎn)移四個(gè)策略來(lái)將復(fù)雜的設(shè)計(jì)和體驗(yàn)變得更加簡(jiǎn)單。
刪除：關(guān)注核心，讓用戶注意力集中在自己要完成的目標(biāo)上，刪除不必要的功能、流程和造成視覺(jué)混亂的元素等；
組織：繁瑣的功能通過(guò)分塊，被組織成清晰的層次結(jié)構(gòu)。還記得我們前面說(shuō)到的“7±2法則”嗎，把項(xiàng)組織到7加減2個(gè)塊中；分塊越少，選擇越少，用戶負(fù)擔(dān)約輕；
隱藏：隱藏那些主流用戶很少使用，但自身更新需要但功能。通過(guò)漸進(jìn)展示和適時(shí)出現(xiàn)的方法減少干擾；
轉(zhuǎn)移：把合適的功能轉(zhuǎn)移到合適的設(shè)備上去。讓用戶感覺(jué)簡(jiǎn)單的一個(gè)重要前提，就是先搞清楚把什么工作交給計(jì)算機(jī)，把什么工作留給用戶。
小測(cè)試，下列飲料中哪一種給你印象最深刻呢？文末揭曉。
可口可樂(lè)、雪碧、芬達(dá)、嶗山可樂(lè)、7喜、美年達(dá)
雷斯托夫效應(yīng)又稱隔離效應(yīng)（isolation effect），以及新奇效應(yīng)（novelty effect），前蘇聯(lián)心理學(xué)家馮·雷斯托夫認(rèn)為，某個(gè)元素越是違反常理，就越引人注意，收到更多的關(guān)注。
一樣?xùn)|西與以往經(jīng)歷明顯不同就產(chǎn)生了經(jīng)歷差異。比如人生中的很多第一次，第一次高考、大學(xué)的第一天、初戀、第一份工作等等。該差異也會(huì)出現(xiàn)在新奇面孔、電話號(hào)碼記憶中。奇特的面孔和特殊的電話號(hào)碼更能被人記住。
該理論以多種不同的方式應(yīng)用到設(shè)計(jì)中，最明顯的就是如果想要突出某個(gè)重點(diǎn)內(nèi)容，就要使它特殊化，通過(guò)色彩、尺寸、留白、字體粗細(xì)等設(shè)計(jì)手段。利用對(duì)比來(lái)凸顯想要表達(dá)的重要信息。例如金剛區(qū)、tab欄的運(yùn)營(yíng)活動(dòng)廣告，特殊化的設(shè)計(jì)讓它們?cè)诒尘爸忻摲f而出。
個(gè)人中心的會(huì)員卡為了吸引用戶注意，增加開(kāi)通率，都成了重點(diǎn)設(shè)計(jì)對(duì)象。
與以往不同的界面設(shè)計(jì)可以更加的吸引用戶，加深用戶的記憶，同時(shí)擴(kuò)大了活動(dòng)對(duì)用戶的影響力。例如每年淘寶的雙11首頁(yè)設(shè)計(jì)都與往常不同。
Google doodle 會(huì)在一些比較特殊的日子改變 logo 的設(shè)計(jì)，把logo設(shè)計(jì)成與這個(gè)日子相關(guān)的插畫或涂鴉，與平時(shí)的 logo 形成差異化，幫助人們更好地記住這個(gè)日子。
因此我們?cè)诮缑嬖O(shè)計(jì)中，若想讓用戶對(duì)哪個(gè)模塊或者是元素引起注意或點(diǎn)擊，就可以打破常規(guī)對(duì)該元素進(jìn)行強(qiáng)調(diào)設(shè)計(jì)，使他在背景中脫穎而出。但是不要任何元素都強(qiáng)調(diào)，因?yàn)槭裁炊紡?qiáng)調(diào)就等于什么都沒(méi)強(qiáng)調(diào)，就沒(méi)有重點(diǎn)，所以要謹(jǐn)慎使用這個(gè)方法。
回到開(kāi)篇的題目，答案是「嶗山可樂(lè)」。相比其他飲料，嶗山可樂(lè)遇到的少，反而成了最特別的一個(gè)了。你的答案是什么？歡迎在下方留言探討。
食之無(wú)味，棄之可惜
損失厭惡是指人們面對(duì)同樣數(shù)量的收益和損失時(shí)，認(rèn)為損失更加令他們難以忍受。 同量的損失帶來(lái)的負(fù)效用為同量收益的正效用的2.5倍。比如，丟100塊錢的痛苦感要遠(yuǎn)高于你撿到100塊錢帶來(lái)的幸福感，也就是說(shuō)要至少撿到300塊才能平復(fù)之前的心情。
生活中類似的栗子還有很多，比如旅游時(shí)，雖然這個(gè)景點(diǎn)很爛，人們依然覺(jué)得來(lái)都來(lái)了，還是要看完再走才“不虧”；吃自助餐時(shí)，明明吃不下那么多，可想到花了那么多錢，就要盡可能的多吃才算“回本”，真是應(yīng)了那句話：“食之無(wú)味，棄之可惜”；花了50塊買了張電影票，過(guò)了10分鐘發(fā)現(xiàn)是部爛片，就算在電影院睡覺(jué)也不愿提前走，覺(jué)得這50塊錢不能白花...
那么，該如何將“損失厭惡”賦能給產(chǎn)品設(shè)計(jì)呢？
最典型的莫過(guò)于電商App中的各類券滿天飛，比如：買二送一、3件7折、倒計(jì)時(shí)xx小時(shí)后恢復(fù)原價(jià)等等。商家就是為了營(yíng)造現(xiàn)在不買就會(huì)錯(cuò)過(guò)的套路，用戶也會(huì)覺(jué)得失之可惜。一年一度的天貓雙11，京東618，還有情人節(jié)、中秋節(jié)等各種有的沒(méi)的節(jié)日都是商家利用“損失厭惡”心理為基礎(chǔ)刺激消費(fèi)。
我們App的用戶粘性不太理想，增加一個(gè)“簽到”功能吧，產(chǎn)品經(jīng)理如是說(shuō)。如是我們看到各種簽到得禮品，贏紅包等活動(dòng)。中間還不能中斷，要連續(xù)簽到多少天才能得到獎(jiǎng)勵(lì)，用戶也擔(dān)心中斷的損失。
某網(wǎng)盤下載文件時(shí)，會(huì)給你一個(gè)10秒VIP高速下載的體驗(yàn)，計(jì)時(shí)過(guò)后又恢復(fù)到龜速，讓你恨的牙癢癢。雖然這招有點(diǎn)損，但用戶體驗(yàn)到了VIP的快感，很多人還是會(huì)乖乖成為付費(fèi)會(huì)員。
產(chǎn)品運(yùn)營(yíng)中會(huì)經(jīng)常發(fā)一些優(yōu)惠券，雖然知道自己不會(huì)用，也要先領(lǐng)了再說(shuō)。這些券也都有時(shí)間限制，快過(guò)期的提醒也會(huì)加快用戶決策。還有0元開(kāi)通會(huì)員，套路是第一個(gè)月免費(fèi)，次月開(kāi)始按正常價(jià)自動(dòng)續(xù)費(fèi)，典型的“騙”進(jìn)來(lái)養(yǎng)肥了再“殺”。
人天生會(huì)對(duì)危險(xiǎn)的，不好的東西避而遠(yuǎn)之。如是我們就看到保險(xiǎn)行業(yè)，他們會(huì)用一些負(fù)面信息（空難、車禍）刺激你，用戶就會(huì)產(chǎn)生焦慮，自然就想規(guī)避掉這些概率小的風(fēng)險(xiǎn)。例如購(gòu)買機(jī)票時(shí)的意外險(xiǎn)，QQ退出登錄時(shí)的提示。
還有就是有用戶自己的內(nèi)容的東西，一般不會(huì)輕易舍去。拿我個(gè)人來(lái)說(shuō)，飛書一直是我的寫作工具，后來(lái)看到幾個(gè)更好用的軟件，但要想到把原來(lái)的這么多東西全部轉(zhuǎn)移過(guò)去也是件很心累的事，太麻煩，還是繼續(xù)用飛書好了。QQ這個(gè)“古老”的軟件，估計(jì)很多人好久都沒(méi)打開(kāi)過(guò)了吧，但是讓你刪了它，你還是不愿意的，因?yàn)槟巧厦嬗泻芏嗲啻旱幕貞洝?
用戶會(huì)將大部分時(shí)間花在其它網(wǎng)站上，因此他們會(huì)希望你的網(wǎng)站也能像他們已經(jīng)掌握的其它網(wǎng)站一樣，擁有相同的使用模式和習(xí)慣。
Jakob定律是由Jakob Nielsen提出的，他認(rèn)為用戶在其他網(wǎng)站所積累的經(jīng)驗(yàn)教會(huì)了他們?nèi)绾问褂镁W(wǎng)站，所以他們會(huì)希望你的網(wǎng)站可以與那些熟悉的網(wǎng)站一樣，相似的使用方式，在使用你的產(chǎn)品、服務(wù)、內(nèi)容和信息的時(shí)候，他們不會(huì)感到恐慌，而是輕車熟路。該原則鼓勵(lì)設(shè)計(jì)師遵循常見(jiàn)的設(shè)計(jì)模式，以避免混淆用戶或?qū)е赂叩恼J(rèn)知成本。
例如YouTube2017年改版前后的對(duì)比，在新版中，網(wǎng)站框架和功能上幾乎沒(méi)動(dòng)，只是在UI上做了順應(yīng)新的設(shè)計(jì)準(zhǔn)則，比如調(diào)整字體大小、顏色、欄目間距等。整體上和舊版沒(méi)太大區(qū)別，而且還給用戶提供了舊版的選擇。
在移動(dòng)端App中也應(yīng)如此，在具有相同功能的頁(yè)面，盡量保持一致。大到頁(yè)面底層框架（比如電商應(yīng)用中的購(gòu)物流程），小到UI設(shè)計(jì)中的一個(gè)按鈕，一個(gè)圖標(biāo)，甚至一句微文案。
在設(shè)計(jì)產(chǎn)品時(shí)，要先延續(xù)大眾早已習(xí)慣的概念模型。然后再?gòu)淖约旱漠a(chǎn)品出發(fā)，對(duì)其進(jìn)行改善。而不是從零開(kāi)始制定自以為是的流程。
日常使用的各類修圖軟件，版式都高度相似，中間是圖片，各種濾鏡、貼紙、調(diào)整等功能都放在底部操作區(qū)域，很多相同功能的名稱都一樣。這是用戶最熟悉的布局，可降低用戶在同類軟件使用的學(xué)習(xí)成本提升使用效率。
也許你會(huì)質(zhì)疑當(dāng)所有產(chǎn)品都遵循相同都設(shè)計(jì)模式，會(huì)讓產(chǎn)品同質(zhì)化嚴(yán)重，答案是必然的。此時(shí)需要深入了解用戶的目標(biāo)和心智模型（用戶訪談、用戶畫像、用戶體驗(yàn)地圖等），并將其應(yīng)用到我們的產(chǎn)品設(shè)計(jì)中去，縮小我們與用戶心智模型之間的差距，從而獲得良好的用戶體驗(yàn)。上文YouTube例子中，就是通過(guò)簡(jiǎn)單的用戶授權(quán)（新舊版本選擇），避免了心智模型的不一致會(huì)帶來(lái)的問(wèn)題，當(dāng)用戶準(zhǔn)備好隨時(shí)可以切換到新的版本。相反的案例Snapchat在18年設(shè)計(jì)改版時(shí)，因?yàn)樾碌牟季治茨艽_保改版前后用戶心智模型的一致性，導(dǎo)致大量用戶流向競(jìng)爭(zhēng)對(duì)手Instagram那里了。
但是也要注意設(shè)備之間的差異，比如在移動(dòng)端“漢堡包”式菜單是個(gè)不錯(cuò)的方案，可是放到桌面端可能并不太友好，因?yàn)榇笃聊豢梢暦秶?，小小的漢堡包圖標(biāo)很容易被忽略，這時(shí)候平鋪出來(lái)可能會(huì)更好。
思考總結(jié)
1、用戶會(huì)把在其他產(chǎn)品使用中已熟悉的操作習(xí)慣轉(zhuǎn)移到另一個(gè)看起來(lái)相似的產(chǎn)品上；
2、利用現(xiàn)有的思維模型，使用戶可以專注于自己的目標(biāo)上，而不是學(xué)習(xí)新的操作方式；
3、在進(jìn)行必要的改版時(shí)，請(qǐng)給用戶過(guò)渡到新版本的機(jī)會(huì)，即可以選擇短時(shí)間內(nèi)繼續(xù)使用舊版本；
看名稱挺拗口，另一種翻譯叫做“對(duì)角線平衡的和諧狀態(tài)”。它告訴我們?yōu)g覽頁(yè)面是由左上至右下的視線流，左上角是視覺(jué)第一落點(diǎn)區(qū)，右下角是視覺(jué)最終落點(diǎn)區(qū)，因此右上角和左下角都是一個(gè)強(qiáng)烈的視覺(jué)盲點(diǎn)區(qū)，大多數(shù)時(shí)容易被忽略。
在進(jìn)行信息排布時(shí)，將最重要的信息放在左上角，右上角和左下角添加輔助元素，右下角作為整個(gè)視覺(jué)落點(diǎn)可以展示重要操作。運(yùn)用視覺(jué)元素來(lái)創(chuàng)建一條虛擬的“線”，讓用戶的視線跟隨左上到右下這條對(duì)角線移動(dòng)，符合用戶習(xí)慣性的眼動(dòng)規(guī)律。
古騰堡圖表應(yīng)用最典型的例子就是商品詳情頁(yè)，在界面的頂部展示商品圖片、名稱、價(jià)格、快遞和優(yōu)惠等用戶主要關(guān)心的信息；右上和左下通常是分享、客服和收藏等次要信息；右下角則放置最終促成用戶交易的購(gòu)買按鈕。
我們都知道一般頁(yè)面按鈕都在界面底部是因?yàn)殡x手近，方便操作，但不僅僅如此。還因?yàn)闉g覽是用戶的第一行為，他們的視線會(huì)根據(jù)頁(yè)面元素進(jìn)行移動(dòng)，最終停留在底部結(jié)尾的地方。
看各種社交產(chǎn)品評(píng)論、點(diǎn)贊的位置，就知道產(chǎn)品希望用戶先干什么的想法。
彈窗的按鈕擺放一般都是左「取消」右「確認(rèn)」，目的是讓用戶最快地看到主要操作內(nèi)容。
余額寶的「轉(zhuǎn)出」在左，「轉(zhuǎn)入」在右，畢竟誰(shuí)也不想財(cái)往外流是吧。
既然如此，為什么“發(fā)布”頁(yè)面的按鈕都在右上角呢？因?yàn)榘l(fā)布頁(yè)是屬于“編輯頁(yè)面”，需要用戶謹(jǐn)慎操作，這里關(guān)注的核心應(yīng)該是可編輯內(nèi)容區(qū)域，而不是按鈕本身。
類似的例子還有很多，設(shè)計(jì)中與此視覺(jué)流與節(jié)奏規(guī)律相似的還有F型布局和Z型布局，合理運(yùn)用這些節(jié)奏模式，使用者會(huì)跟隨你“設(shè)計(jì)”的視覺(jué)流和運(yùn)動(dòng)規(guī)律來(lái)瀏覽頁(yè)面，有效提高用戶閱讀的節(jié)奏和理解能力。
美國(guó)心理學(xué)家亞伯拉罕·馬斯洛（Maslow.A.H.）從人類動(dòng)機(jī)的角度提出需求層次理論，該理論強(qiáng)調(diào)人的動(dòng)機(jī)是由人的需求決定的。他將人類需求分成生理需求、安全需求、社交需求、尊重需求和自我實(shí)現(xiàn)需求，依此由低層次到高層次的過(guò)程。馬斯洛需求層次理論最大意義就在于，它告訴了我們，人在滿足了基本的需求之后，就要去實(shí)現(xiàn)更高的需求和目標(biāo)。
馬斯洛需求層次理論有兩個(gè)基本出發(fā)點(diǎn)，一是人人都有需求，某層需求滿足后，另一層需求才出現(xiàn)；二是在上層需求未獲滿足前，首先滿足迫切需求，該需求滿足后，后面的需要才顯示出其激勵(lì)作用。例如，在能感受到愛(ài)之前，他們的生理和安全需求一定要得到滿足。
回歸到產(chǎn)品，一款產(chǎn)品，最核心的是解決用戶的需求。馬斯洛需求層次理論，為產(chǎn)品的需求分析指明了方向。
生理需求：滿足人的最基本需求，如衣、食、住、行、生理方面的需求。諸如美團(tuán)外賣、淘寶、馬蜂窩等為日常生活提供方便的應(yīng)用；
安全需求：人生安全、財(cái)產(chǎn)保險(xiǎn)，也是強(qiáng)需求。如是各類投資理財(cái)軟件層出不窮。
社交需求：包括友情、親情、愛(ài)情多個(gè)層次，滿足人類社會(huì)關(guān)系，讓每個(gè)人不再是孤單的個(gè)體。如是微信、微博、Soul、探探、陌陌等不同類型的社交軟件多如牛毛；
尊重需求：每個(gè)人都有被尊重的需求，都希望展現(xiàn)自己，獲得人們認(rèn)可。此需求可以深度結(jié)合在社交需求中。
自我實(shí)現(xiàn)：最高層級(jí)的需求，完成與自己的能力相稱的一切事情，實(shí)現(xiàn)自己理想的需要。結(jié)合到產(chǎn)品可以理解為能滿足自己外在展示（炫耀）的需求，如各類美顏軟件，美化后的照片曬到朋友圈，給人看到最好的一面。
由此規(guī)律可以看出，越靠近底層需求越是剛需，越往上，就變得越來(lái)越不必要，如自我實(shí)現(xiàn)，變得可有可無(wú)，不再是所有人的剛需。一個(gè)優(yōu)秀的產(chǎn)品，深諳人性滿足用戶核心需求，才能形成持續(xù)穩(wěn)定高用戶粘性的產(chǎn)品。
序列效應(yīng)法則又叫系列位置效應(yīng)，是指一種記憶現(xiàn)象： 在列舉項(xiàng)目時(shí),排在最前面與最后面的元素，要比排在中間的更容易讓人記住。
因?yàn)槿藗儗?duì)排在頭、尾的項(xiàng)目，要比排在中間的更容易記起來(lái)。比如我們都知道第一位登上月球的宇航員是阿姆斯特朗，卻很少人知道第二位奧爾德林；班級(jí)里我們一般都知道成績(jī)最好的第一名和倒數(shù)第一名，至于排在中間的很難記住。因此對(duì)排在開(kāi)頭的項(xiàng)目產(chǎn)生加強(qiáng)的回想效果，稱為“首位效應(yīng)”( primacy effect)。對(duì)排在結(jié)尾的項(xiàng)目產(chǎn)生加強(qiáng)的回想效果，稱為“近因效應(yīng)”( recency effect )。
分類頁(yè)簽中，我們通常都會(huì)記得“精選”、“熱門”這類標(biāo)簽，是希望給用戶進(jìn)入App后看到的主要內(nèi)容。這就是“首位效應(yīng)”，把重要性高的內(nèi)容放在首要位置。
我們都知道界面中“返回”按鈕放在左上角，除了操作習(xí)慣和防誤觸外，還因?yàn)樗霈F(xiàn)在頁(yè)面左上角最開(kāi)始的地方，更長(zhǎng)久地儲(chǔ)存在長(zhǎng)期記憶之中，需要“返回”時(shí)能夠快速回憶出來(lái)。
tabbar數(shù)量不管是3個(gè)還是5個(gè)，用戶通常都會(huì)記得第一個(gè)“首頁(yè)”和最后一個(gè)“我的”，對(duì)排在中間的都會(huì)選擇性的忽略掉。
有時(shí)候新上一個(gè)功能，產(chǎn)品想提高它的位置引起用戶注意，會(huì)和“我的”互換位置。例如網(wǎng)易云音樂(lè)，新版本中把“我的”放在第三個(gè)tab，為了提升“云村”重要性，把它放置最后一個(gè)tab，正是利用了“近因效應(yīng)”。
近因效應(yīng)常用于及時(shí)進(jìn)行反饋的設(shè)計(jì)界面中，比如點(diǎn)贊、評(píng)論、分享等功能置于底部不僅可加深印象，同時(shí)用戶在看到有趣的內(nèi)容，想要評(píng)論或分享時(shí)，不用等到文章看完即可操作。從而增強(qiáng)內(nèi)容粘性，提高互動(dòng)率。
用戶的記憶具有系列位置效應(yīng)，而且人的短期記憶非常有限，通過(guò)序列效應(yīng)法則的應(yīng)用，我們可以幫助用戶減輕記憶負(fù)擔(dān)。在排列項(xiàng)目時(shí)，把重要的放在首位或末尾，以達(dá)到最好的記憶效果。
文章來(lái)源：站酷 作者：Fyin印跡
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
定義：
1.同一頁(yè)面內(nèi)不同模塊描述
文章來(lái)源：站酷 作者：體驗(yàn)為王UX
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
前人早已總結(jié)了讓動(dòng)畫生動(dòng)的技巧，早在1981年由兩位迪士尼動(dòng)畫師所撰寫的《The illusion of life:Disney Animation》一書就提到了動(dòng)畫的12項(xiàng)基本法則，該法則也是受用至今。法則雖是針對(duì)傳統(tǒng)動(dòng)畫而制定，但對(duì)于我們?nèi)粘Ｐ枨笾兴佑|的動(dòng)效/動(dòng)畫需求也同樣受用。
1）動(dòng)畫原則介紹
2）結(jié)合案例應(yīng)用原則
3）流程方法論沉淀
4）結(jié)語(yǔ)
擠壓與伸展是我們最常用的運(yùn)動(dòng)技巧。使用擠壓與拉伸來(lái)強(qiáng)調(diào)物體的質(zhì)感、重量、速度。擠壓和拉伸會(huì)給予物體運(yùn)動(dòng)時(shí)具備質(zhì)量感和體積感的錯(cuò)覺(jué)。例如當(dāng)一個(gè)皮球正在進(jìn)行下落運(yùn)動(dòng)，在運(yùn)動(dòng)過(guò)程中讓皮球體積產(chǎn)生一定拉伸來(lái)表現(xiàn)它的速度感，皮球落地后則因力的作用產(chǎn)生擠壓變形。
擠壓與伸展的幅度影響著物體的質(zhì)感、重量。設(shè)計(jì)師們可根據(jù)物體的質(zhì)感去決定擠壓伸展的幅度。動(dòng)畫雖存在夸張性，但對(duì)于物體擠壓拉伸的體積盡可能保持視覺(jué)統(tǒng)一，避免較大的體積誤差導(dǎo)致運(yùn)動(dòng)的突兀。
預(yù)期動(dòng)作可告知觀者物體運(yùn)動(dòng)即將發(fā)生，增強(qiáng)觀者的場(chǎng)景代入感，使運(yùn)動(dòng)更加生動(dòng)真實(shí)。如果我們?nèi)コ捌诘念A(yù)備過(guò)程物體所呈現(xiàn)的運(yùn)動(dòng)感知像是突然被前方磁鐵所吸引。
預(yù)期動(dòng)作可對(duì)觀者視線進(jìn)行引導(dǎo)，設(shè)計(jì)師可以根據(jù)預(yù)期動(dòng)作所引導(dǎo)的方向來(lái)銜接鏡頭/場(chǎng)景的轉(zhuǎn)場(chǎng)。反之預(yù)期動(dòng)作也可以用來(lái)欺騙觀眾，當(dāng)用戶預(yù)期與畫面不符時(shí)也可增加動(dòng)畫舞臺(tái)的趣味性。
每個(gè)角色/運(yùn)動(dòng)元素在運(yùn)動(dòng)過(guò)程中都會(huì)流露出獨(dú)特的態(tài)度和氣質(zhì)。針對(duì)不同的角色/元素的運(yùn)動(dòng)特性運(yùn)用不同的運(yùn)鏡、表演技巧、時(shí)間節(jié)奏以及舞臺(tái)的編排技巧，傳遞貼合角色/元素氣質(zhì)的動(dòng)態(tài)感知。
在現(xiàn)今動(dòng)畫工作流程中，考慮到流程效率及技巧利弊，我們可以使用兩者相互結(jié)合的方式。關(guān)鍵動(dòng)作描述的是設(shè)計(jì)師們熟知的關(guān)鍵幀動(dòng)畫的方式（類似AE）。在動(dòng)畫設(shè)計(jì)前進(jìn)行基本運(yùn)動(dòng)的關(guān)鍵動(dòng)作提煉，再進(jìn)行細(xì)化，一層層的遞進(jìn)。底層的關(guān)鍵運(yùn)動(dòng)越完善，在后續(xù)添加細(xì)節(jié)時(shí)才不會(huì)耗費(fèi)大量時(shí)間調(diào)整。而對(duì)于持續(xù)動(dòng)作（逐幀動(dòng)畫）的技巧，我們可以利用它處理一些復(fù)雜效果例如（涉及到運(yùn)動(dòng)空間的變化、形狀上的靈動(dòng)變化等）。
逐幀動(dòng)畫。
優(yōu)點(diǎn)：自由且流暢的動(dòng)態(tài)。
缺點(diǎn)：難以把控時(shí)間長(zhǎng)短、體積大小。
關(guān)鍵幀動(dòng)畫。
優(yōu)點(diǎn)：清晰、可靠、規(guī)范。
缺點(diǎn)：修改成本略高。
跟隨動(dòng)作指的是元素運(yùn)動(dòng)結(jié)束后不會(huì)立刻停止，會(huì)因?yàn)橘|(zhì)量、慣性等因素，元素會(huì)慢慢進(jìn)行振動(dòng)減幅的過(guò)程。重疊動(dòng)作則指的是運(yùn)動(dòng)不會(huì)同一時(shí)間發(fā)生，主體與附屬部分的運(yùn)動(dòng)會(huì)因質(zhì)感、外力等因素產(chǎn)生不同的速率。
當(dāng)一個(gè)人跳躍的時(shí)候，自身的衣帽等附屬物也會(huì)隨之?dāng)[動(dòng)。跟隨&重疊動(dòng)作反應(yīng)著運(yùn)動(dòng)的力量感和速度感，利用好跟隨與重疊動(dòng)作，可以更好地表現(xiàn)角色/元素主要?jiǎng)幼?運(yùn)動(dòng)。當(dāng)主要?jiǎng)幼?運(yùn)動(dòng)力量大、速度快的時(shí)候，跟隨與重疊的物體運(yùn)動(dòng)幅度大，反之則運(yùn)動(dòng)幅度小。
真實(shí)世界的運(yùn)動(dòng)遵循著緩動(dòng)運(yùn)動(dòng)的規(guī)律，而并非勻速運(yùn)動(dòng)。根據(jù)物體運(yùn)動(dòng)情況、動(dòng)態(tài)質(zhì)感去編排元素合適的運(yùn)動(dòng)速率。關(guān)于運(yùn)動(dòng)的速率編排相關(guān)內(nèi)容，可以看看過(guò)往的文章-《動(dòng)效的質(zhì)感》。
仔細(xì)觀察可發(fā)現(xiàn)自然界中的運(yùn)動(dòng)多為弧形運(yùn)動(dòng)的組合，而勻速運(yùn)動(dòng)只存在于機(jī)械運(yùn)動(dòng)中。
在人物運(yùn)動(dòng)過(guò)程中使用弧形運(yùn)動(dòng)增添角色動(dòng)畫表現(xiàn)力。比如當(dāng)人物抬頭或轉(zhuǎn)頭時(shí)，通過(guò)弧度的變化映射人物的情感，是充滿好奇心的還是沮喪的。
在交互動(dòng)效中，弧形運(yùn)動(dòng)路徑會(huì)給予觀者運(yùn)動(dòng)表現(xiàn)力較年輕活潑的感知隱喻。設(shè)計(jì)師可根據(jù)品牌調(diào)性及產(chǎn)品屬性去選擇運(yùn)動(dòng)路徑類型。
當(dāng)主體在運(yùn)動(dòng)時(shí)，設(shè)計(jì)師可通過(guò)附屬物運(yùn)動(dòng)來(lái)輔助表達(dá)主體運(yùn)動(dòng)氣質(zhì)。比如人物敲門時(shí)，捏緊拳頭的敲（代表生氣）與翹起蘭花指敲的（代表精致）區(qū)別。
在上篇文章其實(shí)我們有提到影響動(dòng)效質(zhì)感的原因之一就是時(shí)間，控制好物體的運(yùn)動(dòng)時(shí)間也是表現(xiàn)良好動(dòng)畫節(jié)奏感的關(guān)鍵。
使用「時(shí)間偏差」的技巧，可以讓你的動(dòng)畫更加生動(dòng)。因?yàn)槭芰Α①|(zhì)感等因素影響，主體運(yùn)動(dòng)時(shí)附屬部分的運(yùn)動(dòng)不會(huì)同時(shí)發(fā)生。比如當(dāng)人物正在打哈欠時(shí)，首先是從嘴巴發(fā)力，再擴(kuò)散至五官眉毛。
為保持動(dòng)效的連續(xù)性以及營(yíng)造自然流暢的交互體驗(yàn)，適當(dāng)?shù)氖褂脮r(shí)間偏差，可避免動(dòng)效元素變化過(guò)程出現(xiàn)空檔期，提升信息傳遞效率減少認(rèn)知負(fù)荷。
通過(guò)夸張手法增添動(dòng)畫表現(xiàn)張力，加強(qiáng)運(yùn)動(dòng)元素的吸引力令動(dòng)畫更有代入感和戲劇性。
動(dòng)畫設(shè)計(jì)時(shí)可通過(guò)營(yíng)造鏡頭透視感、景深感模擬真實(shí)的空間感打破二維扁平視覺(jué)效果，提升畫面表現(xiàn)力。
一部好的動(dòng)畫作品一定會(huì)有令人吸引的人事物，比如動(dòng)態(tài)氣質(zhì)或視覺(jué)風(fēng)格等它們都能很好的吸引觀眾。除此之外，如何講好一個(gè)故事，通過(guò)趣味幽默的故事表達(dá)手法也可以增添動(dòng)畫的吸引力。
通過(guò)對(duì)十二大基本原則的學(xué)習(xí)，我將技巧分為以下兩大類：設(shè)計(jì)技巧和表演技巧。
設(shè)計(jì)技巧：動(dòng)畫設(shè)計(jì)的技法，增添動(dòng)畫細(xì)節(jié)令動(dòng)畫表現(xiàn)更生動(dòng)自然。
表演技巧：舞臺(tái)表演的技巧，提升動(dòng)畫舞臺(tái)全局的表現(xiàn)力。
接下來(lái)我們結(jié)合上述所提及的動(dòng)畫原則，根據(jù)實(shí)際案例進(jìn)行結(jié)合應(yīng)用。一起來(lái)探討下當(dāng)接到動(dòng)效設(shè)計(jì)需求時(shí)，我們需要思考哪些點(diǎn)？才能使我們的動(dòng)效表現(xiàn)力更上一層樓。
假設(shè)在項(xiàng)目中我們需要對(duì)設(shè)計(jì)元素（豬豬存錢罐）添加動(dòng)效以提示用戶已省錢成功的情感氛圍。設(shè)計(jì)前我們先來(lái)分析下元素以什么動(dòng)態(tài)/動(dòng)作表現(xiàn)會(huì)更貼合元素性格?？紤]到豬豬的可愛(ài)屬性，采用了跳躍的運(yùn)動(dòng)方式。并擬定了跳躍后天上落下金幣的動(dòng)畫腳本。
將腳本確定后，我們?cè)谀X海里已經(jīng)有大概的運(yùn)動(dòng)畫面。但在進(jìn)入動(dòng)效設(shè)計(jì)前，還需要明確在動(dòng)畫中使用哪些動(dòng)畫原則來(lái)提升動(dòng)畫生動(dòng)性。
在添加動(dòng)畫細(xì)節(jié)前，我分享下在項(xiàng)目中經(jīng)常用到的兩個(gè)技巧。
實(shí)現(xiàn)擠壓與伸展的方式有很多種，最常見(jiàn)的是直接改變物體的縮放比例或形狀路徑來(lái)實(shí)現(xiàn)。但在設(shè)計(jì)項(xiàng)目中我們往往會(huì)遇到非矢量的設(shè)計(jì)元素，利用xxx可實(shí)現(xiàn)圖層的彎曲扭曲等變形效果。
質(zhì)地堅(jiān)硬的物體受外力的影響較小，質(zhì)地柔軟的物體受外力的影響較大。而像豬豬這類柔軟的物體在恢復(fù)靜止吋肉肉會(huì)有一個(gè)跟隨&重疊動(dòng)作（抖動(dòng)）。在處理這類抖動(dòng)的效果除了使用常規(guī)的彈性表達(dá)式外還可配合使用AE的 CC bend it 效果增加形變細(xì)節(jié)令物體運(yùn)動(dòng)更為生動(dòng)自然。
當(dāng)我們?nèi)コ@些動(dòng)畫原則后，再去作對(duì)比明顯的感知差異就出來(lái)了。
根據(jù)過(guò)往項(xiàng)目經(jīng)驗(yàn)，我總結(jié)了動(dòng)效/動(dòng)畫設(shè)計(jì)的流程思路。從業(yè)務(wù)目標(biāo)的分析到動(dòng)畫腳本的確定，層層遞進(jìn)。前期的目標(biāo)和框架確定后，之后進(jìn)行動(dòng)畫原則的梳理及最后的動(dòng)效輸出。設(shè)計(jì)師們不妨在項(xiàng)目中嘗試上述的流程思路及原則技巧，將自身動(dòng)畫的表現(xiàn)力提升一個(gè)檔次。
隨著動(dòng)畫/動(dòng)效的落地方式愈來(lái)愈完善，像Lottie、svga等新型的動(dòng)畫落地形式所帶來(lái)的高品質(zhì)畫面呈現(xiàn)。設(shè)計(jì)師們不能滿足于動(dòng)畫僅僅只是動(dòng)那么簡(jiǎn)單，如何去塑造生動(dòng)的動(dòng)畫形象還有不少我們需要考慮的細(xì)節(jié)。恰好前人總結(jié)了相應(yīng)的原則技巧，幫助我們站在巨人的肩膀上看得更遠(yuǎn)。除《The illusion of life:Disney Animation》外，近期也在閱覽《動(dòng)畫師的生存手冊(cè)》里面涵蓋了不少關(guān)于角色動(dòng)畫的運(yùn)動(dòng)技巧及細(xì)節(jié)。其中部分技巧并不局限于角色動(dòng)畫的設(shè)計(jì)中，下期文章我將分享關(guān)于角色動(dòng)畫的知識(shí)沉淀內(nèi)容。
文章來(lái)源：站酷 作者：Fiasc1
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
用戶體驗(yàn)設(shè)計(jì)是一個(gè)動(dòng)態(tài)領(lǐng)域，每年都會(huì)為我們帶來(lái)新的趨勢(shì)，最近十二個(gè)月也不例外。全球新冠病毒大流行和國(guó)家封鎖使我們與數(shù)字世界和現(xiàn)實(shí)世界之間的互動(dòng)方式發(fā)生了突然的變化。人們不僅開(kāi)始在網(wǎng)上花費(fèi)更多的時(shí)間；他們的思考方式和表現(xiàn)方式也發(fā)生了不同。
本文主要闡述2021用戶體驗(yàn)的趨勢(shì)，我們相信這將在新的一年里占據(jù)主導(dǎo)地位。查看一下您可以利用哪些趨勢(shì)超越競(jìng)爭(zhēng)對(duì)手并在人群中脫穎而出吧。
我們?cè)?a style="outline:0px;margin:0px;padding:0px;text-decoration:none;color:inherit;">2020年UX狀態(tài)預(yù)測(cè)中討論了語(yǔ)音用戶界面（VUI）。如今年所示，語(yǔ)音指令仍然是UX設(shè)計(jì)中最熱門的趨勢(shì)之一。可以肯定地說(shuō)，明年不應(yīng)忽略它。
毫無(wú)疑問(wèn)，到2021年，語(yǔ)音聊天機(jī)器人和虛擬助手將繼續(xù)流行。用戶在數(shù)字體驗(yàn)方面一直在尋求簡(jiǎn)單性和效率。市場(chǎng)需求，高期望值以及人工智能技術(shù)的迅速發(fā)展使品牌別無(wú)選擇，只能在其產(chǎn)品中包含基于語(yǔ)音的功能。
已經(jīng)有許多企業(yè)為廣泛的VUI實(shí)施奠定了基礎(chǔ)。例如，星巴克推出了一種名為My Starbucks Barista的基于AI的聊天機(jī)器人。其目標(biāo)是通過(guò)允許用戶通過(guò)語(yǔ)音命令購(gòu)買自己喜歡的飲料來(lái)改善咖啡訂購(gòu)體驗(yàn)。
極簡(jiǎn)主義可能是當(dāng)今視覺(jué)設(shè)計(jì)中最明顯的趨勢(shì)之一。用戶正在體驗(yàn)越來(lái)越多的網(wǎng)站所有者想要傳遞的關(guān)鍵消息。Cookie彈出窗口，打折廣告和各種通知旨在吸引和轉(zhuǎn)化網(wǎng)站訪問(wèn)者，但它們也吸引了我們的注意力。這就是簡(jiǎn)約的以用戶為中心的設(shè)計(jì)應(yīng)運(yùn)而生的地方。
但是，“極簡(jiǎn)主義”并不意味著“沉悶”或“原始”。意思是“優(yōu)雅”和“高效”。盡管必須使用數(shù)量有限的顏色，設(shè)計(jì)元素和明亮的組合，但UX設(shè)計(jì)人員仍然有很大的發(fā)揮空間。此外，元素的功能最為重要，正確突出產(chǎn)品功能并傳達(dá)正確信息的能力需要大量的創(chuàng)造力。相反，僅具有裝飾目的的組件正逐漸失去其重要性。
內(nèi)容，消息和導(dǎo)航的清晰度是UX設(shè)計(jì)的簡(jiǎn)約方法的另一個(gè)重要方面。信息過(guò)載對(duì)于大多數(shù)現(xiàn)代用戶來(lái)說(shuō)是一個(gè)痛苦，這意味著網(wǎng)站所有者應(yīng)努力使自己的UX文字簡(jiǎn)潔明了。
負(fù)空間是用戶體驗(yàn)設(shè)計(jì)的一種大趨勢(shì)，它已經(jīng)脫離了對(duì)簡(jiǎn)約UI的市場(chǎng)需求。簡(jiǎn)而言之，負(fù)空間是頁(yè)面布局中對(duì)象周圍（宏空間）或?qū)ο髢?nèi)部（微空間）的空白區(qū)域。它已經(jīng)成為獨(dú)立的設(shè)計(jì)元素，在視覺(jué)美學(xué)和用戶體驗(yàn)優(yōu)化中起著至關(guān)重要的作用。谷歌的主頁(yè)，蘋果的官方商店以及一些用Webflow創(chuàng)建的網(wǎng)站就是很好的例子。
留出一定的空間，在設(shè)計(jì)中添加“寂靜的感覺(jué)”，必須是始終有意義的。否則，用戶可以將其視為缺少信息。負(fù)空間的主要功能是整理網(wǎng)頁(yè)，以吸引用戶對(duì)關(guān)鍵對(duì)象和消息的注意。建立清晰的內(nèi)容層次結(jié)構(gòu)有助于UX設(shè)計(jì)人員將用戶的注意力吸引到最重要的內(nèi)容上。
負(fù)空間有時(shí)也稱為“空白區(qū)域”或“留白區(qū)域”。所有這些術(shù)語(yǔ)都是可以互換的。當(dāng)區(qū)域中沒(méi)有元素時(shí)，您還可以在深色模式或任何其他顏色下使用此用戶體驗(yàn)趨勢(shì)。
在發(fā)生COVID-19大流行之后的在線體驗(yàn)將與我們習(xí)慣的在線體驗(yàn)不同。UX設(shè)計(jì)以相關(guān)方式反映了缺陷。為了使品牌的數(shù)字化形象更具關(guān)聯(lián)性，設(shè)計(jì)師有意在版面設(shè)計(jì)中實(shí)現(xiàn)了一些“缺陷”。 它可以是任何東西，從手繪對(duì)象到構(gòu)圖或頁(yè)面的不尋常元素。
通常，不完美的設(shè)計(jì)可以很好地證明品牌的身份并突出其獨(dú)特性。但是，如果要應(yīng)用這種UX趨勢(shì)，則必須記住一個(gè)關(guān)鍵規(guī)則：必須保持平衡。如果你做得過(guò)多，那是行不通的。
中性風(fēng)格是UI設(shè)計(jì)中其他兩種大規(guī)模方法（擬態(tài)和平面設(shè)計(jì)）的組合，它們通常被認(rèn)為彼此相對(duì)。擬態(tài)化是關(guān)于模仿現(xiàn)實(shí)世界中的物體以及我們與物體交互的方式。
幾十年前，當(dāng)需要使用超現(xiàn)實(shí)元素來(lái)創(chuàng)建直觀且用戶友好的UI時(shí)，它很流行。垃圾桶就是例子之一。另一方面，平面設(shè)計(jì)是一個(gè)更新的，簡(jiǎn)化的概念，圍繞二維元素，極簡(jiǎn)主義和鮮艷的色彩。
同質(zhì)性兼顧了兩者的優(yōu)點(diǎn)。它使用圖形強(qiáng)度大的元素，陰影和漸變來(lái)使按鈕和卡片類似于自然界中的對(duì)象，而不是精確地重新創(chuàng)建它們。中性風(fēng)格不會(huì)將現(xiàn)實(shí)主義推到極致。取而代之的是，它努力實(shí)現(xiàn)淺色和微妙對(duì)比度的“柔和”外觀。
在過(guò)去大約一年的時(shí)間里，同質(zhì)化一直是UI / UX專業(yè)人員中討論最多的主題之一。盡管仍然沒(méi)有很多真正的數(shù)字產(chǎn)品的用戶界面遵循這種方法，但許多設(shè)計(jì)人員對(duì)該概念感到興奮。像Behance和Dribbble這樣的專業(yè)平臺(tái)已經(jīng)包含了許多同態(tài)的例子。因此，我們有充分的理由相信，這一趨勢(shì)最終將在2021年出現(xiàn)在我們的手機(jī)和筆記本電腦中。
視差效果和3D元素并不是UX設(shè)計(jì)中的全新內(nèi)容。我們已經(jīng)看到了如何在許多Web設(shè)計(jì)解決方案中實(shí)現(xiàn)它們。但是，我們?nèi)匀挥^察到這些用戶體驗(yàn)趨勢(shì)正在逐步普及。
首先，它的使用量顯著增加。如今，3D元素和視差效果已不再是網(wǎng)絡(luò)上奇特的事物。它們更為常見(jiàn)，特別是在代表著脫穎而出的時(shí)尚和電子商務(wù)品牌的網(wǎng)站和應(yīng)用上。
另一種趨勢(shì)是嘗試在一個(gè)界面中結(jié)合視差效果和3D圖形。使用視差滾動(dòng)時(shí)，網(wǎng)頁(yè)背景和前景元素以不同的速度移動(dòng)。僅憑它就能產(chǎn)生深度感。通過(guò)為此添加3D對(duì)象，您可以創(chuàng)建一種真正的身臨其境的體驗(yàn)，并將在用戶的記憶中保留很長(zhǎng)時(shí)間。
隨著我們?cè)O(shè)備屏幕的變寬，UI / UX設(shè)計(jì)中出現(xiàn)了不對(duì)稱趨勢(shì)。通常，不對(duì)稱是野獸派的一種屬性，這是藝術(shù)和網(wǎng)頁(yè)設(shè)計(jì)中與極簡(jiǎn)主義相反的一種風(fēng)格。但是，如果與其他殘酷的設(shè)計(jì)元素分開(kāi)使用，它可以使您的網(wǎng)站看起來(lái)有趣，同時(shí)使它保持微妙和優(yōu)雅。
不對(duì)稱布局的UI / UX趨勢(shì)通常與其他創(chuàng)造性的Web設(shè)計(jì)技術(shù)一起實(shí)現(xiàn)，例如破碎的網(wǎng)格，重疊的元素和分割的屏幕。您也可以將不對(duì)稱性應(yīng)用于排版。如果操作正確，它將使您的品牌信息更加引人注目和令人難忘。
但是，請(qǐng)務(wù)必記住，非對(duì)稱設(shè)計(jì)并不意味著“隨機(jī)放置的UI元素”。在布局上定位對(duì)象的不尋常方式應(yīng)該引導(dǎo)用戶的眼睛朝正確的方向前進(jìn)，并幫助品牌強(qiáng)調(diào)重要信息。
今天，當(dāng)我們?cè)诨ヂ?lián)網(wǎng)上進(jìn)入隨機(jī)網(wǎng)站時(shí)，很可能會(huì)看到GIF，微型動(dòng)畫，動(dòng)畫插圖或其他一些運(yùn)動(dòng)設(shè)計(jì)元素。動(dòng)畫在用戶體驗(yàn)設(shè)計(jì)中仍然很流行，并且使用頻率不斷增長(zhǎng)。
除了具有視覺(jué)吸引力之外，移動(dòng)物體還可以改善用戶參與度并簡(jiǎn)化導(dǎo)航。他們還可以為數(shù)字產(chǎn)品或服務(wù)注入生命，使它們更具個(gè)性。
如果要在用戶界面設(shè)計(jì)中使用這種軟件開(kāi)發(fā)趨勢(shì)，那么明智地執(zhí)行此操作至關(guān)重要。漂浮在屏幕上沒(méi)有特定目的的對(duì)象可能會(huì)使訪問(wèn)者感到困惑，從而促使他們甚至比計(jì)劃的要早離開(kāi)網(wǎng)頁(yè)。動(dòng)畫元素也不應(yīng)使用戶界面不必要地復(fù)雜。它們始終必須是相關(guān)的，有價(jià)值的和平穩(wěn)的。
信息體系結(jié)構(gòu)是在頁(yè)面上組織和構(gòu)造不同內(nèi)容的方式。它是以用戶為中心的設(shè)計(jì)（UCD）的基本要素，旨在使用戶的數(shù)字環(huán)境更加舒適。與用戶研究和可用性測(cè)試一起，構(gòu)建有效，有用且一致的信息體系結(jié)構(gòu)是UCD流程的必不可少的階段。
為了創(chuàng)建一個(gè)實(shí)用的信息體系結(jié)構(gòu)，UX設(shè)計(jì)人員需要對(duì)產(chǎn)品的目標(biāo)受眾，其行為以及使用數(shù)字解決方案的原因有深入的了解。用戶應(yīng)該無(wú)需花費(fèi)太多精力就能獲得所需的結(jié)果。因此，在設(shè)計(jì)過(guò)程的線框階段始終必須考慮用戶的目標(biāo)，清晰的導(dǎo)航和內(nèi)容表示（包括盲點(diǎn)監(jiān)視）。
我們創(chuàng)建此文章是為了讓您在當(dāng)今競(jìng)爭(zhēng)異常激烈的數(shù)字世界中站穩(wěn)腳跟。這里提到的所有UX趨勢(shì)絕對(duì)可以改善幾乎每個(gè)軟件解決方案或網(wǎng)站的用戶體驗(yàn)。即使用戶期望很高，它們也可以使您的產(chǎn)品在視覺(jué)上對(duì)目標(biāo)受眾更具吸引力。
文章來(lái)源：站酷 作者：ZZiUP
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
交互成本是用戶在與網(wǎng)站交互中必須執(zhí)行以達(dá)到其目標(biāo)所需的精力（無(wú)論是精神上還是物理上）。
理想情況下，我們希望用戶訪問(wèn)網(wǎng)站并在他們眼前找到他們正在尋找的答案。這將意味著零交互成本，并且是檢驗(yàn)可用性的里程碑。
不幸的是，由于大多數(shù)站點(diǎn)和應(yīng)用程序都提供了用戶可能想要做的許多事情，因此很少能達(dá)到零交互成本。大多數(shù)時(shí)候，用戶必須四處瀏覽，閱讀，可能滾動(dòng)，找到有希望的鏈接，單擊它，等待頁(yè)面加載，然后重新進(jìn)行整個(gè)過(guò)程。有時(shí)，一個(gè)新窗口可能會(huì)在現(xiàn)有窗口的頂部彈出，在這種情況下，用戶必須將注意力轉(zhuǎn)移到新窗口上，也許還需要回頭看舊窗口以將信息集成到兩個(gè)窗口中。在其他情況下，用戶可能需要記住一頁(yè)上的信息，然后將其應(yīng)用于另一頁(yè)。所有這些動(dòng)作都需要認(rèn)知努力并彌補(bǔ)了交互成本。
可用站點(diǎn)將實(shí)現(xiàn)各種用戶目標(biāo)所需的交互成本降至最低。也就是說(shuō)，它們最小化：
閱讀
滾動(dòng)
環(huán)顧四周以查找相關(guān)信息
理解提供的信息
單擊或觸摸（不會(huì)出錯(cuò)）
打字
頁(yè)面加載和等待時(shí)間
注意開(kāi)關(guān)
內(nèi)存負(fù)載-用戶必須記住的信息才能完成其任務(wù)
這些用戶動(dòng)作對(duì)總交互成本的貢獻(xiàn)不同。它們的相對(duì)重要性可能取決于用戶-例如，閱讀障礙的用戶閱讀時(shí)間可能比點(diǎn)擊周圍的時(shí)間困難，而操作障礙的用戶可能會(huì)覺(jué)得點(diǎn)擊困難。它們還取決于設(shè)備-連接到高速網(wǎng)絡(luò)的臺(tái)式機(jī)上的頁(yè)面加載可能微不足道，但是如果蜂窩網(wǎng)絡(luò)覆蓋較慢，則移動(dòng)設(shè)備上的頁(yè)面加載可能會(huì)花費(fèi)很長(zhǎng)時(shí)間。
許多可用性準(zhǔn)則都解決了使交互成本的各個(gè)組成部分最小化的問(wèn)題。例如，網(wǎng)絡(luò)寫作規(guī)則通過(guò)推薦要點(diǎn)和簡(jiǎn)短的要點(diǎn)句子和段落來(lái)降低閱讀成本。
讓我們舉一個(gè)簡(jiǎn)單的例子。假設(shè)我們要查找“儀式”一詞的來(lái)源。我們將使用Dictionary iPhone應(yīng)用程序執(zhí)行此任務(wù)。我們將忽略在手機(jī)上查找應(yīng)用程序所涉及的成本，并且在啟動(dòng)Dictionary應(yīng)用程序后立即開(kāi)始分析。
啟動(dòng)應(yīng)用程序后出現(xiàn)的第一件事是啟動(dòng)屏幕。
在這一點(diǎn)上，交互成本包括等待幾秒鐘，以使啟動(dòng)屏幕消失并為應(yīng)用程序的第一個(gè)可操作屏幕騰出空間：
在此頁(yè)面上，互動(dòng)成本來(lái)自定位搜索框。幸運(yùn)的是，搜索框非常顯眼地位于頁(yè)面頂部，因此我們可以放心地認(rèn)為，用戶只需很少的精力就可以找到它。找到后，用戶需要觸摸搜索框以將輸入焦點(diǎn)移到搜索字段中。搜索框是一個(gè)相當(dāng)大且易于觸摸的目標(biāo)，因此交互成本也可能會(huì)降至最低。
接下來(lái)，用戶必須編輯搜索查詢。
當(dāng)輸入焦點(diǎn)在搜索字段中移動(dòng)時(shí)，自動(dòng)建議的詞將自動(dòng)顯示。
用戶必須查看自動(dòng)建議并確定它們不相關(guān)，然后清除當(dāng)前查詢。他們可以通過(guò)按右側(cè)的灰色x按鈕（如果他們熟悉iOS規(guī)則）來(lái)執(zhí)行此操作，也可以通過(guò)按觸摸屏上的Delete鍵來(lái)逐個(gè)清除字符。
刪除后，用戶將開(kāi)始輸入目標(biāo)詞“儀式”。當(dāng)他們開(kāi)始輸入內(nèi)容時(shí)，關(guān)聯(lián)詞會(huì)顯示在下方。用戶可以檢查關(guān)聯(lián)詞并決定是否要繼續(xù)鍵入或停止并選擇關(guān)聯(lián)詞。
選擇（或鍵入）單詞“ ceremony”后，用戶必須按Search進(jìn)入結(jié)果頁(yè)面。他們需要等待片刻才能顯示新頁(yè)面：
用戶必須推斷Origin可能包含有關(guān)單詞來(lái)源的信息。（對(duì)于大多數(shù)用戶而言，這是一個(gè)簡(jiǎn)單的推論，因此認(rèn)知成本很低；但是，如果改用“詞源”一詞，則某些用戶可能會(huì)在閱讀和理解其含義時(shí)遇到更多麻煩；因此，“來(lái)源”是更好的選擇，因?yàn)樗档土私换コ杀尽＃?
讓我們總結(jié)一下交互成本的各個(gè)組成部分，以找到“儀式”一詞的由來(lái)：
等待啟動(dòng)頁(yè)面
搜索
輸入幾個(gè)字符
掃描自動(dòng)提示列表，以查看所需單詞是否在其中
如果否，請(qǐng)輸入更多字符并在上一步中重復(fù)
如果是，請(qǐng)通過(guò)點(diǎn)擊選擇所需的單詞
找到搜索框，然后點(diǎn)擊將輸入焦點(diǎn)移至該搜索框
閱讀搜索框中顯示的查詢和自動(dòng)建議
決定查詢不相關(guān)
刪除搜索框中顯示的查詢
鍵入或選擇自動(dòng)建議
點(diǎn)擊搜索
等待結(jié)果頁(yè)面
在結(jié)果頁(yè)面上找到相關(guān)的詞源信息
向下滾動(dòng)頁(yè)面并掃描內(nèi)容以查找詞源信息
找到標(biāo)簽并閱讀
請(qǐng)注意，右側(cè)還有更多隱藏的標(biāo)簽
推斷詞源可能是隱藏的標(biāo)簽之一
注意到滑動(dòng)會(huì)向右暴露內(nèi)容
向右滑動(dòng)
閱讀Origin并將該單詞與目標(biāo)聯(lián)系起來(lái)，以找到單詞的來(lái)源
點(diǎn)擊詞源
了解“儀式”一詞的來(lái)源
如您所見(jiàn)，一個(gè)相當(dāng)簡(jiǎn)單而輕松的過(guò)程需要很多步驟和子步驟；他們每個(gè)人都會(huì)產(chǎn)生互動(dòng)費(fèi)用。對(duì)于某些人而言，交互成本微不足道-例如，記住人們向右滑動(dòng)即可顯示更多內(nèi)容，因此交互成本非常低，因?yàn)槿藗冊(cè)谝苿?dòng)設(shè)備或Web上已經(jīng)多次遇到水平滾動(dòng)。可以優(yōu)化其他步驟以最小化交互成本；因此，在搜索框中使用灰色的小x按鈕可以大大降低刪除顯示在搜索框中的查詢的成本。同樣，將按鈕調(diào)大可以幫助點(diǎn)擊目標(biāo)。選項(xiàng)卡的位置和外觀設(shè)計(jì)會(huì)影響人們找到選項(xiàng)卡的速度。（當(dāng)然，選項(xiàng)卡本身的選擇與使用其他方式來(lái)構(gòu)造內(nèi)容的方式也會(huì)影響用于在結(jié)果頁(yè)上查找相關(guān)信息的位置的交互成本。）
請(qǐng)注意，對(duì)于前面各節(jié)中的某些步驟，用戶可以有多種選擇。例如，他們可以按灰色的x按鈕刪除當(dāng)前字符串，也可以多次使用Delete鍵?；蛘撸麄兛梢詮淖詣?dòng)建議列表中選擇建議，也可以在最后輸入字符串。
人們?nèi)绾螞Q定采取哪種行動(dòng)？答案在于預(yù)期效用的概念：
預(yù)期效用=預(yù)期收益–預(yù)期交互成本
用戶嘗試最大化一項(xiàng)操作的預(yù)期效用：換句話說(shuō)，他們權(quán)衡了每個(gè)操作的收益和成本，然后選擇收益與成本之間最佳平衡的方案。
當(dāng)有幾種方法可以實(shí)現(xiàn)具有相似利益的相同目標(biāo)時(shí)，用戶通常傾向于選擇使估計(jì)的交互成本最小的操作。
例如，許多人可能不會(huì)在自動(dòng)提示列表中向下滾動(dòng)以找到“儀式”一詞，而是可能會(huì)再鍵入一個(gè)（或幾個(gè)）字符，直到可見(jiàn)“儀式”一詞為止，因?yàn)橄蛳聺L動(dòng)小列表和掃描列表中的正確單詞比擊中一個(gè)甚至幾個(gè)字符的成本更高。
這種類型的想法也普遍適用于站點(diǎn)級(jí)別。如果看起來(lái)真的很難在任何給定站點(diǎn)上實(shí)現(xiàn)其目標(biāo)，則除非與初始站點(diǎn)進(jìn)行交互的收益確實(shí)很高，否則大多數(shù)用戶只會(huì)以較低的估計(jì)交互成本轉(zhuǎn)移到另一個(gè)站點(diǎn)。舉個(gè)例子，如果用戶真的想購(gòu)買Apple電腦，他們可能會(huì)堅(jiān)持使用Apple的網(wǎng)站，因?yàn)樗麄儾惶赡茉谄渌胤劫?gòu)買。在這種情況下，用戶的動(dòng)機(jī)確實(shí)很高，因此他們可能愿意忍受很高的交互成本。但是，如果用戶要購(gòu)買燒烤架，則可能不在乎是否從Home Depot或Lowe's或其他站點(diǎn)購(gòu)買，并且會(huì)離開(kāi)互動(dòng)成本高的站點(diǎn)。
營(yíng)銷和品牌推廣通常會(huì)增加與特定網(wǎng)站或品牌互動(dòng)的用戶動(dòng)機(jī)和預(yù)期收益；可用性可以降低交互成本。兩種方法最終都解決了增加使用站點(diǎn)或軟件的預(yù)期效用的問(wèn)題。
交互成本是可用性的直接度量。實(shí)際上，該概念早在人機(jī)交互時(shí)就被引入，以評(píng)估軟件系統(tǒng)的可用性。所有的可用性啟發(fā)將用戶的交互成本降至最低。
從長(zhǎng)遠(yuǎn)來(lái)看，快速評(píng)估設(shè)計(jì)的交互成本可以節(jié)省大量資金，因?yàn)樗梢院芎玫睾饬坑脩艚缑娴碾y易程度。它也可以用作設(shè)計(jì)備選方案之間的比較工具：通常，將交互成本最小化的方案具有更大的成功機(jī)會(huì)。
文章來(lái)源：站酷 作者：ZZiUP
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
“今天吃什么啊？”
“不知道啊，看看大眾點(diǎn)評(píng)，哪家店比較靠前”
“一會(huì)去看什么電影？”
“我看豆瓣上，這部片子評(píng)分特別高，我們?nèi)タ催@個(gè)吧”
當(dāng)我們每天面對(duì)類似“吃什么”“買哪個(gè)品牌”“周末去哪玩”等等需要抉擇的問(wèn)題時(shí)，面對(duì)的選擇越多卻越不知道如何做決定，或者當(dāng)下做了決定覺(jué)會(huì)一直思考做的這個(gè)決定是不是最好的，選擇困難變成了大眾病。面對(duì)用戶的選擇需求各大平臺(tái)都有自己的方式，幫助用戶做決定的同時(shí)，引導(dǎo)用戶購(gòu)買目標(biāo)產(chǎn)品，極大的降低了用戶的選擇成本，其中排行榜就是平臺(tái)的常用套路。用戶的選擇成本是什么？排行榜為什么能夠幫助用戶降低選擇成本？排行榜僅僅是用來(lái)降低用戶的選擇成本，為什么商家對(duì)排行榜也趨之若鶩？下面帶你了解為什么人人都愛(ài)排行榜，及我們生活無(wú)處不在的“顯性”“非顯性”排行榜。你可能都不知道，我們的生活正在被各種排行榜所支配！
排行榜的本質(zhì)是一個(gè)沒(méi)有感情的信息篩選機(jī)制，某一相關(guān)的同類事物之間通過(guò)比較，反映同類事物客觀實(shí)力。排行榜建立的基礎(chǔ)在于用戶對(duì)信息篩選平臺(tái)權(quán)威性的認(rèn)可，比如我們買衣服會(huì)首選淘寶，電子類產(chǎn)品會(huì)首選京東，看電影會(huì)看豆瓣評(píng)分，這些都是對(duì)平臺(tái)某一領(lǐng)域權(quán)威性的認(rèn)可。用戶信任平臺(tái)權(quán)威性對(duì)信息的篩選，由于錨定效應(yīng)降低用戶自己的選擇成本，準(zhǔn)備快速的做出選擇。同時(shí)由于用戶的從眾心理或者羊群效應(yīng)，也會(huì)對(duì)上榜主體產(chǎn)生強(qiáng)烈的品牌認(rèn)可，為上榜主體帶來(lái)更多的利益、強(qiáng)烈的榮譽(yù)感、甚至流量和平臺(tái)背書標(biāo)簽，比如：B站的百大up主，各個(gè)平臺(tái)排行榜的銷量冠軍、朝陽(yáng)地區(qū)必吃榜第一名。那這一切背后的原理是什么？
一個(gè)完整的排行榜需要平臺(tái)、上榜主體、用戶三大組成部分，俗話說(shuō)屁股決定腦袋，不同的定位決定了排行對(duì)三大組成部分不同的作用，當(dāng)然背后的原理也不盡相同。
在沒(méi)有各種應(yīng)用前，當(dāng)我們決定購(gòu)買什么東西或去哪家消費(fèi)，前期需要花費(fèi)大量的人力、物力，搜集相關(guān)的信息進(jìn)行整理集合后，對(duì)比集合信息后才能做出決定，也就是說(shuō)用戶需要經(jīng)過(guò)信息的搜集-備選集的建立-擇優(yōu)決策3個(gè)過(guò)程才能等到最終的結(jié)果。在建立備選集后，做出擇優(yōu)決策階段發(fā)生的成本或費(fèi)用都是用戶付出的選擇成本（前兩個(gè)階段發(fā)生的成本是交易費(fèi)用，而不是選擇成本）。在備選集的建立過(guò)程中，包含的選擇越多，用戶選擇的難度就越大，選擇成本就會(huì)越高。
選擇性排行榜在備選集建立完成后，利用沉錨效應(yīng)在用戶心理建立潛意識(shí)的目標(biāo)參照，幫助用戶完成擇優(yōu)決策，降低用戶的選擇成本。（另一方面平臺(tái)在幫助降低選擇成本的同時(shí)，也會(huì)影響這用戶的最終選擇，在接下來(lái)的平臺(tái)側(cè)方面會(huì)有詳細(xì)的分析）
比如說(shuō)：當(dāng)我需要買個(gè)耳機(jī)時(shí)，如果在沒(méi)有各大應(yīng)用的前提下，我需要找到我身邊的耳機(jī)發(fā)燒友或數(shù)碼電子方面方面的內(nèi)行人，收集信息建立備選集，但由于京東在電子設(shè)備方面的權(quán)威性，我會(huì)優(yōu)先查看京東的耳機(jī)類排行榜，也就是說(shuō)京東完成了前期的信息搜集及備選集建立，而用戶出于對(duì)平臺(tái)權(quán)威性的信任，根據(jù)平臺(tái)給出的維度參照、品牌參照、價(jià)格、標(biāo)簽參照等信息，最終快速的完成自己的選擇。整個(gè)過(guò)程就是用戶在對(duì)錨的尋找，以及用戶對(duì)信息確定性的尋找過(guò)程。
在馬斯洛需求中，當(dāng)個(gè)人的生理需求和安全需求被滿足時(shí)，與他人建立情感聯(lián)系或關(guān)系成為人們最強(qiáng)烈的需求，即社交需求。社交又分為：為達(dá)到某種目的產(chǎn)生的功利社交或?yàn)楂@得情感連接及體驗(yàn)的共情社交需求。例如：QQ音樂(lè)新增的撲通社區(qū)、微博明星超話打榜等功能模塊的火熱正是滿足了擁有共同興趣愛(ài)好的用戶對(duì)于共情社交的需求。
無(wú)論是“功利社交”還是“共情社交”首先需要的是溝通，溝通的本質(zhì)則是信息的流通，但當(dāng)雙方都沒(méi)有可以溝通的信息時(shí)則社交不成立，而類似：微博熱搜、今日頭條、澎湃新聞等信息類排行榜，則給有社交需求的用戶提供了相通的談資。
在選擇類排行榜中，提到的從眾心理（又稱羊群效應(yīng)），是指人類由于對(duì)信息壓力及規(guī)范壓力，會(huì)希望融入到群體中尋求安全感的特性，即便此類信息與自己無(wú)關(guān)。大部分人由于對(duì)未獲得及時(shí)信息的焦慮感，會(huì)熱衷于瀏覽此類排行榜來(lái)獲取實(shí)時(shí)信息，融入群體生活。每天早上，在通勤的路上用戶利用碎片時(shí)間刷微博、瀏覽知乎或今日頭條等應(yīng)用了解最近發(fā)生了什么社會(huì)事件，在上班電梯或工作間隙討論各自掌握的信息，及對(duì)事件的見(jiàn)解，甚至在與他人有相同的見(jiàn)解或之后，會(huì)對(duì)對(duì)方產(chǎn)生莫名的親近感，滿足自己的社交需求。
過(guò)年期間各家app紛紛推出自己的用戶年度報(bào)告總結(jié)榜，不知道你有沒(méi)有參與到其中，并分享到自己的朋友圈。在我們的平常生活中也會(huì)在朋友圈、B站等看到各種測(cè)試自己隱藏能力或性格的小程序，人們對(duì)于這類活動(dòng)的空前熱情其實(shí)是因?yàn)槿祟惓诵枰畔⒌拇_認(rèn)外，還需要了解自身在大數(shù)據(jù)下的自我確認(rèn)，通過(guò)各種各樣的榜單，判斷自身的能力、情緒、價(jià)值等，來(lái)達(dá)到自我認(rèn)同，否則就會(huì)感到焦慮不安。
加拿大社會(huì)學(xué)家歐文·戈夫曼在《日常生活中的自我呈現(xiàn)》中提出他對(duì)社會(huì)生活的理解“社會(huì)是舞臺(tái)，人人皆演員”。 在社會(huì)這個(gè)舞臺(tái)我們需要對(duì)外有印象管理的過(guò)程，我們想要呈現(xiàn)給觀眾怎樣的形象，需要我們對(duì)自身及身邊人有所思考和了解。所以在社會(huì)生活中我們呈現(xiàn)的是自己思考管理下被他人和社會(huì)接受的自己，為了維持自身的平衡防止崩潰，人類會(huì)自發(fā)“忠誠(chéng)、紀(jì)律、謹(jǐn)慎”的維護(hù)自己的外在形象。而互聯(lián)網(wǎng)平臺(tái)大數(shù)據(jù)則折射出“隱形”的自己，讓用戶更加清楚的認(rèn)知自己，同時(shí)通過(guò)分享，滿足自我確認(rèn)以及他人確認(rèn)的需求。
我目前只總結(jié)出這三種類型的排行榜，如果有小伙伴想到其他類型歡迎在評(píng)論區(qū)提出，一起參與討論。
無(wú)論哪種排行榜，用戶信任的基礎(chǔ)都來(lái)自對(duì)平臺(tái)的信任，那么用戶為什么信任平臺(tái)？排行榜對(duì)平臺(tái)意味著什么？背后原理是什么？
對(duì)于用戶來(lái)說(shuō)排行榜是為了滿足用戶對(duì)于數(shù)據(jù)參數(shù)、社交信息、自我個(gè)人的確定性，選擇成本是品牌經(jīng)濟(jì)學(xué)的核心，而用戶對(duì)于排行的信任首先要建立在平臺(tái)品牌的權(quán)威性下。
從我們記事起，我們對(duì)世界的認(rèn)識(shí)來(lái)自自己的父母或老師，而這些教導(dǎo)我們什么是對(duì)、錯(cuò)，對(duì)當(dāng)時(shí)的我們來(lái)說(shuō)是權(quán)威的化身。長(zhǎng)大后我們對(duì)于權(quán)威的認(rèn)可更傾向于某一領(lǐng)域的專家，比如：醫(yī)生、律師、教授等。認(rèn)為處于權(quán)威地位的人在某一領(lǐng)域相對(duì)普通用戶的判斷更可靠，可以幫助普通用戶節(jié)省研究問(wèn)題的工作，做出更輕松的決定，雖然不一定是正確的。
搜索我們會(huì)第一時(shí)間想到百度，影視、書籍會(huì)想到豆瓣，想聽(tīng)音樂(lè)會(huì)打開(kāi)網(wǎng)易云音樂(lè)、QQ音樂(lè)等等。各大應(yīng)用經(jīng)過(guò)長(zhǎng)時(shí)間的廝殺各自在用戶心中建立了某一領(lǐng)域的權(quán)威性，形成品牌號(hào)召力，推動(dòng)用戶做出需求決策。另一方面排行榜中也會(huì)說(shuō)明數(shù)據(jù)來(lái)源，比如京東會(huì)在排行榜頁(yè)面有明確的榜單說(shuō)明，豆瓣根據(jù)平臺(tái)數(shù)據(jù)更新，汽車之家依靠外部的權(quán)威數(shù)據(jù)等等方式力證自己榜單的公正、透明，減少用戶做出決定中的思考、猜測(cè)，獲得用戶的信任，增強(qiáng)平臺(tái)的權(quán)威性。那對(duì)于平臺(tái)來(lái)說(shuō)權(quán)威性的建立意味著什么？
平臺(tái)權(quán)威性意味著說(shuō)服力和影響力，在減輕用戶的決策壓力的同時(shí)，影響用戶做出平臺(tái)所需的決策方向；
每年蘋果發(fā)布會(huì)都會(huì)帶來(lái)范圍極大的熱度討論，而app store內(nèi)的熱門推薦自帶話題度和討論熱度
排行榜作為內(nèi)容輸出口，在平臺(tái)權(quán)威性的背書下，產(chǎn)品優(yōu)化自身的價(jià)值，而平臺(tái)也可以通過(guò)排行榜優(yōu)化自身平臺(tái)價(jià)值
平臺(tái)權(quán)威性下，可以通過(guò)多種方式達(dá)到盈利，比如蘋果app store應(yīng)用商店內(nèi)的付費(fèi)應(yīng)用，百度的鳳巢系統(tǒng)、微博熱搜的第3、4位排名等。
在平臺(tái)完成建立權(quán)威性開(kāi)始利用排行榜進(jìn)行商業(yè)變現(xiàn)時(shí)，比如百度、58的競(jìng)價(jià)排名，現(xiàn)在大部分應(yīng)用會(huì)使用明顯的方式告知用戶，防止平臺(tái)建立品牌權(quán)威性。比如微博熱搜第3、4位廣告位的“薦”，淘寶、小紅書推薦猜你喜歡的“廣告”。
上榜主體作為整個(gè)排行榜的內(nèi)容中心，由于排行榜自帶的競(jìng)爭(zhēng)機(jī)制、篩選機(jī)制，使得用戶會(huì)很樂(lè)于分享出去，比如游戲類應(yīng)用王者榮耀的勝利者排位、微信運(yùn)動(dòng)排行榜。
由于馬太效應(yīng)上榜主體中的頭部用戶會(huì)獲得平臺(tái)更多的曝光量、絕大部分用戶的關(guān)注度，以及各種潛在資源，比如：流量、資源、人脈、某一領(lǐng)域影響力、平臺(tái)背書等等，這些都是潛在的社交貨幣。這種激勵(lì)機(jī)制極大的滿足了上榜主體的榮譽(yù)感、及平臺(tái)歸宿感，比如bilibili不同粉絲量級(jí)會(huì)送出相對(duì)應(yīng)的粉絲牌。
而平臺(tái)方也利用上榜主體挖掘潛在的用戶，為平臺(tái)帶來(lái)更多的新用戶，加強(qiáng)平臺(tái)權(quán)威性，形成平臺(tái)和上榜主體的良性循環(huán)。甚至與出現(xiàn)上榜主體自己的流量超過(guò)平臺(tái)自身流量，帶走平臺(tái)用戶的情況。比如去年和熱鬧的“巫師財(cái)經(jīng)推出b站，簽約西瓜視頻”，各大平臺(tái)也時(shí)不時(shí)會(huì)出現(xiàn)搶占流量up主的情況。
排行榜設(shè)計(jì)要達(dá)到用戶攀比的效果，很重要的充分條件就是相同需求的好友基數(shù)足夠大，這樣才能構(gòu)成排行榜設(shè)計(jì)成功的必要條件。
對(duì)于已有成功產(chǎn)品的公司，可以借助平臺(tái)相互間的導(dǎo)流完成初試資源的搭建，比如：微信初期借助QQ好友流量，帶來(lái)好友初期的爆發(fā)；抖音最初的活躍借助今日頭條的流量輸入。
不斷推送已關(guān)注好友的信息流，當(dāng)通訊錄好友開(kāi)始使用頭條都要發(fā)送系統(tǒng)推送。比如全年年低火爆全網(wǎng)的cloubhouse就是利用的熟人社交，你要先有這個(gè)人聯(lián)系方式才能要求好友，關(guān)注的人越多才能解鎖更多的聊天室。通訊錄、地理位置、興趣偏好等等，不斷社區(qū)建設(shè)推送動(dòng)態(tài)信息流和好友卡片推薦。
當(dāng)應(yīng)用建立初期，沒(méi)有很多的資源和內(nèi)容時(shí)，需要平臺(tái)自行填充內(nèi)容，使得排行榜信息量大，增加用戶活躍，才能挖掘用戶的需求和個(gè)性化。不如一些小編推薦、猜你喜歡等等，或是平臺(tái)pgc發(fā)布推送的內(nèi)容。
面對(duì)不同的用戶人群及使用場(chǎng)景排行榜的入口表現(xiàn)形式也會(huì)千變?nèi)f化，根據(jù)表現(xiàn)形式大體可分為“顯性排行榜”和“隱形排行榜”。
在界面有明顯的榜單名稱、排序、評(píng)判規(guī)則、上榜主體、賣點(diǎn)信息等。排序和內(nèi)容主體是這個(gè)排行榜的基本構(gòu)成，其他則根據(jù)不同產(chǎn)品類型及產(chǎn)品需求決定是否展示。
在首頁(yè)底部或頂部tab形式出現(xiàn)，多出現(xiàn)在以UGC或文字信息為核心的產(chǎn)品，以內(nèi)容信息為主，常見(jiàn)以信息熱度為主要功能的資訊、新聞?lì)悜?yīng)用。比如：知乎、今日頭條、36氪。
知乎熱榜內(nèi)容完全展開(kāi)；36氪分為話題榜、人氣榜，話題榜僅展示前5條，人氣榜展示10條，僅在前5條有名次圖標(biāo)，在36氪熱榜的中部還會(huì)出現(xiàn)收藏榜，綜合榜。
而今日頭條僅在整個(gè)頁(yè)面的1/3處展示部分“頭條熱榜”，點(diǎn)擊“查看更多”后，展開(kāi)“頭條熱榜”及“今日關(guān)注”“北京熱榜”，整個(gè)交互形式類似微博熱搜。
首頁(yè)功能入口處明顯排行榜圖標(biāo)，優(yōu)先級(jí)較高，常見(jiàn)自帶推薦屬性，能夠幫助用戶快速選擇，減少選擇成本，比較依賴榜單的應(yīng)用。比如：豆瓣、音樂(lè)類、騰訊動(dòng)漫等應(yīng)用。
其中豆瓣、網(wǎng)易云音樂(lè)由于各種類型的排行榜很多，在圖標(biāo)點(diǎn)擊開(kāi)后，在當(dāng)前頁(yè)面平鋪不同維度榜單類型，用戶進(jìn)行點(diǎn)擊跳轉(zhuǎn)；騰訊動(dòng)漫相對(duì)榜單類型較少，在左邊側(cè)邊欄切換不同的榜單。
用戶查看商品詳情時(shí)，可能會(huì)希望能夠橫向?qū)Ρ韧惿唐?，才能最終決定購(gòu)買那件商品。常見(jiàn)于電商類應(yīng)用，比如：京東、拼多多、得物等。點(diǎn)擊后進(jìn)入不同的榜單頁(yè)面，獲取更多產(chǎn)品信息進(jìn)行篩選。（淘寶的商品詳情頁(yè)沒(méi)有排行榜，但在首頁(yè)卻存在隱形排行榜，在隱形排行榜模塊會(huì)有詳細(xì)說(shuō)明）
當(dāng)用戶沒(méi)有明確搜索目的時(shí)，搜索框的下方，平臺(tái)會(huì)推薦沒(méi)有明確指向性但有熱度的產(chǎn)品信息。衡量的標(biāo)準(zhǔn)一般為搜索熱度或信息本身的熱度。利用榜單效應(yīng)留住用戶，比如：微博熱搜、淘寶熱賣、抖音熱榜等。
沒(méi)有明顯排名及規(guī)則，但經(jīng)過(guò)大數(shù)據(jù)、平臺(tái)或榜單制作者篩選后呈現(xiàn)在平臺(tái)用戶的面前，位置越靠前，在用戶心目中的默認(rèn)位置越靠前，比如淘寶的“有好貨”、編輯精選等。
在平臺(tái)建立初期沒(méi)有特別的內(nèi)容供平臺(tái)呈現(xiàn)，這時(shí)候就需要平臺(tái)人工有目的的推薦一些內(nèi)容，不同于“猜你喜歡”建立在用戶的行為數(shù)據(jù)下，編輯推薦更多的平臺(tái)希望用戶看到的內(nèi)容，一方面作為平臺(tái)內(nèi)容的輸出口引導(dǎo)用戶，另一方面內(nèi)容是平臺(tái)自己發(fā)布內(nèi)容，也可以保證內(nèi)容的高質(zhì)量。
平臺(tái)根據(jù)用戶之前的瀏覽量、收藏量、轉(zhuǎn)發(fā)、搜索等用戶行為數(shù)據(jù)推薦給用戶相關(guān)內(nèi)容。這個(gè)時(shí)候的應(yīng)用基本已度過(guò)最初的獲客期，并且存在大量的平臺(tái)用戶使用數(shù)據(jù)，“猜你喜歡或相關(guān)推薦”模塊用來(lái)增加用戶的瀏覽時(shí)長(zhǎng)及購(gòu)買的可能性，各大應(yīng)用平臺(tái)適用性強(qiáng)，一般出現(xiàn)在首頁(yè)部分。
朋友圈每年年底都會(huì)曬出的各種各樣的生活、音樂(lè)、消費(fèi)的排行榜，這些其實(shí)是用戶自己確定了解自己，且喜歡他人了解自己的一種方式。用戶通過(guò)網(wǎng)絡(luò)數(shù)據(jù)折射出自我的輪廓，清楚的認(rèn)識(shí)自己。
不知道大家小時(shí)候看沒(méi)看過(guò)《第10放映室》，那是我最早關(guān)于排行榜的印象，里面會(huì)有各種最佳動(dòng)作片總結(jié)、最佳男配角總結(jié)等等，以香港電影偏多，是我早年的電影信息資料庫(kù)?，F(xiàn)在我們也會(huì)在小紅書、抖音、公眾號(hào)平臺(tái)刷到各種各樣的top推薦，這其實(shí)也是排行榜的一種。TOP類是已經(jīng)經(jīng)過(guò)人為篩選的排行榜，從眾多選擇中選擇出部分答案，給出理由，而用戶只需在已被篩選過(guò)的內(nèi)容中進(jìn)行決定，節(jié)省選擇成本，比如豆瓣每年都會(huì)舉行的豆瓣電影。另外一種TOP榜并不能幫助用戶做決定，但可以迎合用戶對(duì)確定性需求的各種盤點(diǎn)性質(zhì)的排行榜，比如抖音的TOP榜哥就是盤點(diǎn)各種內(nèi)容，人物。
相比其他排行榜，篩選后的內(nèi)容已經(jīng)體現(xiàn)了用戶的具體需求，高效明確的給用戶提供選項(xiàng)，引導(dǎo)用戶快速選擇。
排行榜一般由必需的榜單頭部、上榜主體，及非必需的榜單規(guī)則、更新信息構(gòu)成；而上榜主體由必需的主體信息、排序，以及非必需的推薦理由、排名變化、熱度信息構(gòu)成。
好的榜單能夠快速吸引用戶快速找到自己的需求點(diǎn)，引導(dǎo)用戶點(diǎn)擊排行榜進(jìn)行查看。而榜單頭部也由于功能需求的不同分為唯一性榜單頭部、可復(fù)用性榜單頭部。
當(dāng)排行榜在整個(gè)應(yīng)用中有且只有一個(gè)時(shí)，通常會(huì)對(duì)榜單頭部的背景及榜單名稱進(jìn)行個(gè)性化、品牌化設(shè)計(jì)。比如微博的微博熱搜、知乎的鹽選榜單、今日頭條的頭條熱榜、大眾點(diǎn)評(píng)的大眾點(diǎn)評(píng)榜單等。其中微博、頭條、大眾點(diǎn)評(píng)都在名稱上有做品牌漏出，增加平臺(tái)的品牌權(quán)威性。
有些應(yīng)用平臺(tái)會(huì)存在內(nèi)容需要多種不同緯度的排行榜展示的情況，為了平臺(tái)的統(tǒng)一性、降低后期的維護(hù)成本，一般會(huì)使用可復(fù)用的榜單頭部，如豆瓣、京東、QQ音樂(lè)等。
得物通過(guò)替換左右切換商品進(jìn)行宣傳。豆瓣、微博、馬蜂窩雖然都是通過(guò)替換圖片及文案的形式達(dá)到適配，但根據(jù)場(chǎng)景又有不同。豆瓣、微博因榜單效應(yīng)根據(jù)榜單第一位的變化更換底圖及文案；馬蜂窩沿用自己品牌的蜂窩形狀及“馬蜂窩榜單”的標(biāo)簽設(shè)計(jì)形式，通過(guò)更換文案底圖達(dá)到適用不同主題；京東就相對(duì)比較簡(jiǎn)單，只是更換標(biāo)題的文案達(dá)到多主題適配。
排行榜上榜主體由于不同的場(chǎng)景業(yè)務(wù)需求，一般有純文字形式、圖文結(jié)合形式、橫排+列表結(jié)構(gòu)3種表現(xiàn)形式，其中主體信息及排序為排行榜必須信息，而推薦理由、排名變化、熱度信息、評(píng)分等等非必須信息則根據(jù)用戶關(guān)注信息點(diǎn)選擇漏出。
純文字的排行榜一般是以內(nèi)容（或標(biāo)題）加排名的形式出現(xiàn)，常見(jiàn)以信息為主的排行榜，比如微博、知乎、今日頭條等以信息為主要關(guān)注點(diǎn)的應(yīng)用，或是搜索列表下方的熱度排行榜。信息類排行榜一般以信息熱度為衡量標(biāo)準(zhǔn)，因此會(huì)在標(biāo)題及排位外，增加各種突出熱度信息的表現(xiàn)形式，如關(guān)注熱度人數(shù)，或是“熱”“新”“爆”等等表示熱度的標(biāo)簽，如抖音、微博。而淘寶搜索熱度則是在標(biāo)簽外增加了上升下降的排名變化。
相對(duì)于純文字形式，圖文結(jié)合的排行榜因?yàn)閳D片信息的增加，使整個(gè)榜單主體占居更多的空間也可以展示更多的產(chǎn)品信息，輔助用戶進(jìn)行選擇。
上榜主體圖片尺寸一般會(huì)有橫版、方版、豎版3種形式。頭條、知乎等資訊類應(yīng)用都采用傳統(tǒng)的橫版圖片形式，延續(xù)了用戶閱讀新聞?lì)愘Y訊的習(xí)慣；而豆瓣、騰訊動(dòng)漫等由于現(xiàn)實(shí)中書籍封面、電影海報(bào)等用戶視覺(jué)場(chǎng)景都是豎版構(gòu)圖，因此沿用至線上使用的也是豎版圖片形式；而京東、大眾點(diǎn)評(píng)、馬蜂窩則使用方版的圖片形式，大概是因?yàn)楫a(chǎn)品的多樣性需要考慮多種圖片的適配問(wèn)題。（視頻、游戲類由于使用場(chǎng)景大部分采用橫版圖片形式；但由于游戲封面、宣傳海報(bào)也會(huì)有豎版的形式，比如：游民星空、小黑盒）
每當(dāng)設(shè)計(jì)圖文結(jié)合的部分，首先要考慮到底是采用左圖右文還是左文右圖的形式呢？可能很多人會(huì)說(shuō)這兩種形式?jīng)]有什么大的區(qū)別啊，有什么可糾結(jié)的！或者認(rèn)為由于視頻、圖片、文字對(duì)人類的吸引力是呈遞減形式的，因此應(yīng)該選擇左圖右文的形式。但實(shí)際上這跟我們長(zhǎng)久以來(lái)的閱讀習(xí)慣以及應(yīng)用希望觸達(dá)的用戶類型有很大的關(guān)系。
人類對(duì)畫面的閱讀及掃描方式通常為三種布局方式，包括：古騰堡圖（Gutenberg），Z型（z-pattern）和F型（f-pattern）。其中產(chǎn)品列表頁(yè)中最常使用的就是F型布局模式，F型布局是雅各布·尼爾森（Jacob Nielsen）在公司進(jìn)行眼動(dòng)追蹤研究后首次提出的。與其他模式相同的是，眼睛從上/左，水平移動(dòng)到上/右，然后回到左邊緣再此進(jìn)行水平掃描。但在F型布局第二次掃頻后，向右掃動(dòng)的次數(shù)會(huì)越來(lái)越少，并且會(huì)隨著向下移動(dòng)，眼球會(huì)緊貼左邊緣。用戶也傾向于F型模式瀏覽瀏覽整個(gè)頁(yè)面，即自左向右自上而下的閱讀模式，越向下信息獲取效率會(huì)越低。
因此今日頭條、知乎等需要通過(guò)文字傳遞給用戶準(zhǔn)確、豐富的新聞資訊類應(yīng)用普遍以左文右圖的形式展現(xiàn)。而電影、游戲、動(dòng)漫等以畫面觸達(dá)用戶需求的應(yīng)用則都采用的是左圖右文的表現(xiàn)形式，比如：騰訊動(dòng)漫、愛(ài)奇藝、得物等等。
說(shuō)到排行榜我們一般第一個(gè)會(huì)想到領(lǐng)獎(jiǎng)臺(tái)，很多平臺(tái)也采用領(lǐng)獎(jiǎng)臺(tái)這種前三名橫排+其他排名列表的結(jié)構(gòu)。純列表形式的排行榜，平臺(tái)用戶的注意力大部分集中在第一名，而領(lǐng)獎(jiǎng)臺(tái)的形式模仿現(xiàn)實(shí)生活中的獎(jiǎng)勵(lì)形式和儀式感，將整個(gè)排行榜的關(guān)注范圍從第一名擴(kuò)展至3名，另一方面排行榜的競(jìng)爭(zhēng)關(guān)系從單一爭(zhēng)爭(zhēng)奪一名變成前三名的競(jìng)爭(zhēng)關(guān)系，增加了第一名的高度。（目前這種形式我只在微博的明星勢(shì)力榜及抖音的直播全站榜中有看到）
榜單規(guī)則是排行榜規(guī)則的描述，是平臺(tái)權(quán)威性的體現(xiàn)。榜單規(guī)則有些平臺(tái)本身具有數(shù)據(jù)庫(kù)，會(huì)有相關(guān)的平臺(tái)數(shù)據(jù)支持如京東；而汽車之家則依靠“汽車工業(yè)協(xié)會(huì)”外部的數(shù)據(jù)支持，增加平臺(tái)的權(quán)威性及榜單的可信度；
信息更新一般存在在榜單頭部和上榜主體的中間，有些是固定時(shí)間更新，也有類似微博熱搜是實(shí)時(shí)更新的模式，而騰訊動(dòng)漫的更新作為用戶的痛點(diǎn)會(huì)在延續(xù)企鵝形象的側(cè)邊欄頭部標(biāo)明榜單更新周期。
排行榜的成功看似是人們對(duì)于選擇困難、信息獲取的解決方案，但歸根到底因?yàn)槿藗儗?duì)于不確定性的懼怕，無(wú)論是信息的不確定性或是對(duì)自身價(jià)值的不確定性。而平臺(tái)方利用金錢、名譽(yù)、獎(jiǎng)勵(lì)的外部激勵(lì)方式，結(jié)合滿足感、確定性、社交性的內(nèi)在激勵(lì)相互作用使得排行榜成為無(wú)論何種平臺(tái)都非常受歡迎的產(chǎn)品功能。作為平臺(tái)方因產(chǎn)品使用受眾、產(chǎn)品側(cè)重點(diǎn)、宣傳方式的不同，排行榜會(huì)以多種入口及展現(xiàn)形式出現(xiàn)。作為設(shè)計(jì)師需要深入了解排行榜等功能背后的產(chǎn)品邏輯，以及用戶操作行為背后的思考及心理效應(yīng)，提出合理的設(shè)計(jì)，幫助用戶了解產(chǎn)品功能，滿足用戶需求。
文章來(lái)源：站酷 作者：9號(hào)自習(xí)室
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
用戶的體驗(yàn)感對(duì)于一個(gè)產(chǎn)品來(lái)說(shuō)，是至關(guān)重要的。一個(gè)好的產(chǎn)品能夠充分照顧到用戶的感受，從而擁有大批的忠實(shí)用戶。用戶體驗(yàn)地圖是幫助產(chǎn)品設(shè)計(jì)者站在用戶維度思考體驗(yàn)優(yōu)化，提升用戶體驗(yàn)的重要工具。
那么，應(yīng)該如何打造用戶體驗(yàn)地圖及如何落地呢？我們?cè)诒疚慕o出了解答。（本文對(duì)用戶調(diào)研、用戶行為路徑、使用場(chǎng)景等也做出了詳細(xì)解析）
它以可視化的形式，來(lái)表現(xiàn)一個(gè)用戶使用產(chǎn)品或接受服務(wù)的體驗(yàn)情況，來(lái)發(fā)現(xiàn)用戶在整個(gè)體驗(yàn)過(guò)程中的問(wèn)題點(diǎn)與情緒點(diǎn)，從中提取出產(chǎn)品的優(yōu)化點(diǎn)。
對(duì)于1-∞的產(chǎn)品來(lái)說(shuō)，用戶體驗(yàn)地圖是用戶增長(zhǎng)策略的一部分，是產(chǎn)品優(yōu)化的重要工具。
用戶體驗(yàn)地圖一般由以下幾個(gè)部分組成：
用戶體驗(yàn)地圖的組成部分大同小異，可以根據(jù)自身分析內(nèi)容增加或簡(jiǎn)化。小伙伴可以保存這張空白模板，直接拿去填內(nèi)容哦~
我們給出了簡(jiǎn)潔明了的回答：
背靠著中國(guó)鐵路總局，12306在基礎(chǔ)票務(wù)預(yù)訂服務(wù)上有著得天獨(dú)厚的優(yōu)勢(shì)，但基于用戶日益增加的多樣化需求，以及越來(lái)越多的用戶愿意為優(yōu)質(zhì)體驗(yàn)買單，競(jìng)爭(zhēng)激烈的OTA們?nèi)找婢M(jìn)，與官方12306形成鮮明對(duì)比，本次優(yōu)化就圍繞12306流失最多的年輕用戶群體展開(kāi)。
本文以12306為例，主要針對(duì)購(gòu)票流程（核心功能），提升交互易用性和用戶體驗(yàn)，演示用戶體驗(yàn)地圖如何落地。首先我們來(lái)看一下用戶體驗(yàn)地圖的原型模板。
（上圖建議保存）
根據(jù)地圖原型的ABC區(qū)域，分別對(duì)應(yīng)著A區(qū)的用戶特征與需求，B區(qū)是用戶行為、思考、情緒，以及C區(qū)的總結(jié)分析。A區(qū)+B區(qū)得出C區(qū)，A和B都基于用戶，所以，了解用戶——是梳理用戶使用問(wèn)題的基礎(chǔ)和第一步。
經(jīng)過(guò)我們團(tuán)隊(duì)的經(jīng)驗(yàn)總結(jié)，得到繪制前的流程步驟如下圖，下文會(huì)拆分步驟一一講解。
體驗(yàn)地圖的“用戶”不是主觀腦補(bǔ)出來(lái)的，而是通過(guò)定性調(diào)研和基于數(shù)據(jù)支撐所得出的，所以收集用戶的信息是十分必要的。
以下我們通過(guò)用戶群體數(shù)據(jù)和問(wèn)卷調(diào)研數(shù)據(jù)（包括用戶畫像）來(lái)確定用戶模型。
本文根據(jù)以上數(shù)據(jù)，僅鎖定一線城市的主要用戶群體，也就是高線年輕人群的購(gòu)票流程優(yōu)化。
籠統(tǒng)的“對(duì)某類用戶使用產(chǎn)品的情況調(diào)研”是無(wú)法提供有價(jià)值的調(diào)研內(nèi)容的，調(diào)研目的一定是顆粒度可細(xì)化的存在。
12306平臺(tái)的下單耗時(shí)長(zhǎng)，年輕用戶流失率上升，對(duì)官方軟件槽點(diǎn)頗多，品牌影響較為負(fù)面。本次調(diào)研，主要針對(duì)年輕用戶在平臺(tái)的購(gòu)票路徑，分析該用戶群體，在下單過(guò)程中的操作節(jié)點(diǎn)與關(guān)注點(diǎn)，探索用戶流失與差評(píng)的原因。
我們把社會(huì)屬性相關(guān)的樣本數(shù)據(jù)按不同維度歸類，劃分用戶人群。比如按年齡、行業(yè)、職位等維度的典型特征，可以將12306APP的主要用戶劃分為：在校學(xué)生、企業(yè)白領(lǐng)、自由職業(yè)。
再加以問(wèn)卷結(jié)果描述，得到了高線年輕產(chǎn)品使用者的虛擬畫像。
在列問(wèn)卷內(nèi)容時(shí)，要注意12306是火車購(gòu)票工具類軟件，用戶目的明確——剛性需求，所以問(wèn)卷無(wú)需過(guò)多挖掘需求，而是鎖定調(diào)研目的，研究APP體驗(yàn)本身，精準(zhǔn)投放顆粒度較細(xì)的具體問(wèn)題。如下：
團(tuán)隊(duì)花了2天時(shí)間，總共發(fā)了335份問(wèn)卷，回收率80%，拿到了268份。圖表較多就不詳細(xì)展示過(guò)程了，重在方法。
根據(jù)統(tǒng)計(jì)結(jié)果，我們最終總結(jié)出了下列重點(diǎn)問(wèn)卷結(jié)論：
把這些痛點(diǎn)、滿意點(diǎn)，包括用戶實(shí)際接觸的界面或功能模塊，都?xì)w納記錄下來(lái)，方便后續(xù)將這些痛點(diǎn)進(jìn)行優(yōu)化改進(jìn)。
保存以上部分的相關(guān)數(shù)據(jù)和結(jié)論，我們已經(jīng)了解了用戶（進(jìn)入角色），接下來(lái)要確定用戶體驗(yàn)場(chǎng)景了（模擬人生）。
在做使用場(chǎng)景前，先通過(guò)產(chǎn)品設(shè)計(jì)者視角梳理出產(chǎn)品目前的用戶行為路徑，這個(gè)步驟的主要目的是找出復(fù)雜節(jié)點(diǎn)，降低操作成本。
它需要我們對(duì)操作流程進(jìn)行拆解，將一個(gè)流程拆解成幾個(gè)階段，階段又可以拆解成具體的操作節(jié)點(diǎn)。這樣一來(lái)，我們可以分析每個(gè)動(dòng)作節(jié)點(diǎn)存在的必要性。
根據(jù)上圖的4步法，第一步——我們?cè)诖_認(rèn)主流程的情況下，羅列所有操作節(jié)點(diǎn)：
一定不能怕麻煩，用戶所有的動(dòng)作節(jié)點(diǎn)都要羅列。
然后我們要找出復(fù)雜的操作節(jié)點(diǎn)，也就是可以優(yōu)化用戶操作的節(jié)點(diǎn)，當(dāng)然也不能主觀地“我覺(jué)得”，用交互量化的方法可以快速幫助我們找到問(wèn)題點(diǎn)：
1. 把每個(gè)操作交互定一個(gè)數(shù)值，即為操作成本。越是高階越是隱藏的交互手勢(shì)越復(fù)雜，所謂的“交互成本”也越高。這里我們規(guī)則為：
2. 通過(guò)簡(jiǎn)單的加減計(jì)算，就可以直觀地看到復(fù)雜節(jié)點(diǎn)在哪里。
3. 通過(guò)計(jì)算，我們能夠直觀地看到用戶操作最繁雜的部分集中于“選擇站點(diǎn)城市”“車次查詢”“選擇乘車人”這三個(gè)操作流程中。此時(shí)，重新審視這幾項(xiàng)繁雜操作節(jié)點(diǎn)，讓用戶在更少的步驟內(nèi)完成操作是我們的目標(biāo)，能一次點(diǎn)擊完成的操作絕不讓用戶點(diǎn)擊兩次。
4.降低操作成本，可以從2個(gè)方面入手優(yōu)化：對(duì)于復(fù)雜的節(jié)點(diǎn)，降低操作難度，用簡(jiǎn)單的操作替換復(fù)雜的；對(duì)于可有可無(wú)的節(jié)點(diǎn)，大膽地刪除，減少操作步驟。
（由于精力有限，這塊內(nèi)容暫時(shí)不過(guò)多展開(kāi)，因?yàn)檫€涉及很多知識(shí)點(diǎn)，以后慢慢講解。當(dāng)然，感興趣的同學(xué)也可以自行查找資料，或在文章下方評(píng)論交流哦~）
明確了目標(biāo)用戶后，接下來(lái)需要我們發(fā)揮共情能力，代入用戶視角走查產(chǎn)品。
從“帶著需求”來(lái)（我要買車票），到“完成目標(biāo)”（買到票）走的核心場(chǎng)景路徑，梳理出來(lái)粗顆粒度的故事場(chǎng)景 。
【舉個(gè)栗子】：
場(chǎng)景的梳理，先從顆粒度大的骨干場(chǎng)景出發(fā)，舉個(gè)栗子：假如我們起床到公司這個(gè)場(chǎng)景，可以回想一下，在整個(gè)過(guò)程中我們經(jīng)歷了哪些大的階段？
——經(jīng)歷了：起床—洗漱—出門—路上—到達(dá)。
基于大的階段，我們可以繼續(xù)拆分出顆粒度較小的二級(jí)故事場(chǎng)景，比如“洗漱”還可以拆解：換衣服—刷牙—洗臉—梳頭。
拿到實(shí)例中，12306的購(gòu)票流程是：查詢車次—篩選車次—填寫乘車信息—提交訂單付款—買到票了
切忌在使用場(chǎng)景時(shí)流程顆粒度過(guò)細(xì)，忽略用戶使用目的。
【加餐知識(shí)點(diǎn)】
這里先講解一下，場(chǎng)景設(shè)計(jì)主要分為2類：一是挖掘需求，挖掘用戶使用目的及動(dòng)機(jī)；二是研究需求，在已有需求上深入研究和優(yōu)化。
12306是從1-∞的出行工具類產(chǎn)品，用戶的使用目的非常明確——買車票，因此使用場(chǎng)景一定是圍繞【研究需求】展開(kāi)。
運(yùn)用4W1H場(chǎng)景分析法，我們得到用戶使用場(chǎng)景：
在已經(jīng)了解用戶和確認(rèn)了用戶使用場(chǎng)景的基礎(chǔ)上，根據(jù)以上得到的結(jié)論和機(jī)會(huì)點(diǎn)等資料，開(kāi)始繪制用戶體驗(yàn)地圖。
文章開(kāi)頭拆解的組成內(nèi)容還記得嗎？
現(xiàn)在召集團(tuán)隊(duì)不同崗位的人員，共同努力填補(bǔ)網(wǎng)格空白處。最好從上到下從左到右開(kāi)始，不用強(qiáng)求全部填滿，因?yàn)橛脩趔w驗(yàn)地圖并不是一錘定音的，它是不斷分析和反復(fù)更新迭代的。
我們得到了用戶體驗(yàn)地圖成品：
用戶體驗(yàn)地圖是產(chǎn)品用戶增長(zhǎng)的策略工具之一，繪制完成后根據(jù)地圖針對(duì)用戶體驗(yàn)情緒與機(jī)會(huì)點(diǎn)探索解決方案。
繪制好體驗(yàn)地圖后，工作并沒(méi)有結(jié)束，還有2項(xiàng)重要的工作：
優(yōu)化機(jī)會(huì)點(diǎn)：展開(kāi)頭腦風(fēng)暴，討論是否能有最佳方案，來(lái)滿足用戶的目標(biāo)，提升用戶滿意度、優(yōu)化體驗(yàn)
安排后續(xù)工作：按照情緒曲線、機(jī)會(huì)點(diǎn)價(jià)值大小，梳理優(yōu)先級(jí)，安排后續(xù)工作
然后根據(jù)用戶體驗(yàn)地圖，按照用戶情緒的低（解決痛點(diǎn)）、高（放大爽點(diǎn)）、中（思考分析），分別探索優(yōu)化。
把所有問(wèn)題點(diǎn)按照上述分類，首先解決用戶情緒最焦慮的痛點(diǎn)問(wèn)題，其次思考是否能把情緒高點(diǎn)繼續(xù)優(yōu)化到極致，讓用戶更嗨，而用戶情緒平緩的地方，要研究分析，繼續(xù)思考優(yōu)化空間。
· 中轉(zhuǎn)功能操作繁瑣，推薦方案不夠智能——減少交互步驟+增加智能方案推薦
· 視覺(jué)層級(jí)冗雜、票價(jià)信息不直觀——F型分析法優(yōu)化+增加票價(jià)顯示
· 列表頁(yè)排序算法升級(jí)（與產(chǎn)品開(kāi)發(fā)相關(guān)，不做案例展示）
我們?cè)黾恿酥悄芊桨竿扑]，并把中轉(zhuǎn)車次與直達(dá)車次劃在同一頁(yè)面，優(yōu)先展示直達(dá)車次。極大地增加了用戶操作的易用性，可直觀對(duì)比，減少頁(yè)面跳轉(zhuǎn)和加載等待時(shí)間。
通過(guò)多稿權(quán)重對(duì)比，在信息層級(jí)、功能突顯和視覺(jué)樣式中，擇優(yōu)選擇了最終稿。
復(fù)雜節(jié)點(diǎn)降低操作成本，切換動(dòng)效能直觀看出閱讀效率和易用性的提高。
通過(guò)F型視覺(jué)模型和十字交叉法梳理了信息層級(jí)，極大的提高了閱讀效率。
日期選擇由展開(kāi)點(diǎn)按切換改為滑動(dòng)切換，提高屏幕利用率的同時(shí)，更方便用戶操作。
——情感化設(shè)計(jì)，魅力型功能，讓嗨點(diǎn)更嗨。
情緒中線以下，都有優(yōu)化空間。比如，
添加乘車人操作重復(fù)、耽誤搶票——默認(rèn)常用已選+頁(yè)內(nèi)抽屜拉起
篩選功能視覺(jué)較弱、觸點(diǎn)易錯(cuò)——增加視覺(jué)識(shí)別與觸點(diǎn)面積
……
這是一部分可以不斷思考打磨的空間，雖然緊要程度低于用戶情緒低點(diǎn)，但是花時(shí)間將產(chǎn)品從滿足80%的用戶到滿足99%的用戶，即使在大多數(shù)人看來(lái)是一種性價(jià)比很低的行為，但卻是提升用戶體驗(yàn)的絕佳方式。這也是大廠產(chǎn)品體驗(yàn)良好的原因。
文章有點(diǎn)長(zhǎng)，感謝閱讀。下面概括了一些文中的方法論知識(shí)點(diǎn)，方便讀者回顧。
市面上有很多關(guān)于產(chǎn)品體驗(yàn)地圖的文章，但多數(shù)是基于已有產(chǎn)品的劣勢(shì)去直接繪制地圖，繪制地圖并不是目的，繪制好體驗(yàn)地圖之后怎么分析優(yōu)化才是目的，用戶體驗(yàn)地圖本身只是一個(gè)可視化工具。我們努力去剖析過(guò)程、記錄方法論，希望初學(xué)者能夠知其然并知其所以然。
文章來(lái)源：站酷 作者：挖設(shè)
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
01 什么是用戶畫像（what）
02 B2B用戶畫像的特色（what）
03 為什么要構(gòu)建B2B用戶畫像（why）
04 如何構(gòu)建B2B用戶畫像（how）
05 B2B用戶畫像的傳播與使用（how）
本文嘗試通過(guò)what-why-how的結(jié)構(gòu)，結(jié)合自己的工作做一些實(shí)踐，和大家分享下B2B用戶畫像的整體概念框架以及構(gòu)建方法。出于對(duì)我司數(shù)據(jù)的保密，無(wú)法直接分享給大家細(xì)粒度且對(duì)應(yīng)的數(shù)據(jù)，所以分享過(guò)程中我會(huì)結(jié)合業(yè)界和其他前輩在網(wǎng)上分享的內(nèi)容和數(shù)據(jù)作為案例，如有不足和錯(cuò)誤之處，還望大家批評(píng)指正。
那在講B2B用戶畫像之前，我想先來(lái)說(shuō)說(shuō)用戶畫像的概念，在看一些文章時(shí)發(fā)現(xiàn)有些作者混淆了用戶畫像的兩種概念?？赡芎芏嗳藳](méi)有注意到，用戶畫像這個(gè)詞包含了2種不同的含義，一種是User Persona，一種Use Profile。
User Persona是對(duì)一個(gè)用戶群體的整體抽象。這一概念最早源于交互設(shè)計(jì)領(lǐng)域，是Alan Cooper在《About Face：交互設(shè)計(jì)精髓》一書中提到的研究用戶的系統(tǒng)化方法?！摆A在用戶”這本書將其翻譯為“人物角色”，目前業(yè)內(nèi)使用“用戶畫像”這個(gè)術(shù)語(yǔ)。表達(dá)的意思一樣，是真實(shí)用戶的虛擬代表，是在深刻理解真實(shí)數(shù)據(jù)的基礎(chǔ)上得出的一個(gè)的虛擬用戶。
User Profile是對(duì)每一個(gè)個(gè)體的畫像，是在產(chǎn)品用戶量有一定規(guī)模以后進(jìn)行的。利用用戶的行為數(shù)據(jù)或者填報(bào)的資料進(jìn)行的用戶屬性標(biāo)簽提取，更多被運(yùn)營(yíng)和數(shù)據(jù)分析師使用，它是各類描述用戶數(shù)據(jù)的變量集合。在大數(shù)據(jù)時(shí)代，企業(yè)通過(guò)對(duì)海量數(shù)據(jù)信息進(jìn)行清洗、聚類、分析，將數(shù)據(jù)抽象成標(biāo)簽，再利用這些標(biāo)簽將用戶形象具體化的過(guò)程。
兩類畫像的對(duì)比如下圖：
明確了兩種畫像的區(qū)別，那本文我們就重點(diǎn)談?wù)?strong>User Persona類型的B2B用戶畫像（后續(xù)文中簡(jiǎn)稱“用戶畫像”）。至于User Profile，比較適合用戶體量大的產(chǎn)品，而B(niǎo)端產(chǎn)品除了頭部企業(yè)，很難達(dá)到這個(gè)量級(jí)，無(wú)疑用User Persona更合適，本文就不再贅述。
不管是B2B還是B2C產(chǎn)品也好，不論是商業(yè)層面上（比如在資源有限情況下聚焦關(guān)鍵用戶類型）、或是在產(chǎn)品層面上（更好理解用戶想要什么，確定功能的范圍和優(yōu)先級(jí)），建立用戶畫像的本質(zhì)都是為了輔助一些決策。
不同之處在于C端面向的是大量且分散的個(gè)人用戶，用戶畫像的主要目的是把用戶聚類，更好的了解不同類型用戶的特點(diǎn)和偏好。而B(niǎo)端產(chǎn)品，面向的是企業(yè)級(jí)用戶，滿足的是企業(yè)的管理或經(jīng)營(yíng)需求，關(guān)注的是成本和效率。畫像的目的是針對(duì)業(yè)務(wù)不同環(huán)節(jié)中、具有類似任務(wù)的用戶進(jìn)行更立體、豐富的需求整理和挖掘，往往和角色相關(guān)。
其決定了B2B用戶畫像的幾個(gè)特點(diǎn)：
伊查克·愛(ài)迪思（IchakAdizes）提出了企業(yè)生命周期理論，企業(yè)的發(fā)展大致有初創(chuàng)期、成長(zhǎng)期、成熟期和衰退期四個(gè)階段。不同階段的企業(yè)，其組織形態(tài)、關(guān)注點(diǎn)、管理方式等都會(huì)有所不同，產(chǎn)品需求側(cè)重點(diǎn)不同，用戶畫像的方向和調(diào)研方式也會(huì)有不同。
初創(chuàng)期：產(chǎn)品立項(xiàng)階段
這個(gè)階段往往指的是公司剛成立，此時(shí)產(chǎn)品、企業(yè)文化尚未成形，處于客戶積累階段，較為關(guān)注引流。需要通過(guò)用戶畫像定位細(xì)分市場(chǎng)、產(chǎn)品模式及功能，這個(gè)階段需做定性調(diào)研了解目標(biāo)用戶，初步形成用戶畫像為需求做底層支撐，這個(gè)階段的用戶畫像顆粒度可以粗些，旨在幫助團(tuán)隊(duì)快速就“我們的用戶是誰(shuí)”達(dá)成共識(shí)。
成長(zhǎng)期：產(chǎn)品運(yùn)營(yíng)中（已有數(shù)據(jù)積累）
這個(gè)時(shí)候產(chǎn)品已有demo或已上線迭代，產(chǎn)品處于完善、升級(jí)的階段?？墒褂谩?strong>數(shù)據(jù)挖掘+定量篩選+定性豐富”的方式，結(jié)合項(xiàng)目的已有數(shù)據(jù)，使用定量篩選用戶，做大量微觀且具體的用戶調(diào)研，基于后臺(tái)、第三方平臺(tái)監(jiān)控發(fā)現(xiàn)問(wèn)題，定位問(wèn)題關(guān)鍵及原因分析，優(yōu)化產(chǎn)品功能及運(yùn)營(yíng)模式，再通過(guò)調(diào)研訪談了解具體的行為細(xì)節(jié)和態(tài)度。該階段的用戶畫像可用來(lái)驗(yàn)證問(wèn)題、完善或發(fā)現(xiàn)新的機(jī)會(huì)點(diǎn)。
成熟期：產(chǎn)品相對(duì)穩(wěn)定
客戶資源相對(duì)穩(wěn)定，可能已有一定的規(guī)模，內(nèi)部管理需求增長(zhǎng)，市場(chǎng)地位趨于穩(wěn)定，日常工作也大多以維護(hù)為主。且現(xiàn)有增長(zhǎng)點(diǎn)已遇上了瓶頸，用戶活躍將不可阻逆地緩慢下降，即使你做再多產(chǎn)品優(yōu)化、燒錢運(yùn)營(yíng)都無(wú)法改變產(chǎn)品終將走向衰退的命運(yùn)，時(shí)間問(wèn)題。企業(yè)急于尋找突破口和新的增長(zhǎng)點(diǎn)，用戶畫像又將被賦予新的使命：基于用戶畫像進(jìn)行“新增長(zhǎng)點(diǎn)”的分析，定性挖掘藍(lán)海，再定量進(jìn)行驗(yàn)證。
衰退期：產(chǎn)品活躍度快速下降
進(jìn)入到這個(gè)階段，說(shuō)明產(chǎn)品沒(méi)有成功轉(zhuǎn)型。這時(shí)候再做用戶畫像的意義其實(shí)不大，如果一定要做，除了提高回流率、挖掘增長(zhǎng)點(diǎn)外，可以定性了解原因，調(diào)整產(chǎn)品。
不同于C端產(chǎn)品的的用戶單一性，B端產(chǎn)品的用戶畫像對(duì)應(yīng)的不是一個(gè)個(gè)體，而是一個(gè)組織或機(jī)構(gòu)，同時(shí)涵蓋組織機(jī)構(gòu)中不同的人員。產(chǎn)品面向的使用對(duì)象可能從普通員工到企業(yè)高層，覆蓋銷售、技術(shù)、行政人事部分等，基于工作場(chǎng)景不一樣，對(duì)產(chǎn)品的需求可能也大相徑庭。
以一個(gè)CRM系統(tǒng)為例，一個(gè)復(fù)雜的B端產(chǎn)品可能會(huì)涉及以下四種角色的用戶：決策者、主要使用者、次要使用者、間接使用者。如下圖所示：
決策者：下決策購(gòu)買產(chǎn)品或服務(wù)的人，可能是業(yè)務(wù)線負(fù)責(zé)人，也可能是公司董事長(zhǎng)、CEO，他們常常不是產(chǎn)品的使用者，使用頻次低甚至完全不用，他們通常都是從公司的整體利益出發(fā)，更關(guān)注產(chǎn)品能否給公司業(yè)務(wù)帶來(lái)幫助，降本還是提效了。其評(píng)價(jià)某個(gè)功能的好壞，往往與使用者的感受是相悖的，如釘釘?shù)摹癉ING一下”,他們并不太關(guān)注使用過(guò)程、體驗(yàn)，更關(guān)注產(chǎn)品的核心價(jià)值，將利益最大化。
滿足決策者的需要是做好B端產(chǎn)品的前提，也是制作用戶畫像所要明確的方向；很多體驗(yàn)做的不好、難看的產(chǎn)品之所以也能在B端市場(chǎng)有一席之地，就是因?yàn)闈M足了企業(yè)的需要。比較理想的情況下，團(tuán)隊(duì)對(duì)目標(biāo)客群有一定深入的研究，形成趨于標(biāo)準(zhǔn)化的產(chǎn)品，就能打動(dòng)目標(biāo)客戶群的大部分決策者。
主要使用者：真正頻繁使用產(chǎn)品的人，也是產(chǎn)品/設(shè)計(jì)師想要提升產(chǎn)品體驗(yàn)要瞄準(zhǔn)的人群
他們可能更關(guān)注產(chǎn)品的具體使用，是不是易用，有沒(méi)有幫助他們更便捷地完成工作，有沒(méi)有提高他們的工作效率。主要使用者是最容易識(shí)別的，以CRM系統(tǒng)為例，如果沒(méi)有銷售日常在系統(tǒng)中錄入客戶數(shù)據(jù)，管理層就無(wú)法查看成單量、進(jìn)度等他們所關(guān)注的信息。
次要使用者：使用產(chǎn)品頻率相對(duì)主要使用者更低，用到的功能也比較少，只在某個(gè)中間流程涉及少量操作。如CRM系統(tǒng)中人事、財(cái)務(wù)會(huì)涉及到其中錢或出差的審批對(duì)他們而言，主要需求是能快速找到自己的任務(wù)并完成就可以了。
間接使用者：不直接使用產(chǎn)品但會(huì)被產(chǎn)品影響的人群，產(chǎn)品和設(shè)計(jì)師在設(shè)計(jì)過(guò)程如果有資源和精力能兼顧他們的需求和體驗(yàn)，那就太貼心了。如審計(jì)、政府人員，屬于不緊急，非必要需求。
B端用戶使用場(chǎng)景多和業(yè)務(wù)形態(tài)密切相關(guān)，產(chǎn)品通常要解決的是某類角色工作時(shí)發(fā)生的問(wèn)題，所以不同于C端用戶畫像，從用戶視角出發(fā)，關(guān)注用戶個(gè)人的場(chǎng)景、訴求、痛點(diǎn)和情緒，核心是滿足用戶的需求，關(guān)注用戶的年齡、性別、收入、個(gè)性、習(xí)慣、消費(fèi)模式等標(biāo)簽。
但是在B端產(chǎn)品中，我們拋開(kāi)了用戶作為個(gè)人存在的標(biāo)簽，我們更關(guān)注用戶所代表的角色，他的崗位職責(zé)是什么，它在工作場(chǎng)景中需要完成哪些任務(wù)，這些任務(wù)要做什么的，其崗位職責(zé)決定了它完成任務(wù)的目標(biāo)、場(chǎng)景、使用什么工具去，需要跟其他角色配合嗎等信息。
所以B2B畫像更關(guān)注角色的分類、工作/使用場(chǎng)景、用戶目標(biāo)、操作鏈路、角色協(xié)同等信息，很難看到類似這個(gè)人是不是已婚，小孩多大這些不知道如何應(yīng)用于產(chǎn)品設(shè)計(jì)的內(nèi)容。而在一個(gè)C端產(chǎn)品用戶畫像上很少看到有哪些讓他壓力山大的KPI等信息。
仍然以CRM系統(tǒng)為例，其主要使用者-銷售的目標(biāo)就是用該系統(tǒng)錄入商機(jī)、線索等，然后根據(jù)數(shù)據(jù)情況制定客戶溝通回訪計(jì)劃等，聚焦的是該系統(tǒng)能否讓他很好的履行了其崗位責(zé)任。和他這個(gè)人在哪個(gè)城市、已婚未婚等個(gè)人特性是無(wú)關(guān)的。
B2B產(chǎn)品面向的是企業(yè)用戶，滿足的是產(chǎn)業(yè)鏈中各企業(yè)的經(jīng)營(yíng)需求，這時(shí)B2B畫像應(yīng)該具備行業(yè)、客戶屬性這一維度；但是最終購(gòu)買者、使用者都是企業(yè)中的某一角色，這決定了B2B畫像還有角色這一維度。所以，小編認(rèn)為，B2B用戶畫像是企業(yè)和多個(gè)核心角色共同構(gòu)成的畫像，建立B2B畫像，需要客戶（企業(yè)）畫像和角色畫像兩部分的信息。
1）客戶畫像
客戶畫像指的是使用B端產(chǎn)品或服務(wù)的企業(yè)用戶，具有行業(yè)特征、企業(yè)特征及角色特征。其的目標(biāo)是促成銷售，主要用來(lái)幫助銷售/運(yùn)營(yíng)人員他們快速定位目標(biāo)企業(yè)，幫助他們更好的認(rèn)識(shí)我們客戶是什么樣的人，讓他們的工作更有方向。
一個(gè)典型的客戶色畫像會(huì)包括：
基本信息：外在的標(biāo)簽，如所處行業(yè)、地域、人員規(guī)模、收入規(guī)模（年?duì)I業(yè)額）
業(yè)務(wù)模式：線下的實(shí)際業(yè)務(wù)流程-視行業(yè)而定，如商業(yè)模式（靠什么賺錢）、業(yè)務(wù)模式（業(yè)務(wù)怎么運(yùn)作）
組織機(jī)構(gòu)：自上而下都有哪些機(jī)構(gòu)，彼此之間的關(guān)系。
關(guān)鍵角色：各個(gè)機(jī)構(gòu)里有哪些崗位/工種，決策鏈上有哪些角色、誰(shuí)才是有價(jià)值的關(guān)鍵角色，角色話語(yǔ)權(quán)。企業(yè)的關(guān)鍵決策人隨企業(yè)大小而不同，一般中小型企業(yè)都是老板、合伙人等。而大型企業(yè)采購(gòu)B端軟件都是需要經(jīng)過(guò)內(nèi)部流程的，最終審核人是老板，但其中影響決策最大的往往是商務(wù)經(jīng)理負(fù)責(zé)人。
2）角色畫像
B端產(chǎn)品雖然面向企業(yè)，但是最終使用執(zhí)行的還是人，這些執(zhí)行層（終端使用者）也是產(chǎn)品的檢驗(yàn)者。在企業(yè)決定購(gòu)買產(chǎn)品之前，執(zhí)行層沒(méi)有話語(yǔ)權(quán)，但是在續(xù)費(fèi)的時(shí)候，他們的話語(yǔ)權(quán)比重會(huì)開(kāi)始顯著提升。
因此在我們的產(chǎn)品設(shè)計(jì)階段，會(huì)更關(guān)注執(zhí)行層的角色畫像。當(dāng)我們討論產(chǎn)品、需求、場(chǎng)景、用戶體驗(yàn)的時(shí)候，往往需要將焦點(diǎn)聚集在這類人群上。
一個(gè)典型的角色畫像會(huì)包括：
基本信息：如角色名稱、照片、角色/工種、平臺(tái)偏好、文化水平、辦公場(chǎng)地、使用頻次，角色名稱以及照片是為了更有代入感的個(gè)人情況說(shuō)明，但值得注意的是，這里的情況更多圍繞職業(yè)情況展開(kāi)，比如工作年限，工作職責(zé)，能力維度等，那些在C端中常見(jiàn)的家庭情況，幾個(gè)孩子什么的統(tǒng)統(tǒng)不重要。
用戶行為驅(qū)動(dòng)：用戶的工作目標(biāo)、工作任務(wù)和考核指標(biāo)，B端角色通常是企業(yè)員工，為了薪酬，有一般都會(huì)有結(jié)合任務(wù)而完成的考核指標(biāo)，了解考核指標(biāo)可以在設(shè)計(jì)過(guò)程中更明確知道哪些內(nèi)容是用戶最關(guān)注的東西；
使用場(chǎng)景：工作的時(shí)間、地點(diǎn)及工作內(nèi)容是什么，使用場(chǎng)景是重要但容易被忽略的一個(gè)內(nèi)容，尤其要搞清楚使用產(chǎn)品的場(chǎng)景有哪些、用戶平時(shí)的工作流程是如何的、主要使用什么功能?？捎靡粋€(gè)真實(shí)、普遍、易懂的故事勾勒一下
使用期望：日常工作面臨的挑戰(zhàn)和痛點(diǎn)，期望獲得的幫助。
角色畫像和客戶畫像之間沒(méi)有直接關(guān)系。因?yàn)槟繕?biāo)不同，所以會(huì)有不同的用戶細(xì)分：客戶畫像的目標(biāo)是成銷售，獲取利益；角色畫像是為了解決問(wèn)題和為用戶創(chuàng)造價(jià)值，進(jìn)一步為公司創(chuàng)造價(jià)值。但是在刻畫B2B用戶畫像時(shí)，如果只考慮執(zhí)行者的話，沒(méi)有客戶畫像作為指引、摸清決策者的特征與行為，你的產(chǎn)品功能或者體驗(yàn)設(shè)計(jì)上可能就會(huì)出現(xiàn)嚴(yán)重偏差，甚至方向錯(cuò)誤。
產(chǎn)品和服務(wù)只是企業(yè)將價(jià)值傳遞給客戶的一種工具和媒介，無(wú)論產(chǎn)品形態(tài)如何，其本質(zhì)都是在解決客戶的問(wèn)題。如果沒(méi)法滿足客戶的業(yè)務(wù)需求，基本上該產(chǎn)品對(duì)客戶是沒(méi)有價(jià)值的?？蛻舢嬒褡饔秘灤┊a(chǎn)品生命全周期，產(chǎn)品/市場(chǎng)/銷售較為關(guān)注，它的價(jià)值主要體現(xiàn)有三點(diǎn)：
對(duì)產(chǎn)品：明確為誰(shuí)服務(wù)，快速的了解客戶的需求和狀況，確定產(chǎn)品功能設(shè)計(jì)，學(xué)會(huì)識(shí)別用戶的解決方案和用戶在場(chǎng)景下的訴求，不斷迭代調(diào)整產(chǎn)品；
對(duì)市場(chǎng)/運(yùn)營(yíng)人員：建立對(duì)客戶盡量全面的了解并基于客戶畫像確定營(yíng)銷內(nèi)容、營(yíng)銷策略和渠道選擇，使產(chǎn)品的服務(wù)對(duì)象更聚焦；
對(duì)銷售人員：幫助銷售進(jìn)行客戶篩選，找到有效客戶，提高轉(zhuǎn)化率，確定業(yè)務(wù)方向和銷售打法。合理配置團(tuán)隊(duì)，完成KPI。
客戶畫像越早建立越好，但是務(wù)必注意控制深度和成本，因?yàn)椴煌A段的企業(yè)其側(cè)重點(diǎn)有所不同。在初創(chuàng)期，產(chǎn)品團(tuán)隊(duì)可以通過(guò)關(guān)注典型客戶來(lái)積累定性數(shù)據(jù)，從而低成本搭建客戶畫像；而到了成長(zhǎng)期和成熟期，在擁有大量客戶數(shù)據(jù)的前提下，企業(yè)可以逐漸過(guò)渡到使用定性&定量相結(jié)合的方式來(lái)形成更為清晰的客戶畫像。
以前業(yè)界有種說(shuō)法，做B端，能用是第一位，用戶體驗(yàn)不重要。所以除了一些成規(guī)模的SaaS公司，設(shè)計(jì)師在B端幾乎無(wú)用武之地，成了組件化的搬運(yùn)工、工具人。所以大部分的企業(yè)在跑馬圈地時(shí)期是不注重用戶體驗(yàn)的，企業(yè)有客戶畫像，卻未必有角色畫像。
還說(shuō)用戶體驗(yàn)不重要的人，可以看看有贊CEO白鴉的公開(kāi)說(shuō)明。
圖片來(lái)源于網(wǎng)絡(luò)
2020年，疫情為企業(yè)級(jí)SaaS帶來(lái)流量，在今年2月宣布延期復(fù)工后，釘釘搜索量激增數(shù)倍，無(wú)論中大型企業(yè)還是小微企業(yè)都紛紛加入了遠(yuǎn)程辦公的行列，協(xié)同辦公SaaS獲得了大量的“試用客戶”，加快了市場(chǎng)激活的進(jìn)程，但接下來(lái)，流量轉(zhuǎn)化和用戶留存成為后疫情時(shí)代的核心關(guān)注點(diǎn)。
后疫情時(shí)代，對(duì)企業(yè)來(lái)說(shuō)，改善產(chǎn)品用戶體驗(yàn)，了解使用產(chǎn)品的終端用戶，構(gòu)建角色畫像愈加重要。而角色畫像作為產(chǎn)品和設(shè)計(jì)師比較關(guān)注的畫像，有以下三點(diǎn)價(jià)值：
設(shè)計(jì)前：幫助確立設(shè)計(jì)目標(biāo)、設(shè)計(jì)策略與準(zhǔn)則
設(shè)計(jì)中：解決架構(gòu)混亂問(wèn)題，明確需求功能的合理性和優(yōu)先級(jí)；解決需求爭(zhēng)議問(wèn)題和溝通問(wèn)題，與團(tuán)隊(duì)成員就服務(wù)目標(biāo)達(dá)成共識(shí)，
設(shè)計(jì)后：解決可用性測(cè)試問(wèn)題，幫助我們鎖定合適的測(cè)試用戶；
總結(jié)一下就是角色畫像是產(chǎn)品的根基，客戶畫像是產(chǎn)品的外延生命力的象征，兩者相輔相成。
對(duì)于這個(gè)章節(jié)。我將以我所負(fù)責(zé)的一款企業(yè)產(chǎn)品為例，來(lái)講述用戶畫像的創(chuàng)建過(guò)程。在這個(gè)項(xiàng)目中我們通過(guò)定性研究創(chuàng)建了用戶畫像，當(dāng)然如果必要，大家也可以在后期再通過(guò)定量研究對(duì)得到的用戶畫像進(jìn)行驗(yàn)證。
用戶畫像的創(chuàng)建可分為以下幾個(gè)步驟：
B端用研和C端有一點(diǎn)不同，企業(yè)用戶的使用場(chǎng)景基于業(yè)務(wù)，背景復(fù)雜、角色多樣、使用工具特殊（如企業(yè)自有后臺(tái)系統(tǒng)）等，導(dǎo)致無(wú)法在可用性實(shí)驗(yàn)室中切實(shí)地模擬出來(lái)，所以我們得接近用戶、基于業(yè)務(wù)場(chǎng)景去了解用戶。
小編大致總結(jié)了一下，B端用研有以下3大痛點(diǎn)：
信息獲取難：B端產(chǎn)品主要針對(duì)用戶工作和業(yè)務(wù)開(kāi)展，一般都是強(qiáng)制使用產(chǎn)品不存在“挑剔”的選擇空間，導(dǎo)致用戶的反饋就非常少，信息的獲取壁壘較高?！吧疃仍L談”是最核心也是獲取信息性價(jià)比最高的一種方法，但是出于對(duì)信息用途的不了解，對(duì)商業(yè)隱私、生意經(jīng)驗(yàn)泄露的擔(dān)憂，B端用戶可能不愿意配合調(diào)研或不信任你。
業(yè)務(wù)復(fù)雜：缺乏行業(yè)經(jīng)驗(yàn)，難以理解業(yè)務(wù)，這會(huì)讓用研對(duì)象覺(jué)得你不專業(yè)，仿佛雞同鴨講、對(duì)牛談琴。而且在不理解業(yè)務(wù)的情況下，設(shè)計(jì)師在訪談過(guò)程中會(huì)過(guò)于關(guān)注基礎(chǔ)業(yè)務(wù)，無(wú)法進(jìn)行更深層次的訪談，采集的信息并非用戶的真正需求。
視角不同：設(shè)計(jì)師視角容易缺乏框架性思考，搞不清每個(gè)業(yè)務(wù)模塊/功能的邊界以及它們之間的關(guān)系，不能站在用戶（決策者、使用者）的角度思考問(wèn)題，以至于被用戶牽著鼻子走，用戶說(shuō)什么就是什么，能和用戶產(chǎn)生共鳴的部分極少。
俗話說(shuō)“磨刀不誤砍柴工”，針對(duì)以上三大痛點(diǎn)，項(xiàng)目伊始有必要進(jìn)行一輪全面的桌面研究，幫助我們快速建立對(duì)行業(yè)的全局認(rèn)知并了解業(yè)務(wù)，另一方面，也有助于我們更好地和用戶進(jìn)行溝通。
研究?jī)?nèi)容：
研究途徑：
此處有2個(gè)注意點(diǎn)：
針對(duì)以上2三點(diǎn)，下文將依次展開(kāi)說(shuō)明。
1、如何篩選出目標(biāo)用戶？
Cooper指出，不能為超過(guò)3個(gè)以上的用戶畫像設(shè)計(jì)產(chǎn)品，這樣容易產(chǎn)生需求沖。當(dāng)有多個(gè)用戶畫像的時(shí)候,需要考慮用戶畫像的優(yōu)先級(jí)。前面講B2B畫像特點(diǎn)的提到過(guò)，由于是企業(yè)產(chǎn)品，僅僅產(chǎn)品中一條業(yè)務(wù)線，角色也是多樣的，所以在篩選目標(biāo)用戶時(shí)有一點(diǎn)尤其要注意：應(yīng)識(shí)別出關(guān)鍵的用戶畫像。
以我公司的招聘業(yè)務(wù)為例，為了便于大家在宏觀上確定什么樣的企業(yè)是我們主要的目標(biāo)用戶，我們的做法是按企業(yè)類型定義了三個(gè)KA客戶畫像。由產(chǎn)品、市場(chǎng)、以及各組leader一起來(lái)完成用戶畫像的優(yōu)先級(jí)排序工作。確定用戶畫像優(yōu)先級(jí)時(shí)，我們可以主要從以下幾個(gè)方面來(lái)考慮：
然后再找關(guān)鍵的角色畫像，即角色畫像中的決策者和主要使用者，次要使用者和間接使用者因時(shí)間、金錢的關(guān)系，現(xiàn)階段不做考慮。我司產(chǎn)品的客戶主要是勞動(dòng)密集型企業(yè)，作用是幫助客戶解決藍(lán)領(lǐng)用工問(wèn)題和發(fā)薪合規(guī)問(wèn)題。以招聘業(yè)務(wù)線為例，想把這個(gè)產(chǎn)品賣給某企業(yè)，首先要打動(dòng)該企業(yè)的HR總監(jiān)，再說(shuō)服CEO/董事長(zhǎng)，再讓招聘部員工-HR試用。
那么這條決策鏈上的關(guān)鍵人就包括了HR總監(jiān)、CEO/董事長(zhǎng)、HR。那在這個(gè)案例中，HR總監(jiān)是決策鏈的關(guān)鍵人物，因?yàn)橹挥兴J(rèn)可之后，才會(huì)申請(qǐng)購(gòu)買或在CEO面前夸這個(gè)產(chǎn)品。而HR是最終產(chǎn)品的使用者，雖然他們?cè)谄髽I(yè)購(gòu)買產(chǎn)品前沒(méi)有話語(yǔ)權(quán)，但是在續(xù)費(fèi)階段，他們的話語(yǔ)權(quán)最大。對(duì)于處于成長(zhǎng)期的產(chǎn)品來(lái)說(shuō)，我們現(xiàn)階段的調(diào)研目標(biāo)也是為了獲取HR總監(jiān)和HR兩類角色的用戶畫像，每個(gè)角色訪談4～6人；
2、畫像維度有哪些？
篩選出了目標(biāo)用戶，那畫像維度有哪些呢？。以本案例為例，在本次用戶畫像的設(shè)計(jì)中，因我司產(chǎn)品處于優(yōu)化迭代階段，做用戶畫像的目的是了解用戶的使用情況，比如各功能的使用頻率、使用中遇到的問(wèn)題，定位問(wèn)題關(guān)鍵及原因分析，優(yōu)化產(chǎn)品功能及運(yùn)營(yíng)模式，同時(shí)也希望通過(guò)了解用戶的具體行為細(xì)節(jié)和態(tài)度，發(fā)現(xiàn)新的機(jī)會(huì)點(diǎn)。
對(duì)于企業(yè)，主要了解其企業(yè)規(guī)模、行業(yè)屬性、業(yè)務(wù)流程、組織架構(gòu)、機(jī)構(gòu)里有哪些崗位/工種。這個(gè)信息主要由產(chǎn)品或銷售采集，應(yīng)該前置于角色畫像。而我們第一步的業(yè)務(wù)研究中，很大一部分內(nèi)容也來(lái)自于此。
對(duì)于決策者，主要向其了解企業(yè)管理、業(yè)務(wù)等方面的需求信息，對(duì)于本產(chǎn)品決策者關(guān)注的是營(yíng)收增長(zhǎng)、效率提高還是減少成本等方面的問(wèn)題。
對(duì)于主要使用者，側(cè)重了解用戶特征、產(chǎn)品認(rèn)知、使用場(chǎng)景與痛點(diǎn)，各功能的使用頻率、使用中遇到的問(wèn)題等
根據(jù)前面前文提到的的用戶畫像構(gòu)成要素和自身業(yè)務(wù)情況，有選擇性的摘取，最終梳理出本案的用戶畫像維度如下：
明確了調(diào)研對(duì)象后，就可以展開(kāi)調(diào)研了。一般有三種方式：
定量和定性調(diào)研究雖各有優(yōu)劣，但定量較為昂貴、費(fèi)時(shí)，也需要有精通統(tǒng)計(jì)分析的認(rèn)為協(xié)助，在B端調(diào)研方式中并不太實(shí)用。對(duì)大多數(shù)團(tuán)隊(duì)而言，定性是性價(jià)比最高、最合適的。它不僅提供了“用戶是誰(shuí)、他們想要什么”，還是基于數(shù)據(jù)、經(jīng)濟(jì)高效較為快捷的一種方式。
采用何種研究方法，主要根據(jù)企業(yè)生命周期、研究目的、項(xiàng)目時(shí)間和經(jīng)費(fèi)等進(jìn)行綜合考量，本案中我們選擇深度訪談收集一手資料。
在明確目標(biāo)與方法后，需要對(duì)整個(gè)研究進(jìn)行細(xì)化，制定具體詳實(shí)的執(zhí)行計(jì)劃并開(kāi)始招募用戶采集資料了。可通過(guò)前中后三個(gè)階段性策略的來(lái)進(jìn)行訪談。
1. 訪談前：搭建信任基礎(chǔ)
在構(gòu)建用戶畫像的step 1中，我們已經(jīng)對(duì)業(yè)務(wù)和要訪談的用戶角色有了一定的了解。只需在訪談時(shí)間的4-7天前，根據(jù)確定的畫像維度來(lái)設(shè)計(jì)訪談大綱。設(shè)計(jì)大綱的目的是避免訪談過(guò)程中對(duì)話內(nèi)容發(fā)散、混亂而無(wú)法收集到足夠多的有效信息。
需要注意的是：大綱需要針對(duì)訪談的每一條需求，做到詳細(xì)、縝密，同時(shí)要考慮用戶對(duì)訪談?lì)}目的理解，可根據(jù)產(chǎn)品使用順序，由易到難、客觀到主觀、概括到具體的順序展開(kāi)，比如產(chǎn)品功能的使用頻率就可以作為一個(gè)客觀問(wèn)題放在問(wèn)題的開(kāi)始。且要考慮訪談的時(shí)間，因?yàn)樵L談的時(shí)間不易過(guò)長(zhǎng)，所以訪談提綱也不能過(guò)于冗長(zhǎng)，典型的訪談大綱模板如下圖所示：
并提前將訪談目的告知受訪者，能讓他們看到訪談的直接或間接價(jià)值（提高工作效率、降低成本等），也就能更好地建立雙方的信任。因此，我們需要提前確認(rèn)整個(gè)訪談的規(guī)劃，并主動(dòng)將相關(guān)信息告知受訪者，包括訪談的時(shí)間、地點(diǎn)、方式、目的、流程，還有過(guò)程中可能涉及的問(wèn)題、后續(xù)發(fā)放的獎(jiǎng)品等。
2. 訪談中：表現(xiàn)專業(yè)特質(zhì)
開(kāi)場(chǎng)介紹
跟C端訪談一樣，正式訪談開(kāi)始之前的開(kāi)場(chǎng)白非常重要！除了再次介紹自己（不管是什么崗位，此刻我就是用戶研究員），說(shuō)明這次訪談的目的，一定還要強(qiáng)調(diào)訪談的隱私性和數(shù)據(jù)安全性，畢竟他們面對(duì)的是真金白銀的生意。
暖場(chǎng)
在正式訪談前，可以先和用戶閑聊2~3分鐘，通過(guò)一定的溝通活躍氣氛，讓用戶更加放松，同時(shí)增強(qiáng)用戶對(duì)我們信任。暖場(chǎng)和開(kāi)場(chǎng)介紹可穿插進(jìn)行，沒(méi)有絕對(duì)的先后之分，在訪談?wù)咦晕医榻B完成之后，也可以讓被訪者進(jìn)行自我介紹。
一般問(wèn)題
一般問(wèn)題是指一些比較基礎(chǔ)性問(wèn)題，用戶不需要進(jìn)行太多思考即可回答，比如“你最常用的功能是哪些”、“使用時(shí)間多長(zhǎng)”。
深入問(wèn)題
深入問(wèn)題是用戶行為和想法更加深入的探索，會(huì)更關(guān)注用戶行為細(xì)節(jié)和行為背后的動(dòng)機(jī)。一般在問(wèn)這些問(wèn)題時(shí)，訪談?wù)咝枰粩嗟卦儐?wèn)用戶為什么，直到用戶無(wú)法繼續(xù)回答。深入問(wèn)題是整個(gè)訪談的核心，也最容易挖掘到用戶需求和痛點(diǎn)。
回顧與總結(jié)
每部分的訪談結(jié)束后可進(jìn)行簡(jiǎn)單的小結(jié)。訪談?wù)咄ㄟ^(guò)回顧訪談過(guò)程對(duì)用戶的行為和態(tài)度進(jìn)行客觀闡述，一方便有助于訪談?wù)呤崂硭悸?，另一方面讓用戶?duì)訪談結(jié)果再次確認(rèn)。
3. 訪談后：實(shí)現(xiàn)長(zhǎng)線共贏
最好和訪談對(duì)象建立長(zhǎng)期聯(lián)系，尤其是一線業(yè)務(wù)人員。人和人面對(duì)面聊過(guò)后，會(huì)產(chǎn)生基本的信任感和好感，要借助訪談的機(jī)會(huì)，拉近和業(yè)務(wù)人員的距離。如果后續(xù)項(xiàng)目中遇到問(wèn)題，想獲取最真實(shí)的一線反饋，可以聯(lián)系之前的訪談對(duì)象，尋求幫助。
1）根據(jù)角色對(duì)訪談對(duì)象分組
將用戶訪談后得出的重點(diǎn)信息寫在便利貼上（或Excel表中打印后切片），設(shè)計(jì)師需要根據(jù)產(chǎn)品用戶角色不同，將受訪的用戶歸類分組，如HR和HR總監(jiān)。
2）找出行為變量
分組后，需要識(shí)別關(guān)鍵的行為變量，將調(diào)研到的用戶與行為變量進(jìn)行一一對(duì)應(yīng)，并識(shí)別差異化行為模式。如下圖所示
3）映射訪談對(duì)象與行為變量的關(guān)系
再將不同的角色間同類行為模式歸納（合并同類項(xiàng)），進(jìn)行行為描述。此處需注意以行為變量為依據(jù)進(jìn)行用戶對(duì)應(yīng)時(shí)，不必追求絕對(duì)的精準(zhǔn)，只要相對(duì)能映射清楚即可。梳理完后，觀察可發(fā)現(xiàn)某些用戶群體聚集在幾個(gè)行為變量上，它們構(gòu)成了一個(gè)顯著的行為模式，由此聚類出某個(gè)角色類型。依此類推，可以發(fā)現(xiàn)幾個(gè)不同的行為模式。為保證全面，映射完最好遍歷一下，檢查是否有用戶或變量的遺漏。
4）找出共性行為模式
完成映射后，尋找在變量軸上的對(duì)象群。梳理完后，如果一組對(duì)象聚集在多個(gè)不同的變量上，則可以代表一類角色存在顯著的共性行為表現(xiàn)（通常每類角色會(huì)有2～3個(gè)共性行為）。共性行為能幫我們識(shí)別標(biāo)準(zhǔn)化產(chǎn)品需要滿足的用戶需求，而差異化行為可以根據(jù)企業(yè)需求做定制化服務(wù)，一個(gè)B端產(chǎn)品是不太可能滿足所有用戶的需求的。
一旦我們找到共性行為，就可以創(chuàng)造用戶畫像了。梳理出每類角色的行為、目標(biāo)、痛點(diǎn)等維度特征，形成畫像的基本框架。最后再完善用戶畫像，此時(shí)我們需要做的事情主要是：
最終客戶畫像呈現(xiàn)如下圖
數(shù)據(jù)已脫敏，非真實(shí)數(shù)據(jù)
最終角色畫像呈現(xiàn)如下圖
數(shù)據(jù)已脫敏，非真實(shí)數(shù)據(jù)
用戶畫像作為一個(gè)強(qiáng)大的設(shè)計(jì)和交流工具，能夠讓利益相關(guān)人目標(biāo)始終保持一致，它的價(jià)值在于傳播與使用。舉個(gè)例子，90年代，庫(kù)珀將用戶畫像的描述做成一頁(yè)紙貼在墻上，一個(gè)產(chǎn)品的一個(gè)用戶畫像做一頁(yè)紙，這樣設(shè)計(jì)團(tuán)隊(duì)成員每天走進(jìn)辦公室就能看到。
用戶畫像制作出來(lái)后，與整個(gè)項(xiàng)目團(tuán)隊(duì)共享定義的用戶畫像是很重要的，千萬(wàn)不要讓他在共享文檔里積灰或掛在墻上當(dāng)擺設(shè)。你要做的是讓用戶畫像從紙上躍起，走進(jìn)你同事的心里，讓他在每次討論、每個(gè)決策時(shí)，自然、自發(fā)地被提起。所以用戶畫像的使用也是極其重要的，不然前面的工作都是無(wú)用之功。
所以，你可能需要：
向團(tuán)隊(duì)介紹用戶畫像?；c(diǎn)時(shí)間介紹研究的過(guò)程，展示照片給他們看，聊一聊畫像的需求，期望，痛點(diǎn)，性格等。最好以故事性的方式進(jìn)行引導(dǎo)，并長(zhǎng)期地在會(huì)議里提到并討論它
在你的用戶故事中使用用戶畫像?！叭绻沂?*業(yè)務(wù)招聘員，我想要快速識(shí)別出今天某門店招聘的人數(shù)和到崗的人數(shù)”。設(shè)計(jì)時(shí)，花點(diǎn)時(shí)間想象一下軟件會(huì)被用戶在工作中如何應(yīng)用。
造訪不同團(tuán)隊(duì)，介紹用戶畫像，包括它從何來(lái)，如何用。教他們?cè)趺凑心加写硇缘挠脩暨M(jìn)行測(cè)驗(yàn)，如何寫用戶情景來(lái)啟發(fā)設(shè)計(jì)或作為可用性測(cè)試任務(wù)
總的來(lái)說(shuō)，在你能力范圍之類的地方，宣傳用戶畫像的商業(yè)價(jià)值，提升大家的信任。畢竟用戶畫像可以幫助產(chǎn)研團(tuán)隊(duì)跳出自己的需求，了解真正使用產(chǎn)品的人的需求。當(dāng)越來(lái)越多的團(tuán)隊(duì)使用用戶畫像，那么用戶畫像就會(huì)越來(lái)越像一個(gè)真實(shí)的用戶，幫助團(tuán)隊(duì)從用戶的角度出發(fā)去設(shè)計(jì)產(chǎn)品。
值得注意的一點(diǎn)是，用戶畫像并非一成不變的，很大程度上受環(huán)境和周期的影響，所以我們要定期回顧自己的用戶畫像，對(duì)他們進(jìn)行一些更新，確保和現(xiàn)實(shí)一致性。市場(chǎng)變化和策略的變化可能會(huì)重新定義你的業(yè)務(wù)受眾，也可能出現(xiàn)其他的細(xì)分，這也是重新調(diào)整用戶畫像的好機(jī)會(huì)，否則它們最終將失去生命力。希望你的用戶畫像也能始終對(duì)業(yè)務(wù)起到幫助，為體驗(yàn)助力。
文章來(lái)源：學(xué)UI網(wǎng) 作者：小紐扣
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
用戶體驗(yàn)設(shè)計(jì)是一個(gè)動(dòng)態(tài)領(lǐng)域，每年都會(huì)為我們帶來(lái)新的趨勢(shì)，最近十二個(gè)月也不例外。全球新冠病毒大流行和國(guó)家封鎖使我們與數(shù)字世界和現(xiàn)實(shí)世界之間的互動(dòng)方式發(fā)生了突然的變化。人們不僅開(kāi)始在網(wǎng)上花費(fèi)更多的時(shí)間；他們的思考方式和表現(xiàn)方式也發(fā)生了不同。
本文主要闡述2021用戶體驗(yàn)的趨勢(shì)，我們相信這將在新的一年里占據(jù)主導(dǎo)地位。查看一下您可以利用哪些趨勢(shì)超越競(jìng)爭(zhēng)對(duì)手并在人群中脫穎而出吧。
我們?cè)?a style="outline:0px;margin:0px;padding:0px;text-decoration:none;color:inherit;">2020年UX狀態(tài)預(yù)測(cè)中討論了語(yǔ)音用戶界面（VUI）。如今年所示，語(yǔ)音指令仍然是UX設(shè)計(jì)中最熱門的趨勢(shì)之一。可以肯定地說(shuō)，明年不應(yīng)忽略它。
毫無(wú)疑問(wèn)，到2021年，語(yǔ)音聊天機(jī)器人和虛擬助手將繼續(xù)流行。用戶在數(shù)字體驗(yàn)方面一直在尋求簡(jiǎn)單性和效率。市場(chǎng)需求，高期望值以及人工智能技術(shù)的迅速發(fā)展使品牌別無(wú)選擇，只能在其產(chǎn)品中包含基于語(yǔ)音的功能。
已經(jīng)有許多企業(yè)為廣泛的VUI實(shí)施奠定了基礎(chǔ)。例如，星巴克推出了一種名為My Starbucks Barista的基于AI的聊天機(jī)器人。其目標(biāo)是通過(guò)允許用戶通過(guò)語(yǔ)音命令購(gòu)買自己喜歡的飲料來(lái)改善咖啡訂購(gòu)體驗(yàn)。
極簡(jiǎn)主義可能是當(dāng)今視覺(jué)設(shè)計(jì)中最明顯的趨勢(shì)之一。用戶正在體驗(yàn)越來(lái)越多的網(wǎng)站所有者想要傳遞的關(guān)鍵消息。Cookie彈出窗口，打折廣告和各種通知旨在吸引和轉(zhuǎn)化網(wǎng)站訪問(wèn)者，但它們也吸引了我們的注意力。這就是簡(jiǎn)約的以用戶為中心的設(shè)計(jì)應(yīng)運(yùn)而生的地方。
但是，“極簡(jiǎn)主義”并不意味著“沉悶”或“原始”。意思是“優(yōu)雅”和“高效”。盡管必須使用數(shù)量有限的顏色，設(shè)計(jì)元素和明亮的組合，但UX設(shè)計(jì)人員仍然有很大的發(fā)揮空間。此外，元素的功能最為重要，正確突出產(chǎn)品功能并傳達(dá)正確信息的能力需要大量的創(chuàng)造力。相反，僅具有裝飾目的的組件正逐漸失去其重要性。
內(nèi)容，消息和導(dǎo)航的清晰度是UX設(shè)計(jì)的簡(jiǎn)約方法的另一個(gè)重要方面。信息過(guò)載對(duì)于大多數(shù)現(xiàn)代用戶來(lái)說(shuō)是一個(gè)痛苦，這意味著網(wǎng)站所有者應(yīng)努力使自己的UX文字簡(jiǎn)潔明了。
負(fù)空間是用戶體驗(yàn)設(shè)計(jì)的一種大趨勢(shì)，它已經(jīng)脫離了對(duì)簡(jiǎn)約UI的市場(chǎng)需求。簡(jiǎn)而言之，負(fù)空間是頁(yè)面布局中對(duì)象周圍（宏空間）或?qū)ο髢?nèi)部（微空間）的空白區(qū)域。它已經(jīng)成為獨(dú)立的設(shè)計(jì)元素，在視覺(jué)美學(xué)和用戶體驗(yàn)優(yōu)化中起著至關(guān)重要的作用。谷歌的主頁(yè)，蘋果的官方商店以及一些用Webflow創(chuàng)建的網(wǎng)站就是很好的例子。
留出一定的空間，在設(shè)計(jì)中添加“寂靜的感覺(jué)”，必須是始終有意義的。否則，用戶可以將其視為缺少信息。負(fù)空間的主要功能是整理網(wǎng)頁(yè)，以吸引用戶對(duì)關(guān)鍵對(duì)象和消息的注意。建立清晰的內(nèi)容層次結(jié)構(gòu)有助于UX設(shè)計(jì)人員將用戶的注意力吸引到最重要的內(nèi)容上。
負(fù)空間有時(shí)也稱為“空白區(qū)域”或“留白區(qū)域”。所有這些術(shù)語(yǔ)都是可以互換的。當(dāng)區(qū)域中沒(méi)有元素時(shí)，您還可以在深色模式或任何其他顏色下使用此用戶體驗(yàn)趨勢(shì)。
在發(fā)生COVID-19大流行之后的在線體驗(yàn)將與我們習(xí)慣的在線體驗(yàn)不同。UX設(shè)計(jì)以相關(guān)方式反映了缺陷。為了使品牌的數(shù)字化形象更具關(guān)聯(lián)性，設(shè)計(jì)師有意在版面設(shè)計(jì)中實(shí)現(xiàn)了一些“缺陷”。 它可以是任何東西，從手繪對(duì)象到構(gòu)圖或頁(yè)面的不尋常元素。
通常，不完美的設(shè)計(jì)可以很好地證明品牌的身份并突出其獨(dú)特性。但是，如果要應(yīng)用這種UX趨勢(shì)，則必須記住一個(gè)關(guān)鍵規(guī)則：必須保持平衡。如果你做得過(guò)多，那是行不通的。
中性風(fēng)格是UI設(shè)計(jì)中其他兩種大規(guī)模方法（擬態(tài)和平面設(shè)計(jì)）的組合，它們通常被認(rèn)為彼此相對(duì)。擬態(tài)化是關(guān)于模仿現(xiàn)實(shí)世界中的物體以及我們與物體交互的方式。
幾十年前，當(dāng)需要使用超現(xiàn)實(shí)元素來(lái)創(chuàng)建直觀且用戶友好的UI時(shí)，它很流行。垃圾桶就是例子之一。另一方面，平面設(shè)計(jì)是一個(gè)更新的，簡(jiǎn)化的概念，圍繞二維元素，極簡(jiǎn)主義和鮮艷的色彩。
同質(zhì)性兼顧了兩者的優(yōu)點(diǎn)。它使用圖形強(qiáng)度大的元素，陰影和漸變來(lái)使按鈕和卡片類似于自然界中的對(duì)象，而不是精確地重新創(chuàng)建它們。中性風(fēng)格不會(huì)將現(xiàn)實(shí)主義推到極致。取而代之的是，它努力實(shí)現(xiàn)淺色和微妙對(duì)比度的“柔和”外觀。
在過(guò)去大約一年的時(shí)間里，同質(zhì)化一直是UI / UX專業(yè)人員中討論最多的主題之一。盡管仍然沒(méi)有很多真正的數(shù)字產(chǎn)品的用戶界面遵循這種方法，但許多設(shè)計(jì)人員對(duì)該概念感到興奮。像Behance和Dribbble這樣的專業(yè)平臺(tái)已經(jīng)包含了許多同態(tài)的例子。因此，我們有充分的理由相信，這一趨勢(shì)最終將在2021年出現(xiàn)在我們的手機(jī)和筆記本電腦中。
視差效果和3D元素并不是UX設(shè)計(jì)中的全新內(nèi)容。我們已經(jīng)看到了如何在許多Web設(shè)計(jì)解決方案中實(shí)現(xiàn)它們。但是，我們?nèi)匀挥^察到這些用戶體驗(yàn)趨勢(shì)正在逐步普及。
首先，它的使用量顯著增加。如今，3D元素和視差效果已不再是網(wǎng)絡(luò)上奇特的事物。它們更為常見(jiàn)，特別是在代表著脫穎而出的時(shí)尚和電子商務(wù)品牌的網(wǎng)站和應(yīng)用上。
另一種趨勢(shì)是嘗試在一個(gè)界面中結(jié)合視差效果和3D圖形。使用視差滾動(dòng)時(shí)，網(wǎng)頁(yè)背景和前景元素以不同的速度移動(dòng)。僅憑它就能產(chǎn)生深度感。通過(guò)為此添加3D對(duì)象，您可以創(chuàng)建一種真正的身臨其境的體驗(yàn)，并將在用戶的記憶中保留很長(zhǎng)時(shí)間。
隨著我們?cè)O(shè)備屏幕的變寬，UI / UX設(shè)計(jì)中出現(xiàn)了不對(duì)稱趨勢(shì)。通常，不對(duì)稱是野獸派的一種屬性，這是藝術(shù)和網(wǎng)頁(yè)設(shè)計(jì)中與極簡(jiǎn)主義相反的一種風(fēng)格。但是，如果與其他殘酷的設(shè)計(jì)元素分開(kāi)使用，它可以使您的網(wǎng)站看起來(lái)有趣，同時(shí)使它保持微妙和優(yōu)雅。
不對(duì)稱布局的UI / UX趨勢(shì)通常與其他創(chuàng)造性的Web設(shè)計(jì)技術(shù)一起實(shí)現(xiàn)，例如破碎的網(wǎng)格，重疊的元素和分割的屏幕。您也可以將不對(duì)稱性應(yīng)用于排版。如果操作正確，它將使您的品牌信息更加引人注目和令人難忘。
但是，請(qǐng)務(wù)必記住，非對(duì)稱設(shè)計(jì)并不意味著“隨機(jī)放置的UI元素”。在布局上定位對(duì)象的不尋常方式應(yīng)該引導(dǎo)用戶的眼睛朝正確的方向前進(jìn)，并幫助品牌強(qiáng)調(diào)重要信息。
今天，當(dāng)我們?cè)诨ヂ?lián)網(wǎng)上進(jìn)入隨機(jī)網(wǎng)站時(shí)，很可能會(huì)看到GIF，微型動(dòng)畫，動(dòng)畫插圖或其他一些運(yùn)動(dòng)設(shè)計(jì)元素。動(dòng)畫在用戶體驗(yàn)設(shè)計(jì)中仍然很流行，并且使用頻率不斷增長(zhǎng)。
除了具有視覺(jué)吸引力之外，移動(dòng)物體還可以改善用戶參與度并簡(jiǎn)化導(dǎo)航。他們還可以為數(shù)字產(chǎn)品或服務(wù)注入生命，使它們更具個(gè)性。
如果要在用戶界面設(shè)計(jì)中使用這種軟件開(kāi)發(fā)趨勢(shì)，那么明智地執(zhí)行此操作至關(guān)重要。漂浮在屏幕上沒(méi)有特定目的的對(duì)象可能會(huì)使訪問(wèn)者感到困惑，從而促使他們甚至比計(jì)劃的要早離開(kāi)網(wǎng)頁(yè)。動(dòng)畫元素也不應(yīng)使用戶界面不必要地復(fù)雜。它們始終必須是相關(guān)的，有價(jià)值的和平穩(wěn)的。
信息體系結(jié)構(gòu)是在頁(yè)面上組織和構(gòu)造不同內(nèi)容的方式。它是以用戶為中心的設(shè)計(jì)（UCD）的基本要素，旨在使用戶的數(shù)字環(huán)境更加舒適。與用戶研究和可用性測(cè)試一起，構(gòu)建有效，有用且一致的信息體系結(jié)構(gòu)是UCD流程的必不可少的階段。
為了創(chuàng)建一個(gè)實(shí)用的信息體系結(jié)構(gòu)，UX設(shè)計(jì)人員需要對(duì)產(chǎn)品的目標(biāo)受眾，其行為以及使用數(shù)字解決方案的原因有深入的了解。用戶應(yīng)該無(wú)需花費(fèi)太多精力就能獲得所需的結(jié)果。因此，在設(shè)計(jì)過(guò)程的線框階段始終必須考慮用戶的目標(biāo)，清晰的導(dǎo)航和內(nèi)容表示（包括盲點(diǎn)監(jiān)視）。
我們創(chuàng)建此文章是為了讓您在當(dāng)今競(jìng)爭(zhēng)異常激烈的數(shù)字世界中站穩(wěn)腳跟。這里提到的所有UX趨勢(shì)絕對(duì)可以改善幾乎每個(gè)軟件解決方案或網(wǎng)站的用戶體驗(yàn)。即使用戶期望很高，它們也可以使您的產(chǎn)品在視覺(jué)上對(duì)目標(biāo)受眾更具吸引力。
文章來(lái)源：站酷 作者：ZZiUP
藍(lán)藍(lán)設(shè)計(jì)( www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.yvirxh.cn