中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

筆者從認(rèn)知、思維、方法和工具四個方面詳細(xì)闡述交互設(shè)計，幫助大家更深刻地理解什么是交互設(shè)計，意識到交互設(shè)計的價值與重要性。同時，掌握一套通用的設(shè)計思維和方法，適應(yīng) C 端和 B 端數(shù)字產(chǎn)品的交互設(shè)計。

在日常工作中，我們可能經(jīng)常會遇到類似這樣的情景：產(chǎn)品經(jīng)理或研發(fā)人員不清楚交互設(shè)計師和 UI 設(shè)計師有什么區(qū)別，甚至覺得交互設(shè)計師就是畫線框圖而已。交互設(shè)計師和產(chǎn)品經(jīng)理之間經(jīng)常發(fā)生工作上的重疊，產(chǎn)品經(jīng)理根據(jù)自己的思路出了交互原型，交互設(shè)計師就只有審稿或在產(chǎn)品經(jīng)理出的原型圖基礎(chǔ)上完善場景做一些優(yōu)化的的事情了。

在需求評審和交互評審時，研發(fā)人員會瘋狂“吐槽”產(chǎn)品設(shè)計和競品沒有什么區(qū)別，也會針對界面提出一些“刁鉆”問題?，F(xiàn)在已經(jīng)有很多成熟的交互組件庫和界面框架，似乎不需要交互設(shè)計師再介入設(shè)計。

有些設(shè)計總是爭論不休，沒有定論，每個人都有自己的想法，設(shè)計師有時說不清思路和理由說服對方。甚至當(dāng)有人問我們交互設(shè)計師究竟是做什么的時候，卻說不太清楚……

大家對交互設(shè)計還是會存在認(rèn)知上的誤區(qū)，本文即是針對以上種種問題作出的回應(yīng)。筆者從認(rèn)知、思維、方法和工具四個方面詳細(xì)闡述交互設(shè)計，幫助大家更深刻地理解什么是交互設(shè)計，意識到交互設(shè)計的價值與重要性。同時，掌握一套通用的設(shè)計思維和方法，適應(yīng) C 端和 B 端數(shù)字產(chǎn)品的交互設(shè)計。

第一章： 交互設(shè)計的認(rèn)知

1. 什么是交互設(shè)計

交互設(shè)計，是通過分析用戶的心理模型、設(shè)計任務(wù)流程、運(yùn)用交互知識，把業(yè)務(wù)邏輯（功能規(guī)格或內(nèi)容需求）以用戶能夠理解的方式傳達(dá)給目標(biāo)用戶，平衡公司商業(yè)需求和用戶需求的價值，最終實(shí)現(xiàn)產(chǎn)品戰(zhàn)略的過程。

——劉津《破繭成蝶》

簡而言之，使產(chǎn)品的原型設(shè)計無限接近用戶的心理模型，讓用戶更加有效地完成其操作目的，通過改善用戶體驗(yàn)的方式提升產(chǎn)品的價值。

交互設(shè)計是一門把抽象需求轉(zhuǎn)換為具象界面的交叉學(xué)科，重點(diǎn)是用戶行為設(shè)計，要實(shí)現(xiàn)恰當(dāng)?shù)挠脩趔w驗(yàn)，需要具備設(shè)計學(xué)、邏輯學(xué)、人機(jī)工程學(xué)、心理學(xué)、社會學(xué)等多門學(xué)科知識。

大家看到的用戶界面，往往只是看到了設(shè)計的最終結(jié)果，那只是設(shè)計的冰山一角，而具體界面設(shè)計背后的思考和設(shè)計過程是看不見的，在第二章節(jié)會詳細(xì)闡述設(shè)計思維、設(shè)計方法等看不見的設(shè)計。

目前，交互設(shè)計師和產(chǎn)品經(jīng)理的工作確有重疊現(xiàn)象，不再區(qū)分的那么明顯，有的公司并沒有交互設(shè)計師崗位，而是由產(chǎn)品經(jīng)理兼任。其實(shí)，交互設(shè)計師基本上是半個產(chǎn)品經(jīng)理，一定是具備產(chǎn)品思維的交互設(shè)計師，這對交互設(shè)計師也提出了更高的要求。

而有些界面設(shè)計總是爭論不休，沒有定論，本質(zhì)是缺乏明確的設(shè)計目標(biāo)，需明確是為什么用戶在什么場景下解決什么問題。

圖1：用戶界面-看得見的設(shè)計 & 看不見的設(shè)計

2. 交互設(shè)計做什么

交互設(shè)計師在工作中接到的設(shè)計項(xiàng)目通常可分為兩類：一類是體驗(yàn)優(yōu)化類項(xiàng)目，另一類則是新產(chǎn)品或改版項(xiàng)目。

體驗(yàn)優(yōu)化類型的項(xiàng)目，一般是產(chǎn)品日常版本迭代，屬于常規(guī)項(xiàng)目。新產(chǎn)品或改版項(xiàng)目，通常出現(xiàn)的頻率比較低，但是非常重要，前期需要一定的競品分析或調(diào)研工作。

