一、什么是“查詢”？

“查詢”是指用戶在通過某些查詢條件進行數(shù)據(jù)篩選后，再以“表格”的展現(xiàn)形式進行數(shù)據(jù)呈現(xiàn)，以到達篩選數(shù)據(jù)，快速查看的目的。

查詢的動作主要由搜索和篩選組成，這里要強調(diào)一下查詢和篩選的區(qū)別

搜索和篩選的主要區(qū)別是:搜索可以自定義查詢條件，篩選是必須按照特定的條件字段查詢，如“是”、“否”、“不限”、“男”等條件

一般語境下，不支持模糊搜索的查詢結(jié)果為單項數(shù)據(jù)，如姓名查詢，訂單號查詢，這些查詢操作只能輸出一條結(jié)果，即查一得一

舉例 手機號搜索 139xxxx2918 正常情況下是輸入11位號碼進行搜索數(shù)據(jù) 得到手機號碼為139xxxx2918的各項數(shù)據(jù)，即查一得一

輸入139進行搜索查詢也可以得到多條手機號碼包括139的數(shù)據(jù)，但是一定程度上失去了手機號搜索的意義

所以建議在后臺數(shù)據(jù)查詢的頁面，將搜索和篩選這兩個操作區(qū)域通過換行或者間隔拉大進行比較清晰的區(qū)分，不要在搜索字段的區(qū)域里面混入篩選的內(nèi)容。

二、數(shù)據(jù)過多時，“查詢”為什么要優(yōu)化？

當(dāng)數(shù)據(jù)過多，導(dǎo)致“查詢條件”的搜索項和“搜索結(jié)果”的數(shù)據(jù)項過多的情形。查詢操作優(yōu)先級混亂，增加操作人員的使用負擔(dān)和效率

好的查詢界面可以通過折疊，新增彈框等方式，合理的編排查詢層級關(guān)系，在保證查詢功能完整性的情況下，高頻查詢優(yōu)先展示，編輯方便，預(yù)覽快捷，增加工作效率。

三、操作修改實例

我們來看一下什么樣的界面屬于查詢條件過多，搜索結(jié)果項過多的頁面，分析一下臃腫的部分和解決方法。

查詢頁面可以分為三個區(qū)域，查詢條件區(qū)域、操作按鈕區(qū)域和數(shù)據(jù)展示區(qū)域，分析一下3個區(qū)域冗余和待優(yōu)化的地方才可以設(shè)計出交互良好簡介的頁面

問題分析：

1、搜索條件和篩選條件混合，功能區(qū)混亂

2、單項選擇框?qū)Χ噙x的字段兼容性差，表達效果弱

3、查詢區(qū)域設(shè)計語言混亂，輸入框 選擇框 時間選擇框 數(shù)值框同時出現(xiàn) 視覺上渙散，混亂 

改良目標(biāo)：

1、查詢區(qū)域搜索和篩選字段重新編排，并且進行優(yōu)先級整理排序

2、重新設(shè)計針對多選的字段的選擇組件

3、將同一數(shù)據(jù)類型的查詢字段合并，頁面只出現(xiàn)一個時間組件、數(shù)值框

改良方法：

1、查詢區(qū)域搜索和篩選字段重新編排，并且進行優(yōu)先級整理排序

2、重新設(shè)計針對多選的字段的選擇組件

3、將同一數(shù)據(jù)類型的查詢字段合并，頁面只出現(xiàn)一個時間組件、數(shù)值框

四、具體案例

   鑒于后臺系統(tǒng)的龐大數(shù)據(jù)量，查詢條件難免會出現(xiàn)過多的情況，為保持各頁面簡潔統(tǒng)一，默認當(dāng)數(shù)據(jù)超過N條的時候，將其余查詢條件進行收起處理，防止查詢條件過長，導(dǎo)示影響用戶查看搜索結(jié)果。這種收起狀態(tài)可以通過幾種不同的形式呈現(xiàn)。

對于單個查詢項 

1.相同搜索類型合并展示

鑒于后臺系統(tǒng)查詢種類繁雜，我們大體把他分為關(guān)鍵字搜索，日期選擇，數(shù)值范圍，單選多選

為保持設(shè)計語言統(tǒng)一，可以將關(guān)鍵詞搜索和日期選擇合并展示，折疊不同的數(shù)據(jù)項。

若一個搜索同時存在兩種及以上狀態(tài)，可以通過標(biāo)簽展示刪除

2.搜索項分類選擇

當(dāng)搜索項中的數(shù)據(jù)項過多還可使用另一種優(yōu)化形式，使用下拉框與分類形式相結(jié)合。為方便用戶快

速選擇加入了“本項全選/反選”和“全部全選/反選”的功能。其中，“本項全選/反選”是針對當(dāng)前項

的批量操作，“全部全選/反選”是針對所有項的批量操作。

對于整個查詢區(qū)域的布局

1.折疊收起過多搜索項

2.通過開關(guān)收起過多搜索項

3.通過分類搜索項目，用標(biāo)簽跳轉(zhuǎn)區(qū)分

4.通過增加新彈框，隱藏使用頻率低的查詢項

問題分析：

1、操作按鈕數(shù)量過多

2、操作按鈕樣式類似，無法體現(xiàn)功能優(yōu)先級

改良目標(biāo)：

1、精簡按鈕數(shù)量

2、根據(jù)按鈕功能地位，強化/弱化按鈕樣式體現(xiàn)層級關(guān)系

改良方法：

1、將使用頻率不高的按鈕折疊展示

2、弱化次要按鈕

四、具體案例

問題分析：

1、表頭與關(guān)鍵數(shù)據(jù)列固定列表內(nèi)數(shù)據(jù)行的橫向、縱向數(shù)據(jù)過多

2、無法自定義展示的數(shù)據(jù)列

改良目標(biāo)：

1、將重要的數(shù)據(jù)項固定，梳理過多的數(shù)據(jù)項

2、增加自定義展示數(shù)據(jù)列的功能

改良方法：

1、選擇使用表頭固定及關(guān)鍵數(shù)據(jù)列固定，方便對應(yīng)查看數(shù)據(jù)標(biāo)題及內(nèi)容

2、通過增加自定義字段展示和支持列寬，就能盡可能多的展示需要觀察的數(shù)據(jù)項

四、具體案例

1.表頭與關(guān)鍵數(shù)據(jù)列固定

列表內(nèi)數(shù)據(jù)行的橫向、縱向數(shù)據(jù)過多時，選擇使用表頭固定及關(guān)鍵數(shù)據(jù)列固定，方便對應(yīng)查看數(shù)據(jù)標(biāo)題及內(nèi)容。

2.分類篩選字段展示

數(shù)據(jù)行橫向字段過多時，可將字段分類展示，根據(jù)不同的分類去展示字段，即可全局查看，又可分類查看。根據(jù)用戶選擇的分類進行橫向滾動，方便查看數(shù)據(jù)。

5.自定義篩選字段展示

數(shù)據(jù)行橫向字段過多時，還可將字段自定義展示，用戶可以自定義選擇展示的篩選字段和調(diào)整順序，根據(jù)用戶的要求將常用的高頻率的篩選字段優(yōu)先展示，提高工作效率。

五、實際操作

以上的內(nèi)容是按照查詢頁面的三個部分臃腫的地方提出的解決方法，但是優(yōu)化查詢頁面的交互，使得查詢操作既高效又舒適

還是得依據(jù)各個查詢頁面的業(yè)務(wù)需求，將以上不同的解決方法組合，才能得到一個適應(yīng)于自己當(dāng)下任務(wù)的方案。

方案一

查詢條件區(qū)域    將低頻率的篩選條件折疊到高級篩選中+搜索項分類選擇+將關(guān)鍵字搜索字段合并展示

操作按鈕區(qū)域    將低頻率的操作按鈕折疊到更多按鈕中    

數(shù)據(jù)展示區(qū)域    使用分類展示+表頭與關(guān)鍵數(shù)據(jù)列固定

優(yōu)點    首頁展示查詢內(nèi)容最少，頁面簡潔，可以展示更多查詢數(shù)據(jù)，頁面和彈框內(nèi)將類似字段折疊展示，內(nèi)容緊            湊，操作便捷

缺點    頁面交互路徑增長，編輯數(shù)據(jù)要進彈窗，不夠方便，次要按鈕和次要查詢字段被折疊隱藏，新客戶不易找            到

方案二

查詢條件區(qū)域    通過篩選開關(guān)，選擇是否展示篩選字段 字段選項鋪開展示

操作按鈕區(qū)域    將低頻率的操作按鈕折疊到更多按鈕中

數(shù)據(jù)展示區(qū)域    使用自定義顯示表格字段

優(yōu)點    首頁可以直接編輯字段，展示內(nèi)容最多，直觀方便，可操作性強，交互路徑短

缺點    頁面鋪開高度過高，關(guān)閉篩選開關(guān)無法預(yù)覽篩選條件，打開開關(guān)，則壓縮表格空間，電腦一屏展示數(shù)據(jù)較            少

靈活運用布局和組件的簡化方法，才能搭配出適合自己產(chǎn)品的最優(yōu)設(shè)計，以上內(nèi)容僅供參考，希望大家可以學(xué)到的是設(shè)計方法，而不是組件和布局本身。感謝觀看。

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：站酷  作者酸奶烤鴨

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

體驗經(jīng)濟的時代已經(jīng)到來，無論是實體產(chǎn)業(yè)或是虛擬產(chǎn)業(yè)越發(fā)依賴于服務(wù)和體驗帶來的經(jīng)濟效益，作為互聯(lián)網(wǎng)從業(yè)者，深刻認識到體驗的重量，從尊重用戶體驗到掌握體驗思維，于大多數(shù)角色而言都是一門必修課。

“附近的火鍋店味都差不多，不過A家服務(wù)員態(tài)度好好，而且還有好多免費小吃，吃完還能做美甲，吃它！

“下班一起去新開那家咖啡館打卡不？朋友圈看到裝修好有格調(diào)，甜點看起來也超精致，特別適合拍照呢！

“周末那家密室劇情挺一般的，不過場景氛圍還不錯，挺刺激的，關(guān)鍵是npc好帥，小姐姐也好美，還想去！

“師傅，麻煩稍微快點我趕時間估計要遲到了，“小伙子放心，坐穩(wěn)了”，8分鐘后，遲到前5分鐘，打卡成功。
——僅以此條向重慶全體出租車師傅致敬」

...

很熟悉吧？還有數(shù)不清類似的場景充斥在我們的身邊，近些年來，消費者對事物的評判標(biāo)準(zhǔn)有了翻天覆地的變化，一家餐廳對于顧客的價值，決定性因素不再是單一的菜品口味；服務(wù)員的顏值、裝修的格調(diào)、菜品是否精致、拍照好不好看、服務(wù)態(tài)度如何、有無明星打卡經(jīng)歷，甚至是吃飯免費做美甲這樣的邊際體驗都加入了顧客對餐廳的價值評判標(biāo)準(zhǔn)中，餐廳的效益與顧客的粘性甚至取決于這些邊際體驗；市場的高強度供給和國民經(jīng)濟效益的提升，為消費者帶來了更大的選擇空間，解決剛需不再是人們的唯一追求，“品質(zhì)“一詞開始走進大眾群體的生活，相比果腹而言，服務(wù)與體驗這類精神消費需求成為了新世代消費者所追逐的對象，同時也成為了評判事物價值的新機制。

當(dāng)下市場，商家、消費者與互聯(lián)網(wǎng)平臺形成新的內(nèi)容產(chǎn)業(yè)鏈，消費者通過平臺及商家不斷收獲各類峰值體驗，更有甚者還能以此獲利，而商家和平臺則收獲流量和經(jīng)濟效益，在人貨場的概念中形成生態(tài)閉環(huán)，可謂互相成就。而如何滿足顧客的精神消費需求以及怎樣制造更多更好的邊際體驗，成為企業(yè)的“新基建“，其帶來的效應(yīng)讓人著迷，在資本逐利的市場中，不乏企圖通過這樣的手段筑起高樓的群體。

“在當(dāng)下這個時代，消費趨勢從購買東西轉(zhuǎn)向了購買體驗。生產(chǎn)自動化導(dǎo)致東西越來越不值錢，買回家還占地方。很多高級消費在于購買體驗，比如旅游、參加音樂會，到現(xiàn)場觀看重大比賽。對于商家來說，用戶體驗就是商機，其帶來的最直接的好處就是提升黏性，產(chǎn)生利潤?！?《行為設(shè)計學(xué)》節(jié)選)

從剛需到服務(wù)，消費趨勢如此，用人趨勢也如此；在內(nèi)卷對互聯(lián)網(wǎng)行業(yè)深度滲透的環(huán)境下，設(shè)計師理應(yīng)保有危機意識，單向的剛需能力不再滿足于企業(yè)對設(shè)計師的價值認可，如何打造自身對企業(yè)的“體驗”和“價值”成為大部分人的課題；我個人向來不主張設(shè)計師朝著所謂的“高復(fù)合性、UXD、全?！暗蕊L(fēng)尖能力看齊（高階人才請掠過），窄而精，精而深，深而廣，這樣的“以單向能力為主的樹形擴張則更適用于大多數(shù)站在塔尖下的設(shè)計師（個人認為），以UI\UX設(shè)計師為例，如何以單向核心能力拓展分支技能呢？本文將以我的實際工作案例進行深度剖析，圍繞體驗思維和行為設(shè)計等分支技能如何在設(shè)計中實踐應(yīng)用，并以此構(gòu)建更具廣度和深度的設(shè)計解題能力。

(一) 被設(shè)計的體驗

案例：內(nèi)容電商產(chǎn)品，商品詳情頁迭代

方法：結(jié)合線下購書場景體驗，預(yù)測用戶行為，設(shè)計用戶行為動線。

路徑：尋找癥結(jié)>場景預(yù)測>產(chǎn)出>復(fù)盤

第一步，理解購買流程

工欲善其事，必先利其器。第一件事，站在用戶視角和平臺視角分別對購買流程進行拆分對比，以此加深各個環(huán)節(jié)所對應(yīng)業(yè)務(wù)場景的理解認知。

用戶視角購買流程：種草->品類決策->商品決策->購后交流；此流程會隨不同的用戶類型進行變化，例如帶有意向商品進入APP的用戶則省去種草、品類決策兩個環(huán)節(jié)；

平臺視角購買流程：售前->售中->售后3個階段，售前對應(yīng)種草，售中聚焦商品決策。

第二步，場景的本質(zhì)

商品詳情頁是用戶發(fā)起購買行為的重要途徑，其本質(zhì)是售中環(huán)節(jié)的商品決策工具，是通過人工干預(yù)的手段，提高商品與消費者的連接與匹配效率，從而為產(chǎn)品獲得更高的收益；在滿足用戶基礎(chǔ)產(chǎn)品體驗的同時，也承載著平臺流量分發(fā)后的關(guān)鍵轉(zhuǎn)化任務(wù)。

