作者：設(shè)計師豆?jié){
鏈接：https://www.zcool.com.cn/article/ZMTI4NTgyMA==.html
來源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標(biāo)定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計，以及相關(guān)的軟件開發(fā)服務(wù)，咨詢電話：01063334945。我們建立了一個微信群，每天分享國內(nèi)外優(yōu)秀的設(shè)計，有興趣請加入一起學(xué)習(xí)成長，咨詢及進群請加藍小助微信ben_lanlan

在數(shù)字產(chǎn)品設(shè)計日新月異的今天，打造卓越用戶體驗已成為產(chǎn)品成功的關(guān)鍵。這篇文章精準解析了UX設(shè)計的六大核心支柱，從用戶研究到無障礙設(shè)計，為讀者提供了全面且實用的設(shè)計框架。

開啟用戶體驗設(shè)計探索之旅，首要任務(wù)是全面掌握其核心構(gòu)成要素——這些是構(gòu)筑絕佳用戶體驗的基石需求。事實上，在蘋果、微軟和谷歌等設(shè)計推動型科技巨頭中，這些因素的關(guān)鍵性是不言而喻的，甚至因此催生了專屬職業(yè)與角色的誕生。在這六大核心維度中，有一個更是脫穎而出，以至于一個全新的職能部門因此得以形成。接下來，讓我們深入剖析這些零部件如何共同定義卓然出色的用戶體驗設(shè)計版圖及行業(yè)切入點。

在深入分析用戶體驗設(shè)計的六大核心要素之前，我們需要先厘清其核心內(nèi)涵。從本質(zhì)上看，用戶體驗設(shè)計是一門創(chuàng)造愉悅且功能強大的體驗藝術(shù)，確保產(chǎn)品既具有效性又兼具高效性、易用性和用戶滿意度。它涵蓋了一個整體性的設(shè)計循環(huán)，通過不同維度的優(yōu)化來最終實現(xiàn)這些目標(biāo)?？梢园延脩趔w驗設(shè)計比喻成一把“統(tǒng)籌性的大傘”，其下輻射的每個要素都是推動卓越體驗構(gòu)建的重要一環(huán)。本篇文章將沿著這把傘的思維體系，逐步探索這些不可或缺的構(gòu)建模塊及其影響力。

01 用戶研究

用戶研究（亦稱 UX 研究）之所以能在設(shè)計領(lǐng)域占據(jù)重要地位，其原因顯而易見——它是產(chǎn)品設(shè)計的一大核心要素。隨著其價值的日益凸顯，越來越多的企業(yè)開始設(shè)立專門的用戶研究團隊。這一趨勢背后的驅(qū)動力是什么？源于對用戶洞察的深入理解直接決定了能否創(chuàng)造出卓越的產(chǎn)品體驗。在探索方案的過程中，用戶研究永遠都是優(yōu)先級最高的起點。這個關(guān)鍵過程的核心在于定義所謂的“用戶”——通過全面梳理他們的使用體驗，挖掘其需求、期望與操作行為，從而描繪出清晰的用戶畫像。這正是用戶研究的精髓之所在。更具體地說，用戶研究是圍繞用戶的需求、目標(biāo)、行為模式以及心理動機，所展開的系統(tǒng)化調(diào)研與分析。執(zhí)行用戶研究有多種專業(yè)化方法工具，包括深入訪談、結(jié)構(gòu)化調(diào)查、現(xiàn)場可視采樣以及定性和定量化的可用性評估測試，每一步都旨在深刻理解目標(biāo)人群，優(yōu)化體驗閉環(huán)。

02 交互設(shè)計

交互設(shè)計是產(chǎn)品設(shè)計中的關(guān)鍵環(huán)節(jié)，此階段負責(zé)精細化用戶與系統(tǒng)之間的互動路徑與體驗設(shè)計。設(shè)計師需要梳理并規(guī)劃用戶操作觸發(fā)的系統(tǒng)響應(yīng)——例如按鈕點擊后的動作反饋。從提示的生成到任務(wù)處理的閉環(huán)，每一個交互流程都經(jīng)過精致打磨。對交互表現(xiàn)的設(shè)計需通過深度用戶研究與高頻次的可用性測試進行不斷優(yōu)化，以確保全流程交互體驗既順暢又高效。

03 信息架構(gòu)

我的清單中提到的第三項是信息架構(gòu)，這是在設(shè)計過程中理解內(nèi)容與功能的關(guān)鍵環(huán)節(jié)。它的核心是對內(nèi)容和功能進行科學(xué)的分類組織和標(biāo)記，以確保產(chǎn)品的功能與結(jié)構(gòu)清晰易懂，能夠有效地滿足不同用戶的認知需求?？梢园研畔⒓軜?gòu)理解為產(chǎn)品的結(jié)構(gòu)藍圖，為用戶提供在界面元素間高效切換和操作的導(dǎo)引路徑。它的價值在于將內(nèi)容與功能資源以邏輯和體系化的方式呈現(xiàn)。那么如何精準定義哪些要素歸屬于頂層導(dǎo)航、次級導(dǎo)航或細化導(dǎo)航？此時，一種名為“卡片分類法”（Card Sorting）的用戶體驗研究方法便派上了用場，它幫助設(shè)計師優(yōu)化信息層級，制定更具洞察力和用戶思維的導(dǎo)航設(shè)計決策。

*卡片分類法：卡片分類法是一種用戶體驗研究方法，用于幫助設(shè)計師理解用戶如何組織和分類信息。參與者通過將內(nèi)容項（如網(wǎng)站頁面或功能）進行排序和分組，提供了關(guān)于信息架構(gòu)的見解。其主要步驟為：首先，每張卡片上寫一個內(nèi)容項；其次，招募目標(biāo)用戶；再次，用戶根據(jù)理解將卡片分組并命名；最后，識別共同的分類方式。此方法有助于優(yōu)化網(wǎng)站和應(yīng)用的導(dǎo)航結(jié)構(gòu)，提高用戶體驗。

04 用戶界面設(shè)計

接下來重點分析用戶界面設(shè)計環(huán)節(jié)，也就是我們通常所提到的視覺設(shè)計，這是 UX 設(shè)計中至關(guān)重要的一環(huán)，主要關(guān)注產(chǎn)品的視覺展現(xiàn)層。UI 設(shè)計師的職責(zé)在于打造具有吸引力且直觀自然的視覺體驗。他們通過對色彩體系、排版字體、圖形視覺以及插畫風(fēng)格的細膩打磨，為產(chǎn)品的整體視覺編碼賦予獨特且一致的品牌形象。

05 UX 寫作（微文案）

UX 寫作，亦稱微文案，是文案寫作領(lǐng)域下的一個細分學(xué)科，聚焦于數(shù)字產(chǎn)品中的文本設(shè)計。UX 寫作者的核心職責(zé)是優(yōu)化數(shù)字界面中的文案，不僅要貼合用戶需求，還要顯著增強整體用戶體驗。他們善于運用精準而貼近用戶心智的表達方式，撰寫既通俗易懂又情感共鳴強的界面文案，從而最大化提升用戶的可讀性與互動效率。

06 可訪問性

最后，我們需要聚焦于可訪問性——這是確保所有用戶（包括有特殊需求的群體）都能高效且無障礙地使用產(chǎn)品的核心要素。作為設(shè)計從業(yè)者，共情能力是我們設(shè)計哲學(xué)的重要基石。但這種共情不僅局限于通用用戶，還要涵蓋那些需要特殊支持的用戶群體。在每一次 UI 語義和交互設(shè)計中，我們必須以可訪問性優(yōu)先，確保無論用戶的能力如何，都能獲得最佳的可讀性和充分的視覺對比體驗，真正實現(xiàn)一視同仁的包容性設(shè)計。

對九類交互狀態(tài)的深入理解和不斷創(chuàng)新，將為產(chǎn)品設(shè)計帶來更大的提升空間，為用戶帶來更加卓越的體驗，推動產(chǎn)品在競爭激烈的市場中不斷發(fā)展和進步。

一、交互狀態(tài)的重要性

交互狀態(tài)在產(chǎn)品設(shè)計中起著至關(guān)重要的作用，它直接關(guān)系到用戶體驗和產(chǎn)品的可用性。良好的交互狀態(tài)設(shè)計能夠讓用戶在使用產(chǎn)品的過程中感受到便捷、高效和愉悅，從而提高用戶對產(chǎn)品的滿意度和忠誠度。

從用戶體驗的角度來看，交互狀態(tài)可以增強用戶參與感和控制感。例如，在人機交互設(shè)計中，互動性和反饋機制能夠讓用戶覺得他們對系統(tǒng)有一定的掌控能力。當(dāng)用戶進行操作時，系統(tǒng)能夠及時給予反饋，如按鈕按下后出現(xiàn)的狀態(tài)變化、鼠標(biāo)懸停時的提示信息等，讓用戶清楚地知道他們的操作產(chǎn)生了什么效果。這種即時的反饋可以幫助用戶理解系統(tǒng)的運作邏輯，減少用戶的操作失誤，提升用戶的效率和滿意度。

在產(chǎn)品的可用性方面，交互狀態(tài)的設(shè)計也至關(guān)重要。例如，在電子產(chǎn)品設(shè)計過程中，實現(xiàn)人機交互可以為消費者提供良好的使用體驗。設(shè)計師需要考慮不同人群的需求，如設(shè)計操作簡單的老人機，以滿足老年人的使用需求。同時，將人機交互理念融入產(chǎn)品設(shè)計中，能夠提升消費者對產(chǎn)品的喜好程度，使設(shè)計出來的產(chǎn)品能夠滿足人們對電子產(chǎn)品設(shè)計的要求。

此外，交互狀態(tài)的設(shè)計還能夠影響產(chǎn)品的整體品質(zhì)。例如，在 B 端產(chǎn)品的 UI 設(shè)計中，深入了解用戶需求與場景，進行簡潔直觀的界面設(shè)計，可以提升產(chǎn)品的可用性。通過用戶研究方法，了解用戶的工作環(huán)境、使用習(xí)慣和設(shè)備網(wǎng)絡(luò)條件等，將用戶需求轉(zhuǎn)化為具體的設(shè)計元素和功能，為用戶提供更加貼合實際的使用體驗。

什么是B端產(chǎn)品經(jīng)理？和C端產(chǎn)品經(jīng)理有什么區(qū)別？

B端產(chǎn)品經(jīng)理中的B是Business，商業(yè)的意思，B端產(chǎn)品經(jīng)理首先就要理解這個職位的重要性，要設(shè)計出更適合這個項目需求的產(chǎn)品方案，B最終產(chǎn)品經(jīng)理在日常工作中...

查看詳情 >

綜上所述，交互狀態(tài)在產(chǎn)品設(shè)計中具有重要的地位，它對用戶體驗和產(chǎn)品可用性有著重大的影響。產(chǎn)品開發(fā)者和設(shè)計師應(yīng)該充分重視交互狀態(tài)的設(shè)計，以提高產(chǎn)品的競爭力，在市場中脫穎而出。