交互設(shè)計師在對接這兩類項(xiàng)目時，主要需關(guān)注需求分析、用戶研究、信息架構(gòu)、流程設(shè)計、信息設(shè)計、原型設(shè)計、文案、數(shù)據(jù)分析、競品分析 9 個方面。其中，需求分析最為重要，包括用戶需求和產(chǎn)品需求的分析，需求分析是從用戶提出的需求出發(fā)，找到用戶內(nèi)心真正的需求，轉(zhuǎn)化為產(chǎn)品需求的過程。

用戶需求是用戶自己以為的需求或需要，產(chǎn)品需求是經(jīng)過我們分析之后挖掘到的用戶真實(shí)需求，并轉(zhuǎn)化為產(chǎn)品解決方案。此外，一般需要從商業(yè)、用戶、技術(shù)三個方面考慮，洞察需求的合理性。

3. 產(chǎn)品經(jīng)理、交互設(shè)計師和 UI 設(shè)計師的區(qū)別

用戶體驗(yàn)五要素是入門交互設(shè)計必備的基礎(chǔ)模型，通過用戶體驗(yàn)五要素可以直觀清晰地知道產(chǎn)品經(jīng)理、交互設(shè)計師和 UI 設(shè)計師工作的側(cè)重點(diǎn)和區(qū)別。

首先，產(chǎn)經(jīng)經(jīng)理主要側(cè)重于戰(zhàn)略層和范圍層。具體思考產(chǎn)品目標(biāo)和用戶需求，通過對用戶需求的洞察，提出產(chǎn)品解決方案，將用戶需求轉(zhuǎn)化為產(chǎn)品需求（功能規(guī)格和內(nèi)容需求），更多考慮產(chǎn)品的商業(yè)價值和滿足業(yè)務(wù)需求。

其次，交互設(shè)計師主要側(cè)重于產(chǎn)品的結(jié)構(gòu)層和框架層。重點(diǎn)是行為設(shè)計和邏輯層面，權(quán)衡用戶價值和商業(yè)價值，側(cè)重產(chǎn)品用戶體驗(yàn)，提出更有效的設(shè)計解決方案。

根據(jù)用戶體驗(yàn)五要素模型可知，產(chǎn)品主要分為功能型產(chǎn)品和信息型產(chǎn)品，不同類型的產(chǎn)品，交互設(shè)計的側(cè)重點(diǎn)也不同，對于功能類型產(chǎn)品，側(cè)重功能交互設(shè)計和界面設(shè)計，而對于信息類型產(chǎn)品，則側(cè)重信息架構(gòu)和導(dǎo)航設(shè)計。

最后，UI 設(shè)計師主要負(fù)責(zé)產(chǎn)品表現(xiàn)層，以用戶為中心，圍繞產(chǎn)品和交互設(shè)計的目標(biāo)展開視覺設(shè)計。UI 設(shè)計師偏向于感知設(shè)計，通過對比、視覺一致性、配色、排版、字體、字號、圖形符號等視覺設(shè)計方法賦予產(chǎn)品良好的外觀體驗(yàn)和視覺感知，提升產(chǎn)品的視覺體驗(yàn)。

簡言之，設(shè)計師更注重創(chuàng)意及邏輯，設(shè)計目標(biāo)更加純粹，能夠更多地考慮用戶，設(shè)計方法更專業(yè)。產(chǎn)品經(jīng)理會站在產(chǎn)品全局視角考慮問題，側(cè)重商業(yè)目標(biāo)。

圖2：用戶體驗(yàn)五要素（圖片來源網(wǎng)絡(luò)）

4. 交互設(shè)計的價值

產(chǎn)品從抽象到具象的設(shè)計過程中，交互設(shè)計起到了至關(guān)重要的作用。從 2012 年移動互聯(lián)網(wǎng)的元年開始，幾乎每個互聯(lián)網(wǎng)人都深知用戶體驗(yàn)就是商機(jī)，因此，互聯(lián)網(wǎng)企業(yè)非常重視產(chǎn)品的用戶體驗(yàn)。在互聯(lián)網(wǎng)上半場紅利時期，為了搶奪更多的用戶，很多互聯(lián)網(wǎng)企業(yè)推出的產(chǎn)品幾乎都是免費(fèi)的，通過提升產(chǎn)品用戶體驗(yàn)的方式獲取用戶和增加用戶留存，以提高其市場占有份額。

而交互設(shè)計師會兼顧用戶價值、商業(yè)價值和品牌價值等，根據(jù)用戶反饋和商業(yè)目標(biāo)不斷改善產(chǎn)品用戶體驗(yàn)，以提升產(chǎn)品的價值。

交互設(shè)計師還需要分析并重塑需求，分析用戶特征行為，設(shè)計結(jié)構(gòu)、流程、界面、動態(tài)效果，跟進(jìn)視覺、前端，及時整理線上問題，準(zhǔn)備下一次迭代。

此外，交互設(shè)計師可以將產(chǎn)品經(jīng)理從原型設(shè)計的工作中釋放出來，會有更多的時間思考產(chǎn)品方向，可提升產(chǎn)品研發(fā)效率，減少不必要的返工、理解成本和溝通成本，保證項(xiàng)目順利進(jìn)行。

第二章：設(shè)計思維