廣義上的消費決策場景，大多聚焦在售中環(huán)節(jié)的商品決策，場景為用戶通過外部場景進入到商品詳情頁，判斷一個意向商品是否值得購買，決策的結(jié)果是收藏、加購或立即購買，當(dāng)然也可能直接離開；由此得出，商詳場景的核心體驗是通過有效的信息陳列，幫助用戶了解商品與價值判斷后積極的進行購買決策，而同時也是連接用戶與作者以及其他關(guān)聯(lián)商品的流量橋梁。 在理解場景的本質(zhì)后目標(biāo)變得清晰起來，為用戶設(shè)計一個好用的決策工具，為平臺設(shè)計一個有用的信息容器。

為用戶造工具，第一件事是剖析用戶：通過線上平臺購買商品，用戶的消費決策過程是怎樣的？(常規(guī)）

結(jié)論：用戶通過對商品的認知了解、價值判斷建立相關(guān)的購買意愿后進行購買決策。

售中環(huán)節(jié)的信息構(gòu)建是用戶了解商品與自身匹配率并建立購買意愿的核心途徑，場景所具備的信息傳達能力對用戶的最終決策起到?jīng)Q定性作用；為給用戶帶來更好的購物體驗，我通過還原線下購物場景獲取靈感，構(gòu)建線上購書的行為模型，從而對商詳進行優(yōu)化，力求帶給用戶一個符合習(xí)慣認知的、高效、有效的決策工具，同時思考為用戶帶來體驗效益的情景下，提前洞察可能出現(xiàn)的問題以及對業(yè)務(wù)場景進一步支撐的同時能否主動推進業(yè)務(wù)的發(fā)展。

第三步，設(shè)計行為模型

分析消費者線下購書行為，通常為逛書店-拿起書-翻開書-查和問-做決定等五個階段。

分析消費者在線下的購物行為，結(jié)合業(yè)務(wù)場景構(gòu)建具有可行性的行為模型，通過行為模型教育用戶進入商詳場景后基于動線進行瀏覽，將信息獲取效率最大化，并以此提高商品與用戶的匹配效率。

第四步，行為模型塑造購物體驗

現(xiàn)狀評估：基于行為模型，從信息關(guān)注度、信息傳達能力兩方面對框架結(jié)構(gòu)進行體驗測評。

首屏是用戶對場景建立認知的核心方式，當(dāng)前商詳?shù)谝黄脸尸F(xiàn)的信息維度較多且落點分散，用戶的注意力被大量分散，無法引導(dǎo)其完成對商品和場景的快速認知。

歸納前文有效信息，分別站在視覺與交互的視角對存在的問題進行歸類并提出對應(yīng)策略：

1.產(chǎn)品吸引力（氛圍、質(zhì)感、信息傳達能力

2.優(yōu)化信息結(jié)構(gòu)（信息關(guān)注度、信息深度）：教育用戶行為，降低用戶消費決策中的行為阻力，提高商品與用戶的匹配效率

3.設(shè)計最小可行性方案，將實施資源最小化，在業(yè)務(wù)規(guī)則的限制下得出最優(yōu)解。

第五步，方案演示

結(jié)論：在新的場景中，基于行為模型對框架的優(yōu)化，信息結(jié)構(gòu)變得清晰，高效的信息傳達能力讓用戶在最短時間內(nèi)完成與商品的匹配決斷，縮短了用戶購買決策的體驗路徑；同時頁面的視覺質(zhì)感得以提升，用戶在決策過程中的愉悅度也得以相對提升，提高了產(chǎn)品吸引力。

詳解——信息關(guān)注度、傳達能力：通過調(diào)整首屏信息陳列的親密度主動對用戶注意力進行分配，清晰的信息結(jié)構(gòu)會引導(dǎo)用戶的視線按照行為模型獲取信息，當(dāng)用戶進入商詳場景后，會快速聚焦到頭部信息對商品進行基礎(chǔ)了解，并完成第一階段的決策(購買意愿)；

詳解——信息深度、行為阻力、降噪：將詳情信息字段雙行展示調(diào)整為7行極限展示，減少了首屏信息維度的數(shù)量，以此降低用戶首次進入場景后接觸到的信息噪音，同時降低了展開收起功能的操作頻率，滿足了部分用戶的閱讀需求，為決策中期可能產(chǎn)生的行為阻力做了減法。

詳解——產(chǎn)品吸引力：新增彩色背景提高了整體氛圍感，加上信息親密度的調(diào)整，界面整體視覺質(zhì)感的友好度和精致度都有不錯的呈現(xiàn)，同時決策按鈕的配色調(diào)整也企圖在調(diào)動用戶積極心理的能力上得到提升。

展示——設(shè)計結(jié)果（僅對首屏作展示）：

衡量指標(biāo)，設(shè)計自證

結(jié)合數(shù)據(jù)表現(xiàn)與體驗評估，整體體驗諸如商品認知能力、匹配效率等得以提升，但關(guān)鍵轉(zhuǎn)化仍然不理想：

· 信息關(guān)注度：對用戶完成商品基礎(chǔ)了解建立購買意愿后的瀏覽動機存疑，決策中期的信息構(gòu)建仍有調(diào)整空間
· 信息的質(zhì)量：現(xiàn)有內(nèi)容策略缺乏說服力，無法滿足用戶對商品價值的深度評估，促進用戶決策的能力顯得不足
· 心智模型：表現(xiàn)力上，新版商詳帶給用戶的心智模型呈現(xiàn)為“類閱讀產(chǎn)品”，缺少有關(guān)交易屬性的信息，且信任力不足，導(dǎo)致了商品的不確定性。

從數(shù)據(jù)看：1-12s內(nèi)無法對首屏信息進行有效瀏覽吸收，表現(xiàn)出用戶對此處信息關(guān)注度較低，第二階段的詳細信息處字段冗長，滿足部分用戶閱讀需求的同時也引起了其他用戶的閱讀負擔(dān)，在一定程度上挑戰(zhàn)了用戶耐心，信息露出需要平衡。

基于行為模型設(shè)計的導(dǎo)航策略過于線性、理想化，在用戶實際進行購買決策時心理路徑存在線性和非線性兩種群體，所關(guān)注的信息也不盡相同。

(二) 消費決策，心理探尋

方法：通過ELM（詳盡可能性模型）探索用戶的消費決策心理路徑，以此對方案進行調(diào)整優(yōu)化。

ELM模型認為，人類被說服的模型有兩種，即中央路徑和邊緣路徑：

在中央路徑下：當(dāng)個人的動機和能力比較強的時候，人們會理性思考、仔細評估之后做出決策，知識水平較高或有相對性需求時往往傾向于理性的選擇；

在邊緣路徑下：當(dāng)個人的動機和能力比較弱的時候，人們滿足于當(dāng)下的認知，通常不愿耗費精力對信息加以分析，且對信息內(nèi)容的真實性無法判斷，只能通過一些信息的外圍因素來決定該信息的可信度，從而涵蓋了感情因素，更容易被表面因素說服；

舉個例子：小明和小黃逛街時看到一家環(huán)境老舊卻不便宜的冷飲店，本應(yīng)嗤之以鼻的小明看到門口排起的長龍和精美的飲品包裝設(shè)計，讓他放下顧慮立即拉著小黃參與排隊購買飲品，他相信，大家都在買的就是好的；而排隊過程中，小黃則仔細觀察店內(nèi)環(huán)境衛(wèi)生以及店員的操作手法，同時上網(wǎng)查詢該冷飲店的資料和口碑，經(jīng)過對收集到的信息和眼前所看到的場景進行評估后，小黃覺得這個飲品不衛(wèi)生，決定放棄購買。在這個例子中，本應(yīng)嗤之以鼻的小明受到外在因素（生意好排長龍、他人行為、包裝好看）影響，做出了不理智的決策，是典型的快思維（邊緣決策路徑）。而小黃經(jīng)過親身觀察和上網(wǎng)查閱的手段對飲品衛(wèi)生做出的決策，也就是前文提到的慢思維（中央路徑）

兩條路徑處理的信息不同，在中央路徑處理的都是與信息質(zhì)量相關(guān)的線索，而在邊緣路徑中，處理的則是一些表象信息內(nèi)容。

結(jié)合場景梳理用戶決策的思考過程中的關(guān)注點：

依據(jù)結(jié)論，需完善同時滿足兩種決策模式下用戶所需的信息：

主要體現(xiàn)在信息質(zhì)量與表象信息兩個維度，并且在界面的信息傳達中突出商品屬性，增加商品感。

內(nèi)容共建，決策參考：當(dāng)用戶產(chǎn)生購買行為時，首先是需要被說服的，無論是被他人說服，被廣告說服，還是被自己說服。討論區(qū)的建設(shè)，在交易場景連接了內(nèi)容側(cè)的業(yè)務(wù)，同時推動產(chǎn)品內(nèi)容質(zhì)與量的發(fā)展，并試圖通過言論促成“用戶說服用戶”的決策模式，同時滿足了中央路徑、邊緣路徑兩種用戶的信息供給。

強調(diào)心智，情緒體驗：將原本處于第二屏的交易信息前置，矯正整體用戶對界面認知的心智模型，同時讓用戶了解商品信息后第一時間感知到購買權(quán)益及相關(guān)配送體驗，完善首屏的信任力、保障確定性，讓用戶具備“放心買”的心理；界面視覺的質(zhì)感優(yōu)化仍然以提高用戶愉悅度為主，企圖在決策過程中帶給用戶更好的邊際體驗，讓用戶在表象層面提升對產(chǎn)品的好感度，以信任力\好感度\平臺和用戶的內(nèi)容共建等方式在人因決策之外發(fā)揮促進購買決策的最大因果。

結(jié)語

以上案例部分內(nèi)容以倒推形式進行復(fù)盤，是脫離數(shù)據(jù)之外的解題思考方式；希望我的文章能夠為感興趣的同學(xué)帶來新的思考，也期望體驗思維與行為設(shè)計能夠被更多設(shè)計師所熟知應(yīng)用。

設(shè)計源于生活，無論是購物、玩游戲或事社交，打破線上線下的場景壁壘進行觀察、思考，解題方式不乏在你身邊的生活場景中，人的行為始終具有參考價值。

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：站酷  作者：秋思野

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

與客戶的對話和反饋是產(chǎn)品成功的關(guān)鍵要素。然而，研究表明，42% 的公司不調(diào)查其客戶或收集反饋。

偉大的產(chǎn)品不是憑空打造的——您需要一個持續(xù)的過程來從用戶那里獲取反饋，以指導(dǎo)您的產(chǎn)品路線圖、調(diào)整消息傳遞并保持滿意度水平的脈搏。

什么是產(chǎn)品反饋？

產(chǎn)品反饋是您的用戶分享的有關(guān)他們對產(chǎn)品的體驗和滿意度的任何信息。您可以通過各種研究方法收集產(chǎn)品反饋，例如用戶訪談、客戶調(diào)查、評估客戶支持票等。

產(chǎn)品反饋的 3個主要好處

雖然積極收集和分析產(chǎn)品反饋有很多好處，但可以總結(jié)為三個主要好處：

A. 改善客戶體驗和滿意度

B. 優(yōu)先考慮產(chǎn)品路線圖并驗證新想法

C. 打造成功的產(chǎn)品

讓我們更詳細地看看它們。

1. 提升客戶體驗和滿意度

為用戶提供出色的客戶體驗不再是一種獨特的優(yōu)勢——這是意料之中的。產(chǎn)品發(fā)布后，收集產(chǎn)品反饋可幫助您識別任何問題，收集有關(guān)要添加或改進的新功能的信息，并找到幫助用戶充分利用其體驗的方法。

支持票通常擅長揭示需要盡快解決的重復(fù)問題。如果一個問題多次出現(xiàn)，那么您就會知道它困擾著您的大部分客戶群。此外，凈推薦值 (NPS)或客戶滿意度得分 (CSAT) 等調(diào)查是產(chǎn)品反饋的重要來源，可以幫助您了解如何改善客戶體驗。

2. 優(yōu)先考慮產(chǎn)品路線圖并驗證想法

收集用戶的反饋有助于產(chǎn)品經(jīng)理確定產(chǎn)品路線圖的優(yōu)先級，并根據(jù)實際用戶需求做出明智的決策。

您可以收集關(guān)于功能想法的反饋并量化數(shù)據(jù)以了解哪些是最需要的。

3. 打造成功的產(chǎn)品

如今，最好的產(chǎn)品是基于與日復(fù)一日使用您產(chǎn)品的人（您的客戶）的持續(xù)互動和用戶體驗而構(gòu)建的?？蛻羝谕纳仙馕吨髽I(yè)必須不斷收集和識別客戶需求，以構(gòu)建能夠解決實際存在的問題的產(chǎn)品。

產(chǎn)品反饋是一種很好的機制，通過它可以從用戶那里獲取見解，并將其納入您的決策過程。無論是通過征求還是主動提供的反饋，傾聽用戶的意見將確保您能夠始終如一地交付價值。

產(chǎn)品反饋：類型和方法

您可以使用多種產(chǎn)品反饋方法來設(shè)置產(chǎn)品反饋循環(huán)并讓您的客戶與您取得聯(lián)系。

通常，產(chǎn)品反饋可以是征求的，也可以是主動提出的：

A. 征求反饋是指您要求用戶提供反饋。這可能是向您的客戶群發(fā)送調(diào)查或與用戶進行訪談。

B. 不請自來的反饋是用戶在沒有被要求的情況下分享的任何類型的反饋。例如，他們可能會在網(wǎng)上發(fā)表評論或在社交媒體上分享評論。

當(dāng)用戶在您的產(chǎn)品中遇到問題、要求新功能或需要幫助完成某事時，通常會出現(xiàn)不請自來的反饋。

另一方面，通過征求反饋，您需要為用戶提供背景信息并提出正確的研究問題。根據(jù)您的團隊需要反饋的內(nèi)容，以下是您可以用來收集征求的產(chǎn)品反饋的方法的概要：

1) 調(diào)查

2) 客戶訪談

3) 產(chǎn)品分析

4) 專門小組

5) 客戶支持對話

6) 銷售和客戶溝通電話

讓我們更詳細地看一下前三個。

1. 調(diào)查

調(diào)查是一種有效的研究工具，可為您提供針對各種用例的特定產(chǎn)品反饋：分析新發(fā)布的性能、在開始構(gòu)建過程之前驗證想法和新概念、測試產(chǎn)品消息傳遞等。

大多數(shù)反饋調(diào)查使用開放式和封閉式問題的組合。在創(chuàng)建和發(fā)送調(diào)查時要記住幾個最佳實踐，即：

A. 避免引導(dǎo)性問題，例如“您有多喜歡使用該產(chǎn)品？” 相反，請讓您的用戶提供有關(guān)他們體驗的詳細信息，而不要引導(dǎo)他們做出肯定或否定的回答。

B. 保持簡短：注意受訪者提供反饋的時間和意愿。在調(diào)查中包含的問題不超過五到七個，以使其相對簡短，并且仍然可以獲得可操作的反饋。