二、九類交互狀態(tài)詳解

1. 加載相關(guān)

加載類型：除了電商 APP 和計算器應(yīng)用的不同加載方式外，一些社交平臺在加載用戶動態(tài)時也會采用類似的漸進式加載。當(dāng)用戶打開社交平臺，首先會看到最近的幾條動態(tài)，隨著用戶不斷下拉刷新，更多的動態(tài)內(nèi)容逐步加載出來。這樣既保證了用戶能夠快速看到部分內(nèi)容，又不會因為一次性加載過多數(shù)據(jù)而導(dǎo)致等待時間過長。

加載狀態(tài)：在加載狀態(tài)中，不同的產(chǎn)品會有不同的表現(xiàn)形式。例如，一些在線學(xué)習(xí)平臺在加載課程視頻時，除了會有旋轉(zhuǎn)的加載動畫外，還會顯示加載進度條，讓用戶清楚地知道視頻加載的進度。如果加載成功，會有一個短暫的提示音，增強用戶的感知。而如果加載失敗，除了提示用戶檢查網(wǎng)絡(luò)連接外，還會提供一些常見問題的解決方案，如清理緩存、更換網(wǎng)絡(luò)環(huán)境等。

中斷：中斷情況在實際應(yīng)用中較為復(fù)雜。以在線辦公軟件為例，如果在編輯文檔過程中出現(xiàn)網(wǎng)絡(luò)中斷，軟件會自動保存當(dāng)前文檔的進度，以防止數(shù)據(jù)丟失。同時，會提示用戶網(wǎng)絡(luò)中斷，并嘗試重新連接。如果長時間無法連接，用戶可以選擇將文檔保存到本地，待網(wǎng)絡(luò)恢復(fù)后再進行上傳。

2. 特殊模式

深度 / 夜間模式：除了閱讀類應(yīng)用，一些視頻播放平臺也提供夜間模式。在夜晚觀看視頻時，開啟夜間模式可以降低屏幕亮度，減少對眼睛的刺激。同時，夜間模式下的界面顏色通常會更加柔和，營造出舒適的觀看氛圍。

存在沉浸模式插件：在一些在線教育平臺中，也會有類似沉浸模式的功能。當(dāng)學(xué)生進入課程學(xué)習(xí)時，平臺會自動隱藏?zé)o關(guān)的通知和廣告，讓學(xué)生專注于學(xué)習(xí)內(nèi)容。同時，學(xué)生可以通過特定的快捷鍵退出沉浸模式，方便隨時查看其他信息。

3. 操作相關(guān)

輸入：除了即時通訊軟件，一些辦公軟件在輸入方面也有很多優(yōu)化。例如，在文檔編輯軟件中，當(dāng)用戶輸入一些特定的關(guān)鍵詞時，軟件會自動彈出相關(guān)的文檔模板或格式設(shè)置選項，提高用戶的輸入效率。

點擊：在電商平臺的商品詳情頁面，點擊商品圖片通常會放大顯示，讓用戶更清楚地看到商品的細節(jié)。同時，點擊購買按鈕后，會有一個短暫的確認彈窗，讓用戶再次確認購買信息，避免誤操作。

重復(fù)點擊 / 惡意操作：在一些金融類應(yīng)用中，對于重復(fù)點擊或惡意操作的防范更加嚴格。例如，在股票交易軟件中，如果用戶連續(xù)多次提交相同的交易指令，系統(tǒng)會自動鎖定該用戶的交易功能，并提示用戶聯(lián)系客服解決問題。

4. 限制相關(guān)

極值：在旅游預(yù)訂平臺上，用戶在選擇酒店價格區(qū)間時，系統(tǒng)也會進行極值限制。價格下限通常為平臺上的最低價格，價格上限則會根據(jù)當(dāng)?shù)鼐频甑氖袌鰞r格和用戶的搜索歷史進行動態(tài)調(diào)整，確保用戶能夠得到合理的搜索結(jié)果。

邊界：在一些圖形設(shè)計軟件中，除了畫筆工具的邊界限制，其他工具也有類似的限制。例如，當(dāng)用戶使用裁剪工具時，裁剪區(qū)域不能超出畫布的范圍，否則無法進行裁剪操作。

時間：在在線考試系統(tǒng)中，時間限制尤為重要?？荚囬_始前，考生只能看到考試的相關(guān)信息和注意事項，無法進入答題頁面?？荚囬_始后，系統(tǒng)會精確計時，一旦考試時間結(jié)束，答題頁面會自動提交，無法再進行答題。

5. 網(wǎng)絡(luò)相關(guān)

網(wǎng)絡(luò)中斷：在在線游戲中，網(wǎng)絡(luò)中斷會對玩家的游戲體驗產(chǎn)生很大影響。當(dāng)網(wǎng)絡(luò)中斷時，游戲會自動暫停，并提示玩家網(wǎng)絡(luò)中斷。如果玩家在網(wǎng)絡(luò)中斷前已經(jīng)保存了游戲進度，那么在網(wǎng)絡(luò)恢復(fù)后可以繼續(xù)游戲；如果沒有保存進度，可能會丟失部分游戲數(shù)據(jù)。

信號不佳 / 不穩(wěn)定：在視頻會議軟件中，當(dāng)網(wǎng)絡(luò)信號不佳時，軟件會自動降低視頻的分辨率和幀率，同時關(guān)閉音頻中的一些高級功能，如降噪和回聲消除，以保證會議的基本溝通需求。

流量形式切換：在一些音樂播放軟件中，用戶可以根據(jù)自己的網(wǎng)絡(luò)環(huán)境手動切換流量形式。例如，在 Wi-Fi 環(huán)境下，用戶可以選擇自動播放高清音樂視頻；而在移動數(shù)據(jù)環(huán)境下，用戶可以選擇只播放音頻，以節(jié)省流量。

6. 內(nèi)容相關(guān)

沒有內(nèi)容：在在線文檔協(xié)作平臺中，如果一個文檔沒有內(nèi)容，系統(tǒng)會提示用戶 “此文檔為空，請?zhí)砑觾?nèi)容”，并提供一些常用的文檔模板供用戶選擇，方便用戶快速創(chuàng)建內(nèi)容。

敏感 / 違規(guī)內(nèi)容：在電商平臺上，對于商品描述中的敏感或違規(guī)內(nèi)容，系統(tǒng)會進行嚴格的審核。如果發(fā)現(xiàn)違規(guī)內(nèi)容，商品會被下架，并通知賣家進行整改。同時，平臺會對賣家進行警告，嚴重的可能會關(guān)閉賣家的店鋪。

7. 站外內(nèi)容相關(guān)

站外內(nèi)容：在一些知識分享平臺中，當(dāng)用戶點擊站外鏈接時，平臺會提示用戶 “該鏈接為站外內(nèi)容，請注意安全”，并提供一個返回平臺的快捷按鈕，方便用戶隨時返回。同時，平臺會對站外鏈接進行安全檢測，確保鏈接的合法性和安全性。

8. 設(shè)備相關(guān)

橫豎屏：在一些圖片編輯軟件中，橫豎屏切換會影響用戶的操作體驗。當(dāng)用戶將手機從豎屏切換到橫屏?xí)r，軟件會自動調(diào)整界面布局，將工具菜單和編輯區(qū)域分別放置在屏幕的兩側(cè)，方便用戶進行操作。而當(dāng)用戶將手機從橫屏切換回豎屏?xí)r，軟件會恢復(fù)到原來的布局。

分辨率：在一些游戲開發(fā)中，開發(fā)者會根據(jù)不同設(shè)備的分辨率進行優(yōu)化。例如，在高分辨率的設(shè)備上，游戲畫面會更加細膩，特效也會更加豐富；而在低分辨率的設(shè)備上，游戲會自動降低畫質(zhì)，以保證游戲的流暢運行。

清晰度：在一些在線視頻教育平臺中，清晰度的選擇會影響用戶的學(xué)習(xí)體驗。在網(wǎng)絡(luò)條件好的情況下，用戶可以選擇高清或超清的視頻清晰度，以便更清楚地看到教學(xué)內(nèi)容；而在網(wǎng)絡(luò)條件差的情況下，用戶可以選擇標(biāo)清或流暢的清晰度，以保證視頻的播放流暢度。

不同版本：在一些軟件的不同版本中，功能和界面會有所不同。例如，在一款繪圖軟件的專業(yè)版中，會提供更多的高級功能和工具，而在免費版中，功能會相對較少。同時，軟件會在界面上明確標(biāo)識出不同版本的特點和優(yōu)勢，方便用戶根據(jù)自己的需求進行選擇。

硬件調(diào)用：在一些智能家居控制軟件中，當(dāng)用戶需要調(diào)用攝像頭進行監(jiān)控時，軟件會彈出請求授權(quán)的提示框。在獲得用戶授權(quán)后，軟件會提供實時監(jiān)控畫面，并支持遠程控制攝像頭的角度和焦距。

硬件聯(lián)動：在一些智能辦公場景中，硬件聯(lián)動可以提高工作效率。例如，當(dāng)用戶在會議室中使用智能投影儀時，投影儀可以與會議室的燈光和音響系統(tǒng)聯(lián)動，根據(jù)投影內(nèi)容自動調(diào)整燈光亮度和音響音量。

9. 角色相關(guān)

未登錄 / 已登錄：在一些在線教育平臺上，未登錄用戶只能瀏覽部分公開的課程內(nèi)容，無法進行課程報名和學(xué)習(xí)進度跟蹤。而已登錄用戶可以享受更多的服務(wù)，如個性化課程推薦、學(xué)習(xí)記錄保存等。

新用戶 / 老用戶：對于新用戶，一些在線購物平臺會提供新人專享優(yōu)惠券和折扣，幫助新用戶快速熟悉平臺的購物流程。對于老用戶，平臺會根據(jù)他們的購買歷史和瀏覽記錄，為他們推薦個性化的商品和促銷活動。

游客賬號：在一些在線音樂平臺中，游客賬號可以讓用戶試聽部分歌曲，但無法下載和收藏歌曲。當(dāng)游客想要享受更多功能時，可以通過注冊賬號成為正式用戶。

普通 / 會員賬號：以在線閱讀平臺為例，會員用戶可以享受無廣告閱讀、優(yōu)先閱讀新書等特權(quán)。同時，平臺會在會員專屬內(nèi)容上進行明顯標(biāo)識，吸引普通用戶升級為會員。

內(nèi)網(wǎng) / 外網(wǎng)賬號：在一些企業(yè)內(nèi)部的項目管理軟件中，內(nèi)網(wǎng)賬號可以訪問企業(yè)內(nèi)部的項目信息和文件，外網(wǎng)賬號則只能查看一些公開的項目進度和報告。在設(shè)計這種賬號體系時，軟件會明確區(qū)分內(nèi)網(wǎng)和外網(wǎng)賬號的權(quán)限，確保企業(yè)信息的安全。

管理員賬號：在一些社區(qū)論壇中，管理員賬號可以對用戶的發(fā)言進行審核和管理，維護社區(qū)的秩序。同時，管理員賬號還可以進行系統(tǒng)設(shè)置和插件管理，提升論壇的功能和性能。