在互聯(lián)網(wǎng)產(chǎn)品設(shè)計和用戶體驗(yàn)設(shè)計中，除了具體的動手之外，學(xué)會如何思考非常重要?；ヂ?lián)網(wǎng)進(jìn)入下半場，人口紅利消退，資本紅利和流量紅利逐漸萎縮，互聯(lián)網(wǎng)大環(huán)境的變化給互聯(lián)網(wǎng)企業(yè)和設(shè)計從業(yè)人員帶來了全新的挑戰(zhàn)，業(yè)務(wù)增長乏力成為當(dāng)前互聯(lián)網(wǎng)企業(yè)首要解決的問題。

隨著云計算的快速發(fā)展，數(shù)據(jù)存儲成本也越來越低，使得數(shù)據(jù)獲取變得更加容易，大數(shù)據(jù)時代的來臨使得增長更容易實(shí)現(xiàn)。

由于以上原因，設(shè)計思維也發(fā)生了變化。過去，我們做設(shè)計往往注重用戶體驗(yàn)，強(qiáng)調(diào)用戶思維，遵循以用戶為中心的設(shè)計原則，以問題為導(dǎo)向進(jìn)行設(shè)計。

以用戶為中心的設(shè)計思維最早是美國著名工業(yè)設(shè)計師亨利·德萊福斯提出，在他的著作《為人的設(shè)計》非常詳細(xì)地闡述了這一設(shè)計哲學(xué)。然而，現(xiàn)在我們做設(shè)計不再只強(qiáng)調(diào)用戶思維，而是以增長為導(dǎo)向，圍繞產(chǎn)品增長，以產(chǎn)品價值為中心進(jìn)行設(shè)計，并盡可能減少成本。

所以，本文闡述的設(shè)計思維是以用戶為中心，以增長為導(dǎo)向，提升產(chǎn)品價值的用戶思維和增長思維。產(chǎn)品價值包括用戶價值、商業(yè)價值、品牌價值以及產(chǎn)品的核心競爭力等。用戶思維主要總結(jié)為 6 個方面，分別是用戶動線、距離、用戶習(xí)慣、防呆、優(yōu)先級、場景。

2.1 用戶思維

2.1.1 用戶動線

用戶動線，指的是用戶使用互聯(lián)網(wǎng)產(chǎn)品的行為軌跡，即用戶行為路徑設(shè)計。常見用戶動線設(shè)計的方法有視覺引導(dǎo)用戶注意力、小紅點(diǎn)消息提示引導(dǎo)用戶、頁面切換動效、暗示更多內(nèi)容、留白、F 型視線運(yùn)動等等。

首先，通過視覺色彩和區(qū)塊大小對比引導(dǎo)用戶注意力。

例如，美圖秀秀首頁底部導(dǎo)航設(shè)計，中間的加號圖形按鈕使用紅色面積塊體現(xiàn)，且放在導(dǎo)航中間位置，并增大展示和點(diǎn)擊區(qū)域。當(dāng)用戶關(guān)注導(dǎo)航區(qū)域時，用戶會優(yōu)先被引導(dǎo)至加號入口。

筆者認(rèn)為這樣設(shè)計的目的是體現(xiàn)了此入口的重要性，具體跟美圖秀秀的產(chǎn)品定位有很大關(guān)系。美圖秀秀前期產(chǎn)品定位就是免費(fèi)使用的拍照工具，用戶用完即走，目前在進(jìn)行產(chǎn)品商業(yè)化轉(zhuǎn)型，所以產(chǎn)品重新定位為以工具為基礎(chǔ)，做圖片社區(qū)，目的還是希望增加用戶的留存，便于產(chǎn)品商業(yè)化。

圖3：美圖秀秀 APP-首頁-底部全局導(dǎo)航-發(fā)布按鈕

京東、天貓、淘寶 app 商品詳情頁底部按鈕加入購物車和立即購買同樣通過視覺手段引導(dǎo)用戶瀏覽商品詳情后快速找到購買入口。

圖 4:從左到右分別是京東、天貓、淘寶 APP 商品詳情頁

其次，小紅點(diǎn)消息提示引導(dǎo)。

下圖所示分別是微信朋友圈有新動態(tài)時的提示和我在朋友圈某條動態(tài)下互動后，微信共同好友互動后出現(xiàn)的提示引導(dǎo)，且當(dāng)點(diǎn)擊微信朋友圈入口進(jìn)入朋友圈主頁時，界面會出現(xiàn)好友互動條數(shù)入口，點(diǎn)擊后直接定位此條動態(tài)。

這是通過小紅點(diǎn)的方式引導(dǎo)用戶進(jìn)入微信朋友圈查看動態(tài)信息的方式，其設(shè)計目的是為了提升朋友圈的活躍度。

圖 5：微信-發(fā)現(xiàn)界面

其三，頁面切換動效設(shè)計。

動效在頁面跳轉(zhuǎn)中的運(yùn)用起到路徑引導(dǎo)作用，幫助用戶理解頁面之間的關(guān)系，在使用產(chǎn)品的過程中不會迷失，頁面切換動效在移動 APP 中應(yīng)用廣泛，也是 iOS 和 Android 平臺設(shè)計規(guī)范要求。

例如，用戶通過右滑界面左側(cè)區(qū)域至界面中軸線右側(cè)，當(dāng)前界面會向右滑出，清晰地展示界面與界面之間的關(guān)系。抑或查看某商品促銷信息，從界面底部出現(xiàn)對話框，關(guān)閉則是原路返回。類似這樣的頁面切換動效設(shè)計很好地幫助用戶更好地使用產(chǎn)品，提升產(chǎn)品使用體驗(yàn)。