C. 使用開放式和封閉式問題的組合。太多的開放式問題將導(dǎo)致調(diào)查時間過長，因為參與者必須為每個問題輸入答案。另一方面，僅由封閉式問題（如是/否問題）組成的調(diào)查只會為您提供定量數(shù)據(jù)，而不會揭示參與者給出這些答案的原因。將這兩種類型的問題結(jié)合起來可以創(chuàng)建有效的調(diào)查。

2. 客戶訪談

客戶訪談是一種通用的研究方法，可以在整個產(chǎn)品開發(fā)過程中獲得有見地的反饋。從進行最初的設(shè)計研究到獲得發(fā)布后的反饋——與用戶交談總能產(chǎn)生新的見解。

對于產(chǎn)品營銷人員來說，訪談是一種有用的方式來獲取有關(guān)新產(chǎn)品或功能的消息傳遞的信息。

3. 產(chǎn)品分析

產(chǎn)品分析是了解產(chǎn)品性能和改進方式的絕佳來源。產(chǎn)品分析對產(chǎn)品經(jīng)理和營銷人員都很有用，可以幫助您了解用戶在做什么與他們所說的相比，這可能并不總是相同的。

如果您在發(fā)布之前進行了定性測試，產(chǎn)品分析可以幫助您驗證您的初始假設(shè)。

此外，產(chǎn)品分析是識別產(chǎn)品中嚴(yán)重問題的良好來源。例如，衡量留存率之類的分析可以讓您隨著時間的推移跟蹤它或?qū)⒈嚷逝c行業(yè)標(biāo)準(zhǔn)進行比較。當(dāng)任何異常發(fā)生時，數(shù)據(jù)是進行更多研究以了解問題所在的起點。

創(chuàng)建產(chǎn)品反饋循環(huán)的重要性

您可以使用多種方法來收集產(chǎn)品反饋，從我們上面看到的三種方法到社交媒體監(jiān)控、客戶支持票、銷售電話、客戶溝通電話等其他方法。更重要的是創(chuàng)建一個流程，通過該流程，反饋始終如一地到達您的組織并被采取行動，從而征求更多用戶反饋。這也稱為產(chǎn)品反饋循環(huán)。

反饋循環(huán)是一個迭代過程，其中從客戶反饋中收集的見解被實施到產(chǎn)品開發(fā)過程中，并用于在一致的基礎(chǔ)上為產(chǎn)品決策提供信息。隨著新的反饋影響新的產(chǎn)品策略，這個過程會無限重復(fù)，而變化會促使客戶提供額外的反饋。

這種持續(xù)不斷的客戶反饋將幫助您把握客戶滿意度的脈搏，并在您和您的客戶之間建立一個開放的渠道。

如何收集好的反饋

并非所有反饋都是平等的，或者就此而言——有用。就像進行任何其他研究方法一樣，收集很好的反饋需要理解并遵循關(guān)鍵的最佳實踐。這是你應(yīng)該知道的。

建立明確的目標(biāo)

在您開始收集反饋之前，第一步是定義您的目標(biāo)并建立明確的衡量方法。

一個好的起點是查看您負責(zé)的 KPI。對于產(chǎn)品團隊來說，這可能意味著激活或用戶保留。對于產(chǎn)品營銷人員，這也可能是合格的注冊和使用指標(biāo)。

此外，您建立的目標(biāo)還將幫助您選擇正確的方法來收集反饋。例如，客戶訪談非常適合在進行初步發(fā)現(xiàn)研究時獲得定性反饋。另一方面，原型測試最適合在開發(fā)前與用戶一起驗證設(shè)計。確立目標(biāo)是獲得做出明智決策所需的反饋的第一步。

提出正確的問題

其次，提出正確的研究問題是獲得有效、可靠反饋的關(guān)鍵步驟。確定目標(biāo)后，下一步是制定您需要發(fā)送給用戶的調(diào)查或為客戶訪談準(zhǔn)備研究計劃。

在制定研究問題時，需要牢記一些重要的指導(dǎo)方針。其中一些是：

A. 避免引導(dǎo)參與者尋找答案

B. 避免封閉式問題，尤其是在客戶訪談中

C. 參考特定時刻，例如使用功能或新產(chǎn)品

總結(jié)

產(chǎn)品反饋是洞察客戶行為和痛點的重要來源，可幫助您在整個產(chǎn)品開發(fā)過程中做出明智的決策。

今天在產(chǎn)品和營銷領(lǐng)域工作的每個人都將從與客戶交談和傾聽他們的意見中受益。隨著產(chǎn)品的成熟和客戶需求的變化，這些對話不應(yīng)該是一次性的，而是構(gòu)建偉大產(chǎn)品的關(guān)鍵部分。

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：站酷   作者：對啊分享此文一切功德，皆悉回向給文章原作者及眾讀者.

免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

導(dǎo)讀

為什么B端產(chǎn)品總是容易“失控”？B端產(chǎn)品設(shè)計與C端有何差異？如何在不斷復(fù)雜的系統(tǒng)中，權(quán)衡效率、成本、體驗之間的關(guān)系？ 

本文將帶你從B端產(chǎn)品的本質(zhì)出發(fā)，了解產(chǎn)品發(fā)展過程中容易出現(xiàn)的問題，并從復(fù)雜系統(tǒng)的角度去探討設(shè)計體系的構(gòu)建方式。

目錄

一、「 困局 」容易“失控”的B端產(chǎn)品

A .「 關(guān)注重點的差異性 」

B .「 微小差異的不斷疊加 」

C .「 產(chǎn)品發(fā)展進入惡性循環(huán) 」

D .「 進入效率拐點，產(chǎn)品失控 」

二、「 啟發(fā) 」從復(fù)雜科學(xué)的角度思考設(shè)計

A.「 自然算法 」

B.「 物質(zhì)的構(gòu)成原理 」

三、「 探究 」什么是產(chǎn)品設(shè)計體系？

A.「 定義 」

B .「 組成部分 」

C .「團隊能力要求 」

D .「 構(gòu)建方向 」

四、「 剖析 」B端產(chǎn)品的生命周期

「 產(chǎn)品生命周期概述 」

A .「 初創(chuàng)期 」解決核心問題，產(chǎn)生價值

B .「 成長期 」能力完善，產(chǎn)品擴張

C .「 成熟期 」效率提升，快速增長

D .「 暮年期 」商業(yè)價值降低，發(fā)展逐漸停滯

NEXT、「 下期預(yù)告 」設(shè)計體系的構(gòu)建法則

前言

隨著產(chǎn)業(yè)互聯(lián)網(wǎng)時代的到來，市場對B端產(chǎn)品的重視程度逐漸提升。然而，談及B端產(chǎn)品，特別是SaaS產(chǎn)品，大多數(shù)設(shè)計師對此并不是特別感興趣。一來，SaaS更注重功能層面，似乎本身對設(shè)計的要求并不高；二來，SaaS產(chǎn)品的最終實現(xiàn)效果總是不盡人意，就算設(shè)計得再好看，實現(xiàn)出來也難以出彩。

確實，若設(shè)計師僅僅只是關(guān)注視覺層面本身，那么B端產(chǎn)品確實不像C端那么吸引人。但是，若你能以整個產(chǎn)品構(gòu)建的角度去思考B端產(chǎn)品設(shè)計，那么設(shè)計師能夠在其中發(fā)揮的空間是巨大的。

假如把C端產(chǎn)品比作精致的小房子，那B端產(chǎn)品就是一幢巨大的高層建筑。建造小房子，你可以盡情地發(fā)揮創(chuàng)意，追逐潮流，大不了推倒重來。而建造大房子，則需要設(shè)計師考慮更多的維度，因為這是一個長期而復(fù)雜的工程。

建筑的外觀不僅需要好看，更需要足夠耐看、穩(wěn)定；為了適應(yīng)更多人的需求，你不僅要考慮房子的軟裝，還要考慮戶型的合理性、通用性；而為了降低成本，你還需要考慮家具、硬裝的標(biāo)準(zhǔn)化、房間的兼容性等等…

“你是否有信心建造一個宏偉的高樓大廈？” 

這是我在B端設(shè)計中，反復(fù)強調(diào)體系化思維的原因之一。想要建造一個大型建筑，沒有體系化思維、沒有更完善的多職能協(xié)作流程，那么這座高樓一定會在建設(shè)過程中埋下隱患。而當(dāng)問題一旦出現(xiàn)，涉及到的沉沒成本也將會非常巨大。

當(dāng)然，對于C端產(chǎn)品來說，體系化也愈發(fā)重要了。隨著互聯(lián)網(wǎng)時代的持續(xù)發(fā)展，一些C端產(chǎn)品的復(fù)雜性也堪比B端。我在之前的文章中提到過一個觀點：“C端B化，B端C化”。在未來的數(shù)字產(chǎn)品設(shè)計中，B端產(chǎn)品將會逐漸開始重視產(chǎn)品的外觀與體驗，因為觸達的人群更年輕化、對體驗要求更高了。而C端產(chǎn)品也會更注重體系化建設(shè)，因為產(chǎn)品體量越來越大，需要尋求效率與成本之間的平衡點。

產(chǎn)品設(shè)計體系，本質(zhì)上是一套更科學(xué)的復(fù)雜性數(shù)字產(chǎn)品的設(shè)計方法與工作流程。因此，不管是B端產(chǎn)品還是C端產(chǎn)品，設(shè)計體系能夠在提升設(shè)計品質(zhì)的同時，讓產(chǎn)品更“可控”，提升效能，降低成本。

這套設(shè)計方法論，是我在工作中不斷實踐與完善的一些經(jīng)驗與方法。希望能借此分享一些自己淺薄的經(jīng)驗，也探討一下數(shù)字產(chǎn)品設(shè)計未來的形態(tài)。

?

一、「 困局 」容易“失控”的B端產(chǎn)品

-

作為較為復(fù)雜的數(shù)字產(chǎn)品，B端產(chǎn)品在快速發(fā)展的過程中，總是容易出現(xiàn)一些問題。特別是當(dāng)產(chǎn)品體量到達一定階段后，問題就會逐漸暴露出來，比如：

1. 產(chǎn)品丑、設(shè)計質(zhì)量低；

2. 組件樣式繁多，操作習(xí)慣不一致；

3. 新老系統(tǒng)差異大，不同模塊體驗差異大；

4. 頁面結(jié)構(gòu)混亂。

等等…

很多問題大家都能明顯地意識到，但往往因為“不影響售賣”、“價值不高”、“新功能優(yōu)先”等理由被擱置。

隨著問題逐漸積累，產(chǎn)品的優(yōu)化成本也變得越來越高，最終使整個產(chǎn)品已經(jīng)積重難返。若只是多部分頁面/組件進行優(yōu)化，小修小補，雖然成本低，但成效甚微；若是進行大修大補，那么優(yōu)化成本將遠大于研發(fā)新功能的成本。

這種普遍的B端產(chǎn)品現(xiàn)象，被稱為“產(chǎn)品失控”，即——團隊已經(jīng)對整個產(chǎn)品的形態(tài)失去控制力。

那么，為什么B端產(chǎn)品特別容易出現(xiàn)這種問題呢？

A .「 關(guān)注重點的差異性 」

首先，產(chǎn)品的本質(zhì)決定了其關(guān)注重點的差異性。

與C端產(chǎn)品不同的是，B端產(chǎn)品往往更看重“能力”（為企業(yè)用戶解決問題），而產(chǎn)品的銷售方式與付費模式，也決定了產(chǎn)品體驗并非首要關(guān)注的對象。由于B端產(chǎn)品通常針對企業(yè)用戶，需要更長的研發(fā)過程，產(chǎn)品的體量和復(fù)雜性也相對較高。因此，除了產(chǎn)品解決問題的“能力”之外，產(chǎn)品還需要關(guān)注研發(fā)的效率及成本。

因此，在產(chǎn)品的發(fā)展初期，企業(yè)通常對效率最為關(guān)注，其次是成本，最后才是體驗（能用就行）。絕大多數(shù)B端企業(yè)，只有在產(chǎn)品跑通商業(yè)邏輯，并具備一定用戶與盈利預(yù)期之后，才會對產(chǎn)品的體驗逐漸重視起來。

B .「 微小差異的不斷疊加 」

任何微小的差異，在無數(shù)次的疊加之后，都會被快速放大。特別是當(dāng)團隊的人員逐漸增多后，放大速度將會呈指數(shù)級上升。

為了配合產(chǎn)品的快速發(fā)展，產(chǎn)品往往會采用“堆量”的研發(fā)模式。增加研發(fā)效率，最簡單直接的方法便是投入更多的資源。隨著產(chǎn)品不斷增加模塊、功能、頁面，團隊人員也在不斷地擴充。

但是，人類不是機器，并非簡單的1+1=2。團隊數(shù)量的上升雖然會帶來效率的短期提升，但同樣也會增加團隊的管理成本。不同的產(chǎn)品經(jīng)理、設(shè)計師、研發(fā)人員，對于產(chǎn)品的認知是不同的。隨著團隊人員的不斷增加，“個體差異性”將會被不斷地疊加與放大。

就像“傳話筒”的游戲一樣，同一個事物，不同的人理解總是不同的，經(jīng)過多次的“傳話”以后，往往與原本的意思已經(jīng)大相徑庭了。

這種情況表現(xiàn)在產(chǎn)品設(shè)計中，則會出現(xiàn)：當(dāng)相同的組件由不同的人做時，總是會在基本樣式、實現(xiàn)原理、交互細節(jié)等不同的維度出現(xiàn)差異。比如上圖中的導(dǎo)航菜單組件，不同的模塊在開發(fā)時總是會存在差異，最后差異越來越大，形成了五花八門的導(dǎo)航菜單形式。

C .「 產(chǎn)品發(fā)展進入惡性循環(huán) 」

令人遺憾的是，雖然問題很明顯。但是在不斷的“成本考量”中，產(chǎn)品團隊往往優(yōu)先關(guān)注新功能的開發(fā)，而忽略底層問題的優(yōu)化。

隨著產(chǎn)品的快速發(fā)展，產(chǎn)品的優(yōu)化/迭代成本將會逐漸大于研發(fā)新功能的成本。要么背負巨大的成本進行整體重構(gòu)；要么降低標(biāo)準(zhǔn)，繼續(xù)以這種模式不斷疊加新功能。

在這種情況下，大部分B端產(chǎn)品往往會選擇后者。于是，產(chǎn)品的發(fā)展將會進入一個“惡性循環(huán)”：

• 產(chǎn)品快速發(fā)展，功能不斷疊加；

• 各模塊由不同的產(chǎn)品、不同的開發(fā)研發(fā)，導(dǎo)致各模塊之間差異增加；

• 產(chǎn)品丑、體驗不統(tǒng)一，但老系統(tǒng)優(yōu)化成本過高。綜合衡量，優(yōu)先進行新功能研發(fā)；