三、總結(jié)與展望

通過對九類交互狀態(tài)的深入分析，我們可以清楚地看到交互狀態(tài)在產(chǎn)品設(shè)計中的重要性。無論是加載相關(guān)、特殊模式，還是操作相關(guān)、限制相關(guān)等各個方面，交互狀態(tài)都直接影響著用戶對產(chǎn)品的使用體驗和滿意度。

例如，在加載相關(guān)方面，合理的加載類型和狀態(tài)顯示能夠減少用戶的等待焦慮，中斷處理機制則能在意外情況下最大程度地保護用戶數(shù)據(jù)和操作進度。在特殊模式中，深度 / 夜間模式和沉浸模式插件為用戶提供了更加舒適和專注的使用環(huán)境。操作相關(guān)的輸入、點擊和防范重復(fù)點擊 / 惡意操作等設(shè)計，確保了用戶操作的準確性和安全性。限制相關(guān)的極值、邊界和時間限制，使得產(chǎn)品的使用更加規(guī)范和合理。網(wǎng)絡(luò)相關(guān)的處理能夠在不同網(wǎng)絡(luò)狀況下為用戶提供盡可能好的體驗。內(nèi)容相關(guān)的處理確保了用戶在面對不同內(nèi)容情況時都能得到恰當(dāng)?shù)囊龑?dǎo)和提示。站外內(nèi)容相關(guān)的設(shè)計保障了用戶在訪問外部鏈接時的安全。設(shè)備相關(guān)的橫豎屏、分辨率、清晰度、不同版本、硬件調(diào)用和聯(lián)動等設(shè)計，適應(yīng)了不同設(shè)備和用戶需求。角色相關(guān)的不同狀態(tài)設(shè)計，為不同類型的用戶提供了個性化的服務(wù)和體驗。

展望未來，隨著科技的不斷進步，交互狀態(tài)的設(shè)計也將不斷發(fā)展和創(chuàng)新。一方面，人工智能、大數(shù)據(jù)等技術(shù)的應(yīng)用將使交互狀態(tài)更加智能化和個性化。例如，通過分析用戶的使用習(xí)慣和偏好，自動調(diào)整加載策略、推薦適合的操作模式等。另一方面，虛擬現(xiàn)實、增強現(xiàn)實等新興技術(shù)的發(fā)展將為交互狀態(tài)帶來全新的體驗。例如，在虛擬現(xiàn)實環(huán)境中的交互狀態(tài)設(shè)計將更加注重沉浸感和自然交互。同時，隨著物聯(lián)網(wǎng)的發(fā)展，硬件之間的聯(lián)動將更加緊密和智能，為用戶提供更加便捷和高效的服務(wù)。

在交互設(shè)計的范疇里，對用戶的深入研究能夠為設(shè)計師提供關(guān)鍵的解決問題的參考依據(jù)。本文旨在運用一些成熟的方法，助力新人設(shè)計師更深入地理解用戶，拓寬認知視野，進而創(chuàng)造出更多具有價值的設(shè)計。

在設(shè)計的廣袤領(lǐng)域中，對于眾多初入行業(yè)的設(shè)計新人來說，設(shè)計工作常常被誤解為純粹主觀且感性的行為。

他們往往認為個人對美觀的評判即是設(shè)計的全部要義，似乎用戶理應(yīng)沉浸于設(shè)計師所營造的美感之中。然而，設(shè)計的本質(zhì)遠非如此表面。

實際上，設(shè)計是一項通過精心設(shè)想和精確計算來創(chuàng)造價值的工作，其真正的意義聚焦于是否具有價值以及能否切實解決特定的問題。

一、錯誤判斷背后的深度思考

首先，讓我們從一道看似簡單的題目開始：

一雙球鞋和一個籃球共計 1100 元，球鞋比籃球貴 1000 元，那么這個籃球究竟值多少錢？

許多人可能會在瞬間給出 100 元的答案，但經(jīng)過仔細斟酌后會發(fā)現(xiàn)正確答案其實是 50 元。

這種錯誤判斷的根源在于大多數(shù)人所具有的兩種思考模式，即快思考和慢思考。它們也被稱為“無意識思維和有意識受控思維”“感性和理性”等不同的表述方式。

每個人都同時擁有這兩種思考方式，然而通常情況下，慢思考會在接收快思考的估計和決策之后才開始啟動。人類在漫長的生存歷程中，不斷地處理著各種各樣的問題，有復(fù)雜的難題，也有相對簡單的情況?？焖伎际菍Ρ姸嗍虑榻o出下意識的回應(yīng)，是一種未經(jīng)充分大腦思考的快速處理方式，其主要目的在于降低大腦的能量消耗。人類作為一種善于尋找規(guī)律的生物，快思考往往在以往的經(jīng)驗中迅速找尋答案。只有當(dāng)問題獲得反饋或者進入需要慢思考的情境時，人們才會察覺快思考中存在的疏漏。例如，我們時常會在未經(jīng)深思熟慮的情況下，脫口而出對某些問題的回答，這正是快思考在發(fā)揮作用。

二、剖析用戶的感性與理性

正如前文所述，大多數(shù)人同時具備快思考和慢思考兩種模式，所以在未經(jīng)特殊訓(xùn)練的情況下，大多數(shù)用戶也同樣兼具感性和理性。在大多數(shù)情形下，用戶帶著感性的心態(tài)而來，只有當(dāng)遭遇問題或者涉及自身切實利益時，才會啟動慢思考，從而變得理性。對于商業(yè)領(lǐng)域而言，更傾向于快思考的用戶。

一款產(chǎn)品無到有，產(chǎn)品經(jīng)理需要做些什么？

在一個產(chǎn)品從無到有的過程中，要做好產(chǎn)品經(jīng)理這個角色實在是不容易，除了大家都知道的寫需求、寫需求、寫需求，要做的事多著呢。產(chǎn)品經(jīng)理不是你眼中的只會找你麻煩，提要求..

查看詳情 >

因為快思考會帶來感性和沖動，促使用戶迅速做出決策。這也正是為什么許多銷售人員熱衷于趁熱打鐵，讓用戶在快思考的狀態(tài)下被感性和沖動所支配，進而快速完成交易。在各類電商以及活動類的運營活動中，精心營造氛圍的目的就是期望用戶在快思考的時候就完成決策，避免用戶進入慢思考狀態(tài)后因猶豫不決而影響決策的達成。

三、讓用戶持續(xù)保持感性的深度策略

在交互設(shè)計中，有以下更為深入的常見做法可以讓用戶持續(xù)保持感性：

1、顯著地標(biāo)識狀態(tài)與當(dāng)前進度：

不僅僅是簡單地顯示狀態(tài)和進度，更要通過巧妙的設(shè)計讓用戶在第一時間就能直觀地理解其含義。例如，使用動態(tài)的進度條，配合清晰的數(shù)字顯示和簡潔的文字說明，讓用戶不僅知道自己所處的位置，還能預(yù)估完成任務(wù)所需的時間。同時，根據(jù)不同的進度階段，采用不同的顏色或圖標(biāo)進行區(qū)分，增強用戶的視覺感知和心理預(yù)期。

在游戲設(shè)計中，常見的經(jīng)驗條就是一個很好的例子。玩家可以通過經(jīng)驗條的變化，清晰地了解自己距離升級還有多遠，這種明確的進度展示能夠激發(fā)玩家繼續(xù)努力的動力，保持他們在游戲中的投入感。

2、引導(dǎo)用戶完成他們的目標(biāo)：

引導(dǎo)不僅僅是提供方向，更要深入理解用戶的心理需求和行為模式，以更加個性化的方式引導(dǎo)用戶。通過分析用戶的歷史行為數(shù)據(jù)和偏好，為用戶量身定制引導(dǎo)路徑。例如，在在線學(xué)習(xí)平臺上，根據(jù)用戶的學(xué)習(xí)進度和能力水平，為其推薦適合的課程和學(xué)習(xí)資源，引導(dǎo)用戶逐步實現(xiàn)學(xué)習(xí)目標(biāo)。

利用智能助手或虛擬角色進行引導(dǎo)，增加互動性和趣味性。例如，一些購物 APP 中的虛擬導(dǎo)購員，可以根據(jù)用戶的瀏覽記錄和購買意向，為用戶提供個性化的購物建議和推薦商品，讓用戶在購物過程中感受到貼心的服務(wù)和引導(dǎo)。

3、明確無誤地告知用戶想了解的信息：

信息的傳達要做到準確、簡潔、全面。除了基本的產(chǎn)品特點、功能和價格等信息外，還應(yīng)提供用戶可能關(guān)心的其他細節(jié)。例如，在電子產(chǎn)品的介紹頁面，除了列出產(chǎn)品的技術(shù)參數(shù)外，還可以提供使用教程、常見問題解答、用戶評價等內(nèi)容，讓用戶能夠全面了解產(chǎn)品，做出更明智的決策。

采用多種信息傳達方式，滿足不同用戶的需求。例如，對于視覺型用戶，可以提供圖片、視頻等直觀的信息展示；對于聽覺型用戶，可以提供語音介紹；對于閱讀型用戶，可以提供詳細的文字說明。同時，利用信息分層和漸進式披露的方式，讓用戶可以根據(jù)自己的需求逐步獲取更深入的信息。

4、不要讓用戶去診斷問題：

系統(tǒng)應(yīng)具備強大的自我診斷和故障排除能力，在問題出現(xiàn)的第一時間自動檢測并提供解決方案。例如，當(dāng)軟件出現(xiàn)故障時，系統(tǒng)可以自動彈出錯誤提示窗口，同時提供可能的解決方案，如重新啟動軟件、檢查網(wǎng)絡(luò)連接等。用戶只需按照提示進行操作，無需自己去尋找問題所在。

建立完善的用戶反饋機制，及時收集用戶遇到的問題，并進行快速響應(yīng)和解決。例如，在 APP 中設(shè)置反饋入口，用戶可以隨時提交問題和建議，開發(fā)團隊可以及時跟進處理，并將處理結(jié)果反饋給用戶，增強用戶的信任感和滿意度。

5、盡量減少設(shè)置的數(shù)量和復(fù)雜度：

進行深入的用戶需求分析，去除不必要的設(shè)置選項，簡化操作流程。例如，在智能家居設(shè)備的設(shè)置中，通過智能化的默認設(shè)置和自動配置功能，減少用戶的手動操作。同時，對于一些復(fù)雜的設(shè)置，可以采用逐步引導(dǎo)的方式，讓用戶在需要的時候再進行深入設(shè)置。

采用可視化的設(shè)置界面，讓用戶能夠直觀地了解設(shè)置選項的作用和效果。例如，在圖像編輯軟件中，通過實時預(yù)覽功能，讓用戶可以在調(diào)整設(shè)置參數(shù)的同時看到效果的變化，從而更加方便地進行設(shè)置。

6、讓用戶感覺而不是去計算：