圖6:左圖是天貓 APP 商品詳情頁返回動效，右圖是京東 APP 商品詳情頁查看促銷底部彈框動效

其四、暗示更多內(nèi)容。

長頁面超出屏幕可視區(qū)域，需露出部分內(nèi)容，以暗示用戶還有更多內(nèi)容。在移動端界面設(shè)計中，由于界面可視區(qū)域有限，所以需要拓展可視界面區(qū)域，通常水平展示更多內(nèi)容時使用左滑查看更多，展示則默認(rèn)展示 2 個半或 3 個半的內(nèi)容，暗示用戶界面右側(cè)有更多信息。

由于界面首屏內(nèi)容一般會有更多的曝光機(jī)會，頁面越長，用戶越?jīng)]有太多意愿繼續(xù)向下訪問，因此為了暗示用戶向下繼續(xù)瀏覽，通常的做法是在首屏線區(qū)域內(nèi)容展示一半。例如電商 app 首頁展示。

圖7：京東家電和京東 app 首頁

其五，留白。

通過留白的處理，可以影響用戶的瀏覽順序。例如：下圖所示的 B 端表單兩列布局。水平方向和垂直方向表單間距一致，其實(shí)用戶是不知道該按行瀏覽還是按列瀏覽的。

當(dāng)把兩列表單的行間距留白調(diào)大，用戶默認(rèn)會按行瀏覽表單填寫，留白的界面處理方式，會暗示用戶瀏覽信息的順序。

圖8：兩列表單布局

其六，F(xiàn) 型視線運(yùn)動。

符合用戶視線的設(shè)計更容易獲得用戶的點(diǎn)擊。根據(jù)實(shí)驗(yàn)研究，用戶瀏覽信息停留時間最長的布局方式是“F”型。例如，Google搜索結(jié)果頁面的信息布局方式就是采用了“F”型結(jié)構(gòu)。

圖9：Google 搜索結(jié)果頁

了解用戶行為軌跡，可以為界面優(yōu)化提供科學(xué)依據(jù)。對于電商產(chǎn)品而言，通過科學(xué)分析用戶視線停留時間及次數(shù)，可以精準(zhǔn)把握商品的市場反饋。下圖是通過眼球追蹤儀了解到用戶瀏覽信息的軌跡。

圖10：京東商城-眼球追蹤儀研究用戶瀏覽軌跡(來源網(wǎng)絡(luò))

2.1.2 距離

距離，是指界面元素離用戶手指或鼠標(biāo)的距離遠(yuǎn)近。費(fèi)茨定律指出目標(biāo)越大，指向越快；目標(biāo)越近，指向也越快。還是以美圖秀秀首頁為例，界面上半部分的相機(jī)、拼圖、美化圖片等工具入口設(shè)計的點(diǎn)擊區(qū)域足夠大，且入口之間保留足夠的間距，用戶點(diǎn)擊工具入口更快更精準(zhǔn)。

一般 APP 端距離用戶手指最近且容易操作的區(qū)域是界面底部區(qū)域，所以通常使用頻率高的全局導(dǎo)航會優(yōu)先考慮放在界面底部，易操作。

2.1.3 用戶習(xí)慣

在界面設(shè)計中，保留用戶已有的產(chǎn)品使用習(xí)慣，可以有效降低用戶的學(xué)習(xí)成本。一般成長期或成熟期的產(chǎn)品在規(guī)劃改版時，會衡量新老用戶的比重以及改版的價值，不會頻繁輕易改版，頻繁改版會影響老用戶使用習(xí)慣，導(dǎo)致用戶流失。如果改版的價值高于用戶使用習(xí)慣，而用戶不想嘗試改變已有使用習(xí)慣，可以通過激勵措施引導(dǎo)用戶。

例如，通訊社交產(chǎn)品微信，已經(jīng)培養(yǎng)了用戶使用通訊社交產(chǎn)品的習(xí)慣，所以后來支付寶新增的通訊產(chǎn)品-朋友，其界面設(shè)計和交互操作方式基本和微信的聊天界面一致，其設(shè)計決策是考慮到大量用戶使用微信的已有使用習(xí)慣。

圖11：左邊是微信聊天界面，右邊是支付寶-朋友- 聊天界面

2.1.4 防呆

防止用戶誤操作并快速恢復(fù)，避免用戶在操作界面過程中出錯，這是一種防呆設(shè)計。常見的防呆設(shè)計方法有增加必要的限制、操作流程優(yōu)化、及時反饋、容錯設(shè)計。

首先，必要的設(shè)計限制。

當(dāng)用戶填寫表單信息時，增加必要的設(shè)計限制，可以有效減少用戶填寫表單的出錯情況，減少用戶成功填寫表單的時間，提升效率。

下圖分別是 PC 端攜程旅游和同程旅游添加乘客信息的交互設(shè)計，攜程旅游產(chǎn)品添加身份證信息允許用戶輸入中文字符，顯然身份證只能是數(shù)字或字母組成，所以允許用戶輸入中文字符是無效的。而同程旅游產(chǎn)品考慮到了身份證號碼的特殊性，限制不可輸入中文字符，同時放大展示已輸入證件號碼，號碼每六個數(shù)字為一組，保留間距，方便用戶邊輸入邊核對，用戶體驗(yàn)更好，更多地考慮用戶操作場景。