• 所有模塊標(biāo)準(zhǔn)不統(tǒng)一，產(chǎn)品迭代效率持續(xù)降低，維護成本持續(xù)增加。

…

D .「 進入效率拐點，產(chǎn)品失控 」

產(chǎn)品的發(fā)展猶如一輛快速奔馳的巨型列車，一旦加速便難以停止。

隨著問題的反復(fù)出現(xiàn)，以及在一次次的“利益權(quán)衡”中選擇性的忽略，產(chǎn)品的惡性循環(huán)不斷重復(fù)，而問題也逐漸疊加、沉積下來。

當(dāng)這個問題已經(jīng)大到我們無法回避時，我們才發(fā)現(xiàn)：產(chǎn)品的單位迭代/優(yōu)化成本，已經(jīng)遠遠大于新功能的研發(fā)成本。而新功能帶來的增量，已經(jīng)無法抵消現(xiàn)有模塊的迭代成本——產(chǎn)品迎來了效率拐點。

就像一個龐大而復(fù)雜的機器，雖然依舊可以運行，但整體效率已經(jīng)很低了，而與之對應(yīng)的維修成本則非常巨大。小修小補根本無法解決問題，而大修大補則很有可能會帶來更大的虧損。

最終，產(chǎn)品逐漸在“失控”中難以自拔，競爭力逐漸降低，但整個團隊對此卻無能為力，嚴(yán)重影響了企業(yè)的發(fā)展。

那么，在產(chǎn)品發(fā)展中，我們應(yīng)該如何避免這種情況呢？換而言之，一個高度復(fù)雜的數(shù)字產(chǎn)品，我們應(yīng)該如何設(shè)計，才能避免其逐步走向混亂？ 

?

二、「 啟發(fā) 」從復(fù)雜科學(xué)的角度思考設(shè)計

-

如果我們將B端產(chǎn)品看作是一個復(fù)雜系統(tǒng)，那么產(chǎn)品“失控”的本質(zhì)即——在不斷復(fù)雜化的形態(tài)中，缺乏有效的控制機制，最終導(dǎo)致整個系統(tǒng)失去控制。 

但是，在大自然面前，B端產(chǎn)品這種復(fù)雜程度顯然不值得一提。

像大自然這樣的復(fù)雜系統(tǒng)，是如何構(gòu)成的？所有的物體都由原子所構(gòu)成，為什么簡單的一百多種原子，能夠構(gòu)成如此復(fù)雜的世界？生命又是如何在無機物的世界中誕生，并逐步進化成如此復(fù)雜的個體的？

A.「 自然算法 」

道生一、一生二、二生三、三生萬物...無論是老子的《道德經(jīng)》，還是《深奧的簡潔》、《萬物皆數(shù)》、《復(fù)雜》這些現(xiàn)代的書籍中都闡述了這樣一個觀點：

任何看似復(fù)雜而又可控的系統(tǒng)，一定存在著精簡的“算法”，通過不斷的疊加從而形成復(fù)雜系統(tǒng)。

就像愛因斯坦說的：“宇宙最不可理解之處，就是它居然是可以被理解?！?

在大自然中，有很多的花紋與圖案的形狀都存在相同的規(guī)律。比如上圖中的羊齒草分形圖案，這種圖案在森林當(dāng)中到處可見，我們看到很多樹的形狀跟葉子的形狀是一致的，這就是一種分形圖案。而這種分形的圖案本質(zhì)上是一個公式，通過不斷地自我引用進行迭代，這便是分形。

科赫曲線（Koch curve）就是一種分形。其形態(tài)似雪花，又稱科赫雪花（Koch snowflake）、科赫星（Koch star）、科赫島（Koch island）或雪花曲線（Snowflake curve）。

它最早出現(xiàn)在瑞典數(shù)學(xué)家海里格·馮·科赫的論文中。我們將一根直線分成四段，然后向中間擠壓形成等邊的倒V形狀；接著再將每個倒V的邊進行相同的操作，不斷地重復(fù)之后，我們發(fā)現(xiàn)：第一步是倒V型、第二步變成了大衛(wèi)星，第三部變成了楓葉，第四步… 經(jīng)過無數(shù)步以后，最終成了越來越復(fù)雜的“雪花”形態(tài)。

科赫曲線便是“自然算法”的一種。海岸線雖然很復(fù)雜，但是卻有一個重要的特性——自相似性。從不同比例尺的地形圖上，我們可以看出海岸線的形狀大體相同，其曲折、復(fù)雜程度也很相似，換句話說，任意一段海岸線就像是整個海岸線按比例縮小的結(jié)果。而海岸線的構(gòu)成原理就是這種科赫曲線，它是通過天然的演化，不斷折疊最終形成了這種形狀。

可以發(fā)現(xiàn)，他們都是由 基礎(chǔ)物質(zhì) x 簡單算法 x 隨機變量，經(jīng)過無數(shù)次疊加后，最終形成了一個復(fù)雜而多變的整體。

B.「 物質(zhì)的構(gòu)成原理 」

宇宙中還有其他各種驚人的“巧合”。愛因斯坦的相對論揭示了宏觀世界的規(guī)律性，普朗克和海森堡的量子力學(xué)揭示了微觀物質(zhì)世界的規(guī)律。當(dāng)我們從微觀世界到天文學(xué)會發(fā)現(xiàn)——原子核的構(gòu)成方式居然與天體的構(gòu)成非常相似。粒子圍繞原子核的運動方式，就好像行星圍繞太陽運動一樣。

不管是整個宇宙，還是生命體，將其置于復(fù)雜科學(xué)的研究框架中，那些基本定律最終也會變得極其簡單。

在宇宙中所知最為復(fù)雜的形態(tài)，便是如同我們自身的生物。這些復(fù)雜體由已知存在于銀河系中最普通的物質(zhì)所構(gòu)成。但是，通過氨基酸的形態(tài)，這些基本原料竟能自然地將自己組合成一個自組織系統(tǒng)。

混沌中隱藏的算法，使宇宙成為極有秩序的地方。而在秩序中隱藏的隨機數(shù)，又使得宇宙成為極為豐富的世界。

也正是因為算法的精簡，一切物質(zhì)的創(chuàng)造才能具備復(fù)制性、延續(xù)性、進化性。

那么，我們反過來思考——想要使復(fù)雜的系統(tǒng)簡單可控，是否就需要一套簡潔、有效的“算法”？通過“算法”，將基礎(chǔ)的“物質(zhì)”不斷地“有序疊加”，形成一個可控的復(fù)雜體系。

因此，對于復(fù)雜的SaaS系統(tǒng)設(shè)計，我開始引入“設(shè)計體系”這一概念，希望能夠找到未來SaaS產(chǎn)品設(shè)計的發(fā)展方向。只有設(shè)計體系的建立，才能保證產(chǎn)品可控性，才能在不斷復(fù)雜系統(tǒng)中，保證效率、成本、體驗之間的平衡。

?

三、「 探究 」什么是產(chǎn)品設(shè)計體系？

-

產(chǎn)品設(shè)計體系，在國內(nèi)仍舊是較為陌生的詞匯。什么是設(shè)計體系？

A.「 定義 」

一個成熟的數(shù)字產(chǎn)品，需要有一個穩(wěn)定、且持續(xù)迭代的形態(tài)。創(chuàng)造這個形態(tài)的過程，我們稱之為廣義上的產(chǎn)品設(shè)計（這里指產(chǎn)品的整個策劃和設(shè)計過程，包含策劃、交互、視覺及部分前端開發(fā)）。而負責(zé)控制和維護這個形態(tài)的這套系統(tǒng)，便是產(chǎn)品設(shè)計體系。

我們接觸到的更多是設(shè)計系統(tǒng)（Design System），比如平臺級的設(shè)計體系，Apple、Google、Microsoft等系統(tǒng)級的設(shè)計系統(tǒng)，及其設(shè)計開發(fā)套件、應(yīng)用生態(tài)。公司級的設(shè)計系統(tǒng)，如Airbnb設(shè)計系統(tǒng)、IBM的Carbon設(shè)計系統(tǒng)、螞蟻金服的Alipay Design等。

但是，在一個企業(yè)內(nèi)部，想要Design System能夠系統(tǒng)性地運轉(zhuǎn)，還需要基于這套標(biāo)準(zhǔn)建立的團隊協(xié)作機制。只有設(shè)計標(biāo)準(zhǔn)與團隊協(xié)作標(biāo)準(zhǔn)完美融合，才能建立真正的設(shè)計體系。

B .「 組成部分 」

如果將數(shù)字產(chǎn)品比作復(fù)雜的“生命體”，產(chǎn)品的發(fā)展比作競爭中“自我進化”，那么設(shè)計體系便是產(chǎn)品的DNA。它既是產(chǎn)品形態(tài)的控制源，又是不斷自我迭代的進化源，它的作用是：

• 控制產(chǎn)品外觀——感知性模型（視覺風(fēng)格/規(guī)范）

• 制造基礎(chǔ)構(gòu)件——功能性模型（基礎(chǔ)/復(fù)合組件）

• 模塊的構(gòu)建規(guī)則——模式語言（產(chǎn)品框架規(guī)范）

• 產(chǎn)品標(biāo)準(zhǔn)定義、生產(chǎn)方式制定——協(xié)作模型（高度協(xié)同的工作流程）

它不僅能控制產(chǎn)品的“生產(chǎn)結(jié)果”，提升產(chǎn)品質(zhì)量；還能規(guī)范產(chǎn)品的“生產(chǎn)過程”，形成一套完整的多職能協(xié)作流程，提升產(chǎn)品的生產(chǎn)、迭代和維護效率。 

從宏觀來看，設(shè)計體系像是一個“規(guī)范的復(fù)合體”，它是各職能之間規(guī)范的有效整合，產(chǎn)品框架、交互規(guī)范、視覺規(guī)范、前端規(guī)則，同時也是基于整合規(guī)范所創(chuàng)造的一套創(chuàng)新的工作模式。

C .「團隊能力要求 」

設(shè)計體系的建立，需要整個產(chǎn)品團隊擁有一致的目標(biāo)，并為之通力協(xié)作才能完成。這就需要整個團隊擁有較高的平均素質(zhì)與契合度。

同時，體系化的建立和推動，也需要團隊中有人牽頭去推動。設(shè)計師作為“產(chǎn)品-開發(fā)”的中間環(huán)節(jié)，是非常有條件成為推動者的角色的。

當(dāng)然，這就要求設(shè)計師擁有更豐富的橫向能力。

一方面，設(shè)計師需要將自身的能力邊界進行拓展，與上下游的職能保持密切的溝通，并解他們的訴求。只有當(dāng)設(shè)計體系滿足各方利益時，體系化才有推動的空間。

另一方面，對于產(chǎn)品側(cè)與開發(fā)側(cè)人員，設(shè)計團隊也可以通過培訓(xùn)來提升他們的能力邊界。比如針對產(chǎn)品的交互培訓(xùn)、針對開發(fā)人員的基礎(chǔ)審美培訓(xùn)等。這樣才能提升產(chǎn)品的下限與上限，增強產(chǎn)品的綜合競爭力。

D .「 構(gòu)建方向 」

設(shè)計體系并非超脫于產(chǎn)品之上，而是根植于產(chǎn)品的成長過程中。

想要推動體系化的建立，必須充分了解產(chǎn)品發(fā)展的基本規(guī)律。產(chǎn)品處于不同的生命周期，所要解決的問題是不同的。在正確的時間做正確的事情，并對未來的形態(tài)進行規(guī)劃，才能逐步讓設(shè)計體系根植于產(chǎn)品、融合于產(chǎn)品。

因此，在下一章，我們首先來了解一下B端產(chǎn)品的生命周期。

?

四、「 剖析 」B端產(chǎn)品的生命周期

-

對于設(shè)計師來說，首先要更宏觀地了解產(chǎn)品所處的生命階段，才能知道設(shè)計需要解決的問題是什么，并以此有針對性制定不同的設(shè)計策略，最終幫助產(chǎn)品構(gòu)建完善設(shè)計體系。

本章更多的是對B端產(chǎn)品的發(fā)展階段做一個剖析，而不同階段具體的實施策略，會在后面講解。

「 產(chǎn)品生命周期概述 」 

類似于人的成長歷程，一個新的B端產(chǎn)品從誕生到逐步擴大，通常都會經(jīng)歷幾個不同的生命階段。

B端產(chǎn)品研發(fā)是一個漫長而系統(tǒng)化的過程。這個過程通常伴隨著商業(yè)業(yè)務(wù)發(fā)展與商業(yè)戰(zhàn)略模式的不斷調(diào)整。

B端產(chǎn)品從立項到下線，產(chǎn)品會處于幾個典型的不同狀態(tài)中，這就是產(chǎn)品的生命周期。通常來看，大多數(shù)產(chǎn)品都會經(jīng)歷以下幾個生命周期。初創(chuàng)期-成長期-成熟期，直至最終進入暮年期。

而產(chǎn)品的商業(yè)價值，也會伴隨著產(chǎn)品的發(fā)展而變化。在通常情況下，伴隨著產(chǎn)品的逐漸成長，其商業(yè)價值也會隨之增長，并在成熟期進入黃金的商業(yè)價值期。而當(dāng)商業(yè)價值出現(xiàn)大幅、持續(xù)性的降低時，則基本算是進入了暮年期。

那么，不同的生命周期中，產(chǎn)品將會遇到哪些問題？而為了保證產(chǎn)品的持續(xù)發(fā)展，產(chǎn)品團隊又需要做哪些事情呢？

A .「 初創(chuàng)期 」解決核心問題，產(chǎn)生價值

初創(chuàng)期，即產(chǎn)品已經(jīng)從構(gòu)思到研發(fā)，并成為了初步的產(chǎn)品。這個時期，產(chǎn)品雖然還不能覆蓋完整業(yè)務(wù)，但已經(jīng)能夠順利運行。

從構(gòu)思到創(chuàng)意，再到實踐落地。B端產(chǎn)品的誕生，通常源于在行業(yè)內(nèi)深耕多年的資深玩家。在不斷地實踐中，通過創(chuàng)意與實踐，找到了一條能夠幫助行業(yè)解決問題、提升效率的路徑。

在這個時期，產(chǎn)品需要解決以下幾個問題： 

1）用戶是誰？

B端業(yè)務(wù)的本質(zhì)，就是“向組織銷售服務(wù)來獲得盈利”。哪些企業(yè)最需要你的產(chǎn)品？哪一類用戶的問題最需要通過這種方式得到解決的？這些都是需要在早期非常明確的。

站在普羅大眾的角度去規(guī)劃產(chǎn)品固然是好的，但成功的產(chǎn)品都始于一小部分早期用戶；B端產(chǎn)品的用戶通常來自某一垂直領(lǐng)域，首先讓他們喜歡上你的產(chǎn)品，然后慢慢向外拓展至更大的人群當(dāng)中。

想想看，最初一千名喜歡你產(chǎn)品的種子用戶可能是哪些人？

2）產(chǎn)品能夠解決什么問題？