設(shè)計要注重用戶的直覺和感受，通過巧妙的視覺設(shè)計、交互反饋和情感化元素，讓用戶在無需進行復(fù)雜計算的情況下就能做出決策。例如，在酒店預(yù)訂網(wǎng)站上，通過展示酒店的圖片、評價和星級等信息，讓用戶能夠直觀地感受酒店的品質(zhì)和舒適度，從而更容易做出選擇。

利用大數(shù)據(jù)和人工智能技術(shù)，為用戶提供個性化的推薦和決策支持。例如，音樂播放 APP 根據(jù)用戶的聽歌歷史和偏好，為用戶推薦符合其口味的音樂，讓用戶無需花費時間去搜索和篩選。

7、讓描述更貼近用戶：

深入了解用戶的語言習(xí)慣和文化背景，使用用戶熟悉的詞匯和表達方式進行描述。例如，在面向年輕人的產(chǎn)品中，可以采用流行的網(wǎng)絡(luò)語言和表達方式，增強用戶的認同感和親近感。在面向不同地區(qū)的用戶時，要考慮到當(dāng)?shù)氐奈幕町?，采用合適的語言和表達方式。

進行用戶測試和反饋收集，不斷優(yōu)化描述內(nèi)容。邀請用戶對產(chǎn)品的描述進行評價和建議，根據(jù)用戶的反饋進行調(diào)整和優(yōu)化，確保描述內(nèi)容能夠準確傳達產(chǎn)品的特點和優(yōu)勢，同時符合用戶的需求和期望。

8、在需要計算的內(nèi)容提前幫用戶計算好：

利用自動化計算和智能算法，為用戶提供準確、及時的計算結(jié)果。例如，在理財 APP 中，自動計算用戶的收益和風(fēng)險，為用戶提供投資建議。在購物網(wǎng)站上，自動計算商品的總價、優(yōu)惠金額和運費等信息，讓用戶清楚知道自己需要支付的費用。

提供多種計算方式和比較工具，讓用戶可以根據(jù)自己的需求進行選擇。例如，在房貸計算器中，提供等額本金和等額本息兩種還款方式的計算結(jié)果，讓用戶可以比較不同還款方式的優(yōu)缺點，做出更合適的選擇。

9、用情感帶給用戶細微的感受：

通過情感化設(shè)計，觸動用戶的內(nèi)心深處，建立與用戶的情感連接。例如，在社交 APP 中，通過溫馨的提示和問候，讓用戶感受到關(guān)懷和溫暖。在紀念日或特殊節(jié)日，為用戶送上個性化的祝福和禮物，增強用戶的忠誠度。

利用故事和場景化設(shè)計，讓用戶在使用產(chǎn)品的過程中產(chǎn)生情感共鳴。例如，在旅游 APP 中，通過展示美麗的風(fēng)景圖片和用戶的旅行故事，激發(fā)用戶的旅行欲望。在產(chǎn)品介紹中，以故事的形式講述產(chǎn)品的誕生和發(fā)展歷程，讓用戶更加了解產(chǎn)品的背后故事，增強用戶的認同感。

四、設(shè)計的價值與目的之深度探討

許多新人設(shè)計師在初期往往喜歡站在個人和美學(xué)的角度來看待自己的設(shè)計。然而，隨著設(shè)計經(jīng)驗的不斷積累和對行業(yè)的深入理解，他們會逐漸認識到有價值、能解決問題才是人類發(fā)展的核心目的。在市場上存在眾多同類型產(chǎn)品都具有價值、能解決問題的情況下，才需要通過設(shè)計出不同的差異點來脫穎而出。但始終要牢記的前提是設(shè)計必須具有價值、能解決問題，一旦拋棄了這個大前提，任何設(shè)計都會顯得空洞、索然無味。

設(shè)計與藝術(shù)雖然有一定的關(guān)聯(lián)，但它們并不是一回事。設(shè)計更注重實用性和功能性，以滿足用戶的需求和解決實際問題為主要目標(biāo)。而藝術(shù)則更強調(diào)審美價值和自我表達，追求的是情感的共鳴和創(chuàng)造力的展現(xiàn)。設(shè)計師需要在設(shè)計過程中平衡好實用性和美觀性，既要確保設(shè)計能夠解決問題，又要讓設(shè)計具有一定的審美價值，從而提升用戶的體驗和滿意度。

總之，交互設(shè)計要深入理解用戶的思維方式，通過更為深入和有效的方法讓用戶持續(xù)保持感性，從而提高用戶的滿意度和忠誠度。同時，設(shè)計師要時刻牢記設(shè)計的價值和目的，不斷創(chuàng)造有價值、能解決問題的設(shè)計作品，為人類的發(fā)展和進步做出貢獻。

以上觀點僅代表個人看法，如有不對之處，歡迎在評論區(qū)指正交流。謝謝！

多數(shù)產(chǎn)品經(jīng)理總是認為很專業(yè)，總會有一些異想天開的想法；殊不知我們不少自以為是的“優(yōu)秀”設(shè)計，并不符合用戶使用場景，還可能摧毀用戶價值。就像本文列舉的這幾個案例，你有注意到嗎？

產(chǎn)品經(jīng)理的專業(yè)視角與用戶視角，如同孿生兄弟，外表相似但內(nèi)在迥異。

有時我們說誰的產(chǎn)品專業(yè)能力過硬，可能是一句褒獎的話。但專業(yè)能力若不能融合專家視角與用戶視角，便可能被視為局限而非優(yōu)點。

張小龍說自己可以很快變小白，而馬化騰卻可以“一秒變小白”。

所謂“一秒變小白”是指快速從專業(yè)視角切換到用戶視角，確保在設(shè)計產(chǎn)品和評估用戶價值時，避免陷入專家思維，無意中損害用戶價值。

一、那些“優(yōu)秀”的設(shè)計，正在摧毀你上廁所的體驗

兩年前，我?guī)е鴰讉€“朋友”坐飛機回云南老家，到達長水機場后，準備去上廁所。其中一位女性朋友，徑直走進男廁所，直至上完廁所出來后，我們提醒她才“恍然大悟”——進錯了廁所。

究其原因就在于一個“設(shè)計”：女廁所圖標(biāo)設(shè)計不明確，導(dǎo)致誤解。

目前在機場、商場（尤其是高級商場）、寫字樓等場所，設(shè)計者都采取一種精簡設(shè)計方案，他們追求簡潔的設(shè)計感。即只有一個非常簡潔的圖標(biāo)，有的是男和女的人物圖標(biāo)，有的是煙斗和高跟鞋等?？傊?，不會有任何一個漢字（或英文）描述。

好像一旦圖標(biāo)旁寫上“男廁”、“女廁”后，它們就變成了一種“土”、“low”的設(shè)計方案。

同一個空間內(nèi)，不僅僅是廁所圖標(biāo)，還有扶梯、直梯、貨梯、嬰幼兒室、母嬰室等各類圖標(biāo)，甚至有時它們會同時出現(xiàn)在一個引導(dǎo)牌，讓你真正玩一把“猜猜猜”的圖像游戲。

什么是B端產(chǎn)品經(jīng)理？和C端產(chǎn)品經(jīng)理有什么區(qū)別？

B端產(chǎn)品經(jīng)理中的B是Business，商業(yè)的意思，B端產(chǎn)品經(jīng)理首先就要理解這個職位的重要性，要設(shè)計出更適合這個項目需求的產(chǎn)品方案，B最終產(chǎn)品經(jīng)理在日常工作中...

查看詳情 >

結(jié)果是：你無法快速找到圖標(biāo)；找到后，你需要仔細辨認以及“揣摩”圖標(biāo)的含義，避免走錯；直至你走錯后，才能“吃一塹，長一智”。

同時，某些商場或?qū)懽謽堑南词峙_，為了追求設(shè)計感以及合理利用空間，把洗手液跟紙抽“融入”到鏡面里，表面看確實簡潔，是一種優(yōu)秀設(shè)計方案。

但當(dāng)你伸手接洗手液洗手時，卻無法精準對接，需要反復(fù)嘗試2-3次。沒接到的洗手液，自然流就流落到洗手臺之上。

結(jié)果是：用戶體驗差，浪費洗手液，增加清潔成本。

保潔阿姨發(fā)現(xiàn)這個問題后，最后的解決方案就是：在洗手臺旁邊，直接放了一個自助式的洗手液。至此，那個“優(yōu)秀”的設(shè)計方案，從此成為了擺設(shè)。

你自以為的優(yōu)秀設(shè)計，往往卻摧毀了用戶的價值。它肯定不是你的初心，而是你的專業(yè)視角所致，卻忽略了用戶視角（尤其是小白用戶視角）。

二、那些“優(yōu)秀”設(shè)計，正在讓用戶“不明所以”，甚至“不知所措”

如下圖所示，用戶對發(fā)放工資條時，選擇方案的設(shè)計進行了“吐槽”。一般默認勾選時，顯示一個多選框，勾選即選中，反之不選，而設(shè)計升級后，期望讓選中效果更明顯，去掉勾選框，點擊列表選中，再次點擊取消。

結(jié)果是：用戶不知道如何勾選，“優(yōu)秀”設(shè)計摧毀了用戶體驗。

我們再看一個例子。

如下圖所示，它們都是新建班次的設(shè)置頁面，核心是約定員工的上下班時間跟打卡范圍，但它們代表兩種不同的設(shè)計風(fēng)格。

方案1采用平鋪直敘的用戶語言風(fēng)格，以對話感設(shè)計頁面元素，旨在增強用戶互動體驗，但可能導(dǎo)致信息顯示冗余。比如最早可提前x分鐘打卡，晚于x分鐘打卡記為遲到；

方案2采用簡潔設(shè)計，避免冗余文字，以簡潔頁面提升視覺效果，但可能增加用戶理解和使用難度（就像廁所圖標(biāo)的設(shè)計一樣）。比如上班卡當(dāng)天5:00-當(dāng)天12:00，用戶自行設(shè)置取卡范圍。

三、如何避免讓“優(yōu)秀”設(shè)計無意損害用戶價值？

第一，認知層面。產(chǎn)品經(jīng)理的專業(yè)能力體現(xiàn)在創(chuàng)造用戶價值和商業(yè)價值，而非局限于單一專業(yè)領(lǐng)域。這種能力需同時滿足專業(yè)人士和小白用戶的需求，否則不能稱之為真正的專業(yè)能力。

第二，設(shè)計語言。采用用戶語言/自然語言作為設(shè)計語言，而不是設(shè)計師或產(chǎn)品經(jīng)理的“專業(yè)”語言。比如晚于30分鐘打卡記為遲到，就好于“豁免30分鐘”；最早可提前120分鐘打卡，最晚可延后120分鐘打卡，就好于“上班卡范圍：當(dāng)天6:00-10:00”。

第三，設(shè)計“潛規(guī)則”。遵循行業(yè)“潛規(guī)則”設(shè)計，避免過度自我創(chuàng)造（或創(chuàng)新），導(dǎo)致傷害了用戶價值。比如單選、多選、開關(guān)等設(shè)計要素，遵循成熟的設(shè)計方式，而不是非要“獨樹一幟”。