圖12、左圖是攜程旅游添加身份證號碼交互，右圖是同程旅游添加身份證號碼交互(PC 端)

其二，操作邏輯。

通過改變操作流程，可以有效解決因流程設(shè)計導(dǎo)致的用戶痛點(diǎn)問題。比如，很多用戶在使用 ATM 機(jī)取錢時，經(jīng)常取完錢后直接離開，忘記取卡，導(dǎo)致銀行卡被鎖定，找回銀行卡比較麻煩。針對這個問題，中國光大銀行和平安銀行改變了 ATM 機(jī)取錢流程，先退卡再取錢，通過流程設(shè)計優(yōu)化，解決用戶銀行卡被鎖定的痛點(diǎn)。（流程設(shè)計改變了用戶使用 ATM 機(jī)取錢的習(xí)慣）

圖 13：左圖是中國光大銀行 ATM 機(jī)取錢場景；右圖是平安銀行 ATM 機(jī)取錢場景 （圖片來源于網(wǎng)絡(luò)）

其三，及時反饋。

用戶每一次的操作，界面都需要及時響應(yīng)用戶的操作并及時提供用戶反饋。上面談到同程旅游產(chǎn)品添加身份證件號碼的交互，當(dāng)用戶輸入字符時，光標(biāo)離開文本框后即刻校驗(yàn)該字段，及時告知用戶當(dāng)前所填信息正確與否。

圖 14：同程旅游(PC 端)添加證件號碼

移動端場景比較復(fù)雜，比如當(dāng)無網(wǎng)絡(luò)時，需提供無網(wǎng)絡(luò)提示并提供給用戶有效解決方案。比如網(wǎng)易云音樂無網(wǎng)絡(luò)場景設(shè)計，首先會提示用戶無網(wǎng)絡(luò)，無網(wǎng)絡(luò)不可用的入口全部置灰，但是會展示已緩存的數(shù)據(jù)和界面框架，滿足用戶在無網(wǎng)絡(luò)或網(wǎng)絡(luò)不穩(wěn)定時依然可以聽歌的需求，聽歌是音樂類產(chǎn)品最核心的用戶需求。無網(wǎng)絡(luò)或網(wǎng)絡(luò)弱時，提供給用戶可行的解決方案可以有效幫助用戶重新連接網(wǎng)絡(luò)，保證聽歌體驗(yàn)流暢。

圖 15：網(wǎng)易云音樂 APP 無網(wǎng)絡(luò)設(shè)計

再比如，網(wǎng)易新聞、今日頭條、騰訊新聞等內(nèi)容類型產(chǎn)品的設(shè)計，用戶點(diǎn)擊過的內(nèi)容入口會置灰處理，已讀和未讀內(nèi)容作區(qū)分，避免用戶查看重復(fù)信息，這是通過視覺方式處理的及時反饋。

圖 16：左圖是網(wǎng)易新聞 APP 首頁、中圖是今日頭條 APP 首頁、右圖是騰訊新聞 APP 首頁

其四，容錯設(shè)計。

主要目的是防止用戶誤操作而導(dǎo)致用戶數(shù)據(jù)丟失。當(dāng)某內(nèi)容或重要數(shù)據(jù)信息刪除后會徹底刪除，則需提供二次確認(rèn)。同樣是同程旅游 APP 訂單填寫頁面，未填寫信息時，點(diǎn)擊返回則直接返回，若已填寫訂單信息，離開頁面時會提供二次確認(rèn)，一旦離開，則當(dāng)前頁面的數(shù)據(jù)信息不會保留，給用戶一次確認(rèn)離開的機(jī)會。

筆者認(rèn)為有兩點(diǎn)考慮，從產(chǎn)品角度是希望用戶可以完成訂單增加訂單轉(zhuǎn)化率，從用戶角度考慮有可能誤操作返回。

圖 17：同程旅游 APP-訂單填寫

2.1.5 優(yōu)先級

優(yōu)先級，又稱之為“層次”。層次分明的產(chǎn)品界面可以幫助用戶一眼抓住最關(guān)注和最重要的信息，并快速決策。產(chǎn)品、交互和視覺都有優(yōu)先級之分。產(chǎn)品和交互所謂的優(yōu)先級主要指的是內(nèi)容、功能、流程、場景和用戶的優(yōu)先級。

內(nèi)容區(qū)分主要信息和次要信息，功能區(qū)分主要功能、次要功能、基礎(chǔ)功能，考慮功能價值和使用頻率，流程分產(chǎn)品主流程和分支流程，場景則考慮用戶主要的使用場景，而用戶方面則需考慮產(chǎn)品的目標(biāo)用戶、目標(biāo)用戶中的核心用戶（能帶來收入的目標(biāo)用戶群體），產(chǎn)品是為大多數(shù)目標(biāo)用戶設(shè)計的。

視覺的優(yōu)先級則更多是對比、顏色、區(qū)塊大小、文字大小等視覺表現(xiàn)方法，可以讓整體排版布局更加富有層次結(jié)構(gòu)，讓內(nèi)容的可讀性得到明顯的提升。

