作者：設計師豆漿
鏈接：https://www.zcool.com.cn/article/ZMTI4NTgyMA==.html
來源：站酷
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。

蘭亭妙微(m.73404.com.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計，以及相關的軟件開發服務，咨詢電話：01063334945。我們建立了一個微信群，每天分享國內外優秀的設計，有興趣請加入一起學習成長，咨詢及進群請加藍小助微信ben_lanlan

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

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

在深入分析用戶體驗設計的六大核心要素之前，我們需要先厘清其核心內涵。從本質上看，用戶體驗設計是一門創造愉悅且功能強大的體驗藝術，確保產品既具有效性又兼具高效性、易用性和用戶滿意度。它涵蓋了一個整體性的設計循環，通過不同維度的優化來最終實現這些目標。可以把用戶體驗設計比喻成一把“統籌性的大傘”，其下輻射的每個要素都是推動卓越體驗構建的重要一環。本篇文章將沿著這把傘的思維體系，逐步探索這些不可或缺的構建模塊及其影響力。

01 用戶研究

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

02 交互設計

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

03 信息架構

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

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

04 用戶界面設計

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

05 UX 寫作（微文案）

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

06 可訪問性

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

對九類交互狀態的深入理解和不斷創新，將為產品設計帶來更大的提升空間，為用戶帶來更加卓越的體驗，推動產品在競爭激烈的市場中不斷發展和進步。

一、交互狀態的重要性

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

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

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

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

什么是B端產品經理？和C端產品經理有什么區別？

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

查看詳情 >

綜上所述，交互狀態在產品設計中具有重要的地位，它對用戶體驗和產品可用性有著重大的影響。產品開發者和設計師應該充分重視交互狀態的設計，以提高產品的競爭力，在市場中脫穎而出。

二、九類交互狀態詳解

1. 加載相關

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

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

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

2. 特殊模式

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

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

3. 操作相關

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

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

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

4. 限制相關

極值：在旅游預訂平臺上，用戶在選擇酒店價格區間時，系統也會進行極值限制。價格下限通常為平臺上的最低價格，價格上限則會根據當地酒店的市場價格和用戶的搜索歷史進行動態調整，確保用戶能夠得到合理的搜索結果。

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

時間：在在線考試系統中，時間限制尤為重要。考試開始前，考生只能看到考試的相關信息和注意事項，無法進入答題頁面。考試開始后，系統會精確計時，一旦考試時間結束，答題頁面會自動提交，無法再進行答題。

5. 網絡相關

網絡中斷：在在線游戲中，網絡中斷會對玩家的游戲體驗產生很大影響。當網絡中斷時，游戲會自動暫停，并提示玩家網絡中斷。如果玩家在網絡中斷前已經保存了游戲進度，那么在網絡恢復后可以繼續游戲；如果沒有保存進度，可能會丟失部分游戲數據。

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

流量形式切換：在一些音樂播放軟件中，用戶可以根據自己的網絡環境手動切換流量形式。例如，在 Wi-Fi 環境下，用戶可以選擇自動播放高清音樂視頻；而在移動數據環境下，用戶可以選擇只播放音頻，以節省流量。

6. 內容相關

沒有內容：在在線文檔協作平臺中，如果一個文檔沒有內容，系統會提示用戶 “此文檔為空，請添加內容”，并提供一些常用的文檔模板供用戶選擇，方便用戶快速創建內容。

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

7. 站外內容相關

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

8. 設備相關

橫豎屏：在一些圖片編輯軟件中，橫豎屏切換會影響用戶的操作體驗。當用戶將手機從豎屏切換到橫屏時，軟件會自動調整界面布局，將工具菜單和編輯區域分別放置在屏幕的兩側，方便用戶進行操作。而當用戶將手機從橫屏切換回豎屏時，軟件會恢復到原來的布局。

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

清晰度：在一些在線視頻教育平臺中，清晰度的選擇會影響用戶的學習體驗。在網絡條件好的情況下，用戶可以選擇高清或超清的視頻清晰度，以便更清楚地看到教學內容；而在網絡條件差的情況下，用戶可以選擇標清或流暢的清晰度，以保證視頻的播放流暢度。

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

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

硬件聯動：在一些智能辦公場景中，硬件聯動可以提高工作效率。例如，當用戶在會議室中使用智能投影儀時，投影儀可以與會議室的燈光和音響系統聯動，根據投影內容自動調整燈光亮度和音響音量。

9. 角色相關

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

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

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

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

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

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

三、總結與展望

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

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

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

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

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

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

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

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

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

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

許多人可能會在瞬間給出 100 元的答案，但經過仔細斟酌后會發現正確答案其實是 50 元。

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

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

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

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

一款產品無到有，產品經理需要做些什么？

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

查看詳情 >

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

三、讓用戶持續保持感性的深度策略

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

1、顯著地標識狀態與當前進度：

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

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

2、引導用戶完成他們的目標：

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

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

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

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

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

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

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

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

5、盡量減少設置的數量和復雜度：

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

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

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

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

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

7、讓描述更貼近用戶：

深入了解用戶的語言習慣和文化背景，使用用戶熟悉的詞匯和表達方式進行描述。例如，在面向年輕人的產品中，可以采用流行的網絡語言和表達方式，增強用戶的認同感和親近感。在面向不同地區的用戶時，要考慮到當地的文化差異，采用合適的語言和表達方式。

進行用戶測試和反饋收集，不斷優化描述內容。邀請用戶對產品的描述進行評價和建議，根據用戶的反饋進行調整和優化，確保描述內容能夠準確傳達產品的特點和優勢，同時符合用戶的需求和期望。

8、在需要計算的內容提前幫用戶計算好：

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

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

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

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

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

四、設計的價值與目的之深度探討

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

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

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

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

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

產品經理的專業視角與用戶視角，如同孿生兄弟，外表相似但內在迥異。

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

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

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

一、那些“優秀”的設計，正在摧毀你上廁所的體驗

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

究其原因就在于一個“設計”：女廁所圖標設計不明確，導致誤解。

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

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

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

什么是B端產品經理？和C端產品經理有什么區別？

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

查看詳情 >

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

同時，某些商場或寫字樓的洗手臺，為了追求設計感以及合理利用空間，把洗手液跟紙抽“融入”到鏡面里，表面看確實簡潔，是一種優秀設計方案。

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

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

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

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

二、那些“優秀”設計，正在讓用戶“不明所以”，甚至“不知所措”

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

結果是：用戶不知道如何勾選，“優秀”設計摧毀了用戶體驗。

我們再看一個例子。

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

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

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

三、如何避免讓“優秀”設計無意損害用戶價值？

第一，認知層面。產品經理的專業能力體現在創造用戶價值和商業價值，而非局限于單一專業領域。這種能力需同時滿足專業人士和小白用戶的需求，否則不能稱之為真正的專業能力。

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

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

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

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

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

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

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

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

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

一、用戶體驗流程設計

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

尼爾森可用性原則專業描述：

尼爾森可用性原則由人機交互學博士Jakob Nielsen提出，包括狀態可見性原則、貼近用戶真實環境原則、自由控制原則、一致性和標準化原則、防錯原則等。這些原則提供了一套評估用戶體驗好壞的標準，幫助設計師和產品經理進行自查和優化

理論支撐：

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

案例分析：

Netflix：Netflix通過用戶體驗地圖分析用戶觀看習慣，發現用戶在選擇觀看內容時往往會感到選擇困難。為此，Netflix優化了推薦算法，提供個性化的內容推薦，顯著提升了用戶的觀看體驗和滿意度。

二、與用戶相互理解

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

理解用戶的方法：

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

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

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

案例分析：

Dropbox：在早期，Dropbox通過用戶訪談和數據分析了解用戶對文件共享的需求，發現用戶希望能夠輕松分享文件而不必擔心復雜的設置。基于這些反饋，Dropbox簡化了分享流程，使得用戶可以一鍵分享文件，極大提升了用戶體驗。

三、讓用戶理解我們的設計

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

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

案例分析：

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

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

簡潔性是交互設計的重要原則，但這并不意味著界面內容越少越好，而是要讓用戶在使用過程中感到輕松和自然。簡潔的設計應當幫助用戶快速實現目標，而不是讓他們感到困惑。

實現簡潔性的策略：

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

理論支撐：

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

案例分析：

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

五、讓用戶最終感到滿意

用戶體驗的“峰-終”值原理表明，用戶的整體滿意度并不取決于每個環節的完美，而是關鍵時刻的滿意度。因此，設計師應關注用戶在使用過程中的高峰體驗和結束體驗。

實現用戶滿意度的策略：

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

案例分析：

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

總結

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

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

一、設計原則

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

二、引導方式

1. 遮罩式（蒙層引導）

1）定義

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

通常出現在用戶首次操作時做全局引導，也會在產品的各個功能點等待用戶的觸發；根據內容一次顯示一個或多個提示；

2）組成結構

黑色蒙層+高亮內容+內容介紹（圖文/視頻）+操作引導；

3）使用規則

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

做到這三點挑戰，產品經理只會不斷升值

好的產品經理是很稀缺的，懂用戶、懂商業、懂數據的產品經理走出互聯網，依然是搶手貨。相反，如果只做簡單傳話、低效執行、淺層思考的產品經理，恐怕走不過未來3-5年的洪流。

查看詳情 >

4）使用場景

分類場景：展示新產品/功能特色介紹（新功能上新的告知、特色重點功能宣傳）、產品/功能更新迭代（說明界面中功能位置的改動、服務內容的變動等）、操作行為引導（講解操作方式、體現特定的手勢交互劃分說明界面的整體結構）；

2. 開屏引導

1）定義

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

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

2）組成結構

文字介紹+圖片介紹+操作引導；

3）使用規則

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

4）使用場景

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

3. 彈窗引導

1）定義

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

彈窗引導更重，阻斷行更強，需考慮使用的場景和傳達內容的重要程度；

2）組成結構

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

3）使用規則

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

4）使用場景

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

4. 氣泡/浮層引導

1）定義

同樣是作為即使提醒的方式，作為引導提示、提醒提示、解釋提示，讓用戶快速了解此服務/功能的內容

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

2）組成結構

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

3）使用規則

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

4）使用場景

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

5. 操作引導

1）定義

操作式引導會結合產品實際使用場景，一步一步地引導你進行操作，鼓勵用戶參與其中

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

2）組成結構

內容介紹+引導內容+操作引導

3）使用規則

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

4）使用場景

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

編輯導語：由于審美的多優化，產品設計風格及類型也不盡相同，但核心都是圍繞用戶群體來迎合市場需求。本文將從我看到、我理解、我行動、給我反饋這四個層面逐步遞進闡明交互設計的本質，值得閱讀學習。

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

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

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

我的答案是，不應該。

在創作一幅畫作或雕塑的時候，個性化的作品之美是可以被討論的。你偏好特定的風格，從而創作特定類型的作品，看客喜歡自然好，不喜歡也無所謂。因為作品首先是悅己的，然后才是悅人的。我們借由一個個性化的作品來完成自我的投射和受眾的篩選。

而在規劃一款面向大眾產品的時候，其商業化的產品之美則不應該被討論，更應該被數據衡量。我們不是要把自己偏好的風格強塞給不同的用戶，而是要以用戶可接受的方式將自己的產品和服務兜售出去。和作品不同，商品首先是悅人的，然后才是悅己的。我們面對的是一個被篩選出的受眾群體，來完成品牌和服務價值的投射。即便市場上有很多，我個體不喜歡的產品設計，但是仍然要尊重其，在數據指標上是有效的。

當用戶面對交互界面時，會經歷：我看到、我理解、我行動、給我反饋的過程。過程中，逐環節中的漏斗轉化，和最終的業務結果，是可以抽離出數據指標進行衡量的。

那么，交互設計的導向，就旨在降低整個鏈路中的各個環節間的阻力，體現在用戶從“我看到” 到 “我理解”的認知阻力降低，從“我理解”到“我行動”的操作干擾降低，以及從“我行動”到“給我反饋”的反饋時延降低。

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

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

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

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

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

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

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

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

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

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

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

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

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

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

簡單，是我目前對產品和交互的認知和追求。

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

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

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

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

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

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

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

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

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

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

從追求個體的美麗，到追求群體的簡單；從追求個體的控制，到追求群體的順應。

本文由 @YanZehua 原創發布于人人都是產品經理，未經作者許可，禁止轉載。

題圖來自Unsplash，基于CC0協議

蘭亭妙微(m.73404.com.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計，以及相關的軟件開發服務，咨詢電話：01063334945。我們建立了一個微信群，每天分享國內外優秀的設計，有興趣請加入一起學習成長，咨詢及進群請加藍小助微信ben_lanlan

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

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

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

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

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

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

一、水平視差滾動效果

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

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

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

手機游戲武器卡：

Weapon cards by Hassan Mahmud

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

耐克APP促銷卡：

Nike promotional cards by Jardson Almeida

這個例子是耐克APP概念創作的視差滾動效果，來促進即將到來的產品發布。

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

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

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

二、動畫搜素欄交互

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

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

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

Search transform by Alex Pronsky

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

三、提交按鈕啟動消息

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

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

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

Submit splash screen by Khai

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

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

四、頁面間的分頁動畫

分頁是一系列相互連接且內容相似的頁面，需要注意的是即使頁面中某一部分的內容可以分為不同的頁面，我們仍然將這個概念定義為分頁。其優點包括3個：更容易的導航、更好的用戶體驗、更流暢的購買過程。通常用在電子商務網站。

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

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

Pagination by André Gonçalves

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

五、用粘性元素展開卡片

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

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

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

MVMT concept by Lukas Guschlbauer

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

作者：Samarth Zalte

本文由@木之 翻譯發布于人人都是產品經理，未經許可，禁止轉載。

題圖來自 Unsplash，基于CC0協議。

蘭亭妙微(m.73404.com.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計，以及相關的軟件開發服務，咨詢電話：01063334945。我們建立了一個微信群，每天分享國內外優秀的設計，有興趣請加入一起學習成長，咨詢及進群請加藍小助微信ben_lanlan

在互聯網領域中，人機之間的互動過程就是交互。交互也有一些可預測的、重復出現的規律，作者總結了其中常見的七種C端交互模式，可以提高大家的工作效率，分享給大家。

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

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

作為一個熱心好學、樂于助人的產品仔，我當然和他暢聊了一個多小時，順便總結下聊天內容。

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

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

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

一、什么是模式？

可預測、重復出現的現象或規律，通過歸納總結，就變成了某一種模式。

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

比如常見的商業模式、營銷模式、行為模式、數學模式、語言模式等。

舉個例子：

簡單說下行為模式，它分為了“習慣模式、消費模式、學習模式”等等。

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

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

做交互設計10年，我為何轉崗到產品經理？

真正轉崗之后，我發現很多工作還是超出了自己的想象。產品經理的工作確實比較雜。理論上，產品經理的工作包括了產品的方方面面，從市場研究、用戶調研、數據分析...

查看詳情 >

掌握模式，有什么用？

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

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

二、C 端交互設計的 7 種常見模式

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

什么是交互？

簡單來說，交互指的是在互聯網領域中，人、機之間的一系列互動過程。

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

現在試著再系統總結下，我常用的 7 種 C 端交互模式，主要有：導航模式、搜索模式、反饋模式、輸入模式、編輯模式、分享模式、引導模式。

學完就能用，趕緊卷起來~

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

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

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

1. 導航模式

常見的導航模式有按鈕組合、標簽菜單、宮格布局、列表視圖等。

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

上面這張圖中，包含了幾種導航組件呢？

2. 搜索模式

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

搜索模式允許用戶輸入關鍵詞，然后系統返回搜索結果。

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

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

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

3. 反饋模式

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

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

4. 輸入模式

輸入模式主要用于新數據創建，例如淘寶下單時，你新增了一個收貨地址。

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

5. 編輯模式

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

區別它們的一個方法是，交互流程涉及新數據創建，還是改舊數據。

改數據的話，那就是編輯模式。

6. 分享模式

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

分享模式可以很簡單，也可以往復雜了做，看產品階段去實現。

7. 引導模式

引導模式和反饋模式有點像，都是展示特定的內容。

那怎么分辨它們呢？

以設計師視角來看，反饋模式需要用戶觸發，系統被動顯示。

而要讓用戶特別關注的信息，那就是引導模式。

三、總結

模式，即抽象的規律。——好夕雷

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

模式運用在產品領域，就有了這 7 種交互模式，分別是“導航模式、搜索模式、反饋模式、輸入模式、編輯模式、分享模式、引導模式”。

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