我們要為用戶解決什么問題？“用戶的問題”可能是一個需求、一個困擾或是一個機遇。他們的需求是否真的是痛點？

這個時期，團隊需要拜訪大量的目標(biāo)用戶，通過交流獲取痛點。我們必須驗證這個需求的真實性，以及我們的解決方案是否具備一定的可實施性。

我們可以通過更具象的UI或流程，初步展示想法，不斷優(yōu)化。最終形成一個可驗證的初步產(chǎn)品Demo，并通過Demo進一步與潛在用戶進行溝通。

3）這個問題是否普遍？是否具備標(biāo)準(zhǔn)化的可能？

不同企業(yè)的需求是有差異的，如何將個性化的需求抽象成共性的解決方案？如何權(quán)衡范圍與成本之間的關(guān)系？我們要將不同企業(yè)的需求進行抽象，形成標(biāo)準(zhǔn)化的解決路徑。

這個階段，我們需要為種子用戶創(chuàng)建方向聚焦的MVP。MVP必須是名副其實的最小化可行產(chǎn)品，要為種子用戶帶來端到端的精準(zhǔn)體驗。如果他們不理解產(chǎn)品功能，不知道如何或為什么使用，或是發(fā)現(xiàn)其性能低劣、bug 太多，無法達到“可行”的程度，那么你的假設(shè)就難以得到有效驗證。

4）是否能夠形成完整的商業(yè)閉環(huán)？

用戶是否真的會為這個產(chǎn)品買單？換句話說，產(chǎn)品是否能賺錢并且養(yǎng)活整個團隊？

B端產(chǎn)品在初創(chuàng)期，最重要的是快速驗證產(chǎn)品與業(yè)務(wù)的親密性，能否完成既定的商業(yè)戰(zhàn)略。產(chǎn)品團隊需要通過磨合業(yè)務(wù)，快速調(diào)整業(yè)務(wù)解決方案和產(chǎn)品架構(gòu)。

不僅是產(chǎn)品的打磨，整個團隊也要形成完整的閉環(huán)。工作流程、產(chǎn)品的商業(yè)運轉(zhuǎn)機制也要初步跑起來。產(chǎn)品的售前、解決方案、產(chǎn)品研發(fā)、實施、客戶成功，我們需要真實地完成這一套閉環(huán)的操作，并基于此做團隊毛利模型的測算。 

解決問題，帶來價值，并且能夠?qū)r值轉(zhuǎn)化為收益，這才是產(chǎn)品可持續(xù)發(fā)展的關(guān)鍵。只有跑通完整的商業(yè)模式，擁有長期的盈利預(yù)期，產(chǎn)品才能順利進入下一個階段。

B .「 成長期 」能力完善，產(chǎn)品擴張

成長期，即產(chǎn)品形態(tài)初具完善，并具備完整商業(yè)閉環(huán)之后，處于快速成長的時期。這個時期，產(chǎn)品將進行快速的迭代，覆蓋的業(yè)務(wù)一天比一天完整，能滿足的業(yè)務(wù)需求越來越多，而產(chǎn)品為業(yè)務(wù)帶來的價值越來越大。

與新生期的區(qū)別在于，新生期時的迭代方向還未完全明確，迭代更多的是嘗試，磨合業(yè)務(wù)與產(chǎn)品。而在成長期時，產(chǎn)品的迭代方向已經(jīng)是非常清晰了的。

1）更多用戶，更多真實需求

產(chǎn)品在真正投入運營之后，所遇到的情況一定與MVP時期有所區(qū)別。隨著產(chǎn)品的不斷售賣，我們將會接觸到越來越多的真實用戶，以及更多的真實需求。而這些用戶與他們的訴求，將會成為產(chǎn)品發(fā)展的指引。

2）解決更多問題，業(yè)務(wù)范圍擴張

經(jīng)過長期的打磨，產(chǎn)品的形態(tài)和可用性已經(jīng)初步成熟了，商業(yè)模式也已經(jīng)初步跑通。隨著更多的真實需求，產(chǎn)品將會選擇有價值的方向擴張業(yè)務(wù)范圍，從“解決一個問題”逐漸走向“解決一系列問題”。

3）功能完善，產(chǎn)品體量快速增加

伴隨產(chǎn)品的快速迭代，產(chǎn)品的基礎(chǔ)功能會逐漸完善，同時也會基于核心功能去搭建更為豐富的功能矩陣。更多的能力、產(chǎn)品模塊、頁面，最終逐漸疊加為一個完整的大型產(chǎn)品。

4）組織逐漸完善，人員專業(yè)化

隨著業(yè)務(wù)擴張，組織架構(gòu)逐漸完善。為了提高專業(yè)性與效率，團隊人員從“多面手”逐漸轉(zhuǎn)化為專業(yè)化方向。與之對應(yīng)的是，團隊成員的數(shù)量也會在這個時期快速增加。售前、解決方案、產(chǎn)品研發(fā)、實施、客戶成功，這一套完整的團隊模型在各模塊中不斷地復(fù)制。

C .「 成熟期 」效率提升，快速增長

成熟期，即產(chǎn)品的形態(tài)已經(jīng)穩(wěn)定，并能夠創(chuàng)造持續(xù)的商業(yè)價值。處于成熟期的產(chǎn)品，肯定是已經(jīng)進行商業(yè)化運行的。反之，沒有達到預(yù)期的商業(yè)價值的產(chǎn)品，不能算成熟期。

進入這個階段時，產(chǎn)品已經(jīng)實現(xiàn)了產(chǎn)品-市場匹配。但是，我們需要對整個產(chǎn)品、以及團隊進行一系列的調(diào)和與優(yōu)化，才能讓整個產(chǎn)品的形態(tài)與運作方式更加合理，以便將產(chǎn)品推向更廣闊的市場。

1）產(chǎn)品效率、組織效能提升

經(jīng)過一系列的快速發(fā)展，產(chǎn)品體量通常都會比較大，而團隊成員也快速擴張。隨著一致性成本、溝通成本增加，勢必會造成研發(fā)效率、組織效能會下降。因此，如何降低產(chǎn)品的單位研發(fā)成本？如何讓整個團隊的組織效能達到最佳狀態(tài)？是需要解決的問題。特別是當(dāng)產(chǎn)品具備一定的客戶數(shù)量以后，單位研發(fā)成本的降低將會極大提升產(chǎn)品整體的利潤率。

2）產(chǎn)品設(shè)計-研發(fā)標(biāo)準(zhǔn)化，構(gòu)建完整鏈路

通過產(chǎn)品設(shè)計-研發(fā)標(biāo)準(zhǔn)化、數(shù)據(jù)架構(gòu)標(biāo)準(zhǔn)化，打通不同模塊的壁壘，提升模塊化與靈活性。將單點之間的競爭力相互配合，形成“場域”競爭力。

產(chǎn)品的單點也許不能保證都有最佳的競爭力，但如果我們能夠提供一系列的、高質(zhì)量、無縫銜接的配套服務(wù)形成閉環(huán)，將會形成強大的整體競爭優(yōu)勢。同時，產(chǎn)品設(shè)計-研發(fā)標(biāo)準(zhǔn)化，能夠增加產(chǎn)品售賣的靈活性，通過靈活的組合方式吸引不同的用戶，提升銷售靈活性與成單率。

3）提供高質(zhì)量的用戶體驗

產(chǎn)品最終是給人用的，用戶體驗也會在將來逐漸成為B端產(chǎn)品的核心競爭力。隨著競爭的加劇，以及用戶群體的逐漸年輕化，用戶體驗將成為企業(yè)在選擇產(chǎn)品時的重要考量因素，也是口碑傳播的重要途徑。

由于在“產(chǎn)品-市場匹配”階段需要盡快地推出產(chǎn)品，所以在設(shè)計開發(fā)過程中可能遺留諸多問題，需要進一步打磨優(yōu)化。產(chǎn)品設(shè)計需要與開發(fā)具備高度的一致性，視覺交互是否合理，前端代碼是否準(zhǔn)確合理，操作反饋是否高效等問題，都需要這個階段來進行調(diào)和。

4）教育市場，賣給更多的人

當(dāng)產(chǎn)品逐漸成熟并具備一定體量之后，單靠銷售跑單是遠遠達不到發(fā)展要求。這個階段，需要市場部人員對市場進行教育，聚焦不同的行業(yè)領(lǐng)域，從“點式營銷”轉(zhuǎn)變?yōu)椤懊媸綘I銷”，并配合銷售人員進行產(chǎn)品的售賣。因此，在這個階段，產(chǎn)品的品牌力、核心能力的傳播將至關(guān)重要。

D .「 暮年期 」商業(yè)價值降低，發(fā)展逐漸停滯

暮年期，即產(chǎn)品發(fā)展停滯甚至倒退，逐漸失去商業(yè)價值的產(chǎn)品。

B端產(chǎn)品進入暮年期的原因，主要有兩個。一是，伴隨著業(yè)務(wù)的發(fā)展，產(chǎn)品已經(jīng)很難滿足業(yè)務(wù)需求。且翻新產(chǎn)品的投入產(chǎn)出比較低。二是，伴隨產(chǎn)品的使用時長，產(chǎn)品將變得臃腫和遲鈍，逐漸難以敏捷地滿足業(yè)務(wù)需求。

很多時候，商業(yè)環(huán)境的快速發(fā)展、技術(shù)的更新迭代都有可能成為產(chǎn)品進入暮年期的原因。對于暮年期的產(chǎn)品，根據(jù)商業(yè)戰(zhàn)略，產(chǎn)品經(jīng)理既有可能要延長產(chǎn)品的壽命，也有可能持續(xù)保障產(chǎn)品完成順利換代。當(dāng)然，更多暮年期的B端產(chǎn)品，由于業(yè)務(wù)的調(diào)整，最終迎來生命的終結(jié)。

需要注意的是，很多產(chǎn)品因為在成長期、發(fā)展期無法建立有效的產(chǎn)品控制機制，導(dǎo)致產(chǎn)品過早的進入臃腫階段。也就是前文中所講的“產(chǎn)品失控”，非常有可能加速產(chǎn)品暮年期的到來。

因此，是否能在前三個階段建立健康、完善的設(shè)計體系，是產(chǎn)品能夠獲得更長生命力、更多價值的關(guān)鍵。

?

NEXT

「 下期預(yù)告 」設(shè)計體系的構(gòu)建法則  

-

你的B端產(chǎn)品處于什么生命周期？在這個階段產(chǎn)品要解決的問題是什么？而在這些過程中設(shè)計體系又應(yīng)該如何構(gòu)建？

設(shè)計體系的建設(shè)并非一蹴而就，通常是伴隨著產(chǎn)品的而發(fā)展逐步建立的。在下一篇文章中，我們將基于B端產(chǎn)品的發(fā)展階段，帶你詳細了解設(shè)計體系的正確構(gòu)建方式。

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：站酷   作者：Jady13_劍杰

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

1.用微妙的雙重投影來讓你的卡片看起來更加清晰

在某些元素周圍使用多個放置陰影或非常精細的邊框（僅比實際陰影暗一點）可以使這些元素看起來更清晰、更清晰，并幫助你避免那些看起來渾濁的陰影。

2.減少標(biāo)題上的字母間距以提供更好的光學(xué)平衡

你的標(biāo)題很可能會比正文更大，也比正文更重，所以字母之間的間距有時會看起來更大，

減少一點間距，就可以使你的標(biāo)題更加清晰

3.為了保持一致性，請確保圖標(biāo)共享相同的視覺樣式。

在ui中實現(xiàn)圖標(biāo)時，保持一致。

確保它們具有相同的視覺風(fēng)格； 相同的重量，或者填充，或者輪廓。

4.在你的設(shè)計中只用一種字體就好了

在創(chuàng)建設(shè)計時只使用一種字體是比較好的，這樣做實際上可以幫助你產(chǎn)生統(tǒng)一的設(shè)計效果。

使用字重、大小和顏色的組合，你還是可以用一個單獨的字體表達清晰的文字的結(jié)構(gòu)

5.留白

留白可以讓你的設(shè)計具有呼吸感，更加舒適

6.選擇底色，然后使用色調(diào)和陰影來增加一致

通過選擇一個基色，然后使用你選擇的顏色的色調(diào)和陰影，可以以最簡單的方式為你的設(shè)計增加一致性

7.提高用戶的入職體驗。 拇指法則記住。

允許用戶隨時跳過你的移動應(yīng)用程序登錄序列，并將該跳過鏈接放在拇指容易觸及的位置。

只是一個簡單的調(diào)整，可以讓你的用戶有更好的體驗（我常常體驗國內(nèi)一些APP，關(guān)閉按鈕特別遠，特別難按）

8.光影需要是來自同一個光源

確保你的陰影總是來自同一個光源，會素描的同學(xué)很好理解，光源關(guān)系一致表達空間統(tǒng)一性的基礎(chǔ)

9.提高文本和圖像之間的對比度

基本的處理方式是，在圖片上增加一個透明漸變蒙版來使得字體看的更加清楚

10.同一種字體時，使用多字重的字體

如果只使用一個字體，盡量選擇有多字重的字體，比如：阿里巴巴普惠體、思源、OPPO

11.在淺色背景上你的文字可見性需要注意

在淺色背景下工作時，文字顏色不要太淺，雖然看起來很舒服，但可見性不較差，不利于閱讀

12.長文本中，文字閱讀感不要太搶眼

當(dāng)涉及到長格式的內(nèi)容時，某些常規(guī)的粗體字體在屏幕上看起來還是有點太重，太呆板了。

建議，選擇像深灰色（即# 4f4f）來降低文本的色調(diào)，這樣閱讀起來會更加舒服

13.行動按鈕需要是最聚焦的。

通過使用顏色對比、尺寸和標(biāo)簽，確?！靶袆影粹o”盡可能突出

14.字號越小，你的行距就越高

隨著字號的減小，增加行高可以獲得更好的易讀性。

16.突出菜單中最常用的元素

在設(shè)計應(yīng)用程序內(nèi)部使用的菜單時，請確保提供最常用的操作（即； 上傳圖像，添加文件等…）最突出的屏幕

17.從你的圖像中挑選顏色，讓你的產(chǎn)品栩栩如生。

只需從你的產(chǎn)品圖像中挑選顏色，然后將你選擇的顏色的各種色調(diào)和陰影應(yīng)用到你的背景、文本、圖標(biāo)……，就能為你的設(shè)計增添大量的視覺趣味

18.根據(jù)字體的x高度設(shè)置行高。

不同x高度的字體需要不同的行高測量來實現(xiàn)文本行之間的正確分隔。

即使你可能有兩種字體大小相同（即； 18px）它們的x高度可能會有很大差異，選擇正確行高是非常有必要的

19.突出最重要的元素

通過使用字體大小、權(quán)重、顏色和布局的組合，你可以輕松突出UI中最重要的元素

20.告知錯誤的原因

在用戶剛剛執(zhí)行的操作附近添加一條錯誤消息，可以幫助用戶提高正確登入，也可以緩解用戶焦慮（他可以更加清晰那里出錯）