舉個例子，支付寶中的余額寶主頁和京東金融 APP 主頁設(shè)計思路都是先給出結(jié)論，幫助用戶快速決策，因此重要的信息都是收益信息，這是用戶最關(guān)注的信息。所以視覺上均采用純色塊高優(yōu)先級的方式展示，且位置放在首屏第一個板塊，用戶一眼可以看到與自己利益強(qiáng)相關(guān)的信息。

圖 18：左圖是支付寶-余額寶、右圖是京東金融 APP 首頁（我）

2.1.6 場景

場景是設(shè)計思維中重要的思考之一。設(shè)計是解決用戶在具體場景下遇到的問題，這里的“場景”有兩層指向，一種是用戶在現(xiàn)實(shí)生活中的真實(shí)場景，另外一種是用戶使用某產(chǎn)品時的場景。

首先，用戶在真實(shí)場景下的設(shè)計思考。

比如用戶在昏暗環(huán)境下使用摩拜 APP 掃碼用車，摩拜 APP 提供手電筒功能會根據(jù)環(huán)境光線強(qiáng)弱自動開啟手電筒，考慮的是用戶真實(shí)使用場景。

再看蘋果手機(jī)來電顯示界面設(shè)計，用戶未使用手機(jī)時和使用時的電話接聽界面設(shè)計不同。用戶未使用手機(jī)時，接聽界面交互是通過滑動接聽，增加接聽電話操作成本，防止用戶誤操作拒接電話或接聽電話，因?yàn)橛脩粑词褂檬謾C(jī)的場景很多，可能手機(jī)放在口袋或包里，由于運(yùn)動等因素會誤操作。

而用戶正在使用手機(jī)的場景下則是直接展示拒絕和接聽按鈕，如果用戶未使用手機(jī)時的界面也是這樣，則用戶誤操作的幾率非常大，當(dāng)是一個非常重要人士或親密朋友來電話，由于誤操作拒絕了是會引起不必要的麻煩的。這是基于用戶在不同場景下需求不同而做的設(shè)計。

圖 19：左圖是在灰暗環(huán)境下使用摩拜 APP 掃碼用車、右圖是在不同場景下用蘋果手機(jī)接聽電話的界面

第二，基于用戶使用產(chǎn)品時的場景設(shè)計。

美團(tuán)外賣首頁根據(jù)用戶每天吃飯的時間點(diǎn)，分早晨、中午、晚上、夜宵共四個時間段，基于 LBS 地理位置在不同的時間段分別為用戶提供好店，以精準(zhǔn)為用戶推薦好店，解決用戶吃的問題。這是基于場景考慮的設(shè)計。

圖 20：美團(tuán)外賣首頁根據(jù)早上中午晚上夜宵時間段場景的界面設(shè)計

2.2 增長思維

用戶思維是做交互設(shè)計最基礎(chǔ)的設(shè)計思維，此外，增長思維同樣重要?；煦绱髮W(xué)李善友教授曾說過“作為一個企業(yè)，第一重要的事情是增長?！?/p>

對于互聯(lián)網(wǎng)上市公司而言，業(yè)務(wù)營收的高速增長可以提高公司估值，對于企業(yè)投資者而言，則可以提高投資回報率。

從 2018 年以來，設(shè)計行業(yè)比較有影響力的設(shè)計大會，比如產(chǎn)品經(jīng)理大會有一半的演講者都在講增長，可見，增長已是必然趨勢。

既然大家都在講增長，那么什么是增長呢？增長是 KPI 指標(biāo)嗎？作為設(shè)計師，該如何助力業(yè)務(wù)和產(chǎn)品增長呢？

據(jù)筆者了解，國內(nèi)最早提到增長概念，是來自范冰的《增長黑客》這本書，而增長概念來源于美國硅谷。增長并不是 KPI 指標(biāo)，KPI 只是短期階段性指標(biāo)，更多的可能是一些虛榮指標(biāo)，產(chǎn)品經(jīng)理為了達(dá)到 KPI 指標(biāo)而犧牲用戶體驗(yàn)價值是常有的事情。

什么是增長？

增長是產(chǎn)品增長，這是最核心的目標(biāo)，注重產(chǎn)品長期價值。增長對象不僅包括產(chǎn)品用戶量的增長，還包括產(chǎn)品在不同生命周期中各個階段最重要的指標(biāo)。

——范冰《增長黑客》

傳統(tǒng)的產(chǎn)品生命周期分探索期、成長期、成熟期和衰退期這四個時期，不同階段的產(chǎn)品目標(biāo)是不同的，對應(yīng)的產(chǎn)品增長指標(biāo)（指本階段最能體現(xiàn)產(chǎn)品價值和企業(yè)價值的指標(biāo)）也會不同。

在探索期，主要會采用 MVP 的方法（MVP 全稱 MinimumViableProduct，最小可行性產(chǎn)品）以最小成本和最快的研發(fā)速度上線產(chǎn)品，快速驗(yàn)證產(chǎn)品方向是否正確，如果方向不正確可迅速調(diào)整產(chǎn)品方向。