四、彩蛋：如何解決家長帶異性子女上廁所？

我們在商場、機場等，比較常見的解決方案是：提供一個間親子衛(wèi)生間。

哈爾濱江北商場提供了一種創(chuàng)新的解決方案。即：在正常男女廁所旁邊，新建了一個開放式的兒童廁所，配備了男孩和女孩專用的小便池及兒童洗手臺。

既解決了家長帶異性子女上廁所的難題，也方便了兒童獨立使用，體現(xiàn)了對兒童和家長需求的細致考慮，這是真正用戶視角下的產(chǎn)品設(shè)計。

在當(dāng)今數(shù)字化時代，交互設(shè)計不僅是產(chǎn)品成功的關(guān)鍵因素之一，更是連接用戶與產(chǎn)品之間的橋梁。交互設(shè)計的原則和方法雖然眾多，但本文將聚焦于產(chǎn)品交互設(shè)計的內(nèi)在邏輯和基本原理，探討什么樣的設(shè)計才是優(yōu)秀的，如何衡量其效果。

首先，我們需要明確“產(chǎn)品交互設(shè)計”的定義。產(chǎn)品交互設(shè)計是為了達成特定產(chǎn)品目標(biāo)而進行的用戶與產(chǎn)品之間的交互流程設(shè)計和反饋設(shè)計。換句話說，它不僅關(guān)注用戶如何使用產(chǎn)品，還關(guān)注產(chǎn)品如何有效地反饋給用戶。值得注意的是，產(chǎn)品交互設(shè)計是圍繞產(chǎn)品目標(biāo)展開的，而非單純圍繞用戶展開，用戶在這一過程中只是間接的服務(wù)對象。

這種思維方式可能與許多人的初始認知有所不同。以宜家家居為例，作為一家大型購物中心，宜家并不希望用戶能迅速找到想要的產(chǎn)品，而是希望用戶能在其店內(nèi)多做體驗。盡管這種迂回而漫長的購物路徑可能讓人感到煩惱，但用戶卻很少對此抱怨。這正是成功的產(chǎn)品交互設(shè)計的體現(xiàn)：雖然交互流程可能令人困擾，但良好的交互反饋（如各類家具的試用體驗）卻能讓用戶感到滿意。

一、用戶體驗流程設(shè)計

產(chǎn)品交互設(shè)計的核心在于用戶體驗流程的設(shè)計。這一理念強調(diào)，交互設(shè)計并非簡單的按鈕、彈窗或功能的堆砌，而是為了實現(xiàn)產(chǎn)品目標(biāo)而有意設(shè)計的用戶與產(chǎn)品的互動流程。在這個過程中，每一個交互環(huán)節(jié)都旨在滿足用戶需求，同時實現(xiàn)產(chǎn)品的獲益目標(biāo)。這種獲益不一定是金錢上的，可能還包括用戶的關(guān)注度和忠誠度。

尼爾森可用性原則專業(yè)描述：

尼爾森可用性原則由人機交互學(xué)博士Jakob Nielsen提出，包括狀態(tài)可見性原則、貼近用戶真實環(huán)境原則、自由控制原則、一致性和標(biāo)準化原則、防錯原則等。這些原則提供了一套評估用戶體驗好壞的標(biāo)準，幫助設(shè)計師和產(chǎn)品經(jīng)理進行自查和優(yōu)化

理論支撐：

用戶體驗地圖是一種以用戶為中心的可視化工具，用于描述和展示用戶在使用產(chǎn)品、服務(wù)或系統(tǒng)的過程中的整體體驗和情感變化。它通過講故事的方式，描述用戶參與服務(wù)過程中的體驗變化，并通過可視化的方式將信息予以呈現(xiàn)。用戶體驗地圖關(guān)注用戶的行為接觸點、情緒曲線、痛點和機會點，幫助團隊更好地理解用戶需求，從而優(yōu)化產(chǎn)品設(shè)計

案例分析：

Netflix：Netflix通過用戶體驗地圖分析用戶觀看習(xí)慣，發(fā)現(xiàn)用戶在選擇觀看內(nèi)容時往往會感到選擇困難。為此，Netflix優(yōu)化了推薦算法，提供個性化的內(nèi)容推薦，顯著提升了用戶的觀看體驗和滿意度。

二、與用戶相互理解

交互設(shè)計的成功在于與用戶的有效溝通。正如俞軍所說，“產(chǎn)品經(jīng)理就是以產(chǎn)品當(dāng)筆，與世界對話”。在設(shè)計過程中，理解用戶的需求和情感是至關(guān)重要的。

理解用戶的方法：

1. 角色扮演：設(shè)計師假裝自己是用戶，真實體驗產(chǎn)品的使用流程，以此理解用戶的真實想法和需求。
2. 用戶訪談：通過與真實用戶的對話，了解他們使用同類產(chǎn)品的目的、想法和感受，識別最需要優(yōu)化的環(huán)節(jié)。
3. 特征抽取：分析目標(biāo)用戶的特征（如年齡、性別、心理特征等），從中推導(dǎo)出用戶的體驗需求。
4. 數(shù)據(jù)分析：利用數(shù)據(jù)分析工具，識別用戶在使用過程中的行為模式，幫助設(shè)計師更好地理解用戶需求。

KANO模型：由東京理工大學(xué)教授狩野紀昭（Noriaki Kano）發(fā)明，是一種對用戶需求進行分類和優(yōu)先排序的方法論。它將用戶需求分為基本型需求、期望型需求和興奮型需求，幫助企業(yè)識別不同層次的用戶需求，從而優(yōu)化產(chǎn)品功能。

馬斯洛需求層次理論專業(yè)描述： 馬斯洛需求層次理論由心理學(xué)家亞伯拉罕·馬斯洛提出，將人類的需求劃分為五個主要層次，從最基本的生理需求到最高層次的自我實現(xiàn)需求逐級遞增。理解這些層次的需求有助于揭示人們行為的驅(qū)動力及其生活的主要動機。

案例分析：

Dropbox：在早期，Dropbox通過用戶訪談和數(shù)據(jù)分析了解用戶對文件共享的需求，發(fā)現(xiàn)用戶希望能夠輕松分享文件而不必擔(dān)心復(fù)雜的設(shè)置?；谶@些反饋，Dropbox簡化了分享流程，使得用戶可以一鍵分享文件，極大提升了用戶體驗。

三、讓用戶理解我們的設(shè)計

設(shè)計的最終目標(biāo)是讓用戶理解我們的意圖。如果用戶無法理解設(shè)計表達，那么所有的努力都將付諸東流。為了實現(xiàn)這一目標(biāo)，我們需要遵循以下原則：

1. 按照用戶的思維習(xí)慣設(shè)計：設(shè)計應(yīng)符合用戶的思維邏輯。例如，用戶在使用某些功能時，往往會根據(jù)自己的經(jīng)驗進行操作，設(shè)計應(yīng)當(dāng)順應(yīng)這種習(xí)慣。
2. 使用用戶的習(xí)慣性語言：設(shè)計中使用用戶熟悉的術(shù)語和表達方式，以降低理解成本。例如，針對不同文化背景的用戶，設(shè)計語言和符號應(yīng)有所不同。
3. **提供足夠的提示**：在設(shè)計中加入必要的提示和指導(dǎo)，幫助用戶理解如何使用產(chǎn)品。例如，在注冊界面中，確保用戶能夠清晰地看到同意《用戶協(xié)議》的選項。

案例分析：

Slack：Slack在設(shè)計其用戶界面時，充分考慮了用戶的習(xí)慣性語言和操作邏輯，使用了直觀的圖標(biāo)和清晰的提示，幫助用戶快速上手。用戶在使用Slack時，能夠輕松找到所需功能，極大提升了用戶的滿意度。

四、讓用戶感覺越簡單越好

簡潔性是交互設(shè)計的重要原則，但這并不意味著界面內(nèi)容越少越好，而是要讓用戶在使用過程中感到輕松和自然。簡潔的設(shè)計應(yīng)當(dāng)幫助用戶快速實現(xiàn)目標(biāo)，而不是讓他們感到困惑。

實現(xiàn)簡潔性的策略：

1. 提供捷徑：例如，在電商平臺上，允許用戶直接下單而不必經(jīng)過購物車，減少不必要的步驟。
2. 減少深層思考：設(shè)計應(yīng)避免復(fù)雜的設(shè)置，讓用戶能夠快速上手。例如，工具類產(chǎn)品應(yīng)盡量簡化操作流程，讓用戶能夠迅速完成任務(wù)。

理論支撐：

諾曼的交互設(shè)計基本原則：諾曼提出的示能、意符、映射、反饋和概念模型等原則，為設(shè)計師提供了清晰的指導(dǎo)，幫助他們創(chuàng)造出用戶友好的設(shè)計。

案例分析：

蘋果公司：蘋果在其產(chǎn)品設(shè)計中始終堅持簡潔性原則，通過直觀的界面和簡單的操作流程，使用戶能夠輕松上手。無論是iPhone的操作系統(tǒng)，還是Mac的桌面環(huán)境，用戶都能快速找到所需功能，享受流暢的使用體驗。

五、讓用戶最終感到滿意

用戶體驗的“峰-終”值原理表明，用戶的整體滿意度并不取決于每個環(huán)節(jié)的完美，而是關(guān)鍵時刻的滿意度。因此，設(shè)計師應(yīng)關(guān)注用戶在使用過程中的高峰體驗和結(jié)束體驗。

實現(xiàn)用戶滿意度的策略：

1. 控制體驗差的設(shè)計：確保所有體驗不超過用戶的預(yù)期底線，避免給用戶帶來負面體驗。
2. 超越用戶的預(yù)期：在產(chǎn)品的優(yōu)勢和亮點方面，努力超越用戶的期望，提供驚喜。
3. 優(yōu)化離開觸點：確保用戶在離開產(chǎn)品時感到滿意，即使在使用過程中有些環(huán)節(jié)不盡如人意。

案例分析：

Zappos：Zappos以其卓越的客戶服務(wù)而聞名，尤其是在處理退貨和客戶投訴時。他們確保用戶在購買后無論遇到什么問題，都能得到及時和滿意的解決，從而提升了用戶的整體滿意度。

總結(jié)

綜上所述，產(chǎn)品交互設(shè)計的基本原則在于將設(shè)計視為一個整體流程，深入理解用戶，確保設(shè)計能夠被用戶理解，并讓用戶感到簡單和愉悅。最終，設(shè)計的成功與否應(yīng)通過是否幫助實現(xiàn)產(chǎn)品目標(biāo)來衡量。通過不斷迭代和優(yōu)化，我們可以創(chuàng)造出既滿足用戶需求又推動產(chǎn)品發(fā)展的優(yōu)秀交互設(shè)計。設(shè)計師在這一過程中，應(yīng)始終保持對用戶的敏感度，關(guān)注用戶的反饋，以確保設(shè)計始終圍繞用戶的真實需求展開。