21.嘗試在手機上創(chuàng)建更大可點擊的區(qū)域。

當(dāng)為移動設(shè)備設(shè)計時，嘗試創(chuàng)建足夠大的可點擊區(qū)域

對于按鈕和僅由文本組成的鏈接來說，點擊區(qū)域會很小，所以盡可能使用帶有標(biāo)簽的圖標(biāo)。

iOS和Android的最低建議點擊區(qū)域

iOS為44 x 44pt

安卓48 x 48dp

22.在短標(biāo)題上使用大寫的字母

長標(biāo)題都是大寫字母的話，閱讀轉(zhuǎn)化上比較慢（你明白他是什么意思比較慢）

短標(biāo)題都是大字母的話，相對來說比較快可以和記憶中的單詞對應(yīng)上

23.保持淺色文本和圖像之間的對比度

始終確保淺色文本在淺色圖像背景下清晰可見。

只需在文本后面應(yīng)用一個低透明的深色背景，就能保持這些元素之間的良好對比度

24.排版的親密性，要一直記得

標(biāo)題、正文、標(biāo)題、正文……這樣的排列中如果是間距都是相同的，那么在閱讀上就很難區(qū)分標(biāo)題是屬于上文還是下文的。

正確的做法是，標(biāo)題距離上文的距離＞標(biāo)題距離下文的距離，這樣閱讀起來，標(biāo)題會比較清晰的對應(yīng)的是下文

25.在下載中盡量給進度提醒

當(dāng)下載速度是一閃而過時，則無需提示

當(dāng)下載等待時間＞3S時，建議給進度提示

26.文字也有情緒

在項目中處理文本時，選擇正確的字體將影響文本的語音類型。 那么大聲、或者溫柔、或者正式，嚴(yán)肅，或者有趣。每種字體都有自己獨特的聲音

27.為正文選擇合適的行長，并提高可讀性。

基于人閱讀情緒，如果閱讀一行很長，一直閱讀下去，會出現(xiàn)你眼前閱讀的內(nèi)容“不見”的情況

對于單列頁面，45到75個字符被廣泛認為是令人滿意的行長，66個字符的行（包括字母和空格）是最合適的。

當(dāng)然，字體大小和行高也是決定可讀性的一個因素，但是對于行長，要保持在45到75個字符之間

28.偶爾使用純粹的裝飾性元素是可以的，但要保持可訪問性。

需要適當(dāng)，如果裝飾的強了主要表達的，則不可取

29.使UI中的元素相互區(qū)分。

按鈕。 通知。 UI中兩個獨立但必不可少的元素。

一定要確保你的用戶能夠快速準(zhǔn)確地將他們區(qū)分開來

30.陰影不要太重

舒服的投影會增加你的設(shè)計的質(zhì)感，和透氣感。太重的投影會顯得你畫面比較臟

31.使用遞進分類時，需要明確當(dāng)前選中的元素

32.使用高度飽和的顏色？ 試著用色調(diào)或陰影把事情調(diào)小一點。

高度飽和的顏色（明亮的藍色、紅色、綠色等）在網(wǎng)站上看起來很不錯，但過度使用時，會讓用戶眼睛疲勞，主要是與文本內(nèi)容一起使用時。

33.使用用戶熟悉認知的圖標(biāo)表達

在向設(shè)計中添加圖標(biāo)時，使用用戶熟悉認知的圖標(biāo)。新的圖標(biāo)雖有很好看，很有個性，但是會讓用戶疑惑

34.接近律

需要承上表達的元素，排版上接近對應(yīng)的元素，可以讓用戶心理聯(lián)系起來是一體的

35.減少標(biāo)題的行高是很好的。

與長格式正文文本（需要足夠的行高以提高可讀性）不同，標(biāo)題通常要短得多，因此可以稍微縮小間距。標(biāo)題的建議行高通常是文本大小的1到1.3倍

36.從色輪上挑選配色

類比色和鄰近色是最和諧的配色方案之一，也是最不會出錯的配色

37.想用更輕松的語氣， 盡量用小寫字母。

在處理特定項目時，使用類似于所有小寫字母的文本可以表達更加輕松的意思

但需要注意，在圖像和文本之間使用某種顏色疊加，以獲得更強的對比度

38.使用重量、大小和顏色來表示你的結(jié)構(gòu)層次感。

39.深色背景+淺色文本， 增加字重，提升易讀性

當(dāng)在淺色背景下設(shè)置深色文本時，偶爾可以選擇較輕的字體。

但是…

反之：淺色文本>深色背景。

最好是把字體的重量增加一點，尤其是長文本，原因是，讓用戶避免視覺疲勞，獲得更好的易讀性

40.使用爭取的字體類型，表達對應(yīng)的情感

正確的字體選擇對于讓你的內(nèi)容更快的正確傳達更重要

41.全部大寫+字母間距=更好的易讀性。

只需稍微增加字母之間的間距，就可以提高字跡的易讀性，并為大寫字母增加一些設(shè)計感

42.讓表單上的錯誤信息變得有用和容易理解。

確保錯誤提示，解釋了哪里出錯和如何解決

始終讓用戶了解最新情況，即使是普通的表單，讓這些錯誤消息變得有用，不要讓用戶懵逼

43.加載占位符

使用占位符可以更好的緩解用戶焦慮

44.通知用戶如果應(yīng)用某個特定操作將會發(fā)生什么。

在應(yīng)用可能產(chǎn)生后果的特定操作之前，請詳細地通知用戶。尤其適用于具有不可逆轉(zhuǎn)后果的行為，例如永久刪除某個內(nèi)容。讓用戶知道將要發(fā)生什么，并要求他們確認

45.不要在下拉列表中隱藏重要的操作

用戶需要采取的基本操作（例如，注冊或登錄）隱藏在下拉列表中，甚至可能找到用戶想要的。

解決：將重要的功能提出來，不要隱藏

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：站酷   作者：木七木七

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

關(guān)于車載交互(HMI)的一些探索，用一些試驗和案例來進行探索與驗證。

這次我們不聊視覺，也不暢想未來，只說說當(dāng)下HMI產(chǎn)品設(shè)計與交互體驗。

本文內(nèi)容會涉及一些專業(yè)的汽車知識名詞，因為篇幅有限，如有些知識名詞不太明白可以百度一下。

別看錯了，不是HDMI！

說到HMI大多數(shù)設(shè)計師應(yīng)該是既熟悉又陌生，HMI是Human Machine Interface 的縮寫，“人機接口”，也叫人機界面，人機界面（又稱用戶界面或使用者界面）是系統(tǒng)和用戶之間進行交互和信息交換的媒介， 它實現(xiàn)信息的內(nèi)部形式與人類可以接受形式之間的轉(zhuǎn)換，凡參與人機信息交流的領(lǐng)域都存在著人機界面。

聽起來是不是覺得這不就是UI嗎？有什么區(qū)別嗎？emm......的確...似乎...差不多...幾乎是沒有區(qū)別的，只不過是在某些場合和設(shè)備上管他叫UI，比如移動端設(shè)備，而在另外某些場所和設(shè)備上管他就叫HMI，比如汽車車機和數(shù)控機床。所以這個概念也不用去特別較真，HMI就權(quán)當(dāng)做是汽車上的UI界面吧。畢竟汽車是高科技與工業(yè)結(jié)合的完美產(chǎn)物，“HMI”念出這個詞時候就感覺是蠻專業(yè)的！很般配！

HMI前世與今生？

剛才說HMI最早更應(yīng)用于工業(yè)上，比如常見的各種機床、制造裝備。

或者說讓時間在向前推進一點！

而這里通常意義的HMI則更加聚焦點，基本特指汽車車機或者車載多媒體設(shè)備。

說到這里還是要從車載儀表盤說起，從德國人卡爾·本茨發(fā)明世界第一輛汽車，距今已經(jīng)100多年的時間了，在那些還沒有HMI這個名詞的年代，那么他是以什么形態(tài)出現(xiàn)的？那就不得不提“儀表盤”了。

當(dāng)然寫這篇文章并不是去評測誰家HMI更優(yōu)秀，而是希望通過一些假設(shè)、實驗和推斷，和大家一起來探討一下如何更有效的設(shè)計HMI。

屏幕越大越好？車內(nèi)到底需要幾塊屏幕？

我們先從屏幕開始。

說到屏幕，設(shè)計師都是比較敏感的，因為我們最終的設(shè)計交互創(chuàng)意都是需要都是在屏幕上顯示展示出來的，HMI當(dāng)然也不例外?，F(xiàn)在在車載屏幕上你能看到最大尺寸多大？

拿特斯拉為例，Model S和Model X車型都是17英寸，Model 3為15英尺。

當(dāng)然他肯定不是最大的，熟悉汽車朋友你應(yīng)該知道我想說誰了，沒錯就是他！擁有48寸可多段升降屏幕的BYTON新能源概念車M-Byte！48寸的確很夸張，難道屏幕越來越大就是未來HMI的方向嗎？

當(dāng)然這個問題肯定是否定的，為什么？那就要從車載屏幕的作用來說起。

首先我是作為一個曾經(jīng)就職于汽車公司的設(shè)計師，并且是一名地道的汽車發(fā)燒友，憑借對汽車還算熟悉和熱愛做出一些產(chǎn)品交互分析，以下如有不妥之處還望海涵。

汽車內(nèi)屏幕的作用

按照功能場景總體可為三類：主行駛狀態(tài)信息、附設(shè)備狀態(tài)信息、多媒體&外設(shè)

不可缺少還需要與使用者與場景結(jié)合，我們先來做一個大概的用戶畫像

對應(yīng)這些需求，汽車需要有儀表臺（屏）控制和顯示的區(qū)域有五個。

五個區(qū)域分別是：

1、主駕駛儀表屏   

2、中控臺控制（屏）  

3、后排娛樂屏   

4、副駕駛信息屏  

5、扶手控制臺（屏）

其中前三個是主流配置，后兩個比較少見。

關(guān)于汽車設(shè)備這塊我們不做深入展開了，畢竟這篇文章主要討論的還是設(shè)計，直接看結(jié)果！

題外音：屏幕安全性的考量

汽車是比較特殊的設(shè)備，基于安全性考慮，汽車內(nèi)屏幕尺寸不易太大與太多。

屏幕總體為玻璃材質(zhì)，但與車窗風(fēng)擋玻璃的材質(zhì)不同，當(dāng)汽車遭遇碰撞的時候，車內(nèi)屏幕極易破損并形成尖銳物，極大可能會乘坐人員造成二次傷害，所以車內(nèi)屏幕不易太多，更不易太大。雖然車載屏幕變大變多已不可逆轉(zhuǎn)，而且隨著屏幕技術(shù)的提升，柔性O(shè)LED的應(yīng)用也將會在一定范圍解決安全問題。但也需要汽車相關(guān)設(shè)計者多在安全方面進行考慮，任何產(chǎn)品體驗應(yīng)該建立在安全基礎(chǔ)之上的，特別是交通工具。

物理實體按鈕過時了？

為什么大屏幕操控成為了當(dāng)前的HMI主流了呢？那不不得不去提一下另外一個我們熟悉的設(shè)備--手機！

同樣一個有限的區(qū)域，如果用物理按鍵那么這么區(qū)域只能是固定的功能，而屏幕就可以無限擴展。特別是在汽車中控屏上集成內(nèi)容會很多，體現(xiàn)就更加突出。

但是在汽車上的全部使用屏幕真的是最佳選擇嗎？顯然這是有待商榷的。

不可否認屏幕的確有很強的擴展性，但是缺點也是明顯的：1.觸控反饋缺乏    2.交互效率不高

對于這樣的判斷，我們可以通過兩個實驗來進行驗證。

將類似于Surface Dial這種智能按鈕交互裝置引入汽車的屏幕控制中，每個按鈕可以根據(jù)情景進行自定義，并且吸附到汽車屏幕的任何位置進行交互操作，相信這一定是一種全新的使用體驗。當(dāng)然這一定是需要解決比如吸附力、安全性等一系列問題。

屏幕觸控反饋

雖然目前的屏幕還有無法做到完美觸控反饋，但已經(jīng)出現(xiàn)了一些新的硬件技術(shù)來試圖解決這些問題，比如Tanvas Touch，其定義為 “手指與觸摸界面之間的電子壓力控制”。簡單來說他們的產(chǎn)品就 “皮膚的磁鐵” 一樣，能夠更加精準(zhǔn)的感應(yīng)手指的動作，最后結(jié)果就是比 Apple 的 3D Touch 更加具有壓感的觸摸操作表現(xiàn)。

原理是利用手指尖觸摸顯示屏?xí)r產(chǎn)生的靜電引力來模擬觸感，通過電磁脈沖把更精確的反饋發(fā)送到用戶的指尖。

Tanvas 也正在與汽車制造商們合作把這項技術(shù)嵌入到汽車或屏幕上，讓人們更容易感觸受到不同物體的表面。

也許在未來我們真的會遇到他。

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：站酷   作者：殘酷de樂章

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

一、盡量減少用戶等待的情況，盡可能縮短等待的時間

如當(dāng)用戶瀏覽網(wǎng)頁的時候，若在用戶瀏覽到已加載內(nèi)容的倒數(shù)第5條再預(yù)加載10條內(nèi)容，可縮短用戶瀏覽接下來內(nèi)容時的加載等待時間。再如生活中醫(yī)院的預(yù)約掛號系統(tǒng)，用戶可以提前一兩天掛號，當(dāng)預(yù)約時間到了直接到指定科室看病，避免了長時間的排隊掛號。

二、如果是不可避免的等待，該用什么辦法去優(yōu)化等待體驗?zāi)兀?

總的原則是：在用戶等待時給予用戶反饋，告知狀態(tài)，且盡量讓用戶在感知上縮短等待的時間。反饋可根據(jù)等待的預(yù)估時間不同、場景不同，選取不同形式。

• 一般情況下理想的響應(yīng)時間應(yīng)該控制在 100 毫秒內(nèi)，一些響應(yīng)的時長可允許達到1秒，絕不可超過2秒無反饋。

• 若是等待響應(yīng)時長為2-9秒時，可設(shè)計循環(huán)的加載動效（loading），告知用戶正在加載中。

• 若是等待響應(yīng)時長超過10秒時，可設(shè)計帶有進度指示的加載動效。此時除了告知用戶正在加載中（即告知等待原因和當(dāng)前狀態(tài)），還要告知用戶預(yù)期響應(yīng)的時間。

可采取分步響應(yīng)用戶的方式，多次反饋，可讓用戶在感知上縮短等待的時間。

如一些頁面內(nèi)容較多，加載時能分步顯示，可按照框架、文本、占位圖、圖片的順序加載顯示，會在感知上縮短加載時間。又如加載一個新視頻，視頻前幾幀優(yōu)先顯示最小體積的視頻資源，等較高清視頻內(nèi)容加載出來時再切換為高清視頻資源，可縮短用戶等待視頻開始播放的時間。