產(chǎn)品進(jìn)入成長期階段，產(chǎn)品主要的目標(biāo)是確定產(chǎn)品差異化定位，搶占市場、迅速占領(lǐng)用戶心智。在成熟期階段，需重點(diǎn)考慮產(chǎn)品如何進(jìn)行商業(yè)化變現(xiàn)，以及提升商業(yè)價值。上面介紹過的美圖秀秀 APP 已經(jīng)是成熟期的產(chǎn)品了，所以產(chǎn)品需要商業(yè)化轉(zhuǎn)型。

從企業(yè)戰(zhàn)略層的視角看，有了增長意識后，我們需要盡早在產(chǎn)品成熟期階段思考如何提升產(chǎn)品增長，否則當(dāng)產(chǎn)品進(jìn)入衰退期再考慮產(chǎn)品增長是比較困難的事情，市場競爭激烈。

比如美團(tuán)，最早持續(xù)給企業(yè)帶來高速營收增長的業(yè)務(wù)線是美食，在產(chǎn)品成長期階段對標(biāo)的是大眾點(diǎn)評，解決的是用戶本地生活吃飯的需求，后來在原有業(yè)務(wù)線基礎(chǔ)上不斷探索，逐漸分化出來多條新的業(yè)務(wù)助力企業(yè)增長。比如電影/演出、酒店旅游、美團(tuán)外賣、出行（打車、摩拜單車、火車票、機(jī)票）、美容美發(fā)生活服務(wù)等等。

現(xiàn)在發(fā)展比較成熟的業(yè)務(wù)線是美團(tuán)外賣，成為美團(tuán)第二條成功助力企業(yè)營收增長的重要業(yè)務(wù)線，為什么美團(tuán)會有多條成功的能帶來增長的業(yè)務(wù)，這和企業(yè)的創(chuàng)新分不開。

所以，產(chǎn)品增長如何實(shí)現(xiàn)呢？

如何實(shí)現(xiàn)增長？

從業(yè)務(wù)角度看，需要業(yè)務(wù)創(chuàng)新實(shí)現(xiàn)營收增長，深入洞察用戶，挖掘還沒被滿足的需求。

從產(chǎn)品角度看，需要通過數(shù)據(jù)體現(xiàn)增長，前面提到了云計算的快速發(fā)展使得產(chǎn)品獲取數(shù)據(jù)非常容易，所以通過數(shù)據(jù)分析可以由數(shù)據(jù)驅(qū)動業(yè)務(wù)增長，找到能提升業(yè)務(wù)目標(biāo)的解決方案，不斷優(yōu)化產(chǎn)品體驗(yàn)。常用的增長方法是 AAARR 用戶轉(zhuǎn)化漏斗增長模型，具體先后順序是獲客、激活、留存、增加收入、推薦傳播。

但是，AAARR 用戶轉(zhuǎn)化漏斗增長模型更適用于成長期和成熟期的產(chǎn)品，并不適合用于探索期產(chǎn)品。探索期產(chǎn)品最重要的是用戶留存，是要驗(yàn)證產(chǎn)品方向，是不需要花巨大成本推廣獲取客戶的，而是先考慮用戶留存、后激活沉睡用戶，再考慮產(chǎn)品獲客的事情，用戶留存可以體現(xiàn)產(chǎn)品的價值，驗(yàn)證用戶需求。

從設(shè)計角度看，在做具體設(shè)計時，需要具備增長思維，以用戶為中心，以增長為導(dǎo)向，不斷提升產(chǎn)品價值。考慮不同產(chǎn)品生命周期產(chǎn)品最重要的核心指標(biāo)，這個指標(biāo)需要能代表產(chǎn)品長期價值和企業(yè)價值，是項(xiàng)目團(tuán)隊都認(rèn)可的指標(biāo)，大家圍繞共同的目標(biāo)挖掘提升增長的爆破點(diǎn)。具體可通過用戶調(diào)研，深挖用戶差異化的需求，圍繞產(chǎn)品階段性的目標(biāo)，結(jié)合用戶畫像和用戶體驗(yàn)地圖找到設(shè)計機(jī)會點(diǎn)來提升增長指標(biāo)。

用戶調(diào)研分析可以是定性分析或定量分析或者兩者結(jié)合，對于探索期新產(chǎn)品最好是定性分析，畢竟沒有足夠多的數(shù)據(jù)，樣本量少也不一定有說服力。此外，提升產(chǎn)品增長還可以使用 A/B Test方法等。

第三章：設(shè)計方法

用戶體驗(yàn)五要素是學(xué)習(xí)交互設(shè)計的基礎(chǔ)，以用戶為中心，以問題和增長為導(dǎo)向提升產(chǎn)品價值是重要的設(shè)計思維。

目前，具體的設(shè)計方法很多，比如構(gòu)建人物模型（用戶畫像）、用戶體驗(yàn)(旅程)地圖、設(shè)計沖刺法、上癮模型、海盜模型（AARRR）、卡諾模型、福格行為模型（Fogg’s behavior model）、服務(wù)藍(lán)圖（峰終定律 Peak-End Rule）等等，但是筆者認(rèn)為最基礎(chǔ)的也是最通用的還是基于用戶場景的目標(biāo)導(dǎo)向設(shè)計法。沒有目標(biāo)的設(shè)計都是在耍流氓！

1. 基于場景目標(biāo)導(dǎo)向設(shè)計法