大部分APP都會有引導(dǎo)設(shè)計，以幫助新人快速上手。那你知道這些引導(dǎo)設(shè)計有哪些要求和方法嗎？這篇文章，我們看看作者整理的五種類型，你們用的是哪一種呢？

一、設(shè)計原則

• 簡潔性：內(nèi)容簡潔明了，避免過多的文字和復(fù)雜的概念，重點突出產(chǎn)品的核心功能和關(guān)鍵操作；
• 直觀性：采用直觀的視覺設(shè)計和交互方式，如圖片、圖標(biāo)、動畫等，讓用戶能夠快速理解引導(dǎo)信息并進行相應(yīng)操作；
• 漸進性：按照用戶的認知和操作流程，逐步展開引導(dǎo)內(nèi)容，避免信息的復(fù)雜造成過多干擾；
• 互動性：增加互動元素，如點擊、滑動、輸入等，讓用戶積極參與到新手引導(dǎo)過程中，提高用戶的注意力和學(xué)習(xí)效果；
• 友好性：支持可跳過，為有經(jīng)驗或急于使用產(chǎn)品的用戶提供跳過新手引導(dǎo)的選項，尊重用戶的自主選擇。

二、引導(dǎo)方式

1. 遮罩式（蒙層引導(dǎo)）

1）定義

蒙層引導(dǎo)的特點是讓用戶將注意力聚焦到被圈定的某個特定功能上，不被其他內(nèi)容干擾；

通常出現(xiàn)在用戶首次操作時做全局引導(dǎo)，也會在產(chǎn)品的各個功能點等待用戶的觸發(fā)；根據(jù)內(nèi)容一次顯示一個或多個提示；

2）組成結(jié)構(gòu)

黑色蒙層+高亮內(nèi)容+內(nèi)容介紹（圖文/視頻）+操作引導(dǎo)；

3）使用規(guī)則

分為單頁面功能引導(dǎo)和多頁面多功能引導(dǎo)，單頁面引導(dǎo)全局信息量不能過多；多頁面引導(dǎo)控制在5步以內(nèi)，提示契機保證用戶需要的時候出現(xiàn)，不做過多干擾；

做到這三點挑戰(zhàn)，產(chǎn)品經(jīng)理只會不斷升值

好的產(chǎn)品經(jīng)理是很稀缺的，懂用戶、懂商業(yè)、懂?dāng)?shù)據(jù)的產(chǎn)品經(jīng)理走出互聯(lián)網(wǎng)，依然是搶手貨。相反，如果只做簡單傳話、低效執(zhí)行、淺層思考的產(chǎn)品經(jīng)理，恐怕走不過未來3-5年的洪流。

查看詳情 >

4）使用場景

分類場景：展示新產(chǎn)品/功能特色介紹（新功能上新的告知、特色重點功能宣傳）、產(chǎn)品/功能更新迭代（說明界面中功能位置的改動、服務(wù)內(nèi)容的變動等）、操作行為引導(dǎo)（講解操作方式、體現(xiàn)特定的手勢交互劃分說明界面的整體結(jié)構(gòu)）；

2. 開屏引導(dǎo)

1）定義

引導(dǎo)頁出現(xiàn)在用戶首次打開APP的時，在用戶使用產(chǎn)品前先給用戶營造好產(chǎn)品的基調(diào)和氛圍，宣傳產(chǎn)品功能和亮點或告知用戶最核心的操作方式；

基本上由3-5個頁面組成，保證能帶給用戶新鮮感和吸引他們的注意力，否則對用戶來說反而是干擾，只會直接選擇快速劃過；

2）組成結(jié)構(gòu)

文字介紹+圖片介紹+操作引導(dǎo)；

3）使用規(guī)則

引導(dǎo)頁最多不超過5頁；圖片介紹表達簡單且符合真實的使用場景；盡量明確的操作引導(dǎo)查看下一步的操作，

4）使用場景

用戶首次啟動APP，全局展示APP的整體功能架構(gòu)和大的功能模塊分類

3. 彈窗引導(dǎo)

1）定義

用戶進入使用某功能或某交互方式變化時，彈出彈窗予以解釋并介紹相應(yīng)的操作，屬于即時的強提醒方式；

彈窗引導(dǎo)更重，阻斷行更強，需考慮使用的場景和傳達內(nèi)容的重要程度；

2）組成結(jié)構(gòu)

彈窗+圖/文信息+操作按鈕；

3）使用規(guī)則

更多使用于單項服務(wù)的介紹；彈窗內(nèi)盡可能以圖文方式介紹，避免大片文字，內(nèi)容清晰明確，操作按鈕指代清晰；

4）使用場景

告知用戶有新功能上線（如何找到新功能、新功能如何使用，并提供直接鏈接跳轉(zhuǎn)去對應(yīng)服務(wù)）、變更功能提醒（功能變更后提示去哪找到）、告知用戶一些隱藏菜單的內(nèi)容（引導(dǎo)用戶使用）、以及查看/點擊等交互操作變更等；

4. 氣泡/浮層引導(dǎo)

1）定義

同樣是作為即使提醒的方式，作為引導(dǎo)提示、提醒提示、解釋提示，讓用戶快速了解此服務(wù)/功能的內(nèi)容

氣泡屬于輕量級的提示方式，打斷感弱，內(nèi)容傳遞量不大但聚焦；

2）組成結(jié)構(gòu)

彈窗+圖文信息+操作按鈕；

3）使用規(guī)則

彈窗內(nèi)盡可能以圖文方式介紹，避免大篇文字，內(nèi)容明確，操作按鈕指代清晰；

4）使用場景

聚焦在單一功能場景，更貼近某個服務(wù)的引導(dǎo)和告知，告知用戶有新功能上線、引導(dǎo)用戶使用、或告知用戶一些隱藏菜單的內(nèi)容，當(dāng)前提示內(nèi)容較為重要，且內(nèi)容較多，建議使用彈窗。

5. 操作引導(dǎo)

1）定義

操作式引導(dǎo)會結(jié)合產(chǎn)品實際使用場景，一步一步地引導(dǎo)你進行操作，鼓勵用戶參與其中

這種方式很容易讓用戶沉浸其中、快速學(xué)習(xí)，并且因為有及時的操作反饋，所以用戶很容易獲得強烈的成就感；

2）組成結(jié)構(gòu)

內(nèi)容介紹+引導(dǎo)內(nèi)容+操作引導(dǎo)

3）使用規(guī)則

操作引導(dǎo)突出且明確指示出操作的方式，否則用戶很容易因為操作失敗的挫敗感而放棄；保持內(nèi)容與操作的親密性；操作成功后及時給予反饋。

4）使用場景

多應(yīng)用在工具類產(chǎn)品和游戲：比如養(yǎng)雞活動、拼多多的種農(nóng)作物、螞蟻森林種樹等最開始使用此功能時，或者很久未進入的用戶下次進入；

編輯導(dǎo)語：由于審美的多優(yōu)化，產(chǎn)品設(shè)計風(fēng)格及類型也不盡相同，但核心都是圍繞用戶群體來迎合市場需求。本文將從我看到、我理解、我行動、給我反饋這四個層面逐步遞進闡明交互設(shè)計的本質(zhì)，值得閱讀學(xué)習(xí)。

近來，和新的交互團隊溝通頗多。在溝通當(dāng)中，不免會陷入這樣的對話：我覺得這個設(shè)計不美，不優(yōu)雅、所以不合適。

每每，當(dāng)我們圍繞產(chǎn)品設(shè)計的討論進入了“美丑與否”的階段，就基本上等同于陷入了“公說公有理、婆說婆有理”的泥沼。畢竟，審美是一個個體化的偏好，依賴于我們過往的學(xué)習(xí)、認知和經(jīng)歷。圍繞產(chǎn)品去討論美丑，最后往往只能看誰的官帽子大就讓誰決定了。

但是，在涉及交互時，我們應(yīng)該聚焦于美丑的討論么？

我的答案是，不應(yīng)該。

在創(chuàng)作一幅畫作或雕塑的時候，個性化的作品之美是可以被討論的。你偏好特定的風(fēng)格，從而創(chuàng)作特定類型的作品，看客喜歡自然好，不喜歡也無所謂。因為作品首先是悅己的，然后才是悅?cè)说摹Ｎ覀兘栌梢粋€個性化的作品來完成自我的投射和受眾的篩選。

而在規(guī)劃一款面向大眾產(chǎn)品的時候，其商業(yè)化的產(chǎn)品之美則不應(yīng)該被討論，更應(yīng)該被數(shù)據(jù)衡量。我們不是要把自己偏好的風(fēng)格強塞給不同的用戶，而是要以用戶可接受的方式將自己的產(chǎn)品和服務(wù)兜售出去。和作品不同，商品首先是悅?cè)说模缓蟛攀菒偧旱?。我們面對的是一個被篩選出的受眾群體，來完成品牌和服務(wù)價值的投射。即便市場上有很多，我個體不喜歡的產(chǎn)品設(shè)計，但是仍然要尊重其，在數(shù)據(jù)指標(biāo)上是有效的。

當(dāng)用戶面對交互界面時，會經(jīng)歷：我看到、我理解、我行動、給我反饋的過程。過程中，逐環(huán)節(jié)中的漏斗轉(zhuǎn)化，和最終的業(yè)務(wù)結(jié)果，是可以抽離出數(shù)據(jù)指標(biāo)進行衡量的。

那么，交互設(shè)計的導(dǎo)向，就旨在降低整個鏈路中的各個環(huán)節(jié)間的阻力，體現(xiàn)在用戶從“我看到” 到 “我理解”的認知阻力降低，從“我理解”到“我行動”的操作干擾降低，以及從“我行動”到“給我反饋”的反饋時延降低。

一、從“我看到”到“我理解”

這個環(huán)節(jié)一般是產(chǎn)品經(jīng)理和設(shè)計師容易代入個人審美的環(huán)節(jié)，有審美潔癖的人士往往會傾向于提供更有結(jié)構(gòu)化、更富有美感和邏輯性的信息排布展示。而事實上，這就犯了“理性人假設(shè)“的錯誤，我們總假設(shè)用戶是秉持著理性來使用我們產(chǎn)品的，殊不知，他們大概率是以感性的方式來感知和應(yīng)用我們的產(chǎn)品，未必能夠體會到產(chǎn)品精致的“匠心”：

比如，對于列表頁卡片來說，同樣的信息，以標(biāo)簽的形式展現(xiàn)就不如以標(biāo)題的形式展現(xiàn)。”字要大“定律，在列表頁卡片的設(shè)計中屢試不爽。

又如，在同一個頁面上，如果我們增加了兩個關(guān)注按鈕，UV關(guān)注轉(zhuǎn)化效率就會比一個的要好。以個人體驗為例，我一直在使用一款壁紙軟件，但直到某一日，我才驚覺原來這個頁面里有兩個收藏按鈕，我一直只在使用其中一個。我拿著手機問了身邊的朋友，呈現(xiàn)出28分布，80%的人和我一樣關(guān)注到了同一個位置的收藏按鈕；而20%的人則關(guān)注到了另一個收藏按鈕、或同時關(guān)注到了兩個按鈕。