唐納德諾曼提出過排隊等待的6個設(shè)計原則，可以很好地幫助我們設(shè)計等待體驗，6個原則分別是：

（1）提供一個概念模型。

（2）使等待看起來合理。

（3）滿足或超越期待。

（4）使人們保持忙碌。

（5）公平。

（6）積極的開始，積極的結(jié)尾。

下面我們就說說這6個原則在優(yōu)化等待體驗上的運用：

1. 提供一個概念模型

概念模型是幫助人們把復(fù)雜自然現(xiàn)象轉(zhuǎn)變成可用的，可理解的心理模型。概念模型可以幫助用戶理解事物，了解事物如何運作以及當(dāng)前處在哪個階段、理解當(dāng)前為什么處在等待狀態(tài)，以及產(chǎn)生對未來即將發(fā)生事情的預(yù)估和期待。

如用戶通過餓了么下單后，app上會用插畫顯示商家備貨、騎士送貨的過程。讓用戶了解外賣送到手中的整個流程，以及當(dāng)前處在流程的哪一階段，距下一階段預(yù)估還有多久。如果是雷雨天，訂單頁面的插畫還會模擬實時天氣情況，用戶看到插畫想到騎士正在雷雨環(huán)境下送貨取貨，也會理解騎士配送辛苦、理解當(dāng)前配送緩慢，緩解等待時的負面情緒。

2. 使等待看起來合理

使等待看起來合理，即通過概念模型使用戶理解為什么要等待，明白等待是有緣由的。

如用滴滴打車時，當(dāng)我們按下呼叫快車按鈕，頁面會顯示動效光波信號向外擴散，同時會顯示當(dāng)前排隊人數(shù)。設(shè)計師通過設(shè)計建立一個簡易的概念模型，讓用戶理解當(dāng)前的等待的原因，并認為等待是合理的。實際上滴滴派單的算法流程可能與頁面顯示的流程不同。但用戶等待時會理解此時手機正在發(fā)出信號請求駕車信息、或此時正有多人在排隊、或此時正在等待司機接單。

3. 滿足或超越期待

滿足或超越期待指用戶給等待時間估算時長時，如果用戶實際的等待時間比心理預(yù)期的等待時間要短，用戶會有相對比較好的心理體驗。

心理學(xué)專家曾做過一個實驗，同等時間下，同樣長度的進度加載條有三種進度顯示方式：進度條速度勻速、速度先快后慢、速度先慢后快。三種相比較發(fā)現(xiàn)，當(dāng)進度條增加速度先慢后快，用戶的體驗最好。而用戶體驗最差的是加載速度先快后慢，因為如果開始的時候加載速度比較快，用戶一開始就有了較高的心理預(yù)期，當(dāng)速度變慢時便低于用戶的心理預(yù)期，感知體驗就會變差。

4. 使人們保持忙碌

使人們保持忙碌即讓用戶在等待的時候有事可做。因為當(dāng)人們非空閑時，對時間的心理感知會比空閑時對時間的心理感知要短。

利用這個原則的設(shè)計如：CorelDRAW軟件下載安裝時，軟件安裝等待頁面除了顯示進度條還放映國際優(yōu)秀設(shè)計圖片，CorelDRAW用戶一般都是設(shè)計愛好者或設(shè)計從業(yè)者，通過讓他們?yōu)g覽優(yōu)秀設(shè)計圖片來度過軟件安裝時間，避免用戶純空閑等待。

5. 公平

當(dāng)用戶正在等待時，如果等待看起來是合理且公平時，不易引起用戶的負面情緒。如果等待看起來是不公平的時候，更容易引起用戶的負面情緒。如：當(dāng)你正在排隊買票時，同等條件下，你看到后來半小時的人比自己先買到了票。你可能會抱怨，“為什么比我晚來半小時的人都排到了我卻還在等”。

針對公平方面的設(shè)計如銀行的叫號辦理業(yè)務(wù)系統(tǒng)。用戶統(tǒng)一到取號機前取號，每當(dāng)一個窗口的空出來，叫號系統(tǒng)便叫一個最早的號去該窗口辦理業(yè)務(wù)。這比人們直接分散在多個窗口排隊會更公平，不會出現(xiàn)早來卻因為這個窗口排隊慢而導(dǎo)致等待時長比晚來的用戶更長的情況。同時把多個小隊伍變成一個大隊伍，用戶感知上也會覺得隊伍移動的更快，也有助于降低等待的負面情緒。

6. 積極的開始，積極的結(jié)尾

德國心理學(xué)家艾賓浩斯曾提出系列位置效應(yīng)，指記憶材料在系列位置中所處的位置對記憶效果發(fā)生的影響，包括首因效應(yīng)和近因效應(yīng)。（來源：百度百科）即人們回憶體驗時，在最開始和最后的體驗比中間的體驗更能讓人印象深刻。所以當(dāng)我們在設(shè)計等待流程時，要保證等待開始和等待結(jié)束時有較好的體驗。

如當(dāng)我們在餐館排隊結(jié)賬時，一些餐館結(jié)賬臺旁邊會放著一盤薄荷糖，收銀員幫用戶辦理結(jié)賬時會對用戶說可以拿幾顆薄荷糖。這個小獎勵會讓用戶走出餐館后對剛剛結(jié)賬時排隊等待的不好體驗的記憶變?nèi)酰鴮ψ詈蟮谋『商怯懈畹挠∠?，從而對餐館也留一個相對好的印象。

關(guān)于等待體驗的優(yōu)化設(shè)計案例還有好多，但基本的設(shè)計原則是相通的。

我們在實際設(shè)計時可先整理用戶整個體驗流程中可能等待的點，看看哪些是可以通過設(shè)計或技術(shù)縮短實際等待時間的。針對不能縮短實際等待時間的點，我們先預(yù)估每個等待的時長，并設(shè)計概念模型讓用戶理解等待的緣由且能預(yù)估等待的時間，且采取合適的方式讓用戶在感知上盡量縮短等待時間。

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：站酷   作者：醬紫Y

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

一、什么是用戶體驗？

用戶體驗（User Experience，簡稱UE/UX）這個詞是在上世紀(jì)90年代中期，由用戶體驗設(shè)計師 唐納德·諾曼（Donald Norman）所提出和推廣。

定義：用戶在使用產(chǎn)品過程中建立起來的一種純主觀感受。即用戶在使用一個產(chǎn)品或系統(tǒng)之前、使用期間和使用之后的全部感受，包括情感、信仰、喜好、認知印象、生理和心理反應(yīng)、行為和成就等各個方面。

二、可用性原則

可用性指的是產(chǎn)品對用戶來說有效、易學(xué)、高效、好記、少錯和令人滿意的程度，即用戶能否用產(chǎn)品完成他的任務(wù)，效率如何，主觀感受怎樣，實際上是從用戶角度所看到的產(chǎn)品質(zhì)量，是產(chǎn)品用戶體驗的核心，不好的可用性會導(dǎo)致用戶放棄使用產(chǎn)品。

可用性由易學(xué)性、效率、可記憶性、容錯性、滿意度、實用性、個性化、可預(yù)測性組成。

01 易學(xué)性

指的是用戶學(xué)習(xí)如何與產(chǎn)品進行交互，以實現(xiàn)目標(biāo)所花費的時間和精力，即用戶能否在初次使用產(chǎn)品時完成簡單的任務(wù)或?qū)崿F(xiàn)用戶目標(biāo)。

02 效率

用戶在使用產(chǎn)品一段時間后，能否在合理的時間完成想要達成的目標(biāo)任務(wù)。這里以騰訊視頻為例，用戶能否快速的下載想要的東西，在同一系列中，可以快速下載更多的相關(guān)內(nèi)容。

03 可記憶性

我們常說互聯(lián)網(wǎng)是有記憶的，好的產(chǎn)品體驗是幫助用戶去記憶。用戶在體驗中，要對一些有意識、無意識的行為進行記憶是一個比較大的負擔(dān)，如果在一些環(huán)節(jié)通過系統(tǒng)能幫用戶記錄，會降低用戶的負擔(dān)。比如在搜索、歷史記錄、瀏覽記錄等。

04 容錯性

用戶在使用產(chǎn)品時，發(fā)生錯誤后，能否快速幫助用戶識別和糾正錯誤，幫助用戶從錯誤中恢復(fù)的能力。如常見的注冊登錄，當(dāng)用戶屬于郵箱格式不對的時候，給出提示，并且告知錯在哪里。如果提示語只是："請輸入正確的郵箱" 用戶可能會疑惑，錯在哪里。

05 滿意度

滿意度指的是用戶與設(shè)計互動產(chǎn)生的愉悅程度，可以是用戶使用產(chǎn)品時流暢的交互和優(yōu)秀的視覺設(shè)計，也可以是用戶在產(chǎn)品中得到的滿足感。比如sir語音交互，王者榮耀等級（滿足感）

06 實用性

產(chǎn)品能否提供用戶在完成任務(wù)時所需要用到的基本功能，例如P圖類軟件，用戶需要對圖片進行裁剪、添加濾鏡、摳圖、美顏、補妝、添加文字、去除水印、添加文字等操作。

07 個性化

在滿足實用性的基礎(chǔ)上 針對用戶提供不同場景下的功能定制，如美圖秀秀，在提供圖片美化的同時，針對用戶不同的使用場景還提供視頻剪輯、視頻美容等功能。

08 可預(yù)測性

用戶能夠預(yù)測到下一步操作或者整個流程的交互，將會發(fā)生什么。舉例淘寶的購買流程。點擊購買按鈕> 選擇商品屬性> 付款> 輸入密碼> 購買成功; 用戶在點擊購買按鈕開始就能夠預(yù)測到下一步或者整個流程的步驟會發(fā)生什么。

三、可見性原則

可見性是用戶根據(jù)界面中可見元素確定產(chǎn)品可以做什么的設(shè)計原則。

01 物理功能可見性

物理功能可見性是基于對象的物理外觀。在視覺上，這種類型的功能可見性使用戶能夠立即清楚地看到在設(shè)計界面中能干什么。例如當(dāng)我們使用音樂類軟件，最常使用的就是播放/暫停，上一曲/下一曲。我們就會尋找去這些圖標(biāo)。其次是分享、收藏、下載、評論等功能需要用到的功能展示在頁面中，這就是功能可見性。

02 狀態(tài)可見性

當(dāng)信息或者列表過多時區(qū)分狀態(tài)的展示，將重要的狀態(tài)信息呈現(xiàn)在盡可能高的信息層級當(dāng)中。如iOS信息和QQ郵箱中區(qū)分未讀信息的微標(biāo)。如果將這些徽標(biāo)隱藏起來，會極大地破壞易用性，因為人們將不得不進入一個個郵件詳情頁當(dāng)中進行確認，才能獲取到原本由徽標(biāo)提供的狀態(tài)信息，這樣的互動非常低效且乏味。

03 步驟可見性

當(dāng)用戶在執(zhí)行某項任務(wù)的時候應(yīng)該清晰明了的告知用戶目前在什么步驟，后面還有多少步驟，完整清晰的流程展示。如果將這些信息隱藏起來，用戶會困惑當(dāng)前進行到哪一步，接下來還有多少步驟。

四、可供性原則

強調(diào)需要明確的視覺線索向用戶展示產(chǎn)品可以做什么。例如用戶界面中的交互元素（如滾動條、命令按鈕和圖標(biāo)等）的設(shè)計必須能夠為用戶提供足夠清楚的建議，讓用戶可以清晰地辨別出這些元素所代表的意思是什么、它們的功能是什么，以及如何與它們進行交互行為（點擊、長按、滑動 等）

五、反饋

給用戶及時、恰當(dāng)?shù)姆答?，是體驗設(shè)計中非常重要的一項原則；對每個用戶的操作都應(yīng)該有恰當(dāng)?shù)南到y(tǒng)反饋（包含視覺、聽覺、觸覺）。

01 告知性

明確告知用戶當(dāng)前操作發(fā)生了什么。如點擊下載和下載過程給出相對應(yīng)的反饋及進度條。

02 動作連接性

當(dāng)用戶產(chǎn)生某個動作時，給予相對應(yīng)的連接反饋。如大概用戶點擊某個按鈕時，按鈕默認的外觀與點擊后的外觀發(fā)生變化，結(jié)合現(xiàn)實世界的開關(guān)去思考（按下 開燈）動作與反饋是連接的，即時的。

六、希克定律

?？硕?，是1951年由威廉·埃德蒙·?？耸紫忍岢龅模J為人們從數(shù)組中選擇目標(biāo)的時間取決于可用選項的數(shù)量。也就是當(dāng)一個人所面臨的選擇越多，做出選擇所花的時間就越多，當(dāng)面臨選擇的數(shù)量增加，做出決定的時間也會跟著增加。

如京東篩選，在搜索結(jié)果頁會將篩選條件收起，因為里面的篩選條件內(nèi)容過多。用戶會在當(dāng)前頁面選擇的時間增加.將一些項目分組放入二級下單，并且做好歸類，用戶能夠更迅速的作出決定。

七、費茨定律

費茨定律，是1954 年 由保羅.菲茨首次提出，在人機交互中指的是通過圖形用戶界面使用鼠標(biāo)或其他類型的指針從一個起始位置移動到一個最終目的所需的時間。

T：代表完成移動所需的平均時間

A：代表光標(biāo)開始/停止時間

B：代表光標(biāo)移動速度

D：代表從起點到目標(biāo)中心的距離

W：代表目標(biāo)的尺寸

簡單來說就是指：隨著目標(biāo)的距離增加，移動到目標(biāo)的時間更長，并且隨著目標(biāo)的尺寸減小，選擇目標(biāo)的時間也會增加。

所以在界面設(shè)計當(dāng)中會遵循越重要的功能，占據(jù)面基會越大。重要圖標(biāo)的點擊熱區(qū)也會增大。便于用戶快速點擊。

屏幕外邊緣和四個角部比屏幕中的其他位置都更容易被定為和選中，所以我們在進行產(chǎn)品設(shè)計的過程中，會將常用/重要的操作放置在屏幕邊緣處，便于用戶操作。

八、神奇數(shù)字 7 ± 2

神奇數(shù)字7±2法則是1956年由 喬治·米勒 所提出的，根據(jù)喬治·米勒的研究，人類短期的記憶一般一次只能記住5-9個。也就是為什么大多數(shù)APP底部導(dǎo)航為5個的原因。

由于人類的大腦處理信息的能力有限，大腦會將復(fù)雜信息劃分成 塊 和小的單元。如：京東和每日優(yōu)鮮的分類處理。

人類短期的記憶一般一次只能記住5-9個，所以人們總是傾向于把一串?dāng)?shù)字拆分為多個較短的部分進行記憶。如銀行卡號和手機號碼等。

九、復(fù)雜守恒定律