基于場景的目標(biāo)導(dǎo)向設(shè)計法是指：特定類型用戶（who）在某時間（when）某地點(diǎn)（where）、遇到什么（what）時，有怎樣的訴求（want），會通過什么手段（how）來滿足其訴求，簡稱 5W1H 法則。

舉個例子，現(xiàn)在有這樣的需求：假設(shè)我們在 APP 首頁首屏里，要插入登錄領(lǐng)新人禮包的卡片。用戶的場景可以描述為：在用戶進(jìn)入首頁瀏覽模塊信息（地點(diǎn)）的時候（時間），看到了“新人禮包 188 元新人專享權(quán)益”的卡片（出現(xiàn)某物），未注冊的用戶（特定類型用戶）萌發(fā)了領(lǐng)取禮包（訴求），會點(diǎn)擊卡片的新人禮包（手段）通過注冊來領(lǐng)取新人禮包?？梢源_定設(shè)計的目標(biāo)是引導(dǎo)未注冊的用戶領(lǐng)取新人紅包。

圖21：左圖京東 APP 首頁-用戶已登錄 、右圖京東 APP 首頁-用戶未登錄

交互設(shè)計流程一般有六個步驟。分別是需求分析、確定設(shè)計目標(biāo)、競品分析、任務(wù)流程設(shè)計、信息架構(gòu)&功能交互設(shè)計和原型設(shè)計。原型設(shè)計只占整個交互設(shè)計過程的 1/3，更多的是設(shè)計思考與分析。

在需求分析階段，我們需要考慮需求來源、明晰需求類型、深入了解需求背景和目的，理性評估需求合理性與價值，清楚目標(biāo)用戶、洞察用戶心理和用戶需求目的。通過需求分析的結(jié)果，提煉出產(chǎn)品目標(biāo)和用戶目標(biāo)，以確定設(shè)計目標(biāo)并指導(dǎo)交互界面設(shè)計。

如果是新產(chǎn)品或改版，在進(jìn)入設(shè)計之前，有必要做競品分析，競品分析的目的是吸取競品優(yōu)點(diǎn)并發(fā)現(xiàn)不足，根據(jù)競品分析的結(jié)論優(yōu)化設(shè)計，而不是照抄競品。

當(dāng)然，不是所有的項(xiàng)目都必須要做競品分析。確定設(shè)計目標(biāo)之后，開始任務(wù)流程設(shè)計，分解用戶使用產(chǎn)品的主要任務(wù)和分支任務(wù)，設(shè)計滿足需求的用戶路徑和操作流程。

信息架構(gòu)和功能設(shè)計分信息型和功能型產(chǎn)品，思考產(chǎn)品結(jié)構(gòu)和信息組織。原型階段主要是導(dǎo)航設(shè)計、信息設(shè)計、框架設(shè)計和文案等。

第四章：設(shè)計工具

工欲善其事，必先利其器。交互設(shè)計師常用的設(shè)計工具有 Axure、Sketch、墨刀等。Axure 適應(yīng) Mac OS 系統(tǒng)和 Windows 系統(tǒng)，支持協(xié)同辦公，通常用來制作的是低保真原型，原型無法導(dǎo)出切圖標(biāo)注，效率一般。

如果電腦是 Mac OS 系統(tǒng)，可以使用 Sketch 工具，使用 marketch 或 Sketch Measure 插件導(dǎo)出切圖標(biāo)注，再加上 Sketch 組件的運(yùn)用，可以直接輸出高保真原型，提高設(shè)計效率，現(xiàn)在很多公司設(shè)計團(tuán)隊一般采用 Sketch 設(shè)計工具。

總結(jié)

本篇文章主要從認(rèn)知、思維、方法和工具四個方面講述了交互設(shè)計。

1. 交互設(shè)計的認(rèn)知篇章主要介紹了交互設(shè)計是使產(chǎn)品的原型設(shè)計更接近用戶的心理模型，讓用戶更有效地完成操作目的，通過提升用戶體驗(yàn)的方式提升產(chǎn)品的價值。
2. 設(shè)計思維模塊介紹了以用戶為中心，以問題和增長為導(dǎo)向，提升產(chǎn)品價值的設(shè)計思維，包括用戶思維和增長思維。用戶思維介紹了用戶動線、距離、用戶習(xí)慣、防呆、優(yōu)先級、場景六個思考要素。
3. 介紹了基于場景的目標(biāo)導(dǎo)向設(shè)計法和交互設(shè)計一般流程。
4. 最后一部分則簡單介紹了交互設(shè)計師常用的幾款設(shè)計工具，Axure、Sketch、墨刀、Figma 等。

設(shè)計無邊界。近兩年，交互設(shè)計師和產(chǎn)品經(jīng)理、視覺設(shè)計師的邊界越來越模糊，因此，每位設(shè)計師都不要給自己設(shè)限制，局限自己只做交互或只做視覺，可以嘗試站在業(yè)務(wù)、產(chǎn)品和用戶的更高視角思考交互設(shè)計，提升設(shè)計的價值。交互設(shè)計師不是技能合成設(shè)計師，需要運(yùn)用綜合能力或合作能力為更高的目標(biāo)服務(wù)。

以上僅代表筆者個人觀點(diǎn)，而我所說的可能都是錯的，感謝閱讀。

本文由 @沉一 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自 Unsplash ，基于 CC0 協(xié)議