二、從“我理解”到“我行動”

這個環(huán)節(jié)一般是產(chǎn)品經(jīng)理和設(shè)計師容易代入專家視角的環(huán)節(jié)，有專家視角的人士往往會傾向于使用書面的、應(yīng)用內(nèi)專有的表述方式，比如：溝通、馬克、直聊等等，但是，這種不說人話的文案顯然既不利于理解，又無法有效推動用戶做出有效的行動。

套用福格行為模型，行為發(fā)生于動機、能力和提示同時出現(xiàn)的時候。產(chǎn)品交互的作用，就是要降低用戶使用產(chǎn)品所需的能力門檻，給到用戶充分的行動提示，從而促進行為密度的提升。

從過往2C銷轉(zhuǎn)的經(jīng)驗上來看，同樣的頁面布局，暖色的按鈕比冷色的按鈕轉(zhuǎn)化率高、直白的口語化文案比正式的書面語文案轉(zhuǎn)化率高。數(shù)據(jù)結(jié)果告訴我們，那些原本中立的用戶，是可以被顏色、文案所引導(dǎo)，從而做出有效行動的。

三、從“我行動”到“給我反饋”

這個環(huán)節(jié)基本上就屬于基礎(chǔ)認知了，不要讓自己的產(chǎn)品在交互過程中出現(xiàn)“死機”態(tài)。在實踐中可以更多的使用非阻塞式操作，通過異步的方式給到用戶更及時和靈敏的反饋：

以用戶上傳頭像為例，一種做法是在用戶上傳完畢后才給到提示；另一種做法則是本地完成操作后就先給用戶反饋，隨后進入后臺的上傳，只有在上傳失敗且重試失敗后，才給到用戶提示。

以內(nèi)容平臺發(fā)布UGC內(nèi)容為例，一種做法是先審后發(fā)，先審核通過后再發(fā)布到公域；另一種做法則是先發(fā)后審，先讓內(nèi)容對用戶自己可見，并插入到他信息流的首位，然后在審核通過后發(fā)布到公域。從公域的可視性上來說，兩種方案是一致的，但是給用戶體感上，先發(fā)后審的即時性更強。

只有能夠切實降低用戶認知阻力、操作阻力、反饋延時的交互，才稱得上是商品維度的好交互。美感與否、邏輯與否，都是上帝視角的先驗審判，而逐環(huán)節(jié)的漏斗指標(biāo)才是用戶視角的后驗投票。

不追求美麗，那么追求什么呢？

簡單，是我目前對產(chǎn)品和交互的認知和追求。

許是年紀大了，便終于因為意識到自己的審美是非典型的、有偏差的，開始更多的不執(zhí)念于自己，而落地于用戶觀察。

簡單，是一種有效的策略。

因為簡單，所以用戶更容易理解我們提供的信息和內(nèi)容，從而更快速的完成信息的識別和認知。

因為簡單，所以用戶更容易聚焦在主路徑上，不會在諸多紛繁的選項中迷失、陷入選擇困難。

因為簡單，所以用戶不需要了解平臺的黑盒，他能夠得到一個更簡單的系統(tǒng)，看到的就是直接的輸入輸出、按下一個按鈕收獲一個商品。

簡單的策略，不光讓用戶得利，我們也會從中受益，使得前期試錯成本和后期維護成本都降低許多。

簡單，是一道困難的題目。

追求簡單，所以我們需要找到用戶群體的最大公約數(shù)，只有將這個最大公約數(shù)落地在產(chǎn)品設(shè)計中，才能讓用戶快速理解和接受我們的設(shè)計；

追求簡單，所以我們需要使用更平白的文本、更直接的圖標(biāo)，不端著、說人話，才能讓用戶沒有理解的障礙、一看到就能夠明白。

追求簡單，所以我們需要克制自己對于巴洛克風(fēng)格的摯愛，不斷的收斂自己想要多做功的念頭，砍到20%的需求，以MVP的方式去推進業(yè)務(wù)。

從追求個體的美麗，到追求群體的簡單；從追求個體的控制，到追求群體的順應(yīng)。

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

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

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標(biāo)定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計，以及相關(guān)的軟件開發(fā)服務(wù)，咨詢電話：01063334945。我們建立了一個微信群，每天分享國內(nèi)外優(yōu)秀的設(shè)計，有興趣請加入一起學(xué)習(xí)成長，咨詢及進群請加藍小助微信ben_lanlan

編輯導(dǎo)讀：動效效果是一個功能性元素，而不僅僅是一個裝飾。本文作者介紹了五個交互動效效果，水平視差滾動效果、動畫搜索欄交互、提交按鈕啟動信息、頁面間的分頁動畫、用粘性元素展開卡片，希望對你有幫助。

設(shè)計一個帶有動效效果和轉(zhuǎn)場效果的用戶界面，是為另一個手機應(yīng)用規(guī)劃一個更好的用戶體驗的好方法。在一個注意力持續(xù)時間短暫的世界里，動畫-微交互是刺激用戶參與的好方式。

這就是為什么 Airbnb最近推出Lottie–它是一個“新開源工具，可以輕松為本地應(yīng)用程序添加動效效果”像Lottie項目表明了，為應(yīng)用程序和網(wǎng)站增加用戶體驗，其中添加動畫作為一個新元素越來越重要。

就像所有放入界面中的元素并與之交互的過程一樣，動效效果也是一個功能性元素，而不僅僅是一個裝飾。動效效果在用戶界面應(yīng)該堅持一個恰到好處的處理，而背后設(shè)置始終需要有一個明確的目的。當(dāng)動效效果是錦上添花而不是美中不足時，用戶體驗會更流暢。

以下是介紹的交互動效效果：

1. 水平視差滾動效果；
2. 動畫搜索欄交互；
3. 提交按鈕啟動信息；
4. 頁面間的分頁動畫；
5. 用粘性元素展開卡片；

一、水平視差滾動效果

視差效果在數(shù)字系統(tǒng)設(shè)計中可以同時用于垂直面和水平面。視差效果首次應(yīng)用是在視頻游戲，數(shù)十年后它進入了網(wǎng)頁設(shè)計應(yīng)用中，然后漸漸的又進入了移動應(yīng)用程序，使用靜態(tài)或緩慢移動的背景圖像與快速移動的前景圖像，創(chuàng)建一個多層次的3D滾動效果。這使用戶體驗更加身臨其境，以其微妙之處吸引用戶。為什么這會讓人眼前一亮-

• 數(shù)字屏幕是一個二維空間，但是設(shè)計師能在他們的平面像素屏幕上做有深度和廣度的創(chuàng)意，這就是微妙視差效果能發(fā)揮作用的地方。
• 視差滾動效果在界面設(shè)計中采用不同的視覺元素并以不同的速度移動它們來增加動作和深度的錯覺。

一起看一下在設(shè)計原則中的兩個視差滾動效果實例。

手機游戲武器卡：

Weapon cards by Hassan Mahmud

視差效果最佳位置之一是在移動應(yīng)用程序或網(wǎng)站上水平或垂直滾動卡片，體驗最流暢環(huán)節(jié)的感受，是在最后部分的一張卡片。類似于iphone在你滾動到特定列表的末尾時引入的橡皮筋效應(yīng)。

耐克APP促銷卡：

Nike promotional cards by Jardson Almeida

這個例子是耐克APP概念創(chuàng)作的視差滾動效果，來促進即將到來的產(chǎn)品發(fā)布。

這個設(shè)計通過突出前景元素—- 鞋子—- 將其提升了一個層次，從而超越了背景卡片的邊緣。這個效果彌補滾動時發(fā)生的背景顏色改變。正如你看到的例子，精心制作的視差互動效果可以很容易幫助你從產(chǎn)品群中脫穎而出并為你的訪客建立一個好的印象。不要認為視差是純粹的裝飾，像你使用的其他技術(shù)一樣，它應(yīng)該為你的用戶增加真正有價值的體驗方式被融合。

但是，需要注意的是在視差效應(yīng)范圍內(nèi)過多的運動可能會對那些患有前庭疾病的人造成傷害。運動錯覺和深度錯覺可能導(dǎo)致眩暈或者迷失方向感，請切記這些設(shè)計準則：

• 將視差效果的數(shù)量保持在最低限度；
• 屏幕的一個小區(qū)域內(nèi)限制過多移動效果；
• 不要讓你的效果分散用戶對重要信息的注意力；

二、動畫搜素欄交互

搜索欄是用戶在移動應(yīng)用程序或網(wǎng)頁設(shè)計中最常見的圖形元素之一。在這種類型的動畫中，界面通常只有一個搜索圖標(biāo)，當(dāng)你點擊它搜索輸入字段時會顯示一個彈性動畫。通過在搜索元素中添加一個微妙的動畫，設(shè)計師可以實現(xiàn)兩個基本目標(biāo):

1. 查詢和搜索數(shù)據(jù)是數(shù)字產(chǎn)品中最常見的交互方式之一，為他們增添樂趣；
2. 只有當(dāng)用戶需要搜索輸入時，通過擴展搜索欄有效利用空白區(qū)。

讓我們看一下這個交互的例子：

Search transform by Alex Pronsky

這個設(shè)計展示了放大鏡（搜素欄）作為圓形圖標(biāo)，點擊該圖標(biāo)時它會有動效，變成藥丸形狀的搜索框。這是一個非常輕量級的交互設(shè)計，在 Principle 上只需要不到5個頁面就可以實現(xiàn)，并且在開發(fā)應(yīng)用程序或網(wǎng)站時也同樣簡單。

三、提交按鈕啟動消息

用戶填寫表單或在應(yīng)用程序中進行某些選擇按下提交按鈕之后就會出現(xiàn)這個動畫。一個應(yīng)用程序首次啟動并且所有序緩存和數(shù)據(jù)都被提取時，啟動(Splash) 動畫也會被使用。啟動動畫通常包括 logo 和應(yīng)用程序的名稱，通常會在應(yīng)用程序打開前在屏幕上出現(xiàn)片刻。為什么這會讓人眼前一亮-

• 當(dāng)應(yīng)用程序進入加載階段來獲取或上傳數(shù)據(jù)時，啟動動畫非常合適，提供一個為用戶參與的錨點；
• 然而，理想情況是通過提供強烈影響用戶體驗的交互式體驗，可以使用戶走得更遠。

讓我們來看一個交互式啟動畫面的例子：

Submit splash screen by Khai

這個設(shè)計是用戶在應(yīng)用程序中完成提交交互之后的展示的動畫。當(dāng)數(shù)據(jù)被發(fā)送到數(shù)據(jù)庫時，彈跳球創(chuàng)建了一個有趣的體驗，接下來的勾號向用戶提供反饋，告訴用戶的操作是成功的，這是一個重要的體驗實現(xiàn)。以下是啟動畫面時要遵循的一些最佳的方法：