復(fù)雜守恒定律是1984年由 拉里·泰斯勒 所提出的，也稱作泰斯勒定律。認為每一個產(chǎn)品設(shè)計的過程中，都有其固有的復(fù)雜性，存在著一個臨界點，超過了這個點產(chǎn)品設(shè)計的過程就不能再簡化了，你只能將固有的復(fù)雜性從一個地方轉(zhuǎn)移到另外一個地方。

在產(chǎn)品設(shè)計中，會盡量的簡化界面。當(dāng)功能過多時進行一個整合的處理，跳轉(zhuǎn)或者滑動操作。如查看更多或者常見的漢堡導(dǎo)航。

十、新鄉(xiāng)重夫：防錯原則

新鄉(xiāng)重夫認為遺忘有兩種：一種是疏漏，另一種是忘卻。他建議采用一些措施來預(yù)防產(chǎn)品的缺陷。

防錯原則認為大部分的意外都是由設(shè)計的疏忽，而不是人為操作疏忽。因此，在設(shè)計中要有必要的防錯機制；比如常見的信息輸入狀態(tài)，未輸入置灰不可點，輸入變?yōu)榭牲c擊狀態(tài)。

微信拍一拍：微信在出了拍一拍功能之后，很多時候點擊頭像的時候會不小心拍到別人，現(xiàn)在的拍一拍是可以撤銷的，在客戶端鼠標(biāo)懸浮上就可以進行撤回，移動端長按出現(xiàn)撤回彈窗，兩分鐘內(nèi)有效。

微信朋友圈動態(tài)：點擊返回圖標(biāo)會出現(xiàn)的彈窗，避免誤操作。利用防錯原則，可以避免用戶重新編輯。微信當(dāng)中有很多友好的體驗細節(jié)?？梢远喽嗳ジ惺?。

十一、奧卡姆剃刀原理

奧卡姆剃刀 定律 ：它是由14世紀(jì)英格蘭的邏輯學(xué)家、圣方濟各會修士奧卡姆的威廉 （William of Occam，約1285年至1349年）提出。 這個 原理 稱為“如無必要，勿增實體 ”，即“ 簡單有效原理 ”

01、只放置必要的元素

不必要的元素會降低設(shè)計的效率，不管是實體、視覺或者認知上，多余的設(shè)計元素，有可能造成失敗或者其它問題。這并不意味著不能提供給用戶很多的信息，可以用「更多信息」來實現(xiàn)。如夸克瀏覽器，首頁只放置重要功能 搜索 和幾個整合內(nèi)容的圖標(biāo)入口。

02、減少點擊次數(shù)

讓用戶通過較少的點擊就能找到他們想要的東西或使用功能。如音樂類軟件，在播放音樂之后進入其他的tab，在上面都會懸浮播放/暫停的區(qū)域。都能夠隨時操作。

03、“老人”規(guī)則

就是產(chǎn)品的易用性，如果年紀(jì)大點的人，也能夠輕松使用所設(shè)計的產(chǎn)品那么是成功的。如抖音沉浸式的體驗，簡單的滑動就能夠觀看想看的內(nèi)容。目前抖音的用戶老年人也逐漸包含在內(nèi)，并且抖音會根據(jù)用戶的停留時長等推送用戶感興趣的內(nèi)容。

04、減少“段落”個數(shù)

頁面的使用率，當(dāng)你想要在一屏新增很多內(nèi)容時，頁面的布局就會變得擁擠和區(qū)域變小，容易過于干擾用戶做出選擇，重要功能不夠突出等?？淇藶g覽器首頁強化了搜索功能 和幾個整合內(nèi)容的圖標(biāo)入口；uc瀏覽器首頁內(nèi)容過多，當(dāng)用戶想要使用搜索功能時很容易被其他內(nèi)容干擾。

05、給予更少的選項

前面說到的?？硕烧f到，當(dāng)選擇的數(shù)量越多，用戶做決定的時間就更長。做過多的決定也是一種壓力，在展示內(nèi)容的時候要努力減少用戶的思維負擔(dān)。如攜程和馬蜂窩金剛區(qū)的內(nèi)容展示，馬蜂窩根據(jù)產(chǎn)品屬性放置了6個重要的功能入口，便于用戶更快的去選擇所想要的功能。

十二、設(shè)計和藝術(shù)的區(qū)別是什么？

最后我們來探討一下設(shè)計和藝術(shù)的區(qū)別是什么。我看到一句話覺得挺好的。設(shè)計和藝術(shù)的重要區(qū)別是：藝術(shù)拋出問題，而設(shè)計解決問題。

我們設(shè)想一個場景，當(dāng)你在藝術(shù)展廳站在一副名畫面前，你所思考的是什么？是驚嘆畫家的畫技還是整個畫面給你的感覺是一種故事，你會不會思考藝術(shù)家在作畫時的心情，處境，為什么要這么去畫？想表達怎么樣的情感？

然后我們再設(shè)想一個場景，同樣在藝術(shù)展廳，你身上帶有手機和相機。你會選擇用相機拍照還是用手機。答案是 相機 對吧？因為相機的拍照效果在任何環(huán)境下都會比手機好。這就是設(shè)計。是能夠真真切切的解決用戶問題的。能夠去感知到的。

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

文章來源：站酷   作者：左言右設(shè)

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

數(shù)據(jù)表單是一種常見的平臺設(shè)計樣式，在看似乏味呆板的設(shè)計中，沉淀著許多優(yōu)質(zhì)的設(shè)計體驗方法。尤其是在信息組織、信息傳達、信息承載和閱讀性方面，數(shù)據(jù)表單蘊含了許多設(shè)計規(guī)則和設(shè)計模式，使用戶能夠輕松地獲取、處理信息。該篇文章介紹了固定表頭、固定側(cè)欄、自定義欄、分頁器、過濾器、數(shù)據(jù)排序、多選項同時操作、簡單且簡約、普通的字體樣式、項目鏈接、鼠標(biāo)懸停這 11 個設(shè)計指南，為大家提供有關(guān)數(shù)據(jù)表單設(shè)計的實用性建議。

當(dāng)然，在實際的數(shù)據(jù)表單設(shè)計中，還需要根據(jù)產(chǎn)品要求和用戶目標(biāo)進行相應(yīng)的調(diào)整。你對數(shù)據(jù)表單設(shè)計有什么經(jīng)驗體會？有過哪些很棒的設(shè)計案例？歡迎交流分享～

△ 插畫來自 icon8

對于大多數(shù) SaaS 平臺，數(shù)據(jù)表單是必不可少的組件，可讓用戶獲得相關(guān)數(shù)據(jù)和洞察，從而采取正確的決策。

作為一個前企業(yè)家，我使用過各種 SaaS 平臺，例如 Mailchimp，Shopify，Klaviyo，Zendesk 等。它們提供不同的服務(wù) —— 電子郵件、訂單管理、客戶服務(wù)等解決方案，其共同點是，都需要將數(shù)據(jù)反饋給用戶。而數(shù)據(jù)表單則是傳輸大量數(shù)據(jù)最好的方法。

數(shù)據(jù)表單之所以有效，是因為它們能夠有序地組織信息和數(shù)據(jù)，使用戶能夠輕松地掃描、比較和分析自己選擇的信息。這篇文章介紹了我在設(shè)計數(shù)據(jù)表時遵循的關(guān)鍵設(shè)計模式。

固定表頭

這一點對于超過 30 行的表單尤其重要。當(dāng)用戶必須向下滾動才能查看所有可用信息時，如果沒有固定表頭，用戶將很難理解和區(qū)分多行數(shù)據(jù) —— 其中大部分可能是隨機數(shù)。一個固定的表頭可以幫助他們輕松地使用數(shù)據(jù)表，避免了向上滾動查看字段含義 。

設(shè)計提示

我傾向使用 8px 網(wǎng)格系統(tǒng)進行設(shè)計，將表頭尺寸保持在 16px（最小值）—— 防止你的設(shè)計看起來過于沉重和擁擠。

△ 當(dāng)用戶不理解某個數(shù)據(jù)字段時，固定的表頭使得用戶無需重復(fù)向上滾動查看表頭內(nèi)容

固定側(cè)欄

對于數(shù)據(jù)表單，需要兩個組件對所有信息進行排序。一是表頭，用于理解顯示的數(shù)據(jù)。二是固定側(cè)欄 ，與每一行數(shù)據(jù)相連接 ，常用于項目名稱，例如活動名稱、產(chǎn)品名稱、股票名稱等。

當(dāng)數(shù)據(jù)表單需要水平滾動展示隱藏列時，通過固定第一列項目名稱，可以獲得與固定表頭相同的組件優(yōu)勢，提升信息傳達效率。

設(shè)計提示

設(shè)計固定側(cè)欄時，請在該列的右側(cè)添加陰影和垂直分隔線，提示用戶該表支持水平滾動。

△ 當(dāng)數(shù)據(jù)表有太多列時，通過固定第一列項目名稱，使表單更易理解

自定義欄

自定義欄允許用戶根據(jù)自己的偏好選擇表單顯示內(nèi)容。當(dāng)涉及多個指標(biāo)和數(shù)據(jù)集時，該功能可以滿足不同的用戶目標(biāo) 。常用于自助廣告平臺，例如 Facebook Ad Manager、Google Ads、AdRoll 等，在這些平臺上有多種營銷指標(biāo)，每個用戶的優(yōu)先級都不同。

△ 自定義欄允許用戶根據(jù)自己的喜好對數(shù)據(jù)表進行個性化設(shè)置

分頁器

我從開發(fā)朋友那里學(xué)會了對表單進行分頁，通過限制正在處理的信息量，減少加載時間。另一種方法是使用漸進式加載，當(dāng)鼠標(biāo)滾動到最后一行時，表單自動加載一組新的數(shù)據(jù)。對比后者，分頁器允許用戶一次跳過好幾個組數(shù)據(jù)，滿足用戶非連續(xù)性瀏覽的需求。

設(shè)計提示

大多數(shù)表單每頁顯示行數(shù)可能超過 30 行，因此，將分頁器固定在表單頂部或底部會更加友好，方便用戶在頁面之間切換，無需過度地快速滾動。

△ 使用分頁可以減少加載時間，因為它限制了正在處理的信息量

過濾器

過濾器組件對于篩選目標(biāo)信息、屏蔽無關(guān)數(shù)據(jù)量至關(guān)重要。日期篩選是最基本的過濾器，能夠根據(jù)用戶指定日期來顯示信息。當(dāng)每列具有固定的展示字段，這意味著信息不是隨機的，而是固定的選擇，您還可以設(shè)置單項信息的過濾器。

最好在過濾器下拉列表中提供復(fù)選功能，允許用戶選擇多個變量 —— 過濾系統(tǒng)越靈活，用戶就越容易操縱他們的信息。

△ 過濾器組件對于減少根據(jù)用戶要求顯示的數(shù)據(jù)量至關(guān)重要

數(shù)據(jù)排序

排序類似于過濾，可以根據(jù)用戶的需要重新排列信息，調(diào)整信息展示順序。在大多數(shù)情況下，左列會對表單進行默認排序，用戶可以單擊標(biāo)題對表單進行相應(yīng)的排序設(shè)置。

您可以將排序添加到表頭中，例如按數(shù)字或字母順序?qū)Ω鱾€數(shù)據(jù)進行排序。但請不要濫用此功能，它對于狀態(tài)或類別等特定指標(biāo)，可能是多余的 —— 過濾器處理這些數(shù)據(jù)會更合理。

設(shè)計提示

盡量避免使用線型圖標(biāo)，選用面型圖標(biāo)來增加可見性。懸停狀態(tài)能夠傳達整個區(qū)域可單擊的視覺提示 。

△ 排序類似于過濾，根據(jù)用戶的需要重新排列信息

多選項同時操作

復(fù)選框允許用戶選擇多個項目，并對所選項目執(zhí)行某種操作 。幫助用戶節(jié)省時間和精力，不必重復(fù)相同的步驟。想象一下，所有的行都有相同的選框，這些選框會重復(fù)出現(xiàn) —— 這會使你的表單看起來雜亂無章。

設(shè)計提示

我通常將復(fù)選框的大小保持在 24px（最小尺寸），居中布局，提高可用性。此外，高亮顯示被選定的行，增強對比性 。

△ 復(fù)選框允許用戶選擇多個項目并對所選項目執(zhí)行操作

簡單且簡約

“極簡主義” 這個詞已經(jīng)被廣泛地使用，空白似乎是現(xiàn)在的趨勢，但在這種情況下，少就是多。在設(shè)計數(shù)據(jù)表單時，重點應(yīng)該放在數(shù)據(jù)本身而不是用戶界面上。用戶已經(jīng)在與大量的數(shù)字和信息交互，復(fù)雜的界面只會增加用戶的認知負荷。

設(shè)計提示

沒有必要添加額外的視覺干擾，例如不必要的圖標(biāo)、斑馬行、隨機顏色等。

△ 當(dāng)你讓你的 UI 設(shè)計師瘋狂的時候會發(fā)生什么？

普通的字體樣式

在設(shè)計中，排版是樣式指南中的一個關(guān)鍵元素，對于品牌推廣至關(guān)重要。但在設(shè)計表格時，您應(yīng)該遵循上面的指示（簡單和簡約），不要在表格中使用任何復(fù)雜的字體樣式。

設(shè)計提示

沒有推薦的字體，但建議盡量避免使用襯線字體，因為它們往往會吸引人的注意力，導(dǎo)致額外的視覺負擔(dān)。此外，避免出現(xiàn)大寫單詞，它會使你的設(shè)計看起來沉重。

△ 襯線字體在表格上看起來很奇怪 —— 不知道你們是否看到過使用襯線字體的數(shù)據(jù)表單

項目鏈接

對于特定的表單，項目名稱還可以充當(dāng)鏈接，這是一種符合用戶習(xí)慣的交互形式，用戶很容易理解鏈接會將其帶到何處。

設(shè)計提示

設(shè)計文本鏈接時，請使用不同的顏色向用戶展示此鏈接 —— 僅在文本上加粗或設(shè)置下劃線并不能提供足夠的視覺提示。

設(shè)計文本鏈接時，請使用不同的顏色向用戶展示此鏈接

鼠標(biāo)懸停

表單的操作通常放在最后一列。當(dāng)沒有太多的信息列，需要水平滾動信息時，這種模式就很適合。也可以將操作放在第一列或第二列，這樣用戶就不需要在滾動時跟蹤這一行，但操作較多時，可能會產(chǎn)生認知過載，導(dǎo)致不必要的錯誤。

鼠標(biāo)懸?？梢员３趾喖s的外觀 —— 只有當(dāng)用戶將鼠標(biāo)懸停在相應(yīng)的行上時， 操作圖標(biāo)和文本才會出現(xiàn)。

最后

以上內(nèi)容只是原則性說明，主要為你提供一般性的建議，在實際的數(shù)據(jù)表單設(shè)計中，還需要根據(jù)具體的產(chǎn)品要求和用戶目標(biāo)進行相應(yīng)的調(diào)整。

文章來源：優(yōu)設(shè)網(wǎng)    推薦：TCC翻譯情報局

藍藍設(shè)計( www.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)