1 列表
客服系統常規使用的列表由頂部操作欄、表頭、表體、底部操作欄構成。表格是為可讀性而生，所以表格的易讀、易對比、易操作才是表格設計的首要目標。
1.1應用場景
（1）展示大量結構化的數據。
（2）需要對數據進行排列、搜索、分頁、操作等復雜行為。
1.2設計原則
(1)易讀性
1）表頭。保證表頭字段名稱精簡易懂，既能節省列表空間，又能減輕視覺壓力。表頭的固定功能也能夠很好體現系統界面的友好性，尤其當表頭字段過多，數據類型不好識別的情況，固定表頭能夠大大提升用戶的數據瀏覽效率。
2）行高。較小的行高可以承載更多的信息，但會降低視覺掃描效果，適宜的行高更利于閱讀。目前客服系統常用規格為36px行高，但有些數據量大空間小的專區，需要展示盡可能多的數據時，會考慮會采用24px或30px等小行高，需要基于場景的需求進行選擇。
3）行排序?？筛鶕侄我约傲斜韮热莸谋匾耘鋫渑判?、篩選、搜索等功能，方便用戶快速篩選信息或進行信息對比查看。
4）斑馬線。斑馬線能夠增強用戶視覺的橫向引導，尤其閱讀較寬表格且數量還多的列表，可以避免表格內容過多時，出現錯行的現象。
5）分割線。橫向分割線能夠減輕列表豎直方向的視覺重量，只要采用合適的對齊方式，縱向分割線的作用就可有可無。當表頭字段內容少，且易于區分時，可以考慮取掉單元格的縱向分割線，弱化表格形式，便于橫向信息閱讀、信息獲取和信息間對比的同時，又能夠簡化頁面。當數據量太多或單元表格較寬時，保留縱向分割線幫助提升瀏覽速度。
6）列寬。盡量減少展示的列的數量，關注用戶需要的必要信息，當表頭字段過多時采用橫向滾動條的形式，保證列與列之間足夠的呼吸感。
7）自定義列。不同用戶信息側重可能會有所不同，可通過自定義列的下拉面板對列表內容自定義展示。
8）列對齊。標題和內容一般采用左對齊，更符合用戶的閱讀順序。金額數值排列采用右對齊，既方便用戶讀取數據，又方便進行縱向數據對比。
9）空白格。對于無數據項用-占位，不留白。
10）分頁?？头到y列表數據龐大，通常采用分頁來緩解加載壓力，相對用戶而言，通常滾屏會比分頁更便利，所以，若無展示數據量要求且一屏能展示完時，會盡量避免使用分頁。
當使用分頁時，考慮到用戶的操作習慣，可讓用戶自定義每頁展示數量。
11）特殊標識。對于用戶關注的數據狀態變化，可以采用一些符號標識，便于用戶快速定位信息的同時，也能更加直觀的呈現數據變化。如下圖，通過不同顏色和方向的箭頭來反映數據變化。
12）全屏。全屏展示能夠避免和表格無關內容的干擾，提供沉浸式閱讀體驗，可根據場景需要配置全屏閱讀功能。
13）操作項。對于用戶需要進行業務辦理或高頻點擊的操作欄可以固定在列表的兩側，更方便用戶對數據進行操作。當操作項太多或操作項不常用時，可通過收起較低頻操作項，來節省頁面空間，保證用戶閱讀高效性。
(2)易搜索
1）條件查詢。一般位于表單查詢頁面上方查詢條件模塊，當查詢區域內容過多時，可展示第一行的篩選項，其余收起。
2）表頭篩選。在表頭單元格右側增加篩選圖標，點擊后出現篩選覆蓋層，根據不同篩選類別，配置相對應的表單組件，可快速查找數據。
3）標簽篩選。將用戶常用篩選條件或關注目標設置為默認選項，如時間、狀態、范圍，一般位于頂部操作欄或表頭區域。
(3)易操作
1）單條操作。單條數據操作一般固定在列表左側或右側。
2）批量操作。當對批量數據進行相同操作時，沿著用戶的操作路徑，建議將此類操作按鈕放至底部操作欄。
3）全局操作。當進行一些“導入、新增、導出、其他頁面跳轉入口”等列表的全局操作，或進行模糊搜索、條件篩選等操作時，建議將操作按鈕放至頂部操作欄。
4）詳情?？稍诓僮骼锛印霸斍椤卑粹o，也可將名稱項做成可點擊樣式，跳轉詳情。
5）樹形結構展示。無須用戶進行頁面跳轉，展開父級節點即可查看子級列表內容，一般控制在三層以內。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
B端全稱是Business即商家（泛指企業）的產品，通常是企業或商家，為工作或商業目的而使用的系統型軟件、工具或平臺。相對于C端產品，B端產品對業務邏輯和產品邏輯要求會更高。
本篇筆記將羅列B端設計過程中的核心設計思維和高頻設計要點，結尾附上大廠設計規范鏈接。供大家下載查閱。
設計開始要了解設計的目標，用戶的行為都是有「目標動機」的，B端產品的業務目標往往都是為了為企業或個人為了解決某一項工作上的問題。
當設計過程以「目標」為出發點，可以增強設計判斷力，輸出更有效設計解決方案。
B端產品的設計原則：提高使用者的工作效率，同時降低業務鏈路的操作及學習成本。
當你有了目標以后你的設計就可以圍繞這個目標展開：
對于B端的產品而言，用戶最關心它能為實際的工作帶來哪些便利，而并非這個界面做的多么的好看，以及用戶體驗多么棒。所以B端產品設計價值優先級往往是 功能性＞表現力
B端產品設計需要站在整個業務線全局角度去把控各個設計點，不再是「用戶體驗」至上，為實現「任務目標」，「犧牲」一部分「用戶體驗」是必要的，這個時候視覺和一些體驗就不那么重要了。通過調研業務去了解各個角色職能的工作流程、相關痛點，讓產品能用，好用。
理想的B端設計需要了解業務目標以及業務鏈路中每一個環節的過程。將業務邏輯理解透徹再考慮應該如何進行設計實現。
這樣做的原因當你站在使用者的角度進行同理心設計可以更好的幫助用戶完成他要完成的工作，從而提高效率。產品原型一般基于「功能」本身，而設計師從用戶實際場景規劃用戶的任務流，可以優化產品邏輯，補全缺失場景，通過了解業務流程也能給予創造性解決方案
B端產品往往是是服務于企業用戶，用戶畫像需要專注于用戶特征中的「群體職業身份」這類人無論性別、年齡、地區有何差異，他們都是一類角色，我們的產品要提供給這類角色使用，而不是某個人使用。
由于B端設計師不是產品的用戶，無法沉浸在與用戶相同的真實場景中，建立共情。所以設計師最好親自感受一下業務流程，獲得一手的用戶洞察，
「通過業務人員交流」業務人員可以幫助我們快速高效的描繪出典型客戶案例的用戶畫像。
「實地走訪」：觀察在自然狀態下用戶如何完成工作任務，并提問題：「你怎么做？」或者「為什么這么做？」
「建立種子用戶群」：聚集活躍的種子用戶群，收集意見和建議，并在群里驗證設計想法。
「親身體驗」：成為真正的客服小二，接聽客戶電話，記錄自己在工作臺場景下的真實體驗和感受。
獲取用戶畫像后了解該群體背后工作感受，行為習慣，以及任務類型。
安全感和信任感建立：人們越來越關注隱私和信息安全。如果你要求必須填寫敏感信息，請確保使用字段下方的注釋文本解釋為什么需要這些信息。
實際工作中我們曾經自動獲取過用戶之前表單中填寫的的支付類賬戶信息，在收集的用戶反饋中，用戶會感覺到隱私正在泄露并讓用戶信任感降低。所以即使用戶輸入體驗會更好，但是考慮到信任感，敏感類信息請不要自動獲取。
讓用戶感受到你正在幫助他操作：Jakob Nielsen于1994年提出的十大可用性原則中，其最后一條原則Help and documentation（幫助性指導原則）是搭建B端用戶幫助體系的核心準則，在理想情況下，沒有幫助文檔就可以使用系統是最好的，但在某些情況下（尤其是B端系統），提供一些引導性的幫助其實是必要的。
B端系統中可以嘗試搭建用戶幫助系統：
對B端產品來講，設計師在設計的時候是不需要耗費太多的思考的，只是去按照交互設計師的規劃堆砌圖表和列表。但是對于使用者來講，其中縱橫交錯的商業邏輯和業務邏輯卻是給用戶搭建了一個十分高的門檻。
例如修改資料的時候，使用彈窗、浮層等等交互操作會減少頁面跳轉的頻率。
但是與此同時，減少頁面跳轉并不代表真正的高效，例如瑞幸的供應商系統，供應商所產生的訂單需要按照指定的流程一步步進行操作確保不會出現問題這樣雖然頁面的跳轉增加，但是可以避免操作出錯給用戶帶來更大的困擾。
設計要根據用戶的瀏覽習慣和視覺動線。要嘗試引導用戶的視覺，舉個例子，如何引導：
B 端產品是以業務為核心，是需要用戶長時間操作并完成工作任務的，對于操作和展示內容無關的元素，越少越好。視覺為功能讓步，追求簡潔、清晰、克制、理性的視覺風格。設計語言盡量做到不干擾不打擾。
輸入順序：先易后難；先必填后選填；先公開信息后隱私信息；有關聯性的合成一組，特殊問題后置，用戶輸入時、不會覺得突兀、門檻太高 。
自動對焦（PC端）進行表單頁面，自動對焦第一個輸入字段可以引導用戶開始進行輸入。
標題：標題是對下文最短最精的概括。用戶一般都會跳過表單內容，而且幾乎都不會仔細閱讀那種特別詳細的描述。所以用最少的文字說清楚一個表單的目的尤其重要。
用戶應該可以看一眼標題就知道他們應該怎么做，而不是非得把剩下的全部看完，
（附：這部分感興趣的同學可以搜索“微文案設計”）
在表單編寫方面，或者說各種寫作中，刪減詞語都要比添加詞語更加有益。 在仔細檢查不必要的詞語后，文章會更篤實，更連貫，更吸引人。
這個鏈接有什么用？關閉是點擊右上角的按鈕嗎？如果并沒有增效，那就是減效。每一個字，每一張圖片，都不是100% 必需的，這些都會降低你表單的轉換率。
刪除一個字段，表單提交率就可以提高 26%。（本篇筆記原本有12000余字，為了避免浪費大家時間，我僅保留4000余字的高頻要點內容）
PC端產品提示文字盡量不要放在框內
提示文字存在于框內常用在移動端，它的空間占比很小，對移動端的小屏來說，是非常友好的，但如果在交互上處理不好，會有很大的缺陷。
內部標簽結構，只有提示性文字，用作提示用戶應該輸入什么內容，但用戶在輸入的時候，內部的標簽/提示性文字就會消失，這時候，用戶會失去它是否輸入準確的唯一判別標準。
字段輸入通過部分人工智能自動將操作步驟可以變得簡潔高效 ，也包括諸如一些、自動定位、圖片識別、自動獲取，第三方導入等方式來使用戶的效率得以提升的功能。
打字是在線表單中最耗時、最密集的部分，而且經常會導致錯誤——尤其是在手機上。用按鈕、滑塊替換文本框并使用自動完成功能，將減少工作量并提高轉化率。
文本塊會更容易讓用戶記住內容：例如銀行賬戶、電話號碼等等。它指的是將信息排列成「塊」的過程，使內容更容易保留、處理和回憶。一份研究聲稱數字 3 是幫助人們吸收和回憶信息的神奇數字。
如果一個字段需要特定的格式輸入，請告訴用戶。例如密碼要求、語法規則、編號間距等等。
可以用輸入框長度提示用戶輸入的內容是否正確。
德萊厄斯研究所的可用性研究發現，如果一個字段太長或太短，用戶開始懷疑他們是否正確理解了標簽。
在用戶輸入的時候，右下角告訴用戶已經輸入了多少字，如果超過 80 字后會變紅色，用來警示用戶，并且此時的表單域也無法輸入新的內容。
如果用戶填寫錯誤，向用戶顯示錯誤發生的位置，并說明原因。
如果你的表單里的選項少于5個可以列出所有選項供用戶快速選擇，當大于5個時候可以嘗試用下拉框解決。
將第一個選項作為用戶最有可能的默認選項，且是最安全的選項，提前預判用戶的操作提升選擇效率。排列方式推薦數直排列，豎直排列相對于水平排列容易讀取和定位，提高用戶的瀏覽順序。
當前需要用戶填寫相對隱私的信息時，請給予解釋這么做的原因及目的。
完成表單的設計后可以給業務用戶進行簡單的測試，并記錄他們填寫的時間收集反饋，以及對這一連串的問題他們體驗如何。這也將有助于你下次評估表單的設計。
最后在情感化設計系統里記得感謝用戶填寫或者反饋問題，因為用戶是花時間的。所以請表示感謝。
表格的設計圍繞著「可讀性」和「易操作」兩個設計原則。設計易讀，易掃視，易比較，易操作的表格結構是表格設計的首要目標。
列寬有三種常見處理方式：
1. 根據內容的極限長度給出足夠的固定寬度；
2. 可以固定部分列的寬，其余列按百分比處理；
3. 列寬需要考慮最低寬度/最大寬度/文字極限狀態，內容為空狀態顯示方案；
4.需要設置列之間的最小寬度，表格響應式布局情況下最小不小于此寬度。
M-Densign規范中對齊方式會遵循如下規則：
表格的排序，應從用戶目的出發，遵循用戶查看數據的習慣，尊重數據之間的關聯性，設計用戶查看、操作數據的路徑，而非隨機排列（這部分可以在業務側調研時驗證，提高用戶體驗和閱讀效率）。
1. 文本信息/混合型文本左對齊，符合從左到右的閱讀習慣；
2. 數字信息右對齊，方便數字之間的直觀對比；
設計規范需要定義按鈕的四種狀態：正常狀態(Normal)、懸停狀態(Hover)、激活狀態(Active)、加載狀態(Loading)、禁用狀態(Disabled)
B端產品的開發一般涉及多個開發團隊協作，例如瑞幸的后臺修改按鈕顏色，都可能牽動10+工程師的協同。
所以B端產品在進行設計改版以及設計側調整時候要思考調整對于業務側是否有直接幫助，在設計和規范建立之前，切勿頻繁改動。
除了完全獨立設計開發的項目以外，還有大量的 B 端項目是采用第三方框架開發而成的，如 Ant、Element 等等。這是因為這些第三方程序可以幫助團隊節省大量的開發時間和精力。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
很多時候既讓初入B端行業的設計師感到一絲絲迷茫，因為不同的B端系統也就意味著，它的業務一定就會有所不同。比如CRM系統當中的客戶生命周期管理，OA的辦公自動化，特定的行業往往都會蘊含著不同的業務類型
而作為設計師，如果只了解設計模式、設計組件，不去分析設計最后的業務訴求，其實是沒有任何意義。因此想要通過B端設計指南，和大家一起聊聊B端業務，以及背后所牽涉的具體邏輯。今天就簡單聊聊最為常見的 審批
開始之前，還得再多說兩句，因為一個系統當中，業務本身就不是獨立存在的。因此在去講述審批的過程，一定會涉及到 流程、權限、表單配置 等一些基礎內容，建議可以先做初步了解，再結合文章進行閱讀
雖然在說起源，其實我更想給大家講清楚 審批在B端系統 當中的重要性
審批字面意思是審查并加以批示，通常指對 下級呈報上級的公文進行審查批示，報請上級審批
現如今，任何事情一定都會有分工協作，而使用審批的好處是可以
規范員工行為
提高企業運轉效率
系統存檔便于溯源
保護環境（畢竟減少了紙張浪費）
當然在不同的階段的公司，對于審批的訴求是不太一樣
小公司：因為審批的決策路徑短、流程上都非常簡單，但因此就會缺乏規范保障。比如在外出辦公時，看似只需要與老板當面進行口頭上的溝通即可，但是在外出出現意外時，由于缺乏外出辦公的相關證據，員工的權益則很難得到保障
大公司：因為審批的決策路徑長，流程上都極其復雜，因此會在多人協作下完成整個流程審批。比如想要申請購買辦公用品時，會由 行政、Leader、財務 層層審批，從提交審批到最終落實可能需要十天半個月，但是這樣的流程，能夠確保企業在清查財務狀況時，更加有理有據
審批的演變，就是從最開始的規章制度而來。比如在早期去政務機構辦理各種業務時，會讓你去填寫各種紙質表單。在審核過程中，則需要有各個機關的蓋章及批準，而這種形式正是政府對于普通市民的自上而下的管理方式
審批其實是整個B端系統的靈魂，因為在B端系統當中，企業想要使用系統的一大痛點便是 核心的管控
因此你會發現，只要一個獨立的系統，一定會存在獨立的審批模塊。因為B端管理系統當中企業的最終目的，是管理手中的人，而審批便是最為常見的一種手段
審批在如今的B端系統當中，可以理解為它是一組消息，在這一組消息當中會有：“具體的文本、對應的附件、以及照片視頻”這些內容都是輔佐 申請人 去講訴你需要申請的內容
比如我們在申請病假時，往往需要出示 三甲醫院所開設的證明，對于這個證明，如何在表單當中出現，你會發現最為常見的便是拍攝證明圖片，然后上傳到表單當中（這個與字段屬性緊密相連，我就不做不過介紹）
審批的這組消息還會有些特殊，因為它非常重要，你可以理解為它是一則“加急消息”會提醒審批人快速的進行處理，同時會告知相關的參與人（處理人、抄送人）審批的進度、并且無論成功與否，都會在系統當中留下 足跡，因此它起到了 “追蹤、通知、留存” 三個非常重要的作用，我們首先對于審批進行一個基礎的拆解
如果把審批單獨拿出來，你會發現審批會牽涉到 發起人、處理人、抄送人
審批的發起人，也是整個審批流程的歸屬人，他最關心整個審批進展
因為在發起人的角度，創建完審批事項后，可能還需要進入審批頁面，完善 后續附加信息、及時了解審批狀態、催促審批人的審核、處理駁回意見 等等，因此站在發起人的角度，審批需要盡可能詳細的展示 當前審批的狀態、完整的審批流程、駁回信息的快速操作、成功信息的必要通知
審批的處理人主要在審批過程做出決策，因此他更在乎的是審批申請內容的信息。比如 審批的信息內容、直接的審批操作、多條審批的管理
當然，在一些大型的集團企業當中，會將審批分為審批「直接處理人」與「間接處理人」（后文以 直處人、間處人 簡稱）
「直處人」作為審批的第一處理人，也就意味著他的意見至關重要，如果「直處人」通過過后，相對而言整條審批的通過幾率會大大增加。通?！钢碧幦恕故亲鳛樯暾埲说闹毕殿I導居多，因此多數情況下可以理解為直屬領導進行 “把關”
「間處人」作為審批的后續處理人，同樣在流程當中也十分重要。但在有些情況下，比如一些偏平化管理的企業，「間處人」更多像是“權利”的象征，因為權利已經下放給「直處人」，而「間處人」起到知曉審批以及企業的規章制度要求
審批抄送人主要起到通知對應角色的作用，因為一條審批的出現，會造成諸多影響，假設今天你需要申請事假，如何通知同部門的其他成員呢？
發送即時消息，顯得過于簡單；每個打電話，又有些麻煩；發送企業郵件，又怕他們沒有看到
這時候抄送人會顯得尤為關鍵
通常抄送會有企業流程上管理員配置的固定抄送人，以及發起人選擇的自行抄送人 兩種類型
固定抄送人 角色通常與管理員配置整個流程有關，他是角色當中 管理員 所配置的重要通知人，比如今天你的請假信息，肯定會告知行政，像這類默認的通知流程，則可以將其設為固定抄送人
自行選擇抄送人 則是提供給發起人自行選擇，該條審批可能會影響到的相關人群。比如就是發送給同事，讓他們知曉今天你不在崗位上，因此自行選擇可以增加審批抄送的靈活性
這里肯定會有很多讀者會問，我選擇抄送人與我發消息給同事，有什么區別么？
看似完全相同，實則有明確的區分
通過消息，將審批內容傳達，本質上是你自行將內容發送給對方，對方會對于你這個消息的真實性會產生疑問？你是否通知了
而選擇抄送，更為權威，更能體現你這條消息的真實性，并且整個流程都已經由領導進行批準，因此不會存在太大問題
其實審批的本質就是一組消息，而這一組消息當中，申請人 通過 表單配置 去獲取需要補充的消息內容，而流程會根據企業所配置的流程方式將這一組消息進行合并轉發給對應人，而審批人則需要對這一組消息進行回復“通過、駁回” 來讓整個流程繼續延續
審批當中，最主要的便是流程。因為你可以通過查看流程圖，去了解整個企業的組織架構、規章制度、員工管理方式
串行審批主要是指當一個審核節點通過后，才能進入下一個審核節點。如果節點駁回，則可以根據業務實際需要，配置駁回的返回路徑，會有：撥回到發起人、駁回到上一個節點、或駁回之前任意一個節點 重新審批
并行審批是指一個審批節點存在多個角色同時審批，這里會存在兩種情況
任何一個人審批通過，則可以進入下個節點，這也就是系統當中常說的 「或簽」
所有審批人員通過，才能進入下個節點，這也是系統當中常說的 「會簽」
條件審批就是將企業當中的規章制度映射到實際的項目當中，通常就是某個審批內容會根據 金額多少、實際數量 等 進而選擇哪個角色進行審批
比如銷售人員在申請一個合同審批時，會根據合同金額的不同，審批人也會有所差異
當金額小于8000時，合同直接由財務專員進行審批，進而讓流程進行快速審批
當金額大于8000時，合同會由銷售主管進行審批，讓銷售主管能夠掌握企業的重要合同
通過發起人選定一個審批事項后，將自主選擇后續的審批內容，進而實現審批的后續選擇。這是一種較為靈活的審批流程，當企業尚未形成標準化流程時，自主的核心就是當發起人發起一個審批，提交時需要自行選擇下一個環節的審批人。而下一個環節的審批人審批通過后，可以選擇繼續流轉到再下一個人去審批，或者結束這個流程
審批的背后，它映射的其實是企業的一條條管理制度，而它的設計一定是要滿足企業的實際需求。因為你負責的產品不是為某一家企業提供的服務（定制化產品），并且企業管理制度的變動其實是家常便飯，你需要去考慮一個通用的解決方案，這個解決方案拆解下來會分為三個內容，分別是：申請表單、流程配置、更多配置 進行講解
審批表單是最為一個“簡單”的用戶可配置化表單，因為現如今大多數B端產品都是以 SaaS 作為基礎（如果是定制化產品 它的審批內容、流程也不會是固定不變的）也就意味著審批表單需要為企業提供“DIY”的方式，通過表單提供不同的字段類型，去構建審批的實際要求
比如在一個選擇請假時，年假、事假、病假、婚假 等的要求都會有所不同
如何知道他們的差別，其實可以根據《勞動法》的相關規定 以及 各個其實的實際公司制度，進行個性化的處理
在申請婚假時，需要上傳你的結婚證，以證明其真實性；在病假時，需要有3甲醫院的病情證明；在年假時，則需要有你的剩余年假天數。而這些特殊訴求，其實都需要在表單當中進行各種定制化表單
當然這只是極為常見的 請假 場景，而在實際業務當中的復雜場景（更多需要將 審批與其他系統關聯）一個簡單的表單是沒有辦法進行滿足
這也是很多企業會發現，無論是飛書、釘釘、企業微信，都沒有辦法滿足其實際流程需求。又沒有辦法改變自身流程，只能夠自研、定制化 產品，這也是為什么即便各行各業都有了初具規模的 SaaS 產品，但是還是會有很多企業愿意自行研發軟件
企業可以根據自身的系統流程，在流程配置當中去定制特定的流程。在這個頁面的設計上，需要注意不同參與人的狀態，以及復雜流程時如何才能夠進行清晰的閱讀，因此增加了 顏色區分（發起人、審批人、抄送人）+ 視圖縮放 功能
顏色自然不必多說，整個系統需要統一，因此不能夠只考慮在管理后臺的顏色，是一定要在詳情頁當中也能過保證顏色的一致。這樣才能夠滿足實際業務所需
視圖縮放只是小小提一下，常見的視圖縮放會放在左側，至于為什么，自己稍稍揣摩揣摩
由于流程配置的屬性頁面會涉及很多表單的復雜邏輯，這個只能夠留在我的 訓練營的課程 當中進行拆解，這里就不過多贅述
更多配置項則是審批在實際情況下的特殊處理，比如：申請人修改審批的具體時間、能夠將審批轉發給其他人、出現多次相同的審批人是否去重 等等... 其實就是將審批的設計方案進行“賦能”，去滿足更多企業在實際場景當中的需求，感興趣的同學可以去 釘釘、飛書 了解詳情
審批，核心還是提高企業運轉效率，如果在審批之間，還需要不同角色私下反復溝通，本質上就失去了審批的意義。而審批本身，就是一個典型的B端產品 從場景到需求，進而研發功能，最后又回歸場景，你設計的好與壞，落地到真實的場景當中，試試便知
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
作為設計師，日常工作中我們經常要思考如何吸引用戶轉化。如果僅把“界面設計美觀”作為設計的發力點，很難形成完整的判斷鏈條，完成預期的商業目標。因此，在交互行為層面嘗試“破解”用戶行為發生的背后原因，通過科學的方法“設計用戶行為”就變得更加重要。
行為設計領域有三個非常重要的模型：福格行為模型，成癮性模型以及峰終效應。其中福格模型在輔助我們做行為預判的過程中扮演了重要角色。
福格模型是以耶魯大學教師 Fogg，2009 年發表的一篇論文為中心，闡述了任何一個行為的發生，都需要滿足以下三個要素：
任何一個行為的發生，都離不開3要素：動機、能力和觸發器。因此在設計時需要考慮：
人們是否有產生行為的動機、發生行為的能力，以及一個合適的觸發點。
高動機高能力
這類用戶有付費動機且熟悉產品使用流程，屬于高價值用戶，是產品的真愛粉。在后續設計過程中，我們可以收集用戶反饋，并針對問題改善體驗就行。
高動機低能力
這類用戶需要降低門檻，必要時可以提供幫助和引導。提高操作能力，優化用戶體驗。例如一些應用為低能力群體設計“專屬版”，如針對老年人，推出適老版應用，精簡用戶操作步驟，突出核心功能，便于這部分用戶完成產品主流程操作。
低動機高能力
這類用戶需要提高動機，可以結合馬斯洛需求層次理論找出用戶不同階段的需求。分析用戶需求，挖掘用戶痛點，尋找用戶動機。例如“分享領取大額優惠券”、“每日簽到送積分”、“走路得能量”等，我們可以同過激勵來增強用戶動機。
低動機低能力
這類用戶需要適當放棄，投入產出比較低，不屬于我們的目標用戶。
本次將以 “為家人購買保險” 的優化過程為例，分享運用福格模型把行為設計和商業場景聯系在一起。通過設計引導用戶行為進而助力產品轉化。
背景：
用戶在為自己成功投保“醫療險”后，會為本人再推薦一份其他險種的產品，打造“完善雙重保障”的概念。但某年齡段歲下的用戶因保費過低，在收入來源中屬于ROI較低的群體。
產品目標：
希望該年齡群體在為自己購買完保險后，優先推薦為“家人購買”，因其所獲得的商業價值效益更大。預期通過為家人購買保險，拉動這部分用戶的整體ROI。
設計目標：
引導用戶為“家人購買”一份“醫療險”
用戶已經為自己購買過一單保險的情況下。大部分用戶具有健康保障需求，其本身也有購買保險的動機。在模型中偏向于“高動機”人群，
本次設計的發力點：強化這部分用戶“為家人購買”的動機，降低購買保險的行為成本，同時在適當場景給予用戶觸發提醒。
我們一般通過兩種途徑增強用戶的行為動機：心理刺激和物質刺激。
1.營造稀缺性：通過限時限量等方式營造稀缺性。
2.強化“家庭健康保障”需求。安全需求是人的基本型需求。通過“父母有保障，我更安心”等文案迎合用戶對安全生活的向往。
3.顯示社會認同信息。尋求社會認同是更好一層的心理需求。通過標簽外露承保公司名稱，尋求社會認同，并側面透傳出專業性，建立用戶信任感。
“物超所值”，便會促進行動。在頂部向用戶宣傳為家人買的“產品優勢”，增強付費動機
我們可以通過降低用戶門檻，來提高用戶完成這件事的能力。
1.降低門檻—降低用戶成本（金錢）
1元為父母升級,降低用戶參與成本。
2.降低門檻-降低操作成本—簡化選擇（時間）
根據業務目標，指定最優推薦策略。如本次流程最優推薦策略是為父母購買，去掉可能影響用戶決策的其他選擇項，改為僅顯示最優推薦策略下的唯一指定模塊。
3.降低門檻-降低認知成本—結合圖像（精力）
“ 產品適用群體圖片+文字”的表達，在當前情景下可快速傳遞信息。便于用戶快速理解當前流程是在“為誰購買保險”，從而降低以往用戶將“家人身份信息填寫錯誤”的情況發生。這樣設計減輕了用戶的認知成本，提?了信息傳遞的效率。
1.觸發器“醒目”
膠囊形狀的「提交訂單」按鈕在“方形卡片”上十分醒目，是觸發用戶行動的視覺提醒。
簡潔按鈕文案設計，如“限時升級”，將有助于加速用戶的決策，從而促進轉化。
在日常工作中，可以借助福格行為模型解決商業目標中的引導、轉化、留存等問題。在做設計時，我們首先也需要思考設計目標 ： “我們想要用戶發生什么行為？”
我們可以通過福格模型從“動機、能力、觸發因素”等角度進行設計思考，更加深入的理解用戶行為背后發生的原因和影響用戶決策的因素，幫助我們更好的完成產品優化和體驗升級，最終達到商業目標。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
定量研究指的是對用戶的某些特性進行數字化測量并進行統計研究。對于定量研究來說，數據的統計以及數據的分析是尤為重要的。
首先，需要說明數據修養，與統計技術的水平無關。
數據修養指的是培養科學的、正確的對待數據的態度，在收集、分析和解讀數據的過程中做到求真務實。
良好完善的研究設計是正確進行數據分析的前提，如果沒有科學的設計，良好的數據質量，那么無論用什么方法和軟件都無法獲得真實的結果，統計就變成了“數字游戲”。
從預期的研究結果出發，向前逆推數據分析方法和研究設計
Step1 · 要解決什么問題
Step2 · 期望得到的研究結果
Step3 · 需要的統計分析方法
Step4 · 需要的數據類型
Step5 · 對應的調查方法
Step6 · 研究的設計
在問卷開始前將問卷框架設計做好
線上問卷調查是目前我們所用到最主要的調查形式，進行線上問卷調查時，誤差的主要來源包括抽樣誤差和非抽樣誤差兩類。
抽樣框誤差：抽樣框誤差產生于目標總體與抽樣框的不一致，因抽樣框引起的誤差主要有樣本的代表性問題（如是否能代表網民、是否能代表某類用戶總體等）以及抽樣框重復（用戶重復回答）以及抽樣遺漏（如無法包括競品用戶等）。
解決方案：正確界定網絡調查的適用范圍，網絡調查應主要針對以網民為對象的項目。
無回答誤差：樣本中的部分個體不愿意或是無法完成調查問卷而產生的誤差，原因：
（1）激勵手段不夠，缺乏交流。
（2）技術障礙，如網速不穩，瀏覽器不兼容。
（3）對隱私的顧慮。
解決方案：網絡調查與抽樣技術相結合，進行問卷投放跟蹤（如提醒用戶填寫），或者結合有一定激勵性質的產品運營手段。
計量誤差：計量誤差又稱登記誤差，是指由于各種原因使得調查和計量的結果與真實情況不符而引起的誤差，如，問卷歧義，被調查者對調查內容定義和概念誤解所造成的誤差。
解決方案：科學設計調查問卷，要求調查問卷更易于理解、更加完整、更具有親和力，保證被調查者做出準確而真實的回答。
是指用戶對一種產品或服務進行消費體驗后的感知，與其期望值進行比較后，所產生的的一種心理狀態。
1974年，本田公司就進行了有關客戶對汽車評價的調查，但是當時沒有“顧客滿意”的概念。
1989年，美國密歇根大學商學院質量研究中心的費耐爾博士將計量經濟模型引入顧客滿意度測評建立了費耐爾邏輯模型，得到廣泛的應用。
20世紀90年代后期，CS（顧客滿意度）理論已成為在全球工商界開始盛行的一種新型的企業文化和管理哲學。
與此同時，許多國家（地區）先后對顧客滿意度指數測評的理論、模型和方法開展了全面深入的研究。
對事物的特性變量可以用不同的規則賦值，因此形成了不同測量水平的測量量表?；镜臏y量量表有四種：類別量表、順序量表、等距量表和等比量表。顧客滿意度指數測評中應用的五級李克特量表就屬于其中的順序量表。一般采用的五級態度是：滿意、較滿意、一般、較不滿意和不滿意，相應賦值為5、4、3、2、1。也可為相反的順序，將五級態度在題目開頭給出，然后讓被訪者根據對每個測評指標滿意程度直接在相應的方框上打鉤或者畫圈。
顧客滿意度指數測評體系反映測試對象的質量水平狀況和特征，而每一測評指標的變化對顧客滿意度指數變化的影響程度是有所不同的。反映影響程度的重要尺度是權重，權重的確定與分配是測評指標體系設計中非常關鍵的一個步驟，對于能否客觀、真實的反映顧客滿意度起著至關重要的作用。
即以同級指標集內重要程度最小的指標為基礎，其他指標與之比較，作出是其多少倍的重要程度的判斷，然后逐一分析，得出各指標的權重。
我們將重要程度分為非常重要、重要、比較重要和不重要四個等級，把所要比較的指標配成對，然后一對一地對指標的某一特征進行比較，做出重要程度判斷：
a、當A與B比較時，A非常重要，B不重要，則A=4，B=0；
b、當A與B比較時，A重要，B比較重要，A=3，B=1；
c、當A與B一樣重要，則A與B分別記為2。
是美國著名運籌學家賽迪給出的1~9標度法，它根據各測評指標的相對重要性來確定權重。層次分析法可以通過測評指標兩兩比較，使復雜的無序的定性問題能夠進行量化處理。
主要作用是分析顧客滿意度指數模型中各結構變量之間的關系，分析顧客滿意度指數主要受什么影響，從宏觀上如何進行調控才能更有效提升CSI。具體來講，就是在百分制的計分方式中，因變量變動1分，直接影響到后面結果變量變化的分值。
如圖中所示，產品質量提高1分，將直接影響顧客滿意度提高0.36分，結構變量除了這種直接影響外，還可以再模型中箭頭所指的方向上產生間接的影響。如圖中顧客期望除了對顧客滿意度的直接影響是-0.11外，還通過顧客對質量的感知和顧客對價值的感知對顧客滿意度產生間接影響，間接影響系數的大小可以由所有從顧客期望到顧客滿意度的路徑上的系數乘積的累加和表示，計算方法為：
（-0.41）x0.94x0.26+（-0.41）x0.36+（-0.01）x0.26=-0.25
顧客期望對顧客滿意度的直接影響系數和間接影響系數相加可以得到全部影響系數，即（-0.11）+（-0.25）=-0.36
同理，可以計算出其他結構變量對顧客滿意度的直接影響系數、間接影響系數和全部影響系數。
如果能將競爭對手的指標分值也進行路徑系數分析，那么多企業的戰略決策制定，為推進企業發展將會更具有實際指導意義。
可用于分析顧客特征的類型，例如（1）價值取向型。（2）質量取向型。根據不同顧客的需求和體驗，提升其滿意程度。更有利于精細化運營。
進行顧客滿意度研究，其主要目的，就是要不斷提升顧客的滿意度，從而建立更多的忠誠顧客群，為企業帶來更大的利潤和收益。通過“顧客凈推介值”分析，我們可以進行顧客忠誠度的深入分析、研究，以在這方面能提供更多的數據給企業作為經營的決策參考。
“顧客凈推介值”（NPS:Net Promoter Score）,顧名思義，“顧客凈推介值”指的就是公司現有顧客將公司的產品或服務向其他人推薦的程度如何的測量。這也是預測企業有機增長和區分公司“利潤良性”和“不良利潤”的一種手段。
分析假設：我們可以把企業的利潤分為“不良利潤”和“良性利潤”兩種。
“不良利潤”是以損害客戶關系為代價換來的利潤。如果客戶覺得所受到的待遇不周，則產生的利潤就是不良的。即不良利潤是通過降低客戶體驗的質量來省錢，是向顧客榨取價值而非創造價值。
“良性利潤”則截然不同，如果客戶自愿回頭購買更多產品與服務，而且還建議其他人購買，這樣公司便實現了良性利潤。實際上，滿意的顧客變成了公司營銷部門的一部分，即他們成為了推介型客戶，是公司的最佳營銷員。
例如：
根據本次調查，我們的問題是“您有多大的可能推薦此產品呢？”這個問題作出評價，并把被訪者分成三類，即“推介者”（90分~100分）、“消極滿意者”（60分~90分）和“貶低者”（0分~60分）。用推介者所占百分比減去貶低者所占百分比，就得到顧客凈推介值。
受行為科學家赫茨伯格的雙因素理論的啟發，東京理工大學教授狩野紀昭（Noriaki Kano）和他的同事Fumio Takahashi于1979年10月發表了《質量的保健因素和激勵因素》一文，第一次將滿意與不滿意標準引入質量管理領域，并于1982年日本質量管理大會第12屆年會上宣讀了《魅力質量與必備質量》的研究報告。該論文于1984年1月18日正式發表在日本質量管理學會的雜志《質量》上，標志著狩野模式（Kano model）的確立和魅力質量理論的成熟。
雙因素理論又稱激勵 — 保健理論，是美國的行為科學家弗雷德里克·赫茨伯格提出來的。雙因素理論認為引起人們工作動機的因素主要有兩個：一是保健因素，二是激勵因素。只有激勵因素才能夠給人們帶來滿意感，而保健因素只能消除人們的不滿，但不會帶來滿意感。
第一，不是所有的需要得到滿足就能激勵起人們的積極性，只有那些被稱為激勵因素的需要得到滿足才能調動人們的積極性。
第二，不具備保健因素時將引起強烈的不滿，但具備時并不一定會調動強烈的積極性。
第三，激勵因素是以工作為核心的，主要是在職工進行工作時發生的。
保健因素 - 是指造成員工不滿的因素。保健因素不能得到滿足，則使員工產生不滿情緒、消極怠工，甚至引起罷工等對抗行為；但在保健因素得到一定程度改善以后，無論再如何進行改善的努力往往也很難使員工感到滿意，因此也就難以再由此激發員工的工作積極性，所以就保健因素來說：“不滿意”的對立面應該是“沒有不滿意”。
激勵因素 - 是指能造成員工感到滿意的因素。激勵因素的改善而使員工感到滿意的結果，能夠極大地激發員工工作的熱情，提高勞動生產效率；但激勵因素即使管理層不給予滿意滿足，往往也不會因此使員工感到不滿意，所以就激勵因素來說：“滿意”的對立面應該是“沒有滿意”。
（1）A—魅力質量要素：此質量要素具備時，會讓顧客感到滿意；反之未具備時，顧客也能接受，同時不會感到不滿意。
例如說，海底撈等桌做美甲。
（2）O—一維質量要素：此質量要素具備時，會讓顧客感到滿意，反之未具備時，則會導致顧客不滿意。
例如，火鍋店羊肉越便宜越爽，上網的速度越快越爽。
（3）M—必備質量要素：此質量要素具備時，顧客認為這是應該的，反之未具備時，會導致顧客不滿意。
例如，火鍋店要有牛肉，手機能打電話。
（4）I—無關質量要素：此質量要素無論具備與否，對于顧客，都不會有任何滿意或者不滿意的感覺。
例如，山寨機可以刮胡子。
（5）R—反向質量要素：此質量要素具備時，會導致顧客不滿意，反之不具備時，顧客反而會感到滿意。
1、判斷產品的某一質量特性對于顧客而言，屬于何種質量要素
“顧客就是上帝，但是用戶往往需要的不多，想要的卻太多，為了讓他們更滿意，我們是不是要一一滿足他們？”
2、通過滿意的敏感性分析來篩選顧客滿意度的改進因素
“用戶可能根本不知道他們想要什么，而我們能提供的東西很多，但是資源卻是有限的，應該怎么利用有限的資源來使用戶更加滿意”
Step1，定義質量要素
Step2，構建卡諾問卷
Step3，進行問卷調查
Step4，分析調查結果
Step5，篩選改進因素
列出需要使用卡諾模型問卷進行調查的指標，這些指標可以是滿意度所涉及的系統指標體系中的所有指標，也可以是關注的部分指標。
“官網中xxx方面的信息”
“產品中的xxx功能”
“線下戶外廣告宣傳”
“......”
卡諾問卷的設計思想是從正反兩方面進行提問，以便了解顧客對某一改進因素的看法，然后將這些改進因素區分為“魅力質量要素”、“一維質量要素”、“必備質量要素”、“無關質量要素”和“反向質量要素”.
在卡諾問卷中，每個改進因素都由正向和負向兩個問題構成。正向問題是測量顧客在具有某項因素時的反應；負向問題則是測量顧客不具有該項改進因素時的反應。卡諾問卷中的問題答案采用五種程度選項，他們分別是“我喜歡這樣”、“它必須這樣”、“我無所謂”、“我能夠忍受”、“我討厭這樣”。無論是正向還是負向問題，都是同樣的答案選項。
問卷調查的方法有很多，卡諾問卷并沒有限定必須要什么方法調查，例如，入戶訪問法、攔截訪問法、傳統訪問法、計算機輔助等等。
在獲得了每個改進因素的卡諾需求分類數據之后，分析調查結果，分析調查結果的目的是為了了解每個改進因素的顧客需求分類狀況。需求分類最簡單有效的方式是計算每個改進因素在不同需求類型中出現的頻率。
將顧客對某項改進因素的正向和負向問題的答案填入卡諾評價表，就可以得到顧客此項因素的需求分類：
如果顧客對正向問題的回答是“我喜歡這樣”，對負向問題的回答是“我討厭這樣”，那么在卡諾評價表中，這項改進因素就被分類為“O”，即“一維質量要素”。
如果顧客對某項因素正負向問題的回答結合后，分類是M、A、I或者R，那么該因素就被分別分類為“必備質量要素”、“魅力質量要素”、“無關質量要素”或者“反向質量要素”
另外，卡諾評價表中的分類“Q”，是指有疑問的（questionable）結果，顧客的回答一般不會進入到這個類別，除非這個問題的問法不合理，或者是顧客沒有很好的理解這個問題，或者是顧客在填寫問卷時出現錯誤。
對改進因素的顧客需求進行分類，還不能完全說準確的說明這些因素的改進次序，因此，還需要通過滿意的敏感性分析來篩選改進因素。
滿意敏感性分析是指通過對各種改進因素的滿意影響力和不滿意影響力的分析，來判斷顧客對這些因素滿意水平變化的敏感程度，其目的是確定改進哪些因素會更有利于提升顧客滿意度。
滿意敏感性分析是通過滿意影響力（SI）和不滿意影響力（DSI）兩個方面來測量的，他們的測量公式如下：
滿意影響力（SI）
滿意影響力SI是以魅力質量要素A與一維質量要素O的頻率之和為分子，以魅力質量要素A、一維質量要素O、必備質量要素M、無關質量要素I的評率之和為分母計算得到的，滿意影響力的大小顯示，如果某項因素得到改進，顧客滿意強度會有多大的提升。
不滿意影響力（DSI）
不滿意影響力DSI是以一維質量要素O與必備質量要素M的頻率之和為分子，以魅力質量要素A、一維質量要素O、必備質量要素M、無關質量要素I之和為分母，并乘以（-1）計算得到的，不滿意影響力的大小顯示，如果某項因素未滿足顧客的需求，會對顧客滿意的降低產生多大的影響。
將各因素以SI值為橫坐標、DSI值為縱坐標納入改進滿意因素敏感性比較矩陣中，同時以左上原點為圓點，用半徑為0.707的四分之一圓弧將不同的改進因素進行分割，如下圖：
在因素選擇線右側的因素就是需要實施改進的因素，并且離圓心越遠的因素，顧客的滿意敏感性越大。從圖中可以看出，A和D因素暫時不需要改進，需要改進的因素為B、C、E和F方面，按照重點次序排列為F、E、B、C。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
是指通過測量眼睛的注視點的位置或者眼球相對頭部的運動而實現對眼球運動的追蹤。
是一種能夠跟蹤測量眼球位置及眼球運動信息的一種設備，在視覺系統、心理學、認知語言學的研究中有廣泛的應用。PC/IPHONE/CAR都可使用。
在獲取信息時，眼睛停留在所加工的物體上，稱之為“注視”，超過100毫秒，認知加工。
在轉移加工對象時，人眼在兩個注視點之間的快速動，稱之為“眼跳”，注視點或注視方向發生改變，獲取時空信息，無認知加工。
當測試者與眼睛存在相對運動時，為了保證眼睛總注視這個物體，眼球會追隨物體移動。眼球追隨物體移動，有認知加工。
眼動的本質 = 人注意力資源的主動或被動分配，選擇更有用或更有吸引力的信息。
記錄測試者在整個體驗過程中的注視軌跡，從而可知測試者首先注視的區域、注視的先后順序、注視停留時間的長短以及視覺是否流暢等。
用不同顏色來表示測試者對界面各處的不同關注度，從而可以直觀的看到測試者最關注的區域和忽略的區域等。
考察測試者在每個興趣區里的平均注視時間和注視點的個數，以及在各興趣區之間的注視順序。
例如：用戶視覺順序
問題：確認按鈕位置不符合玩家瀏覽路徑。
分析：圖中是玩家的視覺動線，玩家先看見確認按鈕再看見選擇角色區域，這不符合操作順序，很可能導致有些玩家忽略了選擇角色。
建議：調整一下角色選擇的版面布局，可以考慮將確定按鈕放在選擇角色之下。
例如：眼動注視時間及頻率分析（客戶管理軟件的導航可用性評估）
測試用戶的注視時間統計見表1，可以明顯發現兩個版本在眼動注視時間區別：用戶在使用舊版的系統時，注視的時間比較長；
測試用戶的注視頻率統計見表2，兩個版本在眼動注視頻率有明顯區別：用戶在使用舊版系統時，注視次數頻率比較高，無規律性；
通過注視時間、注視頻率和方案評價等級的對比分析，可以得出評估等級越低（數值越低表示滿意度越高），用戶眼動注視時間越短，用戶在頁面搜尋的頻率相對越少，用戶在較短的時間內能找到想要的功能，頁面影響用戶的干擾越小。
例如：網站的可用性對比測試
對某網站改版前（圖7）和改版后的主頁（圖8）進行可用性對比測試，通過讓用戶瀏覽首頁（不做任何點擊）判定網站的主旨和類型，來捕捉用戶注視點的軌跡圖和記錄用戶在不同位置注視時間，對比網站主頁改版前和改版后信息傳達的有效性。
經過對采集到的數據進行分析，可發現用戶在瀏覽改版前的頁面時，眼動軌跡混亂，掃描路徑長且很多相互交叉，注視點序列分散排布，用戶注視點變換快，無明顯的興趣點，如圖這些數據表明改版前的網站首頁布局不夠合理，沒有重點。
1、可以讓用研工作變得越來越有技術含量，將會在用研工作中扮演越來越重要的角色。
2、但是需要加以輔助測試（如定性訪談）來收集更多的實驗數據，并通過結合分析來得出更多、更有效的結論。
1、眼動研究是可用性測試、問卷調查、后臺數據挖掘等研究手段難以企及的，因為是最直接的反饋用戶使用情況的手段。
2、通過眼動研究，不但可以完整地還原測試者在各個頁面的注視軌跡，還可以通過劃分興趣分析測試者在各區域內容的關注度。
3、眼動研究提供的信息不只是人們是怎樣“看”東西這么簡單，眼動反映了人腦的信息處理過程，眼動模式的特點與腦部的信息處理都有密切的關系。
當用戶打開一個頁面，用戶看了些什么，沒有看什么。什么東西最先獲得用戶的關注？這些信息是很重要的，因為很多時候用戶關注的東西與設計希望用戶看到的是不一樣的，這種差別會通過眼動數據直接顯示出來。
在可用性測試中，遇到用戶既無動作也不說話時，研究人員是最為迷惑的。此時用戶很可能執行任務受阻，而通過實時的眼動記錄觀測，研究人員可以間接地了解用戶的處境 - 用戶是在尋找什么東西，還是有什么東西令用戶困惑（來回注視），還是用戶忽視了相關的重要元素？研究人員可以帶著觀點假設，開展眼動研究來驗證或否決，發現導致問題的真正原因。
呈現眼動研究結果最常用到的是熱點圖，顧名思義，熱點圖呈現的是人們視線的熱點，顏色越紅代表被聚集的越多。作為可視化手段起到了良好的信息傳達的作用。
不同的波形代表著不同的心理信息，比如：
頻率為8~13Hz（平均數為10Hz），幅度為20~100μV。它是正常人腦電波的基本節律，如果沒有外加的刺激，其頻率是相當恒定的。是大腦皮質處于清醒、安靜、閉目狀態時腦電活動的主要表現，睜開眼睛（受到光刺激）或接受其它刺激時，α波即刻消失。
頻率為14~30Hz，幅度為100~150μV。是大腦皮質興奮的表現，當精神緊張和情緒激動或亢奮時在額葉出現此波，當人從噩夢中驚醒時，原來的慢波節律可立即被該節律所替代。
頻率為4~7Hz，幅度為5~20μV。在成年人意愿受挫、困倦、失望、抑郁等情緒刺激時以及精神病患者中這種波極為顯著。但此波為少年（10－17歲）的腦電圖中的主要成分。
這些不同的波形反映了測試者所處的心理狀態。
一般來說，原始的腦電波需要一些技術處理才能讀懂，借助腦電數據分析工具，我們可以把復雜的大腦波形整理成有一個起點，然后是不同波形分布的雜合：
經過更復雜的技術處理，我們甚至可以得到一條總體的波形圖：
腦電波（EEG）在醫學領域已經應用了幾十年，通過對腦電信號的處理與分析，我們能了解對象的認知過程和情緒反應，目前已經逐步商用化。
近些年，神經營銷學、神經電影學楷書走進人們的視野。前者通過腦電波等手段測量消費者觀看廣告、描述產品時的腦電情況，以此來解釋、預測他們的消費行為。后者采用腦成像技術等手段量化恐怖電影的效果，甚至考察觀眾們神經活動的同步性（群體卷入性）來檢查電影控制人們思維和情緒變化的能力。
基于認知神經科學，無需語言，獲知他們對產品的情緒、喜好、關注點、興奮度...因為它研究的是大腦的源頭。
除了學術界，全球眾多頂尖的游戲公司公認情緒在游戲中的重要性，并致力于打造更加Emotional（情緒化的）游戲。
并不是越積極越好
必須能夠喚起強烈的情緒反應
讓玩家情緒不斷波動，正負情緒互相轉化
一款成功的游戲：必須要讓玩家達到沉浸和心流情緒狀態。有三種衡量指標：
定義：參與、融入、代入感的程度
游戲體現：故事性、技巧性、策略性、畫面效果、音效、風格
心理體驗：強參與感、脫離現實、忘記時間、很上癮
情緒體現：強烈的正負情緒的交替
游戲引起玩家的情緒反應。積極的情緒反應體現玩家玩的非常開心，而消極情緒反應可能提示游戲讓玩家產生了受挫感。
定義：非常專注，非常有動力的全身投入，并非常享受的精神狀態。
游戲體現：游戲機制、難易度平衡、目標性、反饋。
心理體驗：持續專注、忘我投入、成就感。
情緒體現：正向情緒為主，正負形撥動；緊張感積累，完成挑戰的成就感。
游戲帶給玩家生理上的緊張程度，SCL值越大，表示游戲越刺激，玩家玩的越緊張，而SCL越低，表示游戲可能給玩家帶來了相對無聊的體驗。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
“復雜是世界的一部分，但它不應該令人困惑，好的設計幫我們馴服復雜，不是讓事物變簡單（如果復雜是符合需求的），而是去管理復雜”--唐納德·A·諾曼
與復雜共處，這是一個有趣的話題。在這個奉行“少即是多”的時代，設計師對于復雜噤若寒蟬，認為優秀的設計應該簡潔明了，若無必要，勿增實體，而復雜則常備被視作失敗設計的標簽。設計師為了保持設計上的簡約挖空心思，甚至試圖通過削弱功能的方式來降低產品的復雜度，得到自己想象中的完美設計。然而一味追求“簡單”的設計真的符合用戶的實際需求嗎？從心理學的角度來看，復雜的事物往往功能強大，而功能強大意味著更好的服務與更高的價值，用戶也更愿意為之付費。當我們購買商品時，我們會仔細斟酌，拿著產品的功能列表反復比對，這個時候我們忘記了產品復雜與否，更多考慮的是功能是否滿足自身需求。
對于大部分B端產品而言，復雜或許難以避免，復雜是出于實實在在的業務的需要，而非某位設計師的錯誤喜好。B端產品之所以給人感覺會相對復雜，是因為產品需要完成復雜的工作任務，界面內承載的信息內容較多，在視覺上會帶給用戶壓力，直觀感受上覺得產品很復雜。但是這些信息又都是必需的，如果缺少這些必要的信息，會對用戶理解和使用產品造成阻礙。就如同飛機的駕駛艙，密密麻麻的按鈕如此復雜，但是每一個按鈕都有著相應的功能，不可或缺。既然復雜難以避免，那么作為設計師我們不應該被動接受或盲目拒絕復雜，我們應該學會如何與復雜共處，去嘗試馴服復雜、管理復雜。
相信很多設計師和我一樣，經歷過現代主義浪潮的洗禮，對于簡約的設計有著或多或少的偏好。因為這種偏好，在自己進行設計時也希望能夠選用這種風格，在設計時刻意的去追求界面簡約，卻忽略了界面上的簡約不等同于產品易于理解和使用。從心理學的角度上看，復雜的事物更容易理解，簡單的事物反倒令人困惑，一味的追求簡單反而會讓事物變得復雜。
B端產品的目標是降本提效，追求簡約的設計思想在B端產品的設計中并沒有那么適用，為了提升用戶的操作效率，我們需要將一些能夠幫助用戶理解的信息與常用的操作直觀的展示給用戶。這會在一定程度上增加界面的復雜度，但是相較于產品視覺界面會因此變得復雜，產品的易用性和操作效率對于B端產品而言會更為重要。
與復雜共處的前提是能夠理性地看待復雜，復雜本身的含義即非褒義也非貶義。復雜描述的是事物的狀態，它在詞典上的解釋是擁有很多即錯綜復雜又相互關聯的組成部分的事物。產品復雜與否是由產品本身所從事的業務和需要完成的任務來決定，就像我們不能要求一個做機械結構設計的工程軟件做得像一個圖畫板一樣簡單，因為兩者的功能需求不是一個層面的，所以我們也不能單純的將產品簡潔還復雜作為評判一款產品優秀與否的標準。
我們之所以對復雜懷有畏懼，其實更多的是畏懼令人困惑的復雜，復雜與困惑有著本質的區別，理解他們之間的區別很有必要，復雜描述的是事物的狀態，而困惑表述的是用戶使用產品時的心理。復雜的背后可以擁有規則與邏輯，理解這些規則和邏輯，能夠幫助我們理解和使用產品。而令人困惑的產品往往缺少這樣的內在規則與邏輯，用戶難以理解產品的運轉機制，需要花費很大力氣才能完成有效操作，容易讓用戶產生挫敗感。產品可以是復雜的，但是不應該讓用戶困惑。
在很多復雜的傳統線下業務數字化轉型的過程中，為了讓產品易于使用，設計師需要深入到一線，去了解真實用戶在線下業務場景中是如何處理日常任務的，在流程線上化過程中也需要遵循這樣的業務流程，這樣能夠讓用戶更快上手，而如果我們在設計過程中不去參考用戶在線下的操作場景，按照自己的想法去意測用戶的行為，這樣設計出的產品背離了用戶的心理模型，缺乏內在邏輯，會讓用戶感到混亂困惑，陷入深深的麻煩。
基于產品本身功能需要，我們可能無法很主觀的去降低產品的復雜度，這就需要我們在進行產品設計時花費更多的心思，通過對業務流程、頁面布局、信息呈現上的調整與設計讓產品變得清晰，不讓用戶陷入困惑。如下圖的關于表單編輯器的A\B兩種設計，用戶在編輯器內完成一系列針對表單的編輯、配置操作，然后發布表單。方案A中將這些表單編輯配置項通過tab進行排列，這種方式結構簡單，但是擴展性較差，過多的欄目也容易讓用戶陷入困惑，不清楚需要完成哪些配置項才能進行發布。方案B中采用了步驟導航加側欄導航的雙層導航結構，在步驟導航上給出完成表單編輯配置的主要步驟，在大的步驟下用側欄導航承載小的編輯項，結構清晰，且能夠對用戶編輯表單提供一定的幫助指引。雖然兩種方案信息內容上都一致，視覺觀感上甚至方案B更為復雜，但是方案B在這里可能是更合適的方案，因為方案B在配置流程的指引上更為清晰，也更貼近用戶心理模型，即使沒有使用過在線表單的用戶也能理解產品流程，因而用戶能夠更容易的完成表單配置并發布表單。
我們在使用產品時，都會有一個大概的心理預期，會認為某一類型的產品會較為復雜，某一類型的產品會相對簡單。為什么我們會有這樣的認知呢？是因為我們知道這些產品大概有哪些功能，而這些功能就決定了產品的復雜層度。產品的復雜程度由產品的業務與功能決定，而不是依照設計師的自我喜好，像如淘寶、京東這類的購物網站、擁有著很多的欄目，所以淘寶、京東的界面相對來說較為復雜；而像百度這樣的搜索引擎功能相對來說比較簡單，所以界面設計相對簡單干凈。
我們可以容許一個功能強大的產品設計得相對復雜，但是一個功能簡單的產品設計得復雜難用就是一個災難。作為設計師我們需要根據產品的實際需要來進行設計，即不過度設計，也不執著于追求簡約，而是基于需求恰到好處的進行設計。
復雜的產品會有好的用戶體驗嗎？答案是肯定的，用戶體驗的好壞與產品是復雜還是簡單并沒有直接的關系，很多時候復雜的產品也能帶給我們良好的用戶體驗，在互聯網產品中，我們可以看到很多復雜的產品，這些復雜的軟件產品，一點點的改變著我們的生活與工作方式，讓我們生活與工作變得便捷與高效。
首先可以看看我們的國民級電商應用淘寶，乍看淘寶的界面，可能會覺得十分復雜，甚至會給人一種眼花繚亂的感覺，但是包括我在內的許多人仍然十分喜歡逛淘寶。淘寶內除了有本身的淘寶、天貓店鋪外還有專做海淘的天貓國際，做社區團購的淘鮮達，專做拍賣的阿里拍賣等數十個板塊，業務繁多，功能復雜，但這幾乎很難改變，因為之所以做這些業務和功能背后都有著商業上的考量。從交互設計的角度看，雖然淘寶的業務和功能繁多，卻有著清晰的布局、信息對齊、內容組織，產品盡管復雜，但并不令人感到費解和困惑。購物流程也與用戶在線下購物流程相仿，貼近用戶的心理模型，用戶容易了解產品功能、容易與之交互，整體上有著良好的用戶體驗。
又如我一直在使用的一款筆記軟件Notion，Notion相對于印象筆記、有道云筆記而言更為復雜，需要花費一定的時間成本學習才能夠從容上手使用，但是這并不妨礙Notion被眾多使用者所追捧。Notion的很多功能在使用之前，甚至都不會想到會出現在一款筆記產品里面，如甘特圖，多維表格等，這類功能一般出現在項目管理類軟件中。而Notion塊結構的布局模式，讓筆記能夠自由拖拽，擁有了極強的自由度，用戶可以很自由的用各種各樣的形式來記筆記，要是你肯再花一些心思，你甚至可以在Notion內搭建一個個人專屬網站來記錄的學習知識，打造個人專屬知識庫。將我們習以為常的線性筆記思維，轉變成縱向思維，甚至是網格狀思維。Notion無疑是復雜的，但是這樣做是為了給用戶提供的強大功能和極高的自由度，這些功能恰恰也切合了用戶的需求，創造了一種全新的筆記體驗，帶給用戶愉悅的使用感受。
簡單是產品追求的最終形態嗎？其實未必，很多時候產品設計的過度簡單反而會給用戶帶來麻煩。為了追求簡單的設計，不可避免的就需要隱藏一些信息或者拉長操作路徑，這是一個權衡的過程，我們在做設計時也會經常面臨這樣的抉擇，是追求視覺上的簡約美觀還是信息傳達準確性與操作上的效率。給用戶一個簡約美觀的視覺感受無疑很重要，人們對于美的事物往往更有耐心，也更愿意去探索。但是對于一款針對B端用戶的效率軟件、辦公應用而言，準確的傳達信息，幫助用戶進行判斷，頻繁使用的功能設計得更高效便捷，這些點能帶給用戶更實際價值，也是我們在設計產品時應該優先考慮的點。
特別是在一些專業性的軟件中，如果我們為了追求簡約而弱化或者省略掉一些關鍵信息，還有可能會導致用戶錯誤操作的出現，造成嚴重的后果。試想一下當你在使用軟件編寫一個計算字段時，軟件提供給你了計算公式卻沒有就近給你提供計算公式的解釋和用法示例，導致你因為書寫上的不規范使得計算結果頻繁出錯。這時你可能會滿懷憤怒的抱怨為什么產品會如此難用，為什么不能配置過程中給到更多的反饋與幫助信息來減少配置錯誤的發生。
前面我們了解了關于復雜的定義，認識了復雜與困惑之間的區別，也明確了在B端產品中復雜或許難以避免，復雜是出于實實在在的業務的需要而非某位設計師的錯誤喜好，既然復雜無法避免，我們就應該學會與復雜共處，管理與馴服復雜。那么如何與復雜共處呢，有一些策略或許可以給予我們一些思路。
復雜與困惑的本質區別在于復雜的背后隱藏著規則與邏輯，而困惑缺少這樣的規則與邏輯，讓人無法預測與揣摩，對應到軟件產品的設計，一款成功的優秀的軟件產品，應該是易學易用、能夠滿足用戶預期，用戶能夠直觀的理解產品的流程與主要功能，并通過產品實現自己的目標。那么具體到軟件的設計上我們應該怎樣做呢？
這里可以看看我們團隊正在使用的研發管理工具TAPD，TAPD是一款敏捷研發協作工具，凝聚了騰訊研發方法及敏捷實踐精髓，其中敏捷開發的方法就是TAPD的內在規則與邏輯，有過敏捷開發經驗，理解敏捷開發流程的的開發人員能夠快速的上手使用TAPD，對于不了解敏捷開發的開發人員也可以通過產品幫助中心學習敏捷開發思想，進而理解產品的功能與流程，因此雖然TAPD功能與頁面結構相對復雜，但是基于對敏捷開發的認識用戶還是能從產品復雜的功能界面中摸索出一條操作路徑，實現自己的目標。這就是產品擁有內核思想以后能夠帶來的直觀好處，將原本零散的功能點通過特定邏輯鏈接成操作流程，幫助用戶更好地理解與使用產品。
相同的在我們公司自己的一個項目中我們也運用了同樣的方法，在我們公司之前研發的一款crm產品中，為了給用戶提供最佳的銷售實踐，幫助用戶更快上手使用我們的產品，我們在設計產品時尋找了硅谷藍圖團隊做了顧問咨詢，并依照硅谷藍圖的銷售轉化路徑來構建我們的產品體系，確定產品功能，梳理產品中的業務流程。并希望在以后為客戶做實施的過程中能夠將硅谷藍圖的銷售方法一起帶給用戶，讓用戶能夠更好地使用我們的產品，實現產品的最高價值，為中小企業銷售團隊賦能。
通過前面兩個案例其實我們可以感受到，當一款復雜的產品有了內在的規則與邏輯以后，用戶理解和使用我們的產品會變得更順暢，用戶不會迷失在茫茫的功能之中，通過理解規則與邏輯，用戶能夠對自己操作結果有一個大概的預期，而不是處于困惑狀態，作為設計師的我們也可以將這種規則邏輯作為我們設計的引導，讓我們的設計更為系統和有條理，讓產品不再是一堆功能的堆疊，各自為戰。
復雜是用戶的一種心理感受，用戶覺得產品復雜除了產品本身結構信息復雜之外，也是因為產品在設計上沒有貼合用戶的心理預期，用戶很難理解產品的流程與交互，所以貼近用戶心理進行設計就顯得尤為重要。這里我們需要先了解三個概念，實現模型、表現模型和心理模型，三個概念的釋義如下：
實現模型：產品是怎樣工作的
心里模型：用戶認為產品是怎樣工作的
表現模型：通過設計來讓用戶認為產品是怎樣工作的
表現模型越接近心理模型，用戶就越容易了解產品功能、容易與之交互。表現模型越接近實現模型，用戶越難理解產品，產品就越難使用。復雜產品在用戶體驗過程中的痛點在于用戶需要花費時間學習或培訓之后才能了解產品的運轉機制，很多B端產品在設計時更多的偏向于實現模型，用戶在使用產品的過程中會發現很多地方的交互和自己心理預期并不一致，使用過程中會遇到很多的阻礙，影響整體的使用體驗。對于一款復雜的產品而言，我們需要讓我們產品的表現模型更接近于用戶的心理模型，這樣用戶能夠更容易了解產品的功能，并與之交互。
大家使用電腦時有沒有遇到過類似下圖這樣的電腦報錯信息，里面是一堆的專業名詞，看得人一頭霧水。這時候我們能做的只有默默的打開百度，去了解彈窗里面講的內容究竟是什么，了解后才明白原來這樣，然后按照百度上操作步驟一通操作，僥幸解決了問題。但是當下次我們遇到相同問題時，可能還是不知道如何解決，無可避免還是需要求助百度。這個就是表現模型貼近與實現模型會帶給用戶的困擾，用戶不是專業的開發者，他們不了解也不需要了解產品背后的實現邏輯，這對用戶而言是沒有價值的，給予用戶這些信息不能對用戶起到預想的幫助作用。貼近實現模型進行設計會讓用戶與產品交互變得困難，變相的是在人為的增加產品的復雜度，與復雜共處，我們需要學會貼近用戶心理進行設計。
復雜的產品往往功能、頁面繁多，如果頁面內的視覺元素以及交互各自為戰，那么放大到整個產品就是一個災難，不僅是產品給用戶感官上不統一、整體性差，過多的交互模式也會增加用戶的學習與記憶成本，用戶在這些相視功能但是不同的視覺與交互的模塊之間容易陷入困惑，對用戶使用產品造成困擾。針對這個問題，現在越來越多的公司開始通過搭建組件庫的方式來規范自家產品內的視覺與交互，一個規范完整的組件庫的確能夠在很大程度上解決產品在視覺與交互上的一致性問題，通過模塊化解決方案，也能降低冗余的生產成本，實現產品快速開發。因此很多人也認為搭建好組件庫就能一次性的解決產品體驗一致性問題，但實際上就算一個產品有了一個自己的組件庫，依舊還會遇到體驗上統一性問題，這是為什么呢？
在原子化設計理論中，粒子是構成頁面的最小顆粒，粒子構成簡單組件，簡單組件到復雜組件，再到區塊、頁面。雖然用組件能去構建頁面，但是還會遇到頁面結構、交互不一致的問題，設計師各自使用組件去搭建并不能提升我們的效率和解決設計一致性的問題，在末端設計并沒有做到約束。因此我們在構建好組件以后還需要繼續抽取出了頁面級的組裝結構和交互模式。
這里我們拿B端產品中常見的列表頁來舉例，縱觀所有后臺列表頁面，抽取后無非就分為這么幾個區域。不同的業務可以通過基礎組件和樣式定義符合自己業務線的子模塊。比如列表頁中的篩選區，在不同的業務場景下，對篩選器的需求也各不相同，簡單的可能只需要使用標簽選擇就能夠完成篩選，復雜的可能添加很多的篩選項甚至選項之間還有且或關系，我們需要根據實際的業務場景設計適合的篩選器，但是需要注意的是一個產品中用到的篩選器形式不應太多，我們需要抽取歸納出三四種篩選器形式去覆蓋我們產品內所有的篩選場景。來保證產品內不會出現各種相識卻有各不相同的篩選器。
B端后臺產品中比較常見的還有表單，我們可以歸納出產品內可能會使用到的表單類型，然后定義出具體的框架結構與交互，在具體的設計過程中在根據實際情況選用不同的表單區塊。
一種常見的信息錄入以及信息展示表單，這種形式是我們最長用。
分布表單適用于信息錄入項以及信息展示項過多，在一個頁面內已經不能合理清晰的組織傳遞信息，或者表單內容的錄入方式或者展示方式存在較大差異，不適宜在一個頁面內進行展示時。按照布局的不同也可分為橫向步驟和縱向步驟兩種。
組合表單因其結構能夠承載更多的信息，每一個欄目都可以承載一個獨立的表單頁，有效的管理信息。
很多時候我們也會用彈窗來承載表單，好處是交互銜接流暢，不用跳頁。
將產品中類似的區塊做成最佳的交互模式范例，能夠最大的程度的規范我們產品中的交互，這樣才能真正的實現產品體驗上的統一，化繁為簡，讓復雜的產品也能夠調理清晰，上手簡單容易。在面對復雜的系統級軟件時，在統一組件樣式的基礎上還應該統一產品內的交互模式。
復雜的產品頁面內信息往往都特別繁多，如果不做好信息歸納，用戶將很難把握住重點內容，信息獲取效率低下，十分影響用戶的使用體驗，所以信息的強弱的整理十分重要，那么什么樣的信息是對用戶而言重要的信息呢？
信息設計大師愛德華·塔夫特認為優秀的視覺設計應該是“將清晰的思考視覺化”，他還認為只有充分理解觀看者的“認知任務”及一些設計原則才能設計出優秀的產品。
如何找到對用戶真正重要的信息需要借助到產品設計中一個十分重要的工具--用戶模型，通過調研的來得用戶模型是對于我們產品客戶的抽象歸納，通過用戶模型我們可以確定哪些功能對于用戶而言是高價值的重要內容該重點突出，哪些內容相對不是那么重要可以弱化處理，通過對于頁面內容強弱的劃分，用戶能夠更快的獲取到對自己有用的內容，盡管頁面仍舊復雜，但是信息劃分合理、層級清晰、表意明確的頁面人就能夠帶給用戶良好的用戶體驗，幫助用戶高效的處理任務。
復雜是產品的本來特性，本身不含褒貶，但是如果復雜不加以控制，讓其發展為困惑與混亂，這對于一款產品而言絕對不是一件好事情，這樣即使產品功能上很優秀，用戶也無法長期忍受，一旦市場上出現替代產品，那么忍受已久的用戶也將拋棄產品轉向體驗更好的新產品。
曾經我也是一個極簡主義的追捧者，但是經歷過越來越多的設計項目，我開始發現某些產品復雜性是必需的，將產品做得簡單并不是其核心訴求。真正需要處理的問題也不是復雜，而是混淆的狀態和由此產生的無條理性。解決的方法不是簡單的去除幾個界面元素，讓其在視覺界面上變得簡潔干凈，而是要讓產品擁有內在規則、一致且能夠被理解。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
用戶體驗地圖（Experience Maps）旨在通過描述用戶歷程和故事，使設計師、產品經理等項目成員更好地了解用戶和洞察訴求。所以對于用戶體驗地圖，我們可以將其定義為以下內容：
- 是一種描述用戶故事的可視化工具；
- 是一種幫助設計師、產品經理等更好地了解用戶的共創工具；
- 從用戶視角出發，直觀展現產品流程各個觸點上用戶的痛點、需求和情緒；
- 用戶體驗地圖繪制的形式并不唯一，可以根據項目需求，增減內容。
△ 途家 App 用戶租房 · 用戶體驗地圖案例
通常在接觸到需求之后，設計師就可以開始梳理現有流程、使用用戶體驗地圖了。要注意的是：
- 需要梳理的功能不分大小，都可以使用；
- 做之前，務必要先調研和訪談用戶使用產品的情況。
建議時長：
- 重要項目：120～180 分鐘- 日常項目：60～120分鐘
參與者：
- 必選：設計師、產品- 可選：研發、市場、其他
工具：
- 電腦或白板+便利貼
需要發現和拆解產品現有問題，梳理用戶流程時使用用戶體驗地圖，可以在聚焦階段，整合用戶訴求和業務訴求，共創機會點，找出解決方案，通常在以下場景中使用：
- 新產品設計：需要對需求進行拆解和優先級排序；
- 產品優化：發現產品現有問題，洞察設計發力點。
由此可見，在設計過程中使用用戶體驗地圖作為設計工具，有以下益處：
- 更好的以用戶視角來看產品的體驗；
- 通過共創，項目成員達成共識；
- 確認觸點，作為我們的設計方向；
- 通過用戶痛點找到機會點；
- 幫助梳理產品流程。
△ 用戶體驗地圖共創現場
我們通常會將流程分成4 個階段：定義原則和目的 —— 梳理階段流程 —— 洞察痛點 —— 尋找機會點。
1. 定義原則和目的
首先要了解我們做用戶體驗地圖的原因和目的，包括用戶是誰、解決什么問題、用戶的目標、產品的整體目標、限定條件等等，對用戶群體、整個項目背景和共創任務目標有清晰、全面的認知。
2. 梳理階段流程
首先是劃分階段，將用戶的行為拆分成幾個大的階段，在整理時要注意：
- 在整個產品的范圍之內盡量把故事、流程講完整；- 以廣度優先，而非深度，不要過早的沉浸到細節中。
接下來我們要將主要階段拆分成單個任務，并梳理具體的任務和觸點，羅列出過程中的任務和各個觸點，要做到事無巨細。
然后根據任務和觸點，整理對應的用戶疑問、用戶感受/情緒。通過對用戶的觀察和訪談進行梳理，客觀的描述事實，切勿自說自話或是將自己的情緒代入其中，也不要急于猜想與分析。
3. 洞察痛點
這一步需要我們匯總用戶的痛點，并將痛點分級，洞察用戶痛點背后的真實訴求。這個過程中可以先讓大家在一定時間內寫出自己的想法，每一條寫在一張卡片上，做到先相互不干擾，之后再統一整理和總結。
4. 尋找機會點
通過上述總結，思考新的機會點、解決方案、優化整體流程，并對新流程下的功能做優先級排序。可以通過準備一些問題來刺激大家腦爆出更多的內容，比如：用戶還有其他選擇么？怎么做用戶才能更爽？其他用戶來到這里該怎么處理？等等。在這個階段需要：
- 對內容進行對標、討論，把公認的點保留下來，無用的點剔除出局；- 根據實際情況和項目成本、進度等條件，對新流程下的功能做優先級排序。
在實際的工作過程中，因為項目時間都非常緊張，繪制這樣一個完整的用戶體驗地圖比較耗費時間，所以推薦大家幾個提效的技巧，既可以減少時間浪費，也可以提高共創質量：
1. 事前
充分做好用戶調研，提前準備好用戶地圖模板，可以在開始之前的一到兩天發給參會人員，讓所有人對產品有一個整體梳理和思考，有助于提高大家的產出質量。
2. 事中
如果是優化的產品，可以將設計稿 demo 或者線上產品截圖打印出來，這樣可以增強大家的代入感，有利于想法的輸出。
3. 事后
整理電子版體驗地圖，需要跟隨產品的演進進行更新，上傳到項目共享空間隨時查看。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
在 B 端設計領域中，不管是內部用戶、產品、設計師、開發，還是外部產品、設計師等，總能聽到關于界面「屏效」方面的訴求或吐槽。
「屏效」狹義理解是「界面過度留白」；廣義理解，「屏效」源自諧音“坪效”，指的是每坪的面積可以產出多少營業額(營業額/專柜所占總坪數）。而「屏效」對于界面而言可以指屏幕單位時間、單位面積內的信息可以帶來多少商業效益/效率提升。
為了探索在 B 端產品中用戶為何對「界面過度留白」或「屏效」問題如此敏感，于是我們展開了「屏效」專題的設計探索與實踐?！钙列А箤ｎ}探索主要以「探索」與「實踐」相結合的方式展開，將實踐過程中反復驗證有效的設計策略沉淀成設計手冊，同步將部分功能進行工程化，確?？梢蚤_箱即用。
用戶聲音｜不同的故事相似的訴求
面向內部設計師和終端用戶投放的《高屏效訴求》《中后臺產品滿意度調研》問卷中認為提高屏效能極大提升用戶體驗的設計師占 58.14%；認為提升屏效對體驗有提升的終端用戶占 50.6%。
外部知乎上針對《Ant Design 4.0 設計價值觀》的 13 條反饋里，其中就有 2 點提到關鍵字「效率」。
通過了解不同用戶和產品類型發現，不同的用戶在工作場景的產品使用中有著相似的特征：
案例收集｜發現問題，大膽假設
縱觀 B 端產品界面，發現普遍問題和收錄在解決屏效問題上實踐得比較好的案例，為了逐步突破問題，選擇以數據產品中覆蓋率極高的表格為設計切入點，通過線上跨產品多端地毯式的體驗走查，發現表格三個層次的問題：
視覺、交互層在無需理解業務場景和用戶目標的情況下，都較容易發現，屬基礎問題，但很多「過度留白」的屏效問題往往是信息被組織方式的差異導致的「過度留白」。
綜上我們提出假設：為提高屏效，可從視覺、交互、信息三個層次解決
視覺層為提高信息查閱速度，可以通過提高信息密度；交互層為提高操作速度，可以縮短當前手勢到目標之間的距離；信息層為提高信息被理解的速度，可以通過重組織等方式。
基于假設，我們進行了進一步的桌面研究，查閱論文等書籍，尋找設計理論的驗證和指導。
競品分析｜尋找實踐證據，謹慎驗證
我們知道視覺上界面留白過多（過疏會增加滾屏成本，過密因易串行而影響閱讀效率），以表格「行高」為例，探索各表格在字號、字高和行高的關系，因為不同字體的同字號實際像素高度會有差異，因此選擇的是字高（即文字垂直高度的視覺大?。┒亲痔柣蜃中懈撸瑳Q定留白的兩個重要因子是字高和表格行高，以次推演，界面元素和元素間距的留白關系，探究在視覺層怎樣的留白率能保證甚至提升屏效。
以數據產品中的表格為例，通過直接和間接競對的方式，分別從數據的查閱（視覺）、分析（交互）維度進行功能點和設計細節上的比對，來看看優秀產品是如何解決屏效問題。
直接競對：內部用戶口碑較好的產品 A、B外界競對：同領域的 Tableau、網易有數、金山、微軟表格；間接競對：谷歌郵箱、AntD 等的緊湊主題的常規列表（一維表格）
通過競品分析可以發現，數據分析領域的表格留白率普遍較低（信息密度高），尤其是金山和微軟的電子表格，其次是同類面向數據用戶的 Tableau、網易有數，而谷歌郵箱等工作臺常用的常規列表緊湊版本中，留白率和數據領域的電子表格不相上下。
緊湊版的使用場景也常常是面對數據量巨大的信息呈現，通過切換緊湊主題，提升信息的快速瀏覽，而這也非常適合數據分析場景中巨大的數據量呈現。因此我們的產品在留白率的提升空間極大，而在實際案例實踐中，也已經將表格行高優化至 30px，克制的使用留白。
除此外，競品其他層次的設計也做了比對，總結來看整體設計做法：高密度、少屏數、少留白等。
文字陷阱：中英文字高不等于字號
舉個容易犯錯的競品參考是，谷歌在緊湊版主題下字號 12px，列表行高是 28px，但在 AntD Table 中同樣的 12px 和列表行高 28px 就會發現非常擁擠，缺乏呼吸感。
原因在于谷歌的 12px 是英文字體，實際字高只有 10px，而 AntD Table 的語境是中文字偏多，實際字高有 12px，所以留白的差異在于一個是 18px（28-10），一個是 16px（28-12），這也是為什么決定決定留白的兩個重要因子是「字高」和表格行高，而非「字號」和表格行高，進一步推演，決定界面留白的是「元素視覺高度」和「元素間距」。
論文查閱｜尋找理論證據，謹慎驗證
研究表明，低密度認知負荷低，但高密度任務完成率高，用戶更喜好
參考資料：論文《基于眼動的網頁對稱性和復雜度對用戶認知的影響的研究》
對于信息，用戶需要需要閱讀（視覺），思考和理解（認知），需要點擊按鈕、操作鼠標和打字（行動），在人機工程學中，統稱為負荷。即認知（記憶）負荷、視覺負荷、動作負荷，即分別對應用戶體驗設計的三個層級，信息/視覺/交互。而負荷所花費資源從多到少依次為：認知 > 視覺 > 行動。
認知負荷，舉個例子，看了但不一定懂了。你是否有這么一種體驗——刷抖音，雖然很多（信息密度小，輸出效率低），但可以一直刷下去并且刷很久；而看一門 C4D 教學視頻，即使就短短十來分鐘（信息密度大，輸出效率高），但是卻要看上半天。因為刷短視頻時，你的輸入效率遠高于作者的輸出效率，而看一門 C4D 教學視頻時，你的輸入效率遠低于作者的輸出效率?？墒牵敵鲂适强陀^的，輸入效率是主觀的。如果輸出效率很高，你可以通過提高自己的輸入效率（比如讓自己成為 C4D 專家）來跟上作者，從而變強；否則輸出效率很低（信息質量低），你的輸入效率很高（很專業），信息于你而言都是無效的。
假設負荷總量不變的情況下，那么以上三類場景界面需要對用戶負擔分配大致如下，官網品宣類需要低認知成本，低視覺負擔，視覺要求高，用戶才會被吸引過來閱讀，甚至酷炫的交互更能增加互動體驗而帶來的趣味感，比如蘋果官網，信息量極少、圖版率高帶來極具藝術的視覺體驗、進而吸引用戶愿意跟隨屏幕滾動漸進式接受信息，而 B 端應用因為是專業使用，首先認知方面隨著員工的專業度提高而降低，因此可以通過提高視覺負擔，來降低行動負擔，進而減少操作用時，當然最佳情況是三個維度能整體降低負擔，讓總負擔降低，就需要更多設計巧思了。
面向內部設計師和終端用戶投放的《高屏效訴求調研》預設解決方案中，設計師常用的 Top 3 做法為：【信息層】隱藏不必要信息、【視覺層】提高布局緊湊度、【交互層】減少點擊跳轉。
通過以上的探索，我們可以確定的是，B 端產品面向專業人員的工作界面設計中，提高屏效可從視覺、交互、信息三個層次進行，視覺層-高密度，即提高屏幕信息密度；交互層-低跳轉，通過減少頁面跳轉、手勢與常用操作的距離等；信息層-有效性，通過重組織或輔助信息幫助用戶理解，甚至提供幫助手冊等以提高用戶專業能力。
基于以上的總結，對產品進行優化。下面以一個簡單案例進行設計策略的解讀。一位運營同學想對比 A、B 兩不同人群在相同維度（白領-有信用卡）下的人數差異，尋找運營機會點。
如下表格經過高屏效策略優化前后對比圖，優化前相同維度下不同人群數量的對比需要視線來回跳動比對，而優化后的表格內容，更符合用戶看差異場景下分析目的數據查閱，視線鎖定相同維度，即可快速比對數值大小。
下面以視覺、交互、信息三個層次解剖設計過程背后的思考。
視覺層｜高密度-克制的留白
眼動理論：研究表明，人眼最小可視視角 0.3 度，水平最大眼動舒適轉動區 30度，垂直最大眼動舒適轉動區 55度?？傻贸鋈搜圩钚∽R別范圍 12px，水平視野舒適眼動寬 1200px，垂直視野舒適眼動高 2200px。參考資料：論文《基于眼動交互的用戶界面設計與研究》
如圖，縮小表格行高的同時，目標信息之間的眼動距離隨之縮短，在眼動舒適區內看到更多信息，便于信息的高效獲取。
理論基礎：菲茨定律是用來預測從任意一點到目標位置所需時間的數學模型，它由保羅·菲茨在1954年首先提出。這個模型考慮了用戶定位點的初始位置與目標的相對距離、目標的大小、移動的最短時間。三者之間關系公式為：T=a+blog2(D/W+1)，W為其中目標的大??；D為到目標的距離；T為移動到目標所用最短時間。參考資料：菲茲定律
表格單元格借助交互狀態，增加懸浮出現的信息組件，前置顯示目標單元格明細信息，同時通過交互出現的指示器輔助行列信息的獲取，高頻操作考慮手勢位置放置，縮短與操作目標的距離，以提高整體操作效率。
理論基礎：交互設計四大策略「組織、刪除、隱藏、轉移」參考資料：《簡約至上》
用戶為了對比 A、B 兩不同人群在相同維度（白領-有信用卡）下的人數差異，但內容的重組織方式讓兩數據行需要頻繁點擊滾動條來查看，根據用戶目標，將關聯性大的數據放置相鄰列（即將要對比的人群放置列頭），即可快速查閱，減少眼跳距離。
設計趨勢中常見的大字體大留白界面，但在 B 端場景中，面對緊張的工作節奏，時間和注意力變得尤為可貴，相對而言，基于復雜度守恒定律， B 端信息量大且高頻訪問的產品中，「用得快」要比「看得美」更重要，「高密度」「低跳轉」詮釋的即是「空間換時間」，少一次點擊，少一次跳轉，少一份等待，就多一份時間和效率。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
藍藍設計的小編 http://www.syprn.cn