• 將持續(xù)時間控制在2秒以內(nèi)；
• 對于用戶可能在應(yīng)用程序中多次進行的交互將時間減少到1秒或更短（比如多次提交）；
• 在評估設(shè)計想法時要追求簡單和大膽的想法而不是難懂的、錯綜復(fù)雜點子；
• 過于復(fù)雜的序列動畫只會顯得華而不實，可能會讓用戶覺得他們的時間被浪費；
• 強烈的背景色彩、背景圖片都是不錯的選擇。假如啟動畫面有動畫效果，那么在一個相對固定或漸變的背景上添加動畫可能呈現(xiàn)的效果會更好。

四、頁面間的分頁動畫

分頁是一系列相互連接且內(nèi)容相似的頁面，需要注意的是即使頁面中某一部分的內(nèi)容可以分為不同的頁面，我們?nèi)匀粚⑦@個概念定義為分頁。其優(yōu)點包括3個：更容易的導(dǎo)航、更好的用戶體驗、更流暢的購買過程。通常用在電子商務(wù)網(wǎng)站。

• 雖然大多數(shù)傳統(tǒng)網(wǎng)站和應(yīng)用程序使用單獨的頁面來分割內(nèi)容，由于頁面加載時間較長，導(dǎo)致用戶體驗不連貫，但新的設(shè)計系統(tǒng)已經(jīng)開始使用更流暢的分頁交互，從而降低了客戶流失率，提高了客戶留存率；
• 過去用一個流暢的分頁動畫需要通過幾個頁面進行導(dǎo)航，現(xiàn)在我們可以創(chuàng)建一個單頁面的內(nèi)容交互的效果。

讓我們來看一個分頁組件的例子，它可以在各個部分之間滑動并且可以通過動畫創(chuàng)建一個令人愉快的用戶體驗：

Pagination by André Gonçalves

當(dāng)用戶在不同部分之間切換時，它創(chuàng)造了一種流暢的用戶體驗。它可以用在應(yīng)用程序中用戶可以在各個部分之間快速滑動。例如瀏覽電子商務(wù)網(wǎng)站中的產(chǎn)品圖片、閱讀教育應(yīng)用程序中的不同部分信息，或者按照步驟創(chuàng)建食品應(yīng)用程序的配方。

五、用粘性元素展開卡片

在用戶界面設(shè)計中，卡片列表是一個易于展示信息快的方法。借鑒現(xiàn)實世界中使用實物卡片記憶和組織信息的方法ーー例如抽屜卡或便利貼ーー卡片列表顯示一系列卡片，每張卡片包含一小部分信息。因此，設(shè)計的真正的難點在于平衡信息的傳遞方式，而不是讓使用者不知所措。

用戶應(yīng)該得到一個清晰的圖片并準確傳達信息，如果用戶選擇深入瀏覽時，可以選擇擴展信息和更深入的展示。保持卡片展開的連續(xù)性、流動性應(yīng)是平順且感覺就像是一個連接在一起的感覺。

像上面所有的交互一樣，看一個交互設(shè)計的例子：

MVMT concept by Lukas Guschlbauer

這個設(shè)計是用在一個電子商務(wù)的應(yīng)用程序，購買手表顯示卡的項目。主要的信息如價格和等級需要顯示在每張卡片。擴展卡片可以顯示額外的信息，例如使用特點和推薦。在消費購買決策時，這款手表的粘性擴展視圖創(chuàng)造了一個更好的體驗。直觀的使用和-正確的操作-通常美學(xué)上也是令人舒適的。擴展卡片列表可以構(gòu)建響應(yīng)式布局設(shè)計，也是提高可用性的絕佳方案。目的是提高瀏覽內(nèi)容或者信息量大的應(yīng)用程序。

作者：Samarth Zalte

本文由@木之 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載。

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

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標(biāo)定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計，以及相關(guān)的軟件開發(fā)服務(wù)，咨詢電話：01063334945。我們建立了一個微信群，每天分享國內(nèi)外優(yōu)秀的設(shè)計，有興趣請加入一起學(xué)習(xí)成長，咨詢及進群請加藍小助微信ben_lanlan

在互聯(lián)網(wǎng)領(lǐng)域中，人機之間的互動過程就是交互。交互也有一些可預(yù)測的、重復(fù)出現(xiàn)的規(guī)律，作者總結(jié)了其中常見的七種C端交互模式，可以提高大家的工作效率，分享給大家。

前段時間有個產(chǎn)品童鞋，他剛加我就問了一大串問題。

什么是模式（Pattern）？什么是模版（Template）？這兩個概念有什么區(qū)別？

作為一個熱心好學(xué)、樂于助人的產(chǎn)品仔，我當(dāng)然和他暢聊了一個多小時，順便總結(jié)下聊天內(nèi)容。

你是不是也經(jīng)常在生活工作中，碰到類似“行為模式、設(shè)計模式、語言模式、文檔模版、表格模版”等名詞。

但又搞不清它們有什么區(qū)別，搞懂了又有什么用？

別急，我們花幾分鐘，先來嘮嘮什么是模式。

一、什么是模式？

可預(yù)測、重復(fù)出現(xiàn)的現(xiàn)象或規(guī)律，通過歸納總結(jié)，就變成了某一種模式。

我們的生活中，就有許多模式的影子。

比如常見的商業(yè)模式、營銷模式、行為模式、數(shù)學(xué)模式、語言模式等。

舉個例子：

簡單說下行為模式，它分為了“習(xí)慣模式、消費模式、學(xué)習(xí)模式”等等。

苦逼打工仔普遍的消費模式，一般是工作日花錢少，到了周末都愛到商場逛街和購物。

但又有特例，我有個朋友就特別宅，他只喜歡在上班的時候，摸魚逛淘寶下單，簡直離譜~

做交互設(shè)計10年，我為何轉(zhuǎn)崗到產(chǎn)品經(jīng)理？

真正轉(zhuǎn)崗之后，我發(fā)現(xiàn)很多工作還是超出了自己的想象。產(chǎn)品經(jīng)理的工作確實比較雜。理論上，產(chǎn)品經(jīng)理的工作包括了產(chǎn)品的方方面面，從市場研究、用戶調(diào)研、數(shù)據(jù)分析...

查看詳情 >

掌握模式，有什么用？

當(dāng)你掌握了模式的概念，并嘗試在生活中使用，相信你一定能感受到這 7 個好處。

1. 信息壓縮：把信息精簡成特定的模式，記憶傳播更容易了，教給別人更是輕輕松松；
2. 知識萃?。和ㄟ^學(xué)習(xí)模式，掌握系統(tǒng)化的知識，就像搭樂高拼積木，簡單易懂、一學(xué)就會、舉一反三；
3. 簡化問題：用模式來解決問題，意味著它不再是一團亂麻，成為了可分割的部分，原來苦惱的事，現(xiàn)在輕松搞定；
4. 識別規(guī)律：當(dāng)你摸清了模式的現(xiàn)象規(guī)律，就像旅游帶著地圖，走到哪里都不慌；
5. 提高效率：把模式進行泛化使用，可以大大提高你的工作產(chǎn)出，蓋章可比畫圖快太多了；
6. 組合創(chuàng)新：試著把你學(xué)會的各種模式，打亂排序、重新組合，說不定會拼出一些新玩意；
7. 預(yù)測未來：搞懂了特定領(lǐng)域的模式，意味著你熟知并能運用自如，自然而然學(xué)會了推演未來。

二、C 端交互設(shè)計的 7 種常見模式

我們試著再舉個例子，加深下對模式的理解，順便學(xué)學(xué)交互設(shè)計。

什么是交互？

簡單來說，交互指的是在互聯(lián)網(wǎng)領(lǐng)域中，人、機之間的一系列互動過程。

我還提煉了 3 種常見模式（簡單反饋、數(shù)據(jù)操作、業(yè)務(wù)判斷），比較粗糙湊合也能用。

現(xiàn)在試著再系統(tǒng)總結(jié)下，我常用的 7 種 C 端交互模式，主要有：導(dǎo)航模式、搜索模式、反饋模式、輸入模式、編輯模式、分享模式、引導(dǎo)模式。

學(xué)完就能用，趕緊卷起來~

有人就問了，還有更多交互模式嗎？

確實可以有，等我有時間再編幾個。。

話說回來，如果是一些特別復(fù)雜的業(yè)務(wù)規(guī)則，可能會涉及到 N 個交互模式的任意組合。

1. 導(dǎo)航模式

常見的導(dǎo)航模式有按鈕組合、標(biāo)簽菜單、宮格布局、列表視圖等。

導(dǎo)航模式的主要作用是，告知用戶當(dāng)前在網(wǎng)站的位置，以及接下來到哪些頁面，這有點像地圖 APP。

上面這張圖中，包含了幾種導(dǎo)航組件呢？

2. 搜索模式

搜索，是各大電商 APP 常見的交互模式。

搜索模式允許用戶輸入關(guān)鍵詞，然后系統(tǒng)返回搜索結(jié)果。

打個比方，這有點像在 Navicat 中寫了一段 SQL 查詢。

SELECT id, name, age
FROM users
WHERE age > 18

這段 SQL 的作用是，查詢大于 18 歲的用戶信息，包含序號、名稱、年齡。

3. 反饋模式

常見的反饋模式組件，涉及了對話框、吐司提示、氣泡提示等。

反饋模式用的比較多的場景是，告知用戶一些信息或提示，比如“輸入密碼錯了、展示訂單取消的注意事項”等。

4. 輸入模式

輸入模式主要用于新數(shù)據(jù)創(chuàng)建，例如淘寶下單時，你新增了一個收貨地址。

打開美團叫個外賣，整個訂單創(chuàng)建流程，也是輸入模式。

5. 編輯模式

有很多人可能會把輸入模式和編輯模式搞混。

區(qū)別它們的一個方法是，交互流程涉及新數(shù)據(jù)創(chuàng)建，還是改舊數(shù)據(jù)。

改數(shù)據(jù)的話，那就是編輯模式。

6. 分享模式

我們在看到一些干貨文章，或好用的小程序想要轉(zhuǎn)發(fā)給朋友，那就要用到分享模式。

分享模式可以很簡單，也可以往復(fù)雜了做，看產(chǎn)品階段去實現(xiàn)。

7. 引導(dǎo)模式

引導(dǎo)模式和反饋模式有點像，都是展示特定的內(nèi)容。

那怎么分辨它們呢？

以設(shè)計師視角來看，反饋模式需要用戶觸發(fā)，系統(tǒng)被動顯示。

而要讓用戶特別關(guān)注的信息，那就是引導(dǎo)模式。

三、總結(jié)

模式，即抽象的規(guī)律。——好夕雷

說了這么多概念和例子，你是不是對模式的認知更清晰了呢？

模式運用在產(chǎn)品領(lǐng)域，就有了這 7 種交互模式，分別是“導(dǎo)航模式、搜索模式、反饋模式、輸入模式、編輯模式、分享模式、引導(dǎo)模式”。

如果學(xué)會了模式，那么無論生活還是工作，相信你一定能輕松應(yīng)對、事半功倍。