本文是參考國內交互設計標準網站及用戶行為研究實現的用戶體驗設計規范，用于后臺設計，網站設計等。
涉及到的產品越多，產品統一性越強，實現信息同頻，開發和設計快速了解信息
一個項目中會涉及到多種按鈕，甚至一個頁面中也會涉及到多種不同功能的按鈕，這個就需要把同一類型或同一功能的按鈕，它們的位置統一。減少用戶學習成本。
因為如果同一樣的功能按鈕在不同的變換位置的話會打亂用戶已經形成的習慣，增加其學習成本。（盡量采取以下情況的一種）
幫助說明的表現形式有很多種，但不管選那種整個項目要保持統一，一些特殊情況除外，固定一個位置，可以方便用戶在最短的時間內，快速完成此項操作和獲取內容。
權重是為了突出有效信息，也能在不同元素建立一種有組織的層次結構，讓用戶快速識別關鍵信息。
為了讓用戶能在操作上（類似表單、彈出框等場景）快速做出判斷，來突出其中一項相對更重要或者更高頻的操作。
突出的方法，不局限于強化重點項，也可以是弱化其他項。
但是在一些需要用戶慎重決策的場景中，系統應該保持中立，不能替用戶或者誘導用戶做出判斷
表單在遵守操作流程的情況下，讓用戶涉及到的操作從易到難，讓用戶有填下去的動力。
排序規則
（1）有“有默認項”的選項；
（2）有“選項”的選項；
（3）只輸入“數字”的選項；
（4）“添加圖片”“修改”等涉及復雜操作的選項；
（5）“備注”“商品賣點”等選擇。
左右排版的時候將“重要必填項”先在從左邊（縱向排列）開始排版（排版時仍按照我們的從簡到難的規則）
注：當“必填項”比“非必填項”多時，排版上要考慮，就按照次序，左邊排滿，再排右邊。
在使用Table 時，文字鏈的點擊范圍受到文字長短影響，可以設置整個單元格為熱區，以便用戶觸發。
注：當懸浮在“客戶”所在的文字鏈單元格時，鼠標
【指針】隨即變為【手型】，單擊即可跳轉。
當需要增強按鈕的響應性時，可以通過增加用戶點擊熱區的范圍，而不是增大按鈕形狀，從而增強響應性，又不缺失美感。
注：在移動端尤其適用。
鼠標移入按鈕附近，即可激活Hover 狀態
當『易讀性』遠比『易編輯性』重要時，可以使用『單擊編輯』
狀態一：普通的瀏覽模式，不區分可編輯行和不可編輯行；
狀態二：鼠標懸停時，『指針』變為『手型』，編輯區域底色變黃，出現『Tooltips』提示單擊編輯；
狀態三：鼠標點擊后，出現『輸入框』、『確定』、『取消』表單元素，同時光標定位在『輸入框』中。
當『易讀性』為主，同時又要突出操作性的『易編輯性』時，可使用『文字鏈/圖標編輯』
狀態一：在可編輯行附近出現文字鏈/圖標；
狀態二：鼠標點擊『編輯』后，出現『輸入框』、『確定』、『取消』表單元素，同時光標定位在『輸入框』中。
當『易讀性』遠比『易編輯性』重要時，可以使用『單擊編輯』
注：編輯模式在不破壞整體性的前提下，可擴大空間，以便放下『輸入框』等表單元素；其中，在Table 中進行編輯模式切換時，需要保證每列的不跳動。
減少負擔，增加輕量化的操作
注：刪除的操作是謹慎的，系統在不打斷當前操作的時候給出二次提醒確認。
填寫表單的條件反饋。
注：不需要提交后才出現提示，輸入及時給用戶反饋
完成整個操作后的提示以及系統提示
注：重要的，文字多于15個字以上不適合放在toast里面提示。
提供下一步操作的入口
不僅要提示他發生了什么，還能引導他怎么做，甚至能讓他一步到位直接跳轉到要進行下一步操作的頁面去操作
當頁面沒有按鈕時，提供明確的入口。
最后，關于后臺的用戶體驗設計規范就總結到這里啦。
文章來源：站酷 作者：chaih
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
前言
近年來，「設計規范」逐漸被「設計體系」或「設計語言」的概念重塑。基于一套架構嚴謹、規則統一的體系框架，產品表現層面的設計工作可以逐漸實現模塊化運作，從而讓視覺設計工作變得更加高效。
「Design System 系列」將會從設計觀、設計原則、設計形式三個方向入手，由深到淺、由整到分地演繹設計體系對整個產品迭代過程的價值和意義。有正確的設計觀作判斷好壞的標準，并結合行之有效的設計原則作指引，才能制定出最優的設計方案。
簡介
Robin Williams 的四大基本設計原則相信大家都不陌生，尤其在平面設計領域內對它的應用更為廣泛。在此基礎上，我結合中后臺產品的設計特點，將其縮寫為「兩對兩性」原則，即：對齊、對比、親密性、一致性。
每個優秀的設計中都會應用這些設計原則，并且各自是相互關聯的，只應用某一個原則的情況很少。
作為設計體系的一部分，這套設計原則也為設計實踐提供了理論依據。本章引用中后臺產品設計中一些常見的案例，并以簡潔凝練的語言，分析總結了這四個基本原則的實際應用方法和注意事項。
本章大綱如下：
一、對齊原則
任何元素都不能在頁面上隨意擺放，每一項都應該與頁面上的另一項或多項存在某種視覺關聯。即使對齊的元素空間上是相互分開的，但在水平或垂直位置上也會有一條“隱形的線”把它們連在一起。
在界面設計中，將元素進行對齊，既符合用戶的認知特性，也能引導視覺流向，讓用戶更流暢地接收信息。
1. 左對齊
左對齊是將文本信息或視覺元素沿垂直方向向左對齊的一種對齊方式，左側會有一條“隱形的線”，將彼此分離的文本或元素連在了一起。
文案類、列表類、表單類等排版會常用到左對齊的方式，這能讓用戶順著視覺流的方向，快速高效地接收信息或填寫表單內容。
2. 右對齊
右對齊與左對齊相反，右側會有一條“隱形的線”，將文本信息或視覺元素連在一起。
在表格或表單中使用右對齊，可以實現快速對比數值大小，建議數值的格式保持統一。常規類數值可以統一使用千位符，如「1,024」；金額類數值可以保留小數點后兩位，如「￥88.00」。
3. 居中對齊
居中對齊是第三種常見的對齊方式，中間會有一條“隱形的線”，將文本信息或視覺元素連在一起。
居中對齊會形成一種更正式、更穩重的外觀。盡管這是一種合理的對齊方式，但邊界是“軟”的，“對齊線”的強度也較弱，所以會顯得中規中矩。通常，首頁的功能介紹文案以及數據、金融等類型的產品界面會使用這種對齊方式。
4. 兩端對齊
兩端對齊也稱方形左右對齊，因為文本信息的左右兩端均對齊。
通常在商品信息結算、帶有輔助說明的列表等場景中會使用兩端對齊的方式，不僅能讓橫向的文案更具關聯性，易于用戶接受信息，也能使排版顯得更加工整和嚴謹。
二、對比原則
對比可以有效地增強頁面的視覺效果，同時也有助于元素之間建立一種有組織的層級結構，讓用戶快速識別關鍵信息。
需要注意的是，要想實現有效的對比，就應當拉開元素之間的差異，差異越大，對比效果越明顯。
1. 字體對比
字體對比包括：襯線體和無襯線體的對比，如 Georgia 和 PingFang；字重粗細的對比，如 Regular 和 Semibold；字號大小的對比，如 14px 與 20px；字體顏色的對比，如 #333 和 #999。
當界面或模塊的標題字體大而粗、且顏色較深，正文字體小而細、且顏色較淺時，信息層級關系更明顯，字體對比效果將更理想。
2. 顏色對比
顏色對比包括：色相對比，如 Red 和 Blue；飽和度對比，如 S100 和 S60；明度對比，如 B100 和 B60。
下圖中的百分比堆疊面積圖利用不同維度 (區域) 的色相對比，清晰的反應每個數值所占百分比隨時間或類別變化的趨勢，對于分析自變量是大數據、時變數據、有序數據時各個指標分量占比極為有用。
3. 大小對比
大小對比就是在同一畫面里利用大小兩種元素，以小襯大，或以大襯小，使主體得到突出。大小對比主要體現在面積或體積兩種維度上的對比。
在下圖的 Dialog 中，主體圖片的面積相對于商品信息文字的面積得到最大化突出，主次更加分明，視覺沖擊感也更加強烈。
4. 水平與垂直對比
水平與垂直對比，是指水平分布的視覺元素與垂直分布的視覺元素在橫縱方向上的對比。
在排版上，水平與垂直對比可以打破單一呆板的排列方式，在保持對齊的基礎上，豐富了界面元素的空間表現形式，減輕了用戶的疲勞感和無味感。
三、親密性原則
如果信息之間關聯性越高，它們之間的距離就應該越接近，從而形成一個視覺單元；反之，則它們的距離就應該越遠，從而形成多個視覺單元。
親密性的根本目的是實現組織性，讓用戶對頁面結構和信息層級一目了然。
1. 水平空間關系
為了自適應不同尺寸的屏幕，同時保持橫向上控件的關聯性，因而采用柵格布局的方式來組織擺放元素和控件，保證布局的靈活性。
同一控件內部的元素，橫向間距上也會有“親疏”之分，以體現組織性。
2. 垂直空間關系
在復雜的頁面或模塊設計中，縱向上需要使用高、中、低三種規格的間距來區分信息的層級關系?；凇冈g距」8px，三種規格可以是 24px (高間距)、16px (中間距)、8px (低間距)。
注：縱向間距公式：y=8+8×n。其中 y 是縱向間距，8 是元間距，n≥0。
另外，增加「分割線」等視覺元素，也是有效劃分頁面結構和信息層級的常用手段。
四、一致性原則
可以把「一致性」理解為「復用」，相同的元素在整個界面中不斷復用，復用元素可以是線框、顏色、控件、文本格式、空間間距、設計要素等等。
一致性的根本目的是統一元素，并增強視覺效果，降低用戶的學習成本，幫助用戶快速識別出這些元素之間的關聯性。
1. 線框復用
同類信息的載體可以是相同粗細的線框、相同投影的卡片、或是相同顏色的底面，注意保持樣式屬性值的一致，以及上下左右間距的一致。
2. 顏色復用
在界面設計中，相同的功能提示、圖表數據、文字層級、按鈕、圖標、分割線、背景等，應使用相同的顏色，保持色彩體系上的統一，避免同類型的元素使用不同顏色給用戶造成認知困擾。
3. 控件復用
使用統一的導航、按鈕、彈框、圖表、選擇器等控件，既可以提高設計者和開發者的工作效率，避免重復造輪子的現象出現，又可以保持界面設計的一致性，降低用戶的理解成本，提高使用效率。
4. 格式復用
相同類型、維度或級別的文案，應使用相同的展現格式。注意標題、正文、輔助信息的層級關系，使用統一的對齊方式，讓關聯性高的信息之間形成一個視覺整體。
本章小結
1. 對齊
任何元素都不能在頁面上隨意擺放，每一項都應該與頁面上的另一項或多項存在某種視覺關聯。
2. 對比
對比可以有效地增強頁面的視覺效果，建立一種有組織的層級結構，如果想讓元素不同，那就讓它們截然不同。
3. 親密性
如果信息之間關聯性越高，它們之間的距離就應該越接近，從而形成一個視覺單元，這有助于組織信息，減少混亂。
4. 一致性
一致性的根本目的是統一元素，并增強視覺效果，降低用戶的學習成本，幫助用戶快速識別出這些元素之間的關聯性。
好久沒有發文章了，今天順叔和大家一起聊一聊卡片式設計，無論是WEB還是APP卡片式設計運用的比較多，很多UI設計師比較偏愛這樣的表現，卡片式設計會給人一種視覺上的享受，也能對于界面具有層次感。但往往在卡片設計中有一些技法還是需要了解，不能因為卡片式設計而卡片式設計，要能更好的應用到界面場景中。希望在這次分享中一些知識點能幫助到大家，之后的幾篇系列文章中，順叔會從界面中比較趨勢的設計技法進行分析，希望能幫助到一些設計的小伙伴。
教程前的引言
卡片式設計這幾年比較流行，同樣這樣的設計表達也是個趨勢，應用在APP PC界面中至今還流行著，從事UI設計的都會知道卡片式設計，具有把內容整合模塊化，從視覺，個性化體驗上進行呈現，是設計師在設計時常用的一種表現，同樣也具有獨特的創新概念。
在一些項目中，一些客戶會說這個設計的APP界面有點太白，沒有層次感怎么辦，那這時你應該和客戶說在APP設計中運用了現在比較流行的一個表現手法，卡片式設計，可以解決在畫面中有個性化 、變化、 層次感的設計。那客戶又問什么是卡片式設計呢？
一、什么是卡片
無處不在的卡片設計具有個性的美感和很好的易用性，是以文字標題，小標題， 圖形或圖片組成的模塊化，以塊狀形式規整的整合內容，讓內容更規整化，視覺上更個性化，也是操作上快捷的內容信息入口。更直觀的表達內容信息和快捷跳轉操作。成為當今在設計中一個比較流行趨勢，而卡片在設計中也占用一定的優勢，讓整體更加的有層次感，在運用起來也比較方便，從視覺、體驗、交互都具有不錯的優點
設計效果圖展示
順叔為了這個文章特意設計了兩個案例，通過這兩個案例進行一些講解。請見下圖：
二、卡片設計優勢
1.趨勢
無論是大平臺 還是小平臺的產品都會運用這樣的卡片式，跟風式設計趨勢，也讓卡片式設計成為了一個現在常用的優勢，不過卡片式設計的確有很好的效果
2. 層次感
具有一定的層次感，能在頁面版式中起到設計上的不同，個性化變化，頁面層次感區分強烈，能更好的體現提煉出內容
3. 規整化
卡片式設計以圖片、 圖標 、LOGO、 標題、 整合到一起 以塊狀的形式在界面中展示，更規整的排版呈現。雖然內容多會導致頁面亂，一個模塊包含內容之后就會規整不少，也給頁面設計上帶來了更好的視覺
4. 視覺體驗
卡片式給整個頁面會增加視覺上的體驗，特別那種大圖片卡片式更具有視覺上的沖擊力，背景襯托出前景卡片式設計。同樣對卡片式也感覺到舒適感?？ㄆ皆O計還是需要根據整個布局、 產品需求 、功能進行設計。以達到最好的用戶體驗、視覺體驗。
不要為了卡片設計而卡片設計。
5. 易用性
卡片式設計在易用性和靈活性上比較高，在響應式設計中同樣應用的也比較多一些。能更好的有序排列。
6.簡約設計
簡約設計會更顯得品質，不需要過多的進行裝飾，哪怕就是一個白色的色塊，上面點綴有色彩的圖標和標題 副標的變化，也會覺得顯得高大上，就算是一個帶有顏色的色塊卡片，也無須過多的設計 內容上的標題 、圖標、 按鈕就足以支撐起卡片
7. 交互效果
在卡片式的設計中會有一些動效交互，比如整體卡片放大、 縮小 、左滑、 右滑，可以整模塊化滑動 縮放。整體效果增加了不錯的視覺交互體驗
三、卡片正確設計知識
一般在界面設計中卡片的存在的意義和表現手法都是什么樣的呢，下面為大家舉例了幾種常用的正確的設計表達姿勢。希望小伙伴在設計的同時有所靈感和參考，把一些表現手法加入到自己的設計中，適合才最重要?？ㄆ皆O計還是要根據整個風格和整個布局而進行展示，在做進一步的對比和布局中以最好的效果為最終展示方式，總結分析幾個常見代表例子，如有不全請討論補充，下面就是一些例子
1.卡片式形式一
以色塊為主體并用現在比較流行的漸變色組成，其中四邊為圓角，同樣色塊下邊陰影襯托出主題，這個是在卡片中設計比較常見的運用手法，卡片的長高在設計中也是根據結構，內容功能而進行設定。正方形，長方形都是一個表現得手法，在色塊上面標題文字，圖標，圖形是整個卡片的布局的形式，無非就是左右布局和上下布局
應用場景：卡包、天氣、類別、入口、優惠劵，卡劵
此圖片來自于網絡
2. 卡片式形式二
這種形式共同點都是在頭部C位出現的卡片式設計，其中承載著標題，副標題，以及圖文版式，不難發現，如果圖片有顏色，那么下面是白色底，這樣在白底上面色塊的出現還是比較簡約凸顯卡片，如果背景有顏色，卡片也有顏色那么卡片的凸顯程度就不會那么強，圖二很多在會員卡設計中常用的比較多，也比較簡約，另外兩個共同特點背景有顏色，一般底部背景顏色就是整個界面的主色調，背景有色塊，上面就用白色卡片，卡片上方標題、 文字、 圖片呈現。只不過排版的方式有所不同而已，在很多APP設計中，這樣的表達也很多，通過主色調可以很融合的把上面的狀態欄，導航欄融為一體視覺上統一性，底部背景顏色延續下來，上面凸顯白色卡片，這樣更具有視覺感和層次感。白色的卡片不需要過多的修飾，更能體現的上面的文字和圖片。
應用場景：會員卡，滑動卡片，圖文標題，入口
此圖片來自于網絡
3. 卡片式形式三
這種形式上圖下文字，或者是上標題，下圖片的形式，這種形式特別在圖片素材的選擇上尤為重要，有視覺效果好的圖片通過剪切，處理，合成，攝影，插畫等等方式，出現的圖片質量上好的話可以帶動整個設計的逼格，通過有效的圖片傳達，文字傳達，讓用戶更清晰的了解。這樣的形似一般在入口或者列表的形式出現的比較多，同樣也能體現出整體化和視覺化
應用場景：滑動卡片，圖文標題，入口，列表
此圖片來自于網絡
4. 卡片式形式四
大圖卡片式，一般以攝影圖片，插畫形式，文字壓與圖片之上，這樣的效果更具有沖擊力，也能顯得出比較潮流。體驗也很不錯，放大視覺，展示內容，圖片相結合，讓瀏覽者更愿意多看一會。表達的圖片與文字內容相符，做到圖文交融的程度。一般這樣對于圖片的選擇上還是比較要求嚴格的。沒有質量的圖效果會降低。
應用場景：列表，說明，入口，天氣
此圖片來自于網絡
5.卡片式形式五
列表卡片設計，這種形式一般白色的卡片，上面標題，頭像，按鈕，扁平插畫形式體現，更多應用在一級頁面的下方內容，以及二級頁面的列表頁或者集合頁，整體弱化背景以白色為主，給予圓角及陰影承托出層次感同時，體現上面內容部分。每個模塊的單元體具有統一的視覺。
應用場景：列表，集合頁，入口
此圖片來自于網絡
6. 卡片式形式六
大卡片式設計，表現為一塊特大的卡片式，上面會有標題，按鈕等信息，同樣表現出突出層次感，個性化設計的特質。體現出內容，一般背景有顏色上面卡片為白色，如下面背景為白色，那么卡片的形式也可色塊，在對比上有個反差，才能突出卡片的作用性。
應用場景：提示，說明，優惠劵，劵，入口
此圖片來自于網絡
以上總結的幾種卡片的形式，在設計中可以根據情況而設計，卡片多樣化，布局多樣化，適合自己產品的才最重要，雖然在界面設計中常用的設計，但不要盲目的為了卡片而卡片套用設計，這樣起不到作用反而效果達不到理想程度。希望幾個卡片形式總結能給大家帶來一些靈感和啟發。
同樣在這些卡片中會有一些基本的共同的特點
共同的特點是
1. 四個角都是圓角
2. 根據潮流漸變色或白卡片
3. 色塊下的陰影，色塊下的陰影更能體現出層次
4. 卡片上面組成部分，標題，副標題，圖形，按鈕，圖片，頭像
5. 字體大小，字體顏色的變化
6. 一般卡片應用在會員，列表，說明，優惠劵，分類，類別，集合頁，歡迎頁等場景常見
三、卡片正確設計知識
為了講解文章，順叔臨時構思一個產品原型，而快速進行了簡單的設計，一個第一版，一個優化版，主要為了講解一下這個卡片設計一些問題，
以下此圖為構思的原型圖
經過分析原型圖之后開始進行設計，首先設計一個版本的，如果這樣卡片布局設計，這樣色彩搭配的情況下，會怎么樣呢，整體設計用了藍紫色為主色調，首先鋪藍紫色的色塊作為背景，然后上面放白色卡片，以至于卡片上詳細的內容，比如數字，圖形 能更好的豐富支撐卡片。同樣數據流也是比較重要的C位。也是比較重要的位置。接著根據原型圖下面有兩個卡片，通過扁平化設計，以色塊為主設計一個藍色，一個橙色的卡片，上面并有圖標，頭像，以及標題，兩個顏色的對比，更讓視覺有沖擊力，整體看這個設計并沒有什么，但有個問題在于單個模塊拿出來效果的確都不錯，但組成之后上面的卡片C位讓下面的兩個帶顏色的卡片搶了視覺，當打開這個界面的時候視覺落點在彩色卡片上，那么這個整體設計上就出現了問題，上面的數據，白色卡片其實是比較重要的，而且整個畫面都是卡片毫無設計上的變化，
那么只能在這個基礎上在進行優化，其實大家在做設計的同時也這樣，在考慮功能模塊前提下，用戶體驗，也要考慮視覺體驗，那么視覺從哪方面來，色彩、層次、版式等等方面。那么能不能在進行一下優化呢，其實還是有空間在進行優化。以下圖為第一版
設計第一版
根據上面的設計在進行優化，同樣保留白色卡片部分元素，在卡片與卡片之間放一些顏色的圖標，這樣更好的給功能上快捷入口，也能給卡片設計增添了變化。使得整個畫面更靈活
雖然白色卡片，但有一些色彩的點綴，也讓白色卡片活躍起來，把顏色的卡片改成白色卡片，從上到下的版式舒服多了，也沒有那么跳。整個風格更簡約，同時功能也更全面。
調整后
從原型圖，在到設計第一版，在到優化調整之后，證明一點，卡片不要因為卡片而套設計，反而會失去效果，考慮功能模塊，用戶體驗，視覺體驗也一定讓整體舒服。一直都說，繪畫中需要有主有次，設計中也一定要有主，有次的進行設計。這樣層級關系才能更清晰。
但這些條件一定是從，體驗、色彩、布局、版式等方面進行對比和研究的。設計不要先著急做設計，前期的進行思考，邏輯清楚了，在進行設計的時候會更加的順暢。卡片式設計，大家都在應用，希望這個文章能給大家帶來一點點知識點，那就不枉費我在熬夜寫這篇文章。
不為別的，只是一個喜歡分享的肉團子。這篇文章就寫到這里，如果喜歡請給個贊吧。如內容有沒說到的地方，各位可以進行補充，以上兩個圖你稀罕哪個呢？
一：平鋪
平鋪：指的是將表單信息完整的排版在界面中。
無論是在B端還是C端設計中，平鋪的表單設計是最常見的，這樣的表單用戶可以一覽看全所有表單的信息（但是對于表單字段多且復雜的場景，平鋪也不能一覽所有）。所以對于平鋪的表單設計而言，一般是針對表單信息簡單且字段信息較少的情況，如果字段信息小于兩屏且字段信息強相關，那么我們可以選擇采用平鋪的表單設計方式。
例如：飛書的審批表單頁面設計就是采用平鋪的設計方式
表單的第二種設計方式是分組，分組的排版方式又可以細分為三種方式。分別是：折疊分組、區域分組、標題分組。下面分別介紹了三種分組的詳情。
01：折疊分組
折疊分組：指的是將表單信息分類顯示，通過點擊按鈕展開和收起表單的具體信息。
在B端設計中，會存在很多設置類表單設計，最常見的圖表數據和樣式外觀設置，對于一個圖表而言，會讓用戶自定義圖表的各種信息設置，并且需要在一個表單中顯示完整圖表設計所涉及到的范圍，所以大多數都會采用折疊分組的形式。
折疊分組用戶可以一眼看全表單所涉及到的大范圍，用戶鎖定某個標題范圍后，再展開去完善對應的具體表單信息，這樣用戶就可以不用在龐大的表單信息中去尋找自己需要完成的表單信息。折疊表單一般會包含一些默認的數值，用戶可不做調整，不調整也不會影響功能的使用。如果說表單信息需要用戶手動完整的填寫或者確認，那么最好不要選擇這種表單的設計方式。
例如：Grafana的自定義BI圖表設置信息就采用了折疊的表單形式
02：區域分組
區域分組：指的是將表單信息分類顯示，通過矩形背景劃分區域，形成小組表單信息。
在B端設計中，一些復雜的表單會通過區域分組的形式排版設計，可以將一個表單的信息通過信息的關聯關系劃分不同的區域形成小組信息，這樣有利于信息的歸類以及信息的填寫。用戶在看到復雜表單的時候不會被龐大的表單迷惑，可以更好的找到表單字段，也可以讓用戶填寫表單更有秩序、更清晰。區域分組的使用場景，一般也是針對復雜表單且具有強相關的信息關系。
例如：下面是我在工作中所運用的一個區域分組的表單設計方式。
03：標簽分組
標簽分組：指的是將表單信息分組標簽化，形成獨立的小表單信息，分為上下結構和左右結構。
上下結構
左右結構
復雜的表單可以采用區域分組的形式，還可以采用標簽分組的設計形式。標簽分組可以一眼看全所有分組大類信息，對于一個表單涉及到多種信息字段的情況，并且每個組的字段信息都是獨立的，不是強相關的，那么我們就可以采用標簽分組的形式。
標簽分組可以直接點擊標簽快速定位到想要查看和填寫的表單區域，這樣使用戶操作更加快速便捷。并且也讓龐大的表單信息得到更好的整理，讓用戶使用更方便，可降低用戶對于龐大表單信息的焦慮感。
下面可以看一下在B端產品中我對于一些復雜表單標簽分組的設計方式。
三：分頁
分頁：指的是將整個表單信息通過多頁的形式展示。
分頁表單設計一般會針對具有步驟前后順序關系的表單。也就是指需要先完成上一步表單信息才能進入到下一步的表單頁面，形成一個完整的閉環流程才能使表單信息提交成功。
同樣的，下面截圖為B端實際業務工作中的一個分頁表單設計頁面，因為業務的保密性，所以就不做太多的業務信息，只需要看到分頁表單的一個實際設計場景即可。
一：彈窗（對于信息較少的表單）
最常見的表單呈現方式即彈窗，無論是在C端還是B端，我們都隨處可見彈窗形式的表單。彈窗表單一般呈現在屏幕中間，底部有暗色遮罩層，將底部信息與彈窗表單隔離，使用戶專注于表單的填寫。彈窗模式的表單一般是針對表單信息較少的情況，并且填寫表單不需要關注底部頁面的信息。用戶可以在彈窗表單中順利地完成表單的任務。
案例：
二：抽屜（內容信息較多，且與底部信息強關聯）
抽屜形式的表單一般是針對表單信息較多且與底部信息具有強相關的關系。用戶在填寫表單時需要根據底部信息的輔助完成，或者需要同時操作底部面板中的相關信息，來協助完成表單信息及讓交互使用更方便。
抽屜形式的表單展示方式是從屏幕右側彈出，有時候也會有從底部彈出的情況。這里主要分享從右側彈出的抽屜表單模式，抽屜模式還分為三種模式：有遮罩層的抽屜模式、無遮罩層的抽屜模式、擠壓模式。
下面分別介紹這三種模式的區別以及使用場景。
有遮罩層的抽屜模式
有遮罩層的抽屜模式指的是抽屜底部有暗色遮罩層，將抽屜表單信息與底部頁面信息隔離，這里的遮罩層與上面彈窗中的遮罩層是同樣的作用。那么就有人有疑問了，既然都是有遮罩層具有同樣的隔離作用，那為什么要從右側彈出，而不直接和彈窗一樣展示在屏幕中間呢？
有遮罩層的右側抽屜模式的表單具有以下特點：
01:右側抽屜出現位置在屏幕的右側，雖然有遮罩層，但是仍然可以看到遮罩層底部頁面的相關信息，如果在填寫表單的同時需要關注底部信息，并為填寫表單做輔助，那么右側抽屜表單模式比常規的彈窗模式更適合。
02:右側抽屜模式的表單面積更大，更適用于復雜表單的呈現，可以展示更多的信息。
案例：
無遮罩層的抽屜模式
無遮罩層的抽屜模式指的是抽屜底部沒有暗色遮罩層，抽屜直接浮在底部內容之上，一般通過對抽屜背景做投影來區分底部內容與抽屜內容，讓兩者之間能更清晰地辨別使用。
無遮罩層的右側抽屜模式的表單具有以下特點：
01:與有遮罩層的模式一樣具有可根據底部信息輔助完成表單信息的填寫的特點。
02:適用于復雜表單且可以展示更多的字段信息。
03:另外有一個更加重要的特點是：由于底部內容是沒有遮擋層，所以用戶還可以同時操作底部頁面，使用戶切換信息更便捷，使用效率得到提高。
案例：
三：擠壓模式
擠壓模式指的是表單信息從右側出現，將原本畫布的內容區域寬度減小，從而展示右側表單。這樣的展示方式界面需要做適配，做到畫面中的元素自動適配畫布大小，以滿足正常的閱讀和使用。
擠壓模式與上面的無遮罩層的抽屜模式具有相同的特點，另外擠壓模式還具有可以完整看到原本界面中的內容，右側表單可以自由展開和收起。
但是對于表單信息龐大且復雜的業務情況就不太適用于右側擠壓的模式，因為表單寬度占據太多會影響原本界面內容的展示，原本內容會因為寬度區域太小而布局錯亂的問題，如果因為右側擠壓的表單出現而改變原有界面內容的布局，對于用戶而言使用也不太友好。
案例：
四：頁面（單獨表單填寫，且信息量較多）
上一期已經分享過關于分頁展示的表單模式，其實和這里的頁面展示類似，當表單信息龐大且與原界面無強相關的可以直接采用新頁面呈現。使表單單獨成頁更好地展示表單信息減少其它信息的干擾。
案例：
總結
B端的業務比較復雜，不同的表單信息的復雜程度有所不同，需要根據實際業務的情況合理地選擇表單的展示方式，也需要考慮用戶的使用場景以及業務表單的關聯關系。
簡單且不具有強相關的表單可選擇平鋪，呈現方式可選擇彈窗
復雜且具有強相關的表單可選擇區域分組，呈現方式可選擇無遮罩層抽屜/擠壓
復雜且不具有強相關的可選擇標簽分組，呈現方式可選擇有遮罩層抽屜
具有先后順序的則選擇分頁，表單信息獨立可選擇分頁的呈現方式
（并非強制的表單設計選擇方式，需要合理考慮業務哦！）
文章來源：站酷 作者：設計小余
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
在日常的工作中，會經常接觸到一些數據方面的內容，同時我也在不斷的加強相關方面的專業知識學習，希望可以借此做一個總結，與大家分享。如果你也在平時的工作中遇到相關的數據問題、不知如何利用數據推動設計、或者對數據抱有一定的興趣，那我們可以一起往下看。
本文主要圍繞以下幾個方面來進行解釋說明：
隨著互聯網大環境從增量進入到存量市場，企業發展與產品的迭代越來越離不開數據的指導，數據驅動已然成為當下產品的主趨勢。身為設計師的我們，更應該對數據保持高度敏感，通過一系列的數據分析推動設計迭代,并讓其更合理、更具有可信度。
任何一款產品，設計師都無法根據自己的心情、想法，一拍腦門的迅速產出。好的產品，既要考慮市場價值，也離不開用戶體驗，應該明確目標而進行實現，所以設計過程中需要依靠數據給予我們指導，即利用數據驅動設計。
數據在產品迭代過程中有著舉足輕重的地位，對于設計師而言也是極其重要。在了解數據之前，簡單的理解一下為什么需要數據，在互聯網產品設計中，數據的作用主要分為以下三點。
工作中或許會常常面臨多種需求并線進行的狀況，合理客觀的數據有助于我們更好的分清任務的優先級，并聚焦于當前最緊急的任務展開進行。合理有序的安排可以推動任務的快速高效完成。
設計師與真正的用戶之間往往存在一定的差異，我們不能按照設計師固有的思維方式去衡量用戶的想法，更不能想當然的覺得用戶需要什么。
數據可以幫助我們更好的了解用戶，利用數據分析的種種方法，我們可以進行抽絲剝繭，發現更深層次的問題，不斷的去深挖用戶需求，進而更好的滿足用戶，只有這樣我們才能更好的留住用戶，促進產品增收。
在進行設計輸出的過程中，我們可能常常會遇到以下情況：
我相信各位設計師在日常的對接中，一定是根據需求文檔進行了設計輸出，但是在設計評審階段卻很難去說服各需求方。數據在此情景下就顯得非常重要，它可以幫助我們針對設計方案有一個理性的數據支撐，去衡量我們的設計方案是否合理有效。
其次在項目上線后依據數據反饋,可以驗證此次設計是否達到理想目標,是否還有進一步優化的空間。了解數據可以更好的幫助我們深耕需求、把控方向。
為了進一步了解數據，現將所有的數據進行整合區分，大致上可以分為兩個類型，分別是定性數據與定量數據兩大類。
定性數據指導設計過程，往往判斷某件事物的意義與價值。定量數據關注數據頻率，在結果上更具有說服力。這兩種數據的類型在數據分析以及設計驅動的過程中都非常重要。時常會通過定性數據來發現、定義問題，最后再由定量數據來驗證結果。
定性數據是非統計數據，在樣本選取上，數據量較少，主要收集途徑有以下方法：應用商店評論、客服反饋、音視頻記錄、筆記反饋、訪談調研等。
可以快速了解到用戶的行為和態度，這種數據具有可調查性，是可以進行深入研究的，能進一步推斷出設計的哪些方面存在問題，從而通過設計方法優化產品設計體驗。
定量數據是統計性的，可以用來問“多少”的問題，最終生成結論性的數據信息。收集途徑可以有以下方法：測試、產品數據、指標上報、實驗調查等。
定量數據提供了對設計的間接評估，可以快速了解用戶基礎信息數據以及對產品的使用感知，例如完成率、滿意度等等數據指標，它不僅可以幫助我們快速統計信息，還能驗證結果。
數據不應該是只停留在表面的數字，需要深入的了解數據，善于從這一堆數字背后，發現數據的真實意義。
由此，Google推出HEART模型，作為一套完善的用以評估以及提升用戶體驗的標準。HEART模型包括五個維度，分別為：愉悅度（Happiness）、參與度（Engagement）、接受度（Adoption）、留存度（Retention）、完成度（Task success）。通過這種方式將數據分為五個維度，可以更有效的明白不同類型的數據所體現的真實含義。
什么是愉悅度？關于這個問題，大概一千個人會有一千個回答吧，因此愉悅度更偏向于用戶在產品使用過程中直觀的主觀感受，例如滿意度、產品體驗感受、推薦指數、易用性感知等等體驗指標，通過這一類的數據可以有效的了解用戶對于產品或者某個功能的喜好程度。
可以利用定性研究的方式獲取用戶在體驗和感知上愉悅程度，例如一對一訪談、觀察小組、可行性測試等。也可以通過定量調查中的問卷、數據反饋、AB測試等了解用戶的使用情況以及推薦指數等。
指用戶在使用產品功能時的參與深度，衡量指標即為有效活躍用戶的數量。用戶參與度并沒有統一的可量化的界定標準，但大致上可以分為以下幾個指標，產品訪問頻次、平均訪問時長、訪問頁面數量、產品使用間隔。
數據的衡量只是最基礎的一步，更重要的是如何提升用戶的參與度，對于新用戶而言，可以通過引導、幫助等建立良好的第一印象；對于老用戶，需要合理的推送相關優惠與活動，也可以利用游戲化運營建立長期關系，這些都是比較有效的提升參與度的方法。
當一個新的產品與功能出現時，由于陌生感，用戶短時間內很難接受，而接受度就是指用戶在特定時間內真正開始習慣并使用。
為了快速得到用戶的認可，往往產品設計中會通過競品分析的方式確?？蚣軆热菖c市場的同類產品保持一致，滿足用戶的使用習慣。而針對大部分的新用戶也會使用新功能引導以及相關通知推送等加快新用戶的接受度。
在產品運營中，留存是最關鍵的數據指標，它也是產品獲利與增長中最主要因素之一，留存直接決定了用戶是否愿意繼續使用，它是最真實的數據表現，而留存通常體現在，多日留存率、回訪率、不同平臺的使用重合率等。
針對這一數據我們需要關注的核心問題就是如何提升用戶留存率，大致的方法可以分為以下兩個維度：
(1) 產品維度
產品功能決定是決定用戶留存的關鍵。在需求設計上，通過挖掘潛在需求，刺激用戶長期使用，并且通過拓展應用場景，不斷提供細分服務，進一步滿足用戶；甚至我們也會發現在大多數產品中，通過建立社區，打造社交圈子，強化用戶的粘性。
(2) 運營維度
產品使用過程中，合理的運營也是提升用戶留存的關鍵之一，常用的方法有定期舉辦活動、例如砍價、助力、簽到、每日任務等；也可以通過消息推送挽留用戶。
完成度主要是指用戶對于關鍵任務的完成率，常常用來衡量交互流程是否合理。主要包括以下維度：首次點擊時間、操作完成時間、完成點擊次數、完成率、失敗率、出錯率等。
A: 任務完成度的衡量指標該怎么計算呢？
(1) 任務完成時間
用戶在整個任務過程中，所花費的時間即為任務完成時間。
(2) 完成率
完成率=完成的操作次數/開始操作的次數
產品設計中，為了提升完成率，需要輔助用戶進行交互并進行引導設計，不僅需要符合不同場景變化以及用戶的心智模型，還要給予用戶體驗流程中的舒適感受，進一步輔助其完成任務。
B: 如何提升任務的完成率呢?
(1) 降低理解成本
利用設計手法，降低任務流程中的理解成本，切入到實際的場景中，幫助用戶快速完成任務。
例如在列表模塊中，默認狀態下的輸入框內，展示灰色的提醒文案，提前告知用戶該區域應該填寫的內容；比如說高德地圖通過AR技術結合導航，快速幫助用戶完成導航任務;再類似于可視化數據看板,幫助用戶快速獲取信息結果。
(2) 精簡任務流程
降低理解成本只能單一的滿足用戶操作前的理解，而操作過程中的步驟長短也起到非常關鍵的作用。優化任務流程，目的就是為了提升完成率。
例如用戶在進行登錄注冊時，可以點擊右上角的文案即可實現登錄注冊狀態的快速切換，減少用戶切換的流程步驟。再比如說表單填寫類的產品,還可以將相同的內容進行整合，減少操作。甚至電商產品中，可以通過找相似減少用戶的篩選成本。
(3) 系統智能預判，提供幫助
結合用戶的場景與行為，進行合理的預判設計，有助于縮短用戶操作路徑、引導用戶轉化。例如下面的案例，在表單信息填寫中，通過智能判斷關聯內容，提供幫助，甚至通過判斷用戶的行為，進行精準內容推送。
通過以上數據的五個維度，可以發現數據的覆蓋面是十分廣泛的，不同的數據反映不同的內容。在工作中我們也會接觸到復雜且多樣的數據，對于設計師而言，常用的數據大致可以劃分為用戶數據、行為數據、業務數據這三大類別。
從字面上理解用戶數據即為與用戶有關的數據，這種數據常常用來描述用戶人群、用戶基礎屬性等。通過一系列的“用戶數據”進行支撐，可以快速梳理關于產品的基礎用戶群體，構建用戶的畫像。
不同的產品屬性，有不同的用戶人群畫像。比如說美柚這款記錄類APP,主要的用戶人群是年輕的女性,對生活有一定的追求；再比如說英語流利說這款產品,主要的用戶人群是年輕的、有明確學習英語需求的人群。
用戶數據主要包括兩大類別：用戶基本屬性與用戶生命周期數據。
用戶基本屬性通俗解釋即為關于用戶自身最基本的屬性，包括性別、地域、年齡、職業、學歷、收入、婚姻狀況等等......通過這一系列的屬性，我們可以對用戶有一個更深刻、更全面的認知。
只有更好的了解用戶，我們才能進行針對化的設計產出、精準投放，從而推動產品更好的發展。這就好比兩個人談戀愛，只有清楚對方的想法、習慣、喜好，才能減少吵架的幾率，實現和諧發展。
生命周期指的是從開始到結束，用戶都會經歷著從接觸到流失的階段，我們通過生命周期結合用戶數據可以簡單分為新增、活躍、留存、流失。
1、新增用戶數
新增用戶從字面上拆解開來即為新、增，廣泛意義上來說，我們可以將一段時間內打開產品的新用戶人數算作新增用戶，但是更嚴謹一點的話，則表示某產品一段時間內新增加的注冊用戶數量。
通常我們將下載且訪問過產品的用戶稱為訪客，這部分人群是潛在的注冊用戶。
2、活躍用戶數
活躍用戶在體驗產品的過程中會花費更多的時間與精力，相比普通用戶而言他們更加認可平臺，對于平臺的發展有著重要的地位。那什么是活躍用戶？如何具體的去定義活躍用戶呢？
通常來說，用戶在規定的時間周期內，有打開過產品，這就算做一個活躍用戶。當然，不同平臺對于活躍用戶的定義存在一定差異。而活躍用戶主要也分為兩類：新用戶與老用戶，而從商業的角度上還可以劃分為低價值用戶與高價值用戶。
活躍用戶數常見的指標有DAU、WAU、MAU。
DAU：Daily Active User，表示日活躍用戶數量，指的是從0:00-24:00一個自然日(統計日)之間，登錄并使用了某一功能的用戶數量。
例：某個產品的日活計算方式為打開該APP即算活躍，2022年1月19日這天打開APP的行為有50次，經排重后發現有30個用戶打開了APP，那么該產品的DAU就是30。
了解完DAU,我相信大家對于WAU（周活躍用戶數量）與MAU（月活躍用戶數量）應該不至于陌生了。WAU與MAU，他們兩者最大的區別就是計算周期的不同，但需要注意的是，月活的計算并不是簡單的日活相加，我們需要進行去重。
3、用戶留存率
在講解用戶留存率之前，我們應該了解用戶留存。何為用戶留存？顧名思義，就是最終留下來的用戶。用戶留存率這一指標可以反饋當前產品的質量如何，這是產品自初期開始就需要持續關注的內容。常用的用戶留存指標有次日留存、3日留存、7日留存、15日留存和30日留存。
4、用戶流失
用戶流失的定義是什么？用戶流失需要結合時間(Time)與動作(Action)這兩個指標進行，即用戶在一段特定時間內未進行關鍵行為的操作。與之常常相關聯的因素大致分為產品生命周期、負面體驗、競品策略等等。
用戶流失率的存在表明了用戶對產品的負面反映，對于產品發展有著非常重要的數據反饋。
當下市場中的獲客成本越來越高，獲取新用戶的成本要比留住現有用戶的成本高出5倍。因此降低用戶流失率，就顯得尤為重要。
行為數據常用來描述用戶使用方式，指的是用戶在使用產品過程中所產生的一系列交互相關的數據，通過分析快速了解用戶特征，為流程優化、精細化運營、產品體驗等設計措施提供判斷依據、輔助設計。
行為數據的指標主要包括轉化率、平均停留時長、跳出率、PV、UV等等。
1、轉化率
什么是轉化率？轉化率就是下一頁面與當前頁面的訪問占比。它常常被用來衡量產品路徑中的用戶體驗是否合理，從而進一步推動流程優化以及設計迭代。
以下圖為例，有200個人來到了頁面A，其中有100人點擊頁面A的按鈕進入頁面B，那么頁面A按鈕的轉化率則為(100/200)*100%=50%。
2、啟動次數
通常指的是某一特定時間段內用戶啟動應用的次數。與之相關的兩大指標分別為用戶總啟動次數與人均啟動次數，常用來反映用戶粘性與活躍度。
3、使用時長
使用時長是指某一特定時間段內用戶從打開到關閉產品的使用時間。使用時長需關注的指標為用戶總使用時長、人均使用時長、單次使用時長。這些指標常用來衡量用戶粘性與活躍度，常常需要與啟動次數一起結合進行分析。
4、訪問分析
頁面訪問分析包括頁面訪問次數、停留時長、跳出/退出率、用戶訪問頁面數和用戶訪問路徑。
(1) 訪問次數
訪問次數是指訪客完整打開頁面進行訪問的次數，常用來衡量產品的訪問速度。
(2) 停留時長
停留時長表示用戶進入產品中，呆了多長時間后離去。這一指標是考量用戶粘性以及貢獻度的重要指標。
(3) 跳出率/退出率
跳出率，指的是只訪問了入口頁面即退出的次數與入口頁面訪問次數的占比數。
跳出率越低，說明流量越好，用戶對產品的興趣越高。
計算公式為：跳出率=訪問一個頁面后離開的次數/總訪問次數*100%
退出率是指從該頁面退出的頁面訪問數與進入該頁面的頁面訪問數之比。
計算公式為：退出率=退出次數/總訪問次數*100%
跳出率為(2/8)*100%=25%
退出率為{(2+2)/(8+2)}*100%=40%
注意：跳出率與退出率較高，也不全部都是壞事。我們需要具體問題具體分析。比如說某些下單頁面，點擊提交后會進入第三方支付平臺，該頁面跳出率高則為正常。
(4) 用戶訪問頁面數
用戶訪問頁面數常常離不開兩方面的指標，PV值與UV值。
PV(Page View)：指的是在一個特定周期內，頁面訪問量或點擊量，側重瀏覽量。
用戶每訪問一次就算作一個PV。
UV(User View)：指的是在一個特定周期內，訪問頁面的人數之和，側重訪客數。
一天內同個用戶多次訪問僅算作一個UV。
(5) 用戶訪問路徑
用戶訪問路徑是統計用戶從進入產品到離開產品整個過程中的路徑與頁面訪問情況，不同的用戶路徑是不同的，我們需要去定位關鍵節點，針對性的產出優化方案。
如下圖所示，用戶在進行針對性的查找歌曲時，通過首頁的搜索入口進入，在搜索引導頁面中輸入歌名，最終出現結果頁。通過用戶的訪問路徑分析，可以為我們進行優化提供合理的切入點。
1、ARPU
ARPU是 “The average revenue per user” 的縮寫,是指在某一周期內用戶產生的平均收入,用來衡量單個用戶為企業所帶來的效益。
注意：ARPU值是有時間屬性的，我們在計算的時候需要有清楚的時間定義，不同的定義方法，計算出來的結果是有很大差異的。
2、付費率
不同業務模式之間的付費率計算方式是不同的，在進行分析之前，我們就需要弄清楚分析的維度。
(1) 注冊用戶付費率
注冊用戶付費率=付費人數/注冊人數
(2) 活躍用戶付費率
活躍用戶付費率=付費人數/活躍用戶人數
3、GMV （成交金額）
GMV (Gross Merchandise Volume)，即成交金額。這個指標常用在電商行業，是用來衡量電商企業綜合實力的核心指標。
GMV=真實成交金額+未付款訂單金額+拒收訂單金額+退貨訂單金額。簡而言之就是GMV為已付款訂單與未付款訂單兩者之和。
4、LTV （用戶終身價值）
LTV(Life Time Value)，為用戶生命周期價值。一般常用指標為3日、5日、7日、30日、60日、90日LTV。常用來衡量用戶從開始使用到不再使用產品的整個生命周期內，為企業貢獻了多少收入。
它的計算方式由兩部分組成：LTV=LTxARPU，LT為用戶生命周期，ARPU為每用戶平均收入。
數據分析不僅僅是擺數據，同時深度的結論也非常重要?？沼袛祿?，沒有結論，對于決策者而言并沒有什么明確的用處。那么，面對一堆數據，我們該如何分析得出深度的結論，從而驅動決策？
數據的獲取渠道有很多種方式，接下來分享幾個我在工作中經常使用的方法。
注意：同一關鍵詞，不同平臺的搜索結果可能存在一定差異
平時的工作中，我們不能僅僅是沉浸在自己的世界，需要加強與其他同事之間的溝通交流。通過與用戶運營、數據分析師的交流，可以了解到最新的數據情況，時刻保持敏感度。
如果公司沒有專門的數據分析師，也可以從客服人員下手，他們無疑是與客戶打交道最直接的人了，他們對于用戶的痛點會更及時感知?？梢酝ㄟ^詢問客服人員，更好的了解用戶的痛點需求，輔助我們設計方案的執行。
我們可以通過多種方式了解用戶對于產品的反饋，比如說Feedback用戶反饋，Twitter、Facebook等社交媒體，以及Google Play應用商店評論等。
針對想要查看相關數據的模塊內容，提交關鍵數據指標給到數據分析師、開發等，從而進行一個定制化的內容獲取。
注意：說到這里就不得不提到數據埋點，有一個需要我們注意的地方，那就是在進行埋點時，一定要在設計階段就提前告知開發以及數據分析師，做好溝通工作，針對需要的數據進行埋點處理。
在需求評審前，設計師可以提前了解相關數據，幫助我們對于設計層面有個更深刻的理解。在評審過程中，通過溝通碰撞了解到更多的數據，也能依據之前項目的數據資料作為參考，輔助本次設計優化。
在一些大的項目上線一段時間后需要進行數據反饋，大家針對結果做一個項目復盤，開展相關會議。在這結果之外，我們還需要關注是否產生了新問題以及是否有新的機會發掘點。在復盤之后，針對知識點進行共享，設計師可以通過這種方式了解更多信息，方便后期迭代。
數據的呈現往往告訴我們已經發生了什么，但它沒有告訴我們將會發生什么。我們應該利用數據，從歷史中吸取教訓，也可以依據過去的趨勢預測未來，甚至可能是非常準確的預測。我們需要對數據有一個理性的判斷，進行甄別。
什么是虛榮數據？如果空有一個數據，盡管該數字看起來很美，卻無法依靠該數據去進行設計驅動以及提供具體價值，那么該數據就是一個虛榮數據，毫無意義。
以下幾個指標則是常見的虛榮數據，我們需要引起注意。
1、點擊量
無論什么網站，只要頁面上存在的可點擊區域多，那么該頁面的整體點擊量數字必然都比較高。相比之下，我們更應該關注的是點擊人數，而不是點擊次數。100個用戶每人點擊1次，與1個人點擊100次，后續帶來的結果是必然不同的。
2、下載量
下載量的多少有時候會影響產品在應用商店中的排名，但是這個數據指標并不能帶來實際價值。反觀下載之后的注冊轉化率、付費轉化率等等才是我們關注的重點。
3、用戶數
用戶數量越大，這個產品聽起來似乎就越成功。但是產品的成功與否，并不僅僅取決于這一個數字，而是與之相關的一系列指標。
比如說A、B兩款產品的用戶量分別為100萬以及50萬，用戶活躍度分別為1%與30%，其他都是沉默用戶，那么就一定能說A產品要比B產品好嗎？
用戶數量再大，沒有體現出對應的價值，那么就是虛擬數據。我們不能被這些虛擬數字所欺騙，還沾沾自喜。
4、停留時長
用戶的停留時間越長就說明這個產品越好嗎？真的是由于產品的用戶體驗做的足夠好而讓用戶產生了沉浸式的體驗從而一直停留嗎？
用戶的停留時長并不是越長越好，這個指標也無法直觀反映用戶對產品的粘性。我們更應該結合完成度、內容跳出率等數據進行綜合判斷。
數據分析過程中，也會存在很多異常數據，需要從多個角度看待數據，一般來說，產品的部分數據指標存在固定的波動周期，當某項數據指標突然不符合常規波動變化的時候，我們就需要去進行深入的研究，挖掘異常背后的原因。
1、幸存者偏差
幸存者偏差是數據分析中常見的邏輯錯誤，那么簡單來說是什么意思呢？
通過以上幾個例子，想必大家對于幸存者偏差都有一定的理解了吧。所謂幸存者偏差，即我們在進行統計的時候忽略了樣本的隨機性與全面性，用局部樣本代替總體樣本。歸根到底這就是由于獲取信息知識的不全導致的認知偏差。這啟示我們在查看數據的時候，不能只看顯而易見的信息，同時還要找出沉默信息。否則，一定會存在著巨大偏差。
2、數據樣本不夠
在進行數據提取的過程中，除了需要注意上面所描述的樣本選擇問題上，還需保證足夠多的樣本數量來進行支撐。按照常規定律來說，數據樣本達到一定的數量程度，才能展示出相對真實的規律。
例：比如說我們在產品中新增了一個功能，但是由于預算、人力資源等原因在前期的推廣宣傳階段并沒有多少曝光，只有一部分老用戶知道，這就說明這個功能很失敗，沒有存在的意義嗎？答案未必是這樣。
所以在進行數據提取時，我們就需要盡可能的保證有足夠多的樣本數據，這樣才能保證最終輸出的數據結果是最客觀的。
3、存在臟數據
臟數據，也被稱為壞數據，常常是指不合理、對于業務毫無用處的數據。
臟數據產生的原因有多種，數據統計過程中可能是由于輸入了多余空格、重復插入多余數據等等。在前期數據收集分析階段，例如問卷調查，往往會存在很多無意義的問卷，為了保證問卷的準確性，可以通過設置分支題目、陷阱題目等等方式來進一步篩選問卷，做好對臟數據的防控與清洗。
接下來給大家分享幾個平時工作中常用的數據分析方法，包括以下幾種：漏斗分析法、矩陣分析法、對比分析法。
漏斗分析法是數據分析過程中非常重要的一種分析模型，能夠科學的反映用戶行為狀態以及從起點到終點各階段之間的用戶轉化情況。
常用的指標包含轉化率與流失率。通過層層的分析，觀察流程中是否存在提高轉化率的機會點，挖掘設計。(后面會結合實際項目為例進行詳細闡述，這里就不做過多講解)
所謂的對比分析，就是給孤零零的數據一個合理的參考，否則這種數據是沒有意義的。在利用對比分析法進行數據分析時，需要關注兩個方面內容：對比對象與對比維度。
在產品迭代測試的過程中，為了增強說服力，擇決出最佳方案，往往會采用對比分析，也就是常說的A/B Test。A/B Test最核心的思想是要保證單一變量，其他條件保證相同。回到設計本身，一般來說每個方案應該大體上相同，只是某一個地方有所不同，比如某處文案、顏色、圖標等。然后針對不同的用戶展示不同方案，統計并對比不同方案的轉化率、留存率等指標，從而確定最優方案。
矩陣分析法常常是通過兩個指標的交叉，利用分析矩陣劃分為四個象限，找出問題的優先級。
例：如下圖所示，為某個運營活動點擊的四象限分布情況。X軸自左向右，Y軸自下而上，分別代表了從低到高。
通過矩陣分析的方式，我們可以快速定位當前最值得的MVP優化方式，指引我們在復雜的數據中正確前行。
作為一名設計師，在了解了數據基礎的內容后，就需要掌握通過數據驅動設計最關鍵的內容，接下來我將通過用戶、行為、業務三個角度來給大家分享幾個不錯的設計案例。
通過上面的分析，我們了解到用戶數據涉及到兩個方面，用戶的基礎屬性數據可以很好的輔助設計，通過數據對用戶進行分層，例如性別、年齡、地域，這些都是常見的用戶基礎屬性；
除此之外，與用戶相關并關聯產品的重要數據還包括新增用戶、用戶活躍度、用戶留存率、用戶流失率等數據，我們可以通過這些數據的表現挖掘背后的原因，進而通過設計手法深入優化促進用戶數據增長，形成閉環。簡單分享以下幾個方法。
關于產品拉新，并不只是產品上線后需要考慮的事情，在產品設計的每一環節中，都是需要去進行考慮的。產品拉新可以通過邀請碼、新手福利、邀請好友等幾個方面進行。
1、邀請碼
邀請碼通常是由企業發放，優先發放給種子用戶，然后通過種子用戶的社交圈去進行擴散，進而吸引更多的用戶參與進來。
前段時間爆火的一款國外音頻社交軟件Clubhouse，便是利用了這種方式進行擴散傳播。與Facebook、Instagram、Twitter等社交軟件有所區別，Clubhouse并沒有對全部用戶開放，而是需要得到其他用戶發出的邀請碼驗證后才能進行使用。邀請碼的稀缺性將Clubhouse的熱度炒得越來越高，使得參與其中的用戶能產生一種自我滿足感，同時這種模式大大保證了音頻內容的質量。
2、新手福利
一些產品針對未注冊或者未使用過產品的新用戶，會發放專屬福利，促進用戶轉化。
新手福利通常是以開屏頁、Banner、彈窗、活動頁、新手任務等形式進行領取，隨著市場環境的緊張，獲客成本越來越高，新手福利的成本的也在逐漸增加。
3、邀請好友
針對注冊或使用過產品的用戶而言，通過發掘他們自身的社交圈子，促使老用戶自覺邀請新用戶，提升產品的用戶數量增長。
邀請好友有以下兩個常見方式：
(1) 增加分享入口
老用戶可通過點擊分享圖標的形式直接分享給相應的好友。比如說，網易云音樂這款產品，用戶可以邀請好友一同在線聽歌，或者是單獨分享給特定的人。這種方式主要是利用了人的分享和展示心理。
(2) 福利刺激
平臺發放一定的優惠券、獎勵等給到用戶，新老用戶都可以通過這種方式獲得對應的獎勵。這種方式主要是利用了人的獲利心理。
活躍運營可以提升沉默用戶的活躍度，對于產品的發展有著非常重要的作用，常常通過一系列的方式來進行布局。
1、用戶積分體系
積分體系如果運用的好，那么對于增加用戶粘性以及提升活躍度是非常有幫助的。這個積分體系是否能夠吸引到用戶，就在于積分所兌換的產品是否有足夠價值。
比如說常見的外賣平臺——餓了么的積分體系，其核心就是圍繞下單行為而展開，下單之后返還吃貨豆，吃貨豆可兌換紅包，紅包再次消費抵扣。整個操作流程，圍繞用戶的核心行為構建獎勵并形成閉環。
2、簽到
很多產品都設置了簽到功能，希望借此方式提升用戶粘性。這一功能的常見名稱為“簽到”“打卡”，或者根據運營活動的場景來進行命名，比如說螞蟻莊園、新浪種樹等。
一種良好的簽到模式對于用戶習慣的培養是有著積極的正向作用的，但是關于在產品中是否增加該功能，也是要根據自身的產品特性去進行更細致的考量。
簽到的方式主要有自動簽到與手動簽到這兩種。
（1）自動簽到
登錄自動簽到的方式常見于游戲類應用中，比如說王者榮耀這款產品，用戶打開即以彈窗形式告知用戶，領取相應的獎勵。
（2）手動簽到
用戶點擊簽到入口，即可完成簽到。相比自動簽到而言，這種簽到方式應用范圍更加廣泛。
3、社區
現如今越來越多的產品開始打造自己的社區，比如說淘寶的逛逛，咸魚的會玩等等。為什么社區功能越來越普遍呢？社區的存在，可以讓用戶在產品有一個屬于自己的社交圈子，這樣有助于用戶產生粘性，從而提升產品活躍度。
例：Keep通過打造高品質的UGC內容社區，滿足新老用戶的價值需求。頂部Tab分為關注、精選、圈子三個模塊。關注一欄方便用戶快速查看自己感興趣的人，滿足社交需求。精選一欄承載了KOL與內容生產者的分享內容、用戶社交留存功能。圈子一欄更好的滿足用戶想要一群人打卡的情感訴求。
留存的本質是要滿足用戶的核心需求，只有滿足了這個條件后用戶才會持續使用。它應該貫穿于整個用戶生命周期，而不僅僅是局限于其中某一個節點。好了，廢話不多說，直接上例子。
1、流暢的首次體驗
用戶首次使用該產品時是否順暢，能否在第一時間找到自己所需要的內容，很大程度上會影響用戶后續的留存情況。
比如說現如今很多產品為了降低用戶的登錄注冊成本，通過手機號一鍵注冊即可實現快速登錄。若未注冊過，在登錄時系統會自動判斷并為其創建賬號。這種方式極大的降低了用戶記憶成本，同時還有安全性的保障。
2、降低學習成本
通常來說一款產品的學習成本越高，用戶理解起來就越困難，那么用戶長期留在該平臺的概率就會降低，故而我們應該通過一些設計手法去降低用戶的學習成本。
例如一些金融產品，其晦澀難懂的專業知識對于新手小白來說真的是非常困難，基本的認知都存在困難的前提下，更別說指望用戶轉化了?；诖吮尘埃率忠龑崾?、新手教學視頻、在線客服服務、模擬交易等等方案，都會極大的降低用戶理解成本，為后續用戶的下單轉化提供有力的幫助。
3、遷移成本
何為用戶遷移成本？用戶選擇新產品的行為需承擔的代價。隨著遷移成本的增加，用戶長期使用該產品的概率也會相應增加。
例如有道云筆記這款產品，用戶在該平臺創作了大量的內容后，就很有可能會長期留在該平臺，因為重新換平臺的成本著實有點高。
挽留機制是留住用戶、促進用戶轉化的最后一道程序。
常見的挽留機制有以下幾種形式：
1、提供解決方案
當淘寶用戶在進行退款時，若原因是地址填寫錯誤，那么頁面會自動出現彈窗提醒用戶修改即可，避免用戶取消訂單，從而降低退款率。
2、利益刺激
當用戶退出購買頁面關鍵節點時，會以彈窗形式進行挽留。
例：知乎會員購買頁面退出時，系統會自動出現二次確認彈窗，將價值點信息以動效形式展示在視覺中心，并對支付按鈕進行突出設計，吸引用戶注意，再次挽留。
例:拼多多的二次挽留同樣以彈窗形式展示，突出利益點，同時有時間維度，使得用戶產生緊迫感，刺激用戶下單。
3、操作警告
操作警告類的文案二次提示，可以讓用戶對當前行為有更清楚的認知，并仔細思考。用戶會考慮到一些時間成本、花費精力等因素，可能會取消放棄的念頭。
例：全民K歌這款應用，用戶想要刪除之前發布過的創作內容，點擊刪除之后，會出現二次警示確認彈窗，對用戶的行為進行一個挽留。就算最終用戶刪除了創造內容，還可以在最新刪除列表中恢復。這樣既可以避免用戶誤操作引起的后果，還能最大程度的保護創作內容的多樣化存在。
行為數據描述用戶使用方式，雖然與用戶相關，但更加關注的是使用的流程、方式與產品體驗，其中重點關注的數據包含點擊率、轉化率、訪問分析等。
深入分析用戶的訪問數據，模擬行為場景，更好的把握用戶當下的心理，從用戶角度出發去設計。下面，我將以一個工作中的實際項目為例，詳細闡述如何從設計側推動項目迭代。
例如我們接到一個需求，需要進行注冊流程的優化，提升這一模塊的轉化率。很多時候，我們往往會陷于視覺層面進行調整，但這并不能從根本上解決問題。我們需要靜下心來仔細思考，真正找到這個需求背后的目的以及當前存在的問題。
那么我們可以怎樣去進行呢？首先，為了對用戶行為有更直觀的理解與感受，可以利用用戶體驗地圖的形式將用戶行為場景復現，通過對用戶的情緒曲線、想法的剖析，從中找到合適的機會點，為后續設計的迭代優化提供一定思路。
通過對用戶的旅程進行分析，可以發現在不同關鍵階段中所對應的數據指標也不同。因此在設計的過程中可以針對不同的行為場景，制定對應的數據優化目標，從而提升整體的產品價值。
用戶的行為是決策的重要因素，了解用戶的行為和意圖后，會發現大部分用戶的行為與設計會存在很大的偏差，所以需要更多關注用戶的行為數據，揣摩用戶行為下的真實心理與訴求，才能做出用戶滿意的產品。
緊接著上面的案例，咱們繼續通過漏斗模型進行深入分析，優化用戶在登錄注冊路徑上的體驗，提升轉化率。
原有的登錄流程轉化率如下圖所示
1、快速定位問題環節
通過數據反饋，發現從注冊頁面到點擊注冊按鈕這頁面之間存在較高的流失率，其次再是安全驗證頁面。我們需要對這一流程中的關鍵節點進行梳理，同時將主要的精力聚焦于該模塊的優化。針對流失率較高的主要頁面進行著重設計。
2、分析問題
通過數據分析可知，用戶很大一部分都在點擊注冊按鈕這一頁面流失掉了，當前頁面的停留時長較長，那么我們是否可以縮短停留時長，幫助用戶快速注冊呢?該怎樣設計才能提高用戶的操作效率呢？
3、方案輸出
通過聚焦問題后，發現最終我們的落腳點應該在如何提升用戶的操作效率，幫助用戶快速完成注冊。
針對此設計目標，運用競品分析、用戶體驗地圖等方式對于該模塊進行了思維拓展。提出了一些可行性方案，比如在輸入郵箱時增加常用高頻郵箱格式后綴，減少用戶手動輸入的步驟；比如增加用戶輸入錯誤之后的快捷刪除圖標，方便用戶一鍵操作.....等等（詳細的可見之前項目復盤）。
4、數據驗證
在設計上線一段時期后，查看數據情況。
經過一段時間的驗證，漏斗模型的數據轉化有了很大提升。再次驗證，此次改版方案較為成功。
以上案例大致展示了工作中如何運用數據驅動設計的常規流程與方法。從整體漏斗分析原因，定位關鍵問題節點，進而推動問題環節的優化，最終解決問題。
數據會給到我們一定的指導作用,我們需要對數據進行深入思考,從設計的層面去賦能業務。從宏觀的角度去看待業務價值的增長點,尋找設計機會。那么我們該如何通過設計手段提升業務價值呢?產品價值的實現離不開用戶,從用戶的角度進行拆解分析,可以更好的洞察到機會點。
例如我們需要提升會員模塊的開卡率,該怎么進行落地執行呢?
我們將用戶的行為路徑劃分為感知——決策——行動——傳播這幾個主要階段,通過體驗地圖,深挖可優化的空間。
通過流程的梳理，將目標進行拆解，我們可以從中找到一些值得優化的地方。
有明確的設計目標之后,我們就需要針對每一節點進行針對性的設計。
1、感知階段-用戶觸達
當前會員購買的入口隱藏的過深，很多用戶都對該模塊的存在缺少認知。要想會員卡的購買率有所提升，最基本的舉措就是要加大對其宣傳力度。因此，我們需要增強用戶感知。常見的形式有Push推送、郵件、短信等等，吸引用戶去查看相關的內容，并引導后續轉化。
我們需要提升關于會員內容的用戶感知，就可以嘗試在首頁增加會員入口。宣傳的形式可以采用Banner圖，方便用戶直接點擊就可進入了解詳情。另外，產品頁面還可增加氣泡文案引導，底部懸浮彈窗等等，增強用戶的感知。
有一個需要特別注意的地方，就是在進行宣傳引導時，一定要考慮到產品自身的屬性，進行差異化設計。比如說海外產品的用戶一般都很討厭廣告,那么我們在進行設計的時候就要做到克制。在滿足運營需求的前提下，盡量減少對用戶造成不好的體驗。
2、決策階段-價值觸達
用戶受吸引來查看會員相關內容時，我們需要對會員的價值進行一個高效快捷的輸出傳遞。只有讓用戶在該階段感受到價值大于價格，才會有后續的購買行動。在會員權益模塊，需要根據用戶的狀態進行區分，針對化展示。人群大致劃分為普通用戶、會員與過期會員。
我們可以通過一些設計手法，強化用戶的價值觸達感知。
（1）文案刺激。告訴用戶辦會員卡一年預計能省下多少錢。
（2）增加計算器功能，讓用戶根據自己的習慣輸入預計交易額，更智能的感知優惠。
（3）向用戶發放一定的優惠券，并增加倒計時，出于沉沒成本，用戶轉化的幾率很有可能會增加。
（4）人數比例展示，利用人的從眾心理，促進購買。
3、行動階段-購買轉化
到了行動階段，用戶的整體購買流程是否高效、是否順暢則成了我們需要關注的重點。我們在現階段的設計策略，可通過以下方式進行展開：
（1)避免用戶過多選擇
原有的會員頁面將三種會員模式全都展示出來讓用戶自己選擇，對于很多新手來說這無疑是非常困難的，會員的購買率也比較低。更新后，我們將會員的價值點簡單的羅列出來，讓用戶可以直觀的了解會員卡的優勢，同時會員卡按照時間周期與價格劃分為3個不同的層級，針對平臺主推的年卡，增加標簽，強化感知。
（2)減少頁面跳轉
用戶在進行購買時，無需跳轉頁面，只需在當前頁面操作即可。懸浮收銀臺的形式，可以避免用戶在跳轉頁面之間可能帶來的數據流失，最大化的保障用戶購買行為的完成。
4、分享階段-持續正向裂變
用戶完成分享即可獲得相對的獎勵，被分享的新用戶再進入產品進行體驗，即可獲得新用戶獎勵。在進行分享的操作中，有以下優化方向。
(1) 增加分享引導
可以通過文案引導、運營位的形式進行宣傳，吸引用戶進行分享操作。
(2) 優化分享體驗
增加分享的渠道，引入常用的Twitter、Facebook、Telegram等社交平臺；
增加用戶分享圖的制作，為用戶提供更多的選擇空間。
數據驅動是一項長期的工作，需要去不斷的跟蹤、反饋，通過不斷的數據驅動，才能推動設計的更優發展。在日常的工作中，我們需要對數據保持敏感，從這些數據背后找出真正的原因，并進行針對性的優化。設計師了解一定的數據知識，可以更好的輔助我們進行設計產出，使得我們的方案更有說服度。
感謝閱讀，以上就是我要分享的如何利用數據驅動設計的全部內容。
文章來源：站酷 作者：甜西瓜汁
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
設計師不僅僅只是個畫圖仔，而更應該懂得用戶心理學，明白用戶行為背后的動機。利用這幾個用戶心理學，我們將可以促使用戶更快的做出決策。
一、損失規避
人們獲得損失時產生的痛苦遠大于獲得收益時所帶來的快樂！心理學家把這種對損失更加敏感的底層心里狀態叫做損失規避。
其實簡單來說就是，相比于得到，你更在意失去。
舉個例子：你今天在上班的路上撿到100元錢，心里很高興。可是一不小心把錢弄丟了，那么你就會很沮喪了，甚至一天的心情都會很不好，雖然說這錢本來就不屬于你的。
我們可以用損失規避系數來描述人們對不同東西損失規避的程度。對于一般的消費品，損失規避系數大概是2，也就是說，人們需要得到2倍于原先的價格才肯放棄已經擁有的商品。
損失規避系數因不同的事物而不同，如果涉及到情感等方面的因素，損失規避系數就會大大上升，一旦涉及到健康和生命等問題，損失規避系數就成百上千地增長了。這就解釋了在商場買衣服你會跟銷售員討價還價，但在醫院你絕對不敢跟醫生討價還價。
我們習慣于自然地規避風險，因而更加辛苦地工作只為避免一些微不足道的損失，而不愿冒險去爭取更大的回報。規避損失是人的本性。這也解釋了為什么大多數人只能上班，而創業者始終只是極少數。
那么，有哪些利用了損失規避心理的案例？
a.強調“失去”，而非“得到”
因為人的心理對損失更在意，因此要告訴用戶如果不買，會受到什么樣的損失。
對比以下兩個文案：
達芬奇畫作世界巡展，邀請來感受世界傳世名畫的魅力。
達芬奇畫作世界巡展，如果不來，你將失去一生中唯一一次和世界傳世名畫邂逅的機會。
你覺得哪種方式更吸引你？
b.天貓雙11紅包
每年的雙11活動，天貓都會提前給你發一堆的紅包，雖然數額不大。但規定只能在雙11當天使用。這時你就會心甘情愿的在當天剁手，因為如果你不買，就會白白浪費掉這些紅包。而人的心理對損失是很抗拒的。
c.以舊換新
京東家電類目有個以舊換新的服務，以前我一直搞不明白這樣做的目的何在？現在才知道，原來這也是利用了人的損失規避心理。
消費者想買新電器，但是家里已經有一個，直接丟掉會感覺浪費。那商家搞以舊換新，用舊家電抵扣一部分錢，這比直接給打折優惠，對消費者來說更有誘惑力。因為你收購了客戶的二手電器，讓他感覺自己的舊家電沒有白白浪費了。
二、錨定效應
所謂“錨定效應”是指人們在做決定或下判斷前，容易受到之前的信息影響，該信息猶如一個沉重的錨，沉到了海底，讓你的思維以該信息為基準，在它的一定范圍內做判斷。
簡單來說，就是當你在作決策之前，需要一個參考，貨比多家。比如：你去菜市場買菜，你第一次買這個菜，你根本就不知道這個價格是否合理，這時候你不好決定是否買，你就會去多問幾家。從而內心會形成對這個菜的價格錨定。
生活中錨定效應無處不在：
在線下超市我們會經?？吹缴唐方ㄗh零售價100元，而實際售價78元。各大電商平臺也采用了這種價格的對比效果，加快用戶的決策。
在線下的服裝店商家非常喜歡開一個天價然后等你還價，開價150元，到最后居然能還到50元，這水分……
你去婚紗攝影店咨詢，開始銷售員會給一個比較高的價格，然后后面會自主動給你減掉一千，這樣很容易讓消費都產生購買的沖動。
你去電腦城買電腦，當你買完電腦后，這時銷售員給你推薦電腦保護套，你很容易會購買，因為你會想這么貴的電腦都買了， 這幾十塊錢的保護套自然就不在話下了。但如果直接叫你買保護套的話，你就沒那么容易產生購買行為。
還有奶茶店價格菜單也是經過設計的，通常會采用降序排列，這種排列方式更有利于顧客購買。因為用戶看到的第一個貴的價格會形成錨，往下價格越便宜，消費者更容易決策。
三、羊群效應
在一群羊前面橫放一根木棍，第一只羊跳了過去，第二只、第三只也會跟著跳過去，這時候，如果把那根木棍撤走，盡管攔路的棍子已經不在了，后面的羊，走到這里，仍然會像前面的羊一樣，向上跳一下。這樣的群體盲目跟從就是所謂的“羊群效應”，也稱為“從眾心理”
這些動物的行為看起來愚蠢搞笑，可是看看我們自己，又何嘗不是如此呢？從眾是一種普遍的社會心理和行為現象，在很多情況下，人們都會表現出人云亦云的特征。
“羊群效應”是由個人理性行為導致的集體的非理性行為。由于信息的不對稱，人們并不能得到做出判斷所需的全部信息，那么在無法作出準確的判斷時，其他人的選擇自然就是最合理的參照。這并非全無道理的，因為很多情況下，多數人的做法往往都是正確的，參考他們的做法可以最大限度的降低個人的決策風險。這也是群體盲目背后的根本原因。
但是，凡事有利就有弊。跟隨大眾的做法，有時候很容易被誤導。比如謠言的傳播就是個最大的反例。
我想以下場景你一定不會陌生，在一個廣場上，有商家正在進行著某種商品的促銷活動，人們隨著廣播的聲音慢慢湊了過去，到后來簡直到了里三層外三層的地步。但就在這個時候，經過的人反而有了更大的興致，越是后來的人越是想擠到人群中去，甚至他并不知道里面究竟是在進行什么活動。這是典型的“羊群效應”。
經常網購用戶都明白，我們很容易受到商品銷量的影響，我們的潛意識里會認為銷量越好，商品質量越好，因此會傾向于選擇銷量高的商品。
羊群效應還表現在對權威的順從，人們決策時所盲從的對象由大多數平常人變成了某一個具有一定權威性的人。
人們在做出某種選擇都是在追求安全感，降低風險，而跟隨權威人士給出的意見和建議，會讓人們安全感倍增。權威之所以稱為權威，就是因為在某個領域他們是最專業的。因此人們更愿意相信權威人士的意見，甚至愿意改變自己的選擇去迎合權威的意見。
在設計工作中，嘗試借用權威的號召力，達到對用戶消費決策的影響。經常逛淘寶的人就知道，很多商家在商品詳情頁為了證明產品質量合格，經常會提供某權威機構的檢測認證，或借助某個明星的推薦。因而會對其觀點或者意見表現得非常順從。
四、稀缺效應
在消費心理學的研究中，研究者把人們由于商品稀缺而引起的購買行為現象，稱之為“稀缺效應”。
“稀缺效應”在我們的日常生活中太常見了，比如在線下逛商場時，經常可以看到商家喜歡用“一次性大甩賣”、“限量100件”等廣告語來引誘顧客，以吸引顧客進店購買。這些廣告語會給顧客造成這各種假象：如果現在不買下次再也沒有這樣難得的機會了。
俗話說，物以稀為貴，人們對于稀缺物品會表現出強烈的占有欲望，這在人們的心理需求層次中，屬于較高的層次。越是不容易得到的東西，人們越傾向于得到，以此實現在精神層面上的價值滿足。
在這種心理因素的驅使下，人們對于供不應求的東西，總是會給予特別的關注，同時也愿意支付更高的代價。某種商品一旦限量供應，那么其本身也就具備了稀缺的屬性。
限量供應的銷售原則，也吊足了顧客的胃口，很多顧客完全落入稀缺效應的心理戰術之中，即便當天買不到，第二天也必定會早早前來購買。
比如天貓慣用的搶紅包伎倆，吸引了一波又一波的少女們去瘋狂的搶，它會設定在某一個時間點，限量提供一些紅包，如果沒有搶到。那么用戶第二天還會來搶的，這就提高了用戶的粘性。
五、緊迫感
為了加快用戶下單的決策時間，我們需要給給用戶造成一種緊迫感的氛圍，告訴客戶剩余的時間不多了。如果不立即行動，將錯過這次優惠活動。他們常使用一個很顯眼的倒計時，時時刻刻在提醒用戶所剩的時間已經不多了，再不剁手就沒機會了！天貓雙11活動就是利用了這樣的用戶心理成功讓廣大女同胞們不知不覺中剁手了。
稀缺性與緊迫感可以結合著使用，你要明明白白的告訴用戶，如果錯過了就會損失什么。如果立即行動，可以獲得什么好處。兩者之間強烈地對比可以吸引用戶立即購買。
比如“今天下單可以立減500元！” “錯過今天，你要多付出500元，而且沒有贈品”等等。
如果沒有制造稀缺性和緊迫感，用戶就會拖延，猶豫甚至放棄購買。客戶會認為再過一天來買也是可以的。這時你需要斬釘截鐵地告訴用戶，產品、贈品、特價是有限的。
比如：“產品僅限10件啦，再不買就錯過了！”，“贈品只有30件，剛才張三又搶走了一件，馬上就搶光了！”，“特價產品只剩25件啦，賣完這25件就恢復原價?！蓖ㄟ^人為的制造稀缺性與客戶哄搶的氣勢，促使客戶做出立即購買的決定，從而提升轉化率。
文章來源：站酷 作者：CdzhcHappy
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
用戶喜歡在網上收藏各種東西，把收藏到的東西占為己有，滿足自我的占有欲，每個用戶都為此而樂此不疲。
很多互聯網產品在用戶點擊收藏后，讓用戶去選擇收藏夾。其實用戶并不喜歡去選擇，他們只想簡單的把自己喜歡的東西收藏下來。
選擇本身并不是一件很容易的事情，尤其是對于那些有選擇困難癥的人來說。實際上，我每次都是選默認那個。
這并不是一個好的用戶體驗。
當然也有一些做的很好的體驗，比如微信的收藏，收藏后會出現一個“收藏成功”的非模態反饋。
同時可以添加標簽，但這個并非強制，為了滿足那些有這種需求的用戶。添加標簽的目的是為了方便用戶在日后的檢索。
在收藏列表，微信會根據收藏的內容自動分成鏈接、文件、圖片和視頻等，最近使用位于第一位。
也就是說并不需要用戶去創建自定義分類。
你也可以搜索標簽來找到之前收藏的內容。通過這些方式基本上滿足了大部分用戶的需求。
網站會根據你采集的圖片在極短的時間內，自動識別出圖片對應的收藏夾類型?？梢灾苯硬杉綄奈募A。
然而經過測試，經常會出現誤差。因為圖片的分類其實很復雜的，屬于高度自定義，很顯然，智能識別并不是一個好的解決方案。
花瓣是一個設計師收集靈感的網站，該網站常見的用戶使用場景是，設計師在瀏覽素材時，會大量采集自己感興趣的素材，但每次都要選擇文件夾，非常繁瑣且低效。
后來花瓣網加入了快速采集的功能，其邏輯是網站會默認選擇上一次采集的收藏夾，這大大提高了用戶采集圖片的效率。
而如果你需要選擇其他文件夾則可點擊普通采集。這兩種采集方式滿足了設計師的不同需求。
社區類產品有各種點贊，收藏等互動信息，但用戶又不想被別人知道這些信息。
因此，在規劃產品時需要考慮到用戶互動隱私的保護，這是用戶側的剛性需求。
抖音個人主頁的點贊列表，我記得剛開始是公開的，且不能設置為私密。
用戶點贊的視頻會出現在這里，卻少有人希望這些信息被別人看到，總有些點贊視頻你并不想被別人看到。
如果點贊列表可見，那么用戶在點贊的時候就會有所顧慮，這不利于平臺的互動率。
特別是隨著抖音上熟人也越來越多，強關系社交場景在漸漸加強。
抖音后來也發現了這個問題，把它設計成了默認隱藏。（當然可以自己設置為公開，但只有極少數用戶會這樣做。）
由于點贊是私密的，用戶可以隨心所欲的點贊自己喜歡的視頻，毫無社交壓力。
這是為何？
源于人性心理學：窺私欲。人人都喜歡窺視別人的隱私，而不喜歡自己的隱私被窺視。
不然為何如今的QQ空間基本上都設置了權限，畢竟，誰想被別人窺視當年那個煞筆的自己呢？
現在訂閱號打開率越來越低，朋友圈分享曾是訂閱號流量來源的一大入口。
朋友圈早已淪為了一個人設打造的陣地，現在的人發圈越來越謹慎。
用戶似乎越來越不愿意在朋友圈分享文章了，除非是有利于自己人設打造的內容。
為了減輕用戶的這種社交壓力，微信推出了“在看”的功能。
用戶點了“在看”后，此文章會出現在看一看這個模塊，且七天前的分享將不可見，這就相當于一個弱化版的分享功能。
這將大大減輕用戶分享的社交壓力。對于公眾號主來說，相當于增加了一個流量入口，激發他們創作更多的內容。
視頻號點贊也是同理，會被朋友看到，導致用戶在點贊的時候就會有所顧慮。
他會考慮，我點贊了這個視頻，我老師、上司、父母、親戚、朋友會不會看到？他們會怎么想？
但他在抖音上點贊是沒有這么多顧慮的，單純的喜歡就行。
第一，抖音是弱關系平臺；
第二，抖音上的點贊默認是私密的。
因此，微信才推出了私密贊的功能，需要長按才能觸發。
這并是一個優雅的解決方案，一是操作成本有點高，二是用戶存在較高的學習成本。
微信作為一個強關系社交場景，這正是微信與抖音不一樣的地方。
以上兩者的目的都是一致的，那就是為了減輕用戶的社交壓力。
同時用過mac OS和windows系統的用戶不知是否發現，這兩個操作系統的彈窗按鈕“確定”和“取消”的位置是不一樣的？
mac的彈窗按鈕確定在右，取消在左；而windows的剛好反過來，確定在左，取消在右。
為什么會有這樣的差異？哪一種更加合理？
在交互設計中，這種彈窗叫做模態反饋，艾倫·庫珀在《About Face 4》中提到：模態模式一種臨時模式，它通過遮罩將用戶當前看到的內容和之前看到的內容區分開來，界面中只有 popup（彈出層）組件具有可交互行為，需要用戶操作才能退出該模式。模態的優勢在于讓用戶專注于完成某個任務而不被干擾。
首先我們要明白這兩個按鈕哪個使用率更高，一般來說，“確定”的點擊率要遠遠高于“取消”。這是因為大多數用戶對于自己的操作行為是明確的。
所以這兩個按鈕在視覺上一定要做出差異化，“確定”的視覺層級要高于“取消”，這樣用戶才會一目了然，不會感到困惑。
回到剛才的問題，逆向思考這兩者背后的邏輯差異。
windows彈窗的背后邏輯：
人的閱讀習慣是從左到右，所以把點擊率更高的按鈕放在左邊更加符合人的正常閱讀習慣。
mac彈窗的背后邏輯：
根據一般的任務的流程，“取消”在左代表返回上一步操作，而“確定”在右代表進入下一步任務流程。
看上去似乎都有道理，這兩種交互方式本身沒有絕對的對與錯。只要在整個系統中保持一致性，讓用戶形成操作習慣就沒有啥問題。
從個人的使用習慣而言，個人更傾向于mac的這種方式。
手機上的實體按鍵電源鍵和音量鍵通常有兩種分布方式，放在左右兩側或都放在右側，前者以iPhone為代表，后者以安卓手機為代表。
這兩種方式有什么區別？哪種方式更加合理？電源鍵和音量鍵屬于完全不同類型的兩種按鍵，且都是高頻使用，它們的功能自然不用贅述。
我們先來看看都放在右側會有什么問題，以下使用場景相信用戶不會陌生：
用戶a，在地鐵上玩王者，聲音有點大，想把聲音調小，結果不小心按到了電源鍵，導致手機息屏，而此刻你正在激烈的團戰，內心有一萬只“草尼瑪”奔騰而過……
用戶b，每次按電源鍵（解鎖或鎖屏）都會不小心同時按到音量鍵，結果直接就截圖了！這種情況發生了不止一次，因為這兩個按鍵離的太近了……
用戶c，自家的小米11，電源鍵位于中間位置，右手拿時大拇指會觸碰到，左手拿時中指剛好會觸碰到，而電源鍵又有指紋鎖功能，導致手機在不斷的解鎖，而你毫無察覺……
通過上面的案例，可以得出結論：若按鍵都放在右側，會導致用戶經常誤觸而造成不必要的麻煩。
放在兩側就不會有這樣的問題?？梢杂行Х乐拐`觸，尤其是盲按，不用擔心按錯，減少誤操作的幾率。
值得一提的是，iPhone手機的電源鍵一開始是位于頂部位置，這是為何？
因為剛開始時手機都是小屏幕（3.5～4寸左右），對于iPhone5S及以前的手機來說，單手操控，拇指Home，食指電源，剛剛好。
所以電源鍵放在頂部既按得到又可以減少誤操作。
后來隨著手機大屏的趨勢（4.7寸以上），這個時候單手已經不方便按到頂端了，從6代開始就把電源鍵放在右側了。
但無論是哪種方式， 兩個按鍵都是分開放。
還有一個小細節，iPhone的實體鍵不是在右側正中間，而是在靠上的位置。
iPhone設計理念是單手持握，并且大多數人右手握手機，大拇指經常會碰到右側邊框，若果放中間，這樣會造成誤觸音量鍵和靜音鍵。
其實上面的案例3就已經說明了按鍵放在中間的弊端。
我想起了當年的錘子T1，左右按鍵一樣大且位于兩側的中間，這是典型的為了追求完美的對稱而向用戶體驗妥協。
iPhone從初代開始就已經建立了自己的設計理念，不管是工業設計還是界面設計，并沿用至今。
從初代開始，iPhone機身左側音量鍵上方就有一個靜音鍵。
這些年來，iPhone一直在減少各種實體按鍵以及外部接口，比如3.5mm耳機孔、home鍵。
但直到如今這個靜音鍵卻一直保留下來，為何iPhone對于這個按鍵情有獨鐘？
靜音鍵開啟后，任何來電或通知都是無聲的，震動也會消失。
在無需點亮屏幕的情況下實現一鍵靜音，方便快捷，深受用戶的青睞。
根據自身的使用習慣以及用戶研究，無非以下幾種使用場景，比如看電影、開會、上課等：
1.進電影院看電影前，我一般都會撥一下，避免在看電影的過程中被來電鈴聲打擾，影響了自己和別人觀影。
2.開會的時候也會撥一下，以防在開會的時候突然被來電鈴聲所打擾，避免不必要的尷尬。
3.學生黨在上課前一般也會開啟，這樣整節課都不怕打電話進來了。
總之，就是不希望自己的手機鈴聲打擾到自己和別人，帶來不必要的麻煩。
如果是虛擬靜音鍵，需要先解鎖手機，對著手機屏幕一頓操作。
而實體鍵不需要這么麻煩，可以盲操作，放在褲兜里都不影響操作。
這個按鍵這么重要，卻很少看到安卓手機上有（除了一加基本上沒有）。
實體靜音鍵并非蘋果首創，之前的Palm、Blackberry（黑莓）早已有這樣的設計。
可能的原因是安卓控制中心很早有靜音按鈕，甚至有些定制系統還可以把靜音按鈕直接放在桌面上，設置靜音非常方便，也就沒必要再多加一個實體鍵了，顯得多余又徒增成本。
上面提到過的，作為安卓陣營唯一的靜音鍵，一加手機引以為傲的三段式按鍵，該設計可以通過物理鍵直接實現在靜音、免打擾與正常模式當中快速切換。
但個人認為這個設定復雜了，三種模式遠比兩種模式復雜。用戶并不一定能搞明白，有一定的學習成本。
在早期，iPhone的控制中心并沒有靜音按鈕，想要設置個靜音并不是一件容易的事情，而這個功能又是必須的，蘋果索性直接做了一個實體物理鍵。
這樣靜音的時候只需要把靜音鍵撥過來就可以了，一步到位，使用體驗也很好，所以一直保留至今。
雖然現在iPhone的控制中心已經加入了勿擾模式，但考慮到老用戶的使用習慣，以及品牌調性，蘋果對于這個實體按鍵的去掉還是顯得很謹慎。
考慮到之后iPhone在防水、機身內部空間的改進，不排除蘋果終有一天會取消iPhone上這個靜音鍵。
靜音鍵雖好，但也并非沒有缺點。用戶有時候會無意中觸發這個按鍵而不自知，或者開啟后忘記關閉，導致錯過了一些重要的電話。
雖然開啟了靜音鍵，但并不是絕對的靜音。如果是鬧鐘，鈴聲還是會響起，因為鬧鐘的優先級要遠高于靜音模式。
蘋果這是考慮到了如果有用戶不小心觸發了靜音鍵，或者開啟后忘記了關閉，害怕用戶耽誤了重要事情。
這就很好的解釋了為何明明開啟了靜音模式，卻還可以調解音量大小的原因所在。細微之處方見真功夫。
在日常生活中，旋鈕是個很常見的東西，比如音箱，微波爐，收音機，老式電視，車載旋鈕……
在機械產品上，旋鈕凸起的把手和它下面的圓盤刻度，是最明顯不過的旋轉暗示，符合人的自然感知。
旋鈕式交互是個人非常偏愛的一種交互方式，我認為這種交互跟iPhone的home鍵一樣經典，主要原因有三：
旋鈕操作簡單，看到這種按鈕，一歲小孩子都會忍不住用手去抓。對于用戶來說，幾乎不需要學習成本。
在旋轉的過程中，可調大調小，一切盡在用戶的掌控之中，用戶感覺到有十分的安全感。
在調節的過程中，調大調小都能立刻收到即時的反饋，這是用戶最喜歡的交互方式。
我們在觸摸屏上很少看到這種旋鈕式交互，因為這種交互是要建立在抓住旋鈕實物的感受。
而觸控屏是個二維的世界，沒有真實抓握的手感，無法還原出三維世界的真實手感。
汽車上最常見的旋鈕就要數音量和空調了。然而自從特斯拉在車上推廣大屏幕后，越來越多的國內廠家開始盲目跟風，把絕大部分的功能按鈕集成到屏幕中，比如空調，不僅不方便，行車中使用還容易造成危險駕駛。
車上的觸控體驗跟手機上是完全是兩碼事，使用場景也完全不同。最大的區別在于后者沒有安全問題。
都知道開車不玩手機，可是行車時操作中控屏跟玩手機有什么兩樣？
對于駕駛員來說更加安全，通過旋鈕調節空調，熟悉后完全可以實現盲操，邊開車邊操作毫無壓力。
如果是觸控屏，你必須看著屏幕，一頓操作猛如虎，而在開車過程中眼睛哪怕離開前方一秒鐘就意味著危險。
而安全是汽車駕駛的重中之重。
用戶的操作有真實的物理反饋，旋鈕阻尼。
屏幕上虛擬按鍵反饋根本無法與實體旋鈕相提并論。
軟件系統用久了會變卡，可能會死機，難免會有bug。而這些不穩定因素將成為汽車駕駛的潛在危險因素。
一旦屏幕失靈，或者系統死機了，那所有按鍵都失效了。
雖然特斯拉為了提升其車載系統的穩定性下了很大功夫，但是問題從來都沒有停止過。
但是硬件基本上很少會出問題，物理旋鈕才讓人100%放心。
無論廠家如何吹噓，虛擬屏幕按鍵在大多數情況下都不會比實體按鍵有更好的使用體驗。
因此，有一些實體鍵出于安全駕駛的考慮還是應該保留，將各種功能按鈕都集成在屏幕里并不見得是一個明智的選擇。盲目的把實體按鍵變為觸摸按鍵存在安全隱患。
文章來源：站酷 作者：CdzhcHappy
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
作為一枚設計小萌新，對上述場景，是否似曾相識呢？此些尷尬的情況，也映射出了不少問題：數據化設計意識薄弱，數據基礎知識模糊，缺乏系統的體驗評估模型和度量方法等等。
那么，我們該從哪些維度進行數據分析呢？數據的基礎知識又有什么呢？常見的數據分析方法又有哪些？諸位看官抓好扶好，入門版航班即將起飛，讓我們一起走進數據的世界，掌握一定的數據分析能力，告別“我要我覺得”的任性決策。
增量尚不明確，存量博弈的下半場，都以去肥增瘦的方式，宣告著精細化運營的時代到來，似乎也對設計師同學提出更高專業的要求。數據意識作為能力象限中的某個小瓦塊，雖然細微，但也是專業輸出的切入點。
在面對產品功能迭代、用戶行為分析、日常監測、設計決策以及效果評估等等問題時，單純的從視覺維度進行推導，會稍顯單薄。而基于客觀數據的分析，可以更科學準確的輔助我們進行決策。
所謂的“數據指標”，簡單來說就是可將某個事件量化，且可形成數字，來衡量目標。在一定程度上，“數據指標”能揭示出產品用戶的行為和業務水平狀況。
目前市面上的產品種類繁多，大致都圍繞“用戶是誰、做了何事、結果如何”進行歸納整合，分別對應著用戶數據、行為數據、業務數據三類指標。
1. 存量：反映某一時間段內活躍的用戶數。以日活（DAU）、周活（WAU）、月活（MAU）維度進行統計。其中，Active需以關鍵用戶的自發行為來進行定義，常見的動作有登錄、瀏覽內容等。
2. 增量：一般用新增用戶數來反映，同樣分為日新增（DNU）、周新增（WNU）、月新增（MNU）三類統計維度。其中，增量的定義相對模糊，需提前與渠道確認好新增指標，建議根據內部的賬號體系進行指標的取舍，選擇新增注冊用戶還是新增設備數。
3. 來源：用戶從何而來，包含自然搜索、產品導流、好友邀請等多種渠道。結合不同渠道用戶的數據表現，可以指導后續的推廣方案。
4. 留存：通過留存率來評判產品的健康程度，表示新用戶在一定時間段內，某些行為重復發生的比率。其中，日留存和月留存的評判分析作用又有所不同：
日留存：作為衡量用戶渠道質量的重要依據，如老王的公眾號在站酷、知乎、微信群進行導流宣傳，通過分析不同渠道的用戶留存表現，從而優化受眾用戶的投放來源。
月留存：作為用戶粘性的重要判斷，通過指標來分析產品對用戶是否長期有吸引力。也可用作產品上新后，功能迭代是否符合預期的判斷依據。
1. 訪問深度：用戶單次瀏覽頁面的過程中，瀏覽了頁面的數量越多，表示用戶訪問深度越深，產品粘性較好。
2. 轉化率：指在一個統計周期內，完成轉化行為的次數占總訪問次數的比率。轉化率=(轉化次數/點擊量)×100%。如在電商、理財等產品中，轉化率是衡量產品優秀與否的重要指標之一。
3. 跳出率：訪問了單個頁面的用戶占全部訪問用戶的百分比，可用來衡量訪問質量，高跳出率通常表示內容或體驗與用戶目標脫節。
4. 停留時長：用戶游逛的時間長度，需要區分對待內容消費與工具效率場景，高停留時長并非全是正向反饋。
5. 次數：包含頁面訪問次數（PV）和用戶訪問次數（UV），通過頁面或者用戶作為計數單位，但需進行相應數據去重，保證數據的真實性。
6. 點擊率：CTR（Click-Through-Rate）即點擊通過率，某一內容被點擊的次數與被顯示次數之比，CTR是衡量互聯網廣告效果的一項重要指標。影響用戶點擊的因子較多，作為入口級內容，卻具備較大的設計發揮空間，可通過信息的布局與核心利益點的外化，實現行為號召（Call to Action）
1. 總成交量：GMV（Gross Merchandise Volume）屬于電商平臺企業成交類指標，主要指訂單的總金額，包含付款與未付款兩部分
2. 人均消費金額：ARPU（Average Revenue Per User）即每用戶平均收入。這個指標計算的是某時間段內平均每個活躍用戶為應用創造的收入。
3. 續費率：指的是在訂閱期結束時，選擇續費的用戶占所有應續費用戶的百分比
4. 付費率：付費用戶占活躍用戶的比例。
5. 用戶周期價值：LTV（life time value）是產品從用戶獲取到流失所得到的全部收益的總和，當LTV大于平均獲客成本和后續的運營成本時，產品獲得凈收益。
對上述數據類別有所了解之后，我們在面對紛紜復雜的應用類型與數據概念時，到底該怎么選取合適的指標進行衡量和分析呢？接下來，讓我們進入下一個知識點-指標建模。我們大致可以按照以下方法進行關鍵指標的選取。
① 明確業務的最終目的；
② 判斷業務模塊所屬類型；
③ 根據模塊類型選擇數據指標；
任何產品都有其商業或生存目的，且通常會使用一些支撐手段的工具、或是支撐手段的手段來達成目的。我們以“設計軟件-Figma”為例，進行業務目的與手段的拆解。
1. 目的：Figma 是一個基于瀏覽器的協作式 UI 設計工具，其最終目的是完成商業變現，讓更多用戶付費購買。
2. 手段：為達成這一目標，而采用基于web的模式這一手段，極大的方便了團隊協作辦公的需求，繼而備受青睞，普及率節節攀升。
3. 支持手段的工具：此外，借助開源的插件及完善的組件功能，為設計創作者提供更便捷的工具支持。
在從業務的最終目的出發，梳理業務模塊后，可進一步的拆解該業務模塊的具體類型。為方便理解，可以按照產品價值，將功能模塊分為4種類別：工具、內容瀏覽、社區、交易。
1. 針對本身自帶價值屬性的產品，按照幫助用戶節省時間和消磨時間可分為：
工具類：剪映、輕顏相機、飛書文檔及翻譯查詞等
內容瀏覽類：各類圖、文、音視頻體裁的消費內容，如短視頻、喜馬拉雅、知乎等
2. 另一類產品本身不產生價值，通過自身的平臺屬性來連接資源，同樣按照幫助用戶節省時間和消磨時間可分為：
社區類：小紅書、即刻、微博等
交易類：電商板塊、會員付費板塊以及直播打賞充值等
按照時間與價值維度，將產品劃分為4類模塊，每類都有各自需要核心關注的指標要素
下面對4種分類的功能模塊，分別介紹如何選取指標體系
1. 工具類：通過產品達成個人目標，高頻的使用行為，可以培養用戶的固定習慣。因而可主要關注使用量、目標達成率、頻次數據指標。（示例：剪映）
2. 交易類：以詳情頁作為用戶購買動機的誘因，實現付費轉化。倘若能多次反復的購買商品或服務，整體轉化效果更佳。因而，可選取詳情頁轉化率、客單價、復購率作為衡量指標。（示例：百度網盤）
3. 內容瀏覽類：用戶是否已獲得更優質的內容，愿意投入更多的時間瀏覽內容，并能觸發與內容的互動行為。因而可選取瀏覽數、瀏覽廣度、瀏覽時長和互動行為作為衡量指標。（示例：快手）
4. 社區類：社區環境主要受人與內容、以及人與人之間的關系影響。鼓勵用戶發布內容，以創造的內容來吸引其他用戶產生共鳴，從而進行內容創造與互動行為。因而，可選取發布量、互動量、用戶間的關系密度作為衡量指標。（示例：即刻）
在產品迭代發展的過程中，掌握有效的數據分析方法，能讓冰冷客觀的數據鮮活起來，為決策提供判斷依據。接下來，就給大家推薦兩類高頻數據分析方法，請注意查收。
由Dave McClure 2007提出的客戶生命周期模型，可以幫助大家更好地理解獲客和維護客戶的原理。其核心為AARRR漏斗模型，對應著實現用戶增長的5個指標：
1. 獲取(Acquisition)：用戶如何發現（并來到）你的產品？
2. 激活(Activation)：用戶的第一次使用體驗如何？
3. 留存(Retention)：用戶是否還會回到產品（重復使用）？
4. 收入(Revenue)：產品怎樣（通過用戶）賺錢？
5. 傳播(Refer)：用戶是否愿意告訴其他用戶？
我們在進行數據分析的時候，應該考慮用戶正處于AARRR模型的哪個部分、關鍵數據指標是什么、對應的分析方法又是什么？
科學反映用戶行為狀態以及從起點到終點各階段用戶轉化率情況，是一種重要的分析模型。廣泛應用于網站和App用戶行為分析的流量監控、電商行業、零售的購買轉化率、產品營銷和銷售等日常數據運營與數據分析的工作中。
例如：在完成電商購物行為時，共包含瀏覽選擇、查看詳情、添加購物車、生成訂單、支付等環節。通過監控用戶在流程上的行為路徑，漏斗能夠展現各個環節的轉化率，直觀地發現和說明問題所在，更快定位出某個環節的具體問題。
除了需要了解分析方法之外，還需要提防以下數據分析常見謬誤，避免落入陷阱之中，從而做出錯誤的決策。
1. 數據偏?
在分析數據時受個?偏?和動機的影響，即僅選擇?持你聲明的數據，同時丟棄不?持聲明的部分?！皵祿?”將讓數據的客觀性蕩然?存。 避免這種謬誤的?法是在分析數據時，盡可能收集相關數據，并詢問他?意?。
2. 采樣偏差
在做抽樣分析時，選取的樣本不夠隨機或不夠有代表性。例如，互聯網圈的人極少會使用PDD，為何該應用還會有這么好的市值表現？
3. 因果相關謬誤
將兩個同時發生的事件，判斷為因果關系，忽略了其中間變量。例如，隔壁老王生了個孩子，同時種了一棵樹。孩子和樹都隨著時間的推移而長高，在一定時間內，如果使用相關性分析，可以得出這兩個變量具有相關性。然而我們都很清楚，孩子長高和樹長高之間，并不具有因果關系。
4. ?普森悖論
即在某個條件下的兩組數據，分別討論時都會滿足某種性質，可是一旦合并考慮，卻可能導致相反的結論。避免“辛普森悖論”給我們帶來的誤區，就需要斟酌個別分組的權重，以一定的系數去消除以分組資料基數差異所造成的影響。
5. 定義謬誤
在看某些報告或者公開數據時，經常會有人魚目混珠?！妇W站訪問量過億」，是指的訪問用戶數還是訪問頁面數？
6. 比率謬誤
談論此類型指標時，都需要明確分子和分母是什么。另一方面，在討論變化的百分比時，需注意基數大小。如小王和小劉體重都上漲了10%，但二者的體重基數分別為60kg、90kg。
文章來源：站酷 作者：美工李大強
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
為了保證這篇文章的質量，追波年度的每個作品都超過550贊。在此原則下挑選了828件作品，作品總的大小為2.2G。
相比于《2020年追波設計流行趨勢》多出了328件作品。
從挑選出的828件作品中，排名前十的作品中9件為B端設計，另一件作品也是B端產品C端化的產物。其中：
B端界面設計占比476/828，57.4%；
C端界面設計占比180/828，21.7%；
視頻動效作品占比223/828，26.9%；
明眼人都能看出其中的比重關系，B端設計再次大火，為什么是再次？因為B端設計之前火過，只不過沒有趕上一個好的時代，在C端設計風光的十年里而忽略了其存在。隨著C端市場飽和與數字化的浪潮下，實體經濟、ToB 、ToG的產業再次迎來了它的曙光。視頻動效的作品占比也已超過C端界面設計，相信今年視頻動效作品占比還會再次提升。
追波年度最佳作品來自大家最熟悉的UI8團隊中的Tran Mau Tri Tam ?，作者來自越南西貢，最佳作品截止目前355K瀏覽量，2933個贊。
為什么看似平平無奇的作品卻能獲得追波年度最佳作品呢？既不是C端也不是純B端的作品，更像一個網頁與平面的結合體。如果去掉搜索圖標、分類圖標和按鈕，你可以理解它就是一個平面作品，一個字體加幾何形體構建的作品，為了豐富畫面的層次，讓畫面更加的活潑采用了多彩加幾何色塊，讓標題閱讀有停頓感和呼吸感。faster底部的橫線讓它從標題文字中脫穎而出，這種使用線條突出重要信息的設計也是今年追波設計流行趨勢之一。
MetroUI是Windows8的界面設計語言，在2010年至2013年間曾經風靡一時，那也是移動互聯網的發展元年，現在國家推行實體經濟、數字化帶動To B 、To G 的發展元年，通過幾何色塊（MetroUI）實現B端產品與C端設計風格的傳承與銜接，你會發現歷史總是驚人的相似。最后背景結合今年最流行的微軟風，毛玻璃的多彩高斯模糊漸變風，年度作品當之無愧。
最后來看下按鈕的設計，正常的按鈕要么文字加色塊，要么左圖標加右文字，它設計成左文本加右圖標，更加注重信息的可讀性和易讀性，也體現B端設計重功能和交互體驗，視覺點到為止的設計理念。
下面我們來欣賞年度最佳作品里面的流行趨勢吧。
字體三原則：可讀性、易識性、易讀性。當你同時讀一篇文言文和一篇設計文章，肯定設計文章的內容可讀性更好。易識性是用在字體設計上，不能過于浮夸的改變字體骨架、形體而不易識別。易讀性和每個位設計師都息息相關，因為我們都需要編排文本。當我們小時候寫作文時，不會寫的文字可以用拼音代替。這時候讀者讀到拼音時會有停頓感，更加適合用戶閱讀。
通過給用戶制作停頓感來增加用戶的易讀性。可以在相關聯文本后面添加圖片、表情、圖標來更好的理解文本內容，豐富文本內涵。比如情侶間表達愛意時會輸入文本，“我愛你”、“我Love你”、“我ai你”、“我??你”，哪個更加會有情感共鳴呢？不言而喻，相信你心中已經有答案了。
在標題文字上添加曲線來突出重要文案是2021追波最流行的趨勢之一，第一個設計目的就是突顯文字，其次就是想表現鉛筆真實書寫的感覺。之前很多帶有簽名的設計中，簽字的文本都是手寫體的感覺，手寫體對比電腦的機械字體會帶有一種人文氣息，也會讓兩者之間產生一種對比、矛盾。
除了突顯文本外，曲線還有視覺引導的作用。通過視覺引導讓用戶按照設計師編排的順序進行瀏覽界面。當然還有比這更科學的工具就是眼動儀測試，通過真實用戶眼睛瀏覽界面顯示對應的熱點圖。
多彩高斯漸變風是從色彩的角度來傳達和豐富畫面的，多彩高斯漸變風其實是從制造矛盾到平衡矛盾的過程，多彩漸變多為冷暖對比來制造畫面的沖突，需要控制冷暖畫面的大小來實現平衡。主流的還是以暖色突顯為主。多彩漸變主要起到活躍氣氛、吸引目光、平衡畫面的作用。
多彩高斯漸變還可以結合輕擬物、幾何圖形、三維等新的組合方式去創新，給用戶呈現一種更加新穎的視覺表現形式。最后我們還是要回歸到內容上，為了更好的傳達信息需要去設計與內容相匹配的視覺風格。
B端設計的火爆帶動了B端相關模塊設計，更多的人也愿意嘗試B端相關模塊設計，側邊欄作為產品架構中重要的導航系統，好的側邊欄設計能為用戶帶來更好的效率。主流側邊欄都做了展開、收起、拖拽等交互效果，也是受限于PC屏幕為展示更多數據而騰空間。側邊欄主要承擔的功能有導航、分類、自定義篩選、共享、新增等。追波的B端產品設計已經不再是假大空概念設計，而是一套實用美觀可落地的設計。
儀表盤設計是一個很好的隱喻，想象一下開摩托車或汽車主駕駛前面的屏幕，汽車儀表有燃油表、車速表、里程表、水溫表、轉速表、故障指示燈等。B端類產品后臺界面的儀表盤設計也需要展示一些重要的數據和各種狀態，大體分為側標欄、導航欄、待辦任務、個人信息、報表數據、消息中心、快捷入口等。當然最重要的就是報表數據，團隊收益、任務進度、轉化比例、新增、存量、團隊工作時長等都是老板或領導關心的內容。每個公司業務不同、每個人員權限不同，自定義的儀表盤也各有差異。重要的是突顯數據和業務狀態，需要分層級系統性去思考和設計。
復雜的事情簡單化，簡單的事情標準化，標準的事情流程化，流程的事情自動化。流程設計是每一個企業核心功能和業務，可自定義的管理流程系統搭建也是B端產品設計的難點，需要對業務高度抽象，讓每一個業務人員可自定義的流程才是好的流程設計。
B端C化是B端產品設計的視覺表現力慢慢往C端產品設計的視覺靠齊，國內B端產品界面設計視覺水平還有很大的提高空間。除了視覺上的提升外，由于業務的發展，B端產品也開始移動化、智能化，國內主流還是通過小程序、H5來現實B端產品C端化。
輕代碼化是一種低代碼賦能無代碼的方式，彌補無代碼拓展性差、覆蓋場景少的問題。在保有無代碼靈活、易用、快捷的同時，又能覆蓋低代碼使用場景。簡單理解就是無需代碼開發即可如搭積木般快速、靈活地創造屬于你的個性化管理系統，輕松實現多元業務場景的數字化管理。
輕代碼化將功能進行打包，升級成全局可以用的配置，技術人員配置好后，業務人員在應用編輯時直接選擇使用模版，綁定對應的變量即可使用。
為什么人加色塊的組合方式能流行起來？還是B端行業流行帶動的。B端講的更多的是企業對企業。企業對企業除了講行業解決方案外，還需要傳達公司的價值觀、使命、愿景。人加色塊的組合方式非常適合體現公司的企業文化。對于一家全球化的公司不同膚色的人物組合在一起，這種人文氣息和價值觀已經就不言而喻了。
當然企業也需要進行營銷，抓人眼球。幾千年來的遺傳證明了，人的大腦對食物、性、動的東西、人臉和眼睛、危險的動物很敏感。人加色塊的組合方式也具有抓人眼球營銷的功能。真可謂一舉兩得。
這種風格更適合大公司，國內的一些手機廠商OPPO、VIVO等也會通過手機+背景+人物來體現科技與人文的結合，而對于中小型公司產品差異化和行業解決方案展現應該還是重中之重。
毛玻璃效果加大了模糊程度，透明效果更加扁平，很好的順應當下UI扁平化的設計趨勢。蘋果Mac OS Big Sur系統的圖標、界面中運用了大量毛玻璃和半透明元素，界面更扁平。至于C4D三維彩色玻璃的視頻教程可以在B站搜索“透光藝術-C4D創建彩色玻璃的4個技法”，完全能滿足UI設計師。當然還有一個好消息就是Mac用戶可以享有OC一年免費的使用權，具體安裝購買方法可以上“某寶”就可以輕松搞定，真香。
輕擬物這幾年一直流行，在UI設計中趨于穩定的位置。從寫實到扁平再到輕擬物，其實是設計師們一路不斷探索的結果。本質就是光影對形體產生的視覺感受。在色彩中對高光、亮面、明暗交界線、暗面、反光（環境光）五個部分的處理。寫實三維的圖標等設計更適用于簡潔的畫面中，扁平等設計更適用于復雜一點的界面中，比如B端產品界面中的功能圖標。輕擬物可使用的范圍更廣，效果更佳。Sketch、Figma軟件對于漸變、高光、投影、高斯模糊處理已經非常簡單且出彩。
簡潔設計遵從了密斯·凡德羅的“少即是多”的設計原則，在B端產品界面中更加需要簡潔設計，我們最熟悉的Sketch軟件界面已經是相當的簡潔了。回到現實當需求功能不斷增加，產品界面的編排如何取舍，如何保證界面的簡潔是設計師需要深度思考的問題？如何與上級溝通？該功能是否可做可不做？是否需要埋點用數據說話？如果只是一味競品有我們就需要有，功能不斷累加只會讓界面越來越重。
幾何圖形和幾何插畫有異曲同工之妙，幾何圖形多為產品界面和宣傳內容的抽象，產品界面的幾何圖形多為占位符形式，加上色彩和幾何色塊讓其成為一個整體。B端產品視覺設計C端化的進程中，幾何圖形、幾何色彩不失為最好的突破口，相信今年追波B端產品的視覺設計一定會更上一個臺階。
幾何圖形另一個場景化的地方就是品牌，作為一名UI設計師一定會經歷從圖標到幾何圖形到品牌設計的過程，品牌設計的技巧基本還是以幾何圖形為主，至于品牌的內涵需要更深層次的解讀。掌握主流品牌設計的技巧對產品定位、品牌宣傳打下扎實的基礎。
暗黑模式的設計是解決在微弱環境下內容也可以有更高的可讀性。隨著用戶夜晚及深夜使用電子設備時長增大，如何在夜晚這個特定場景下使用更加舒適。合理使用暗黑模式可以減輕眼睛疲勞，提高在夜間使用的可讀性。
在設計暗黑主題時，不能為了突顯視覺上的逼格，而去使用高飽和度鮮艷的色彩來突顯界面的品質感。而應該把舒適度、可讀性作為設計的衡量指標。Material Design給出了暗黑主題的設計準則，即正文和背景之間的對比度應至少為15.8:1。按照此標準設計，可讀性都還不錯。這里介紹一個插件“Stark”（Figma、Sketch、XD、Chrome插件）用來測試界面的對比度。
為什么叫模塊化，而不叫組件化，組件化更多的利用原子系統從原子、分子、組織、模版、頁面來快速的搭建界面，但在B端產品設計中基礎組件和業務組件的搭建是以提高工作效率為前提，是否有從0到1搭建B端產品組件的經歷是設計師一生中最寶貴的經驗之一，它能提高設計師的系統化思維、邏輯思維和抽象思維能力。
產品模塊化設計就是將產品分成幾個部分，也就是幾個模塊，每一部分都是具有獨立功能，具有一致的連接接口和一致的輸入、輸出接口的單元，相同種類的模塊在產品族中可以重用和互換，相關模塊的排列組合就可以形成最終的產品。通過模塊的組合配置，就可以創建不同需求的產品，滿足客戶的定制需求 。
插畫作為設計的一大品類，不同的插畫師都有自己擅長的風格，本質是都有自己的個性，但是在產品設計中更多是需要共情、共性來講故事，表達產品理念和價值觀。這就需要插畫師去嘗試并探尋出適合互聯網產品設計類的插畫風格。設計的本質是舊元素的重新組合，插畫不會過時，而是需要結合當下和產品找到最匹配的設計風格。
幾何插畫算是插畫簡化的一種表現形式，人和物的形態不再寫實，而是抽象成幾何圖形拼湊的感覺，同時保留人物形態的神韻。加上幾何色塊與人物交互形態的表現，傳達出簡潔、科技的現代感。難點還是在人物形態的表現上，平時多練習練習速寫還是很有必要的。
線面插畫最近一兩年非常流行，準確的說是非常適合。首先線面插畫主要是由線條和塊面組合而成，用塊面表現人物形態時某些結構會表現不出來，這時候用線條簡單勾勒后，結構就會清晰明了。其次當線面插畫運用在界面上時，可以打破界面純文字或組件化的機械和沉悶感。線面插畫的風格提升畫面熱鬧感的同時，還能保持界面的干凈整潔。
界面微交互動效會讓用戶的體驗更加精致到位。想要打造優秀的產品設計，微交互和動效設計是繞不開的，UI界面設計通過微交互反饋告知用戶當前正在發生的事情，所處的狀態。細微的動效更能調動用戶情緒，取悅用戶。C端產品微交互和動效已經很成熟了，一部分功勞來自iOS系統原生自帶的效果。B端產品的微交互和動效更多還是在學習海外產品，還需要給前端工程師灌輸微交互和動效的設計價值，共同打造產品體驗細節。
Mg動畫需要很好的節奏感、韻律，每一個場景動畫都需要其中的元素進行連接變化，讓轉場動畫更加自然，MG人物動畫通過點線面的動效變化讓畫面更加有趣、自然，通過粒子效果讓特定場景無限循環會讓人更加印象深刻。
MacOS Big Sur系統圖標的更新帶動了三維圖標的流行，三維圖標的應該場景還是需要有較大留白空間的界面，因為三維圖標太小后就看不到更多細節。三維圖標感覺又回到了擬物化和扁平化哪個更好的問題上？設計師應該保持開放多元的視角。設計本身也在不斷的演化融合，存在即合理。合適最重要，它們都會有適合自己的場景和設計價值。
為什么輕三維在界面設計中占有一席之位？一個是設計師不斷追求差異化的產物。另一個是更好的表現內容，并與用戶產生共鳴。輕三維的基礎模型都是來自手機界面中的各種元素，比如組件、開關、按鈕、占位符、圖表、幾何圖形、圖標、進度條等，這些都是用戶日常使用系統軟件常見的元素，通過簡單的幾何形體建?！驘艄狻硬馁|—渲染—PS調色。難度系數不大但效果很出彩。第一個出彩點是模型帶有厚度的倒角，結合燈光渲染的光澤是二維軟件不能比擬的。第二個出彩點就是材質自由添加，特別是當下流行的毛玻璃效果，玻璃材質渲染效果更佳。第三個出彩點就是可以加局部燈光，局部的漸變色或環境光更佳出彩。
P4D是PS加C4D的設計表現技法，也是視覺設計的最后一個環節，通過PS對C4D的渲染圖片進行調色，利用PS的調色技巧可以很好的解決C4D打燈光的瑕疵，還可以利用PS強大的合成功能，將渲染圖片與圖片素材進行合成，來表現畫面的視覺度，當然三維軟件比較難實現的水、粒子、煙花等效果，也可以通過PS的后期合成來實現，這也是P4D的強大之處。
卡通IP設計最近三四年技術的迭代已經慢慢的走上成熟，卡通IP也從傳統的純PS手繪技法，轉到C4D建?！巧壎ā狹D衣服制作—OC渲染—PS（靜態）/AE（動態）調色。
卡通IP火的本質更適合做營銷，相比于品牌或Slogan，卡通IP具有親和力和畫面感。隨著各種手辦行業大熱，受互聯網大廠影響下，卡通IP已經是互聯網B輪以上公司的標配了。如果團隊中沒有這樣能力的人，也可以通過繪制好二維，一套三維可以選擇外包完成。
對于UI設計師來說學習是有成本的，暫時并不是必備技能，如果喜歡完全可以學習，從設計差異化的角度來看三維視覺確實有一定的競爭力。
C4D三維場景動畫通過構建實物和場景模擬生活中的現實場景，會讓用戶體驗真實感，三維軟件制作動效的最大優勢是通過動力學和表達式來模擬真實感，未來在AR/VR領域會有更好的發展。相對于界面動效學習成本難度也相對較大。在三維動畫中C4D軟件對于域、動力學還是有一定的優勢。
上一次寫追波流行趨勢還是兩年前了，通過兩年的沉淀對趨勢流行有了更深的認知。十年的互聯網行業風風火火，隨著最近的互聯網裁員潮大家也慢慢的進入到反思層，客觀的看待和理解這個真實的世界，曾經的流行趨勢也需要慢慢的沉淀下來。
存在即合理，趨勢流行稍縱即逝，注定是不長久的，只有大浪淘沙歷史遺留下來的風格才能更長久。但我們也不能不去關注，因為哪有什么所謂的創新，只不過是舊元素的重新組合，并符合當下這個時代人的審美需求。香奈兒的“時尚易逝，風格永存”大概就是這個意思吧。
6000多字的設計流行趨勢，希望能幫助設計師度過互聯網裁員的寒春。最后希望以后每年堅持輸出設計流行趨勢。為設計行業奉獻微薄之力。
總結
追波年度最佳作品
易讀性（停頓感）
曲線
多彩高斯漸變風
B端界面設計
側邊欄Sidebar
儀表盤設計
流程設計
B端C化
輕代碼化
界面設計技巧
人文氣息
毛玻璃效果
輕擬物
簡潔設計
幾何圖形
暗黑設計
模塊化（組件化）
插畫
幾何插畫
線面插畫
動效
微交互
Mg動畫
三維
三維圖標
輕三維
P4D（PS+C4D）
卡通IP
三維動畫
總結
文章來源：站酷 作者：水手哥
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
之前總結了B端表單頁設計的一些問題，其中信息錄入是比較重要的部分，信息錄入中選擇錄入是最為常用及復雜的組件，平時工作中遇到的相關問題也是最多的，此次針對選擇錄入常用組件的應用場景和交互規則進行總結
選擇錄入的類型比較多，可以簡單的分為兩大類即
基礎選擇組件：單選/多選/開關/下拉選擇
復雜選擇組件：時間/日期/穿梭框/級聯選擇/樹形選擇等
B端表單業務場景比較多，很多場景具有通用性，有的場景卻有一定的獨立性，需要了解場景及用戶的需求和組件的適用性才能提高用戶操作體驗和效率
一.單選框
單選框(Radio)是表單中比較常用的控件，它通常被用來從一組互斥的相關選項中選擇一個單獨的選項。
當點擊一個未選中的單選名時，它會被選中，其他按鈕為未選中狀態。英文命名Radio來源于舊收音機上的按鈕，用于舊收音機不同頻道的切換，當一個按鈕被按下時，其他按鈕會彈起，使被按下的按鈕處于唯一被選擇狀態的按鈕。
使用場景
1.當用戶需要在一組互斥的選項中進行單一選擇時使用單選框；如果要進行多個選擇，推薦使用多選框。
2.當選項數目在2-7個之間時使用單選框；如果選項超過7個，推薦使用下拉框。
3.如果有兩個含義相反的選項，如“同意”和“不同意”，“接受”和“拒絕”等，建議使用一個多選框或者開關勾選為同意，不勾選為不同意。
4.如果每個選項都有同等的優先級，沒有推薦選項時，使用單選框；如果需要向用戶推薦某個選項，可以使用下拉框。
5.如果提供給用戶的選項很熟悉，看了第一個選項就能預見到所有的內容，如“周一”，那么后邊的選項是“周二到周日”等，這種情況下就不需要將所有的選項都展示出來，可以使用下拉框來簡化界面。
交互邏輯
1.選項的設置，在設計單選框的選項時，要充分考慮用戶的實際情況，給出的選項要覆蓋到所有的情況。應該滿足“互斥”的原則，因此選項之間要避免存在交集，同時也要注意選項覆蓋要全面，不能出現遺漏。
例如，要考慮到用戶不進行選擇的情況，這時需要提供一個“無”的選項。給出的選項有可能都不符合用戶的情況，如果所有的選項用戶都可能不會選，就需要提供一個“其它”選項。
2.默認選項，一般情況下為第一個選項，需要選擇最安全，最有可能的選項作為默認選項，提前預判用戶的選擇，提升用戶選擇效率。
3.選項排序會影響用戶選擇效率，所以需要遵循一定的原則。按照邏輯順序，選擇概率由高到低；或者按照復雜程度排序，由簡單到復雜；也可以按照操作后風險排序，將最安全的操作放在前邊，由風險最低到最高進行排序
4.排列對齊方式，豎直排列相對于水平排列而言，容易讀取和定位，可以提高用戶的瀏覽效率，所有的選項進行左對齊，不用受制于選項的標簽文字長短，但豎直排列會占用較多的垂直空間；水平排列要注意每個選項之間的間距，間距盡量大一點，要不然用戶會分不清單選按鈕的文字到底是在前邊，pc端水平空間比較大，所以相對而言，水平排列的方式更加常用。
5.交互區域，單選框的面積較小，用戶在點擊的時候會比較困難?？梢酝ㄟ^擴大點擊區的交互區域來提高易用性，將標簽文字也設置為可點擊，增加操作區域的面積，方便用戶操作
6.文字標簽，每個選項的文字都要簡潔明了的表達該選項所代表的含義。一般使用短語而不是句子，因此不需要以句號來結尾。盡量保證每個文字標簽用語的表達的一致性，不要出現有的用名詞，有的用動詞的情況。如果需要解釋說明，可以在選項下方使用單獨一行文字。如果標簽文字無法進行精簡，必須使用多行文字，將單選按鈕與文字頂對齊
7.交互狀態，每個選項都有選中和未選中兩種情況，每種情況對應了3種交互狀態，分別為默認、懸浮和禁用。
二.多選框
多選框的交互定義是幫助用戶完成從若干個互斥的選項集合當中選取一個或者多個選項的任務，多選框多用于表單中。傳統意義上，多選框是方形，單選框是圓的，用戶已經形成這種習慣認知，所以盡量避免使用特殊形狀
使用場景
1.當用戶需要在一組互斥的選項中進行多個選擇，完成N選n的任務，使用多選框
2.當選項數目在3-7個之間時使用多選框；如果選項超過7個，推薦使用下拉選擇
3.當選項數量為一個，包含“是”和“否”的邏輯，也可叫單個多選框 比如常見的用戶協議頁面，通常采用單個多選框。
交互邏輯
選項排序/對齊方式/交互區域/文字標簽等邏輯與單選框基本一致
1.選項的設置，因為所有選項處于外露狀態，所以超過7個時建議使用下拉選擇器，避免選項過多難以展示
2.默認選項，相對單選框，默認選擇在多選框中并不常見
3.提交操作，單個多選場景中，提交時必不可少的，可以是確認按鈕或是其他方式；下拉選框中為了提高效率也可不用確認，點擊空白處即確認選擇。
4.排列對齊方式：縱向排布，適用于選項內容較多或信息長度差異較大的情況；橫向，適用于選項數量多且內容簡短的情況
5.特殊狀態：相對于其他控件，多選有了兩個較為特殊的狀態“半選中”“禁用(已選)”
1）半選中狀態是全選狀態的一種特殊狀態，依附于全選狀態，所以當多選框中存在全選時才可能出現半選狀態，同時還需要有選中狀態的子項，全選半選狀態屬于【父級】狀態，交互的邏輯是狀態的變化是隨時體現的，所以【子級】狀態的變化，作為【父級】狀態也應該隨之變化，這樣父子級聯動才會有半選中狀態的出現。
2）禁用狀態有未選禁用和已選禁用，未選禁用一般是該條數據不滿足條件無法選中進行操作。而已選禁用一般用戶的權限不足無法進行操作，通常展示出來只是為了讓用戶了解到有此操作。
應用場景
1.復雜選擇器
復雜選擇器中常常會用到多選框，可以明確展示選項的選擇狀態，需要注意的是多選框可以承載的半選，全選狀態所對應的關系，是否符合業務場景。在實際工作中，我曾遇到過父級選擇影響子級但是子級無法影響父級的多選場景，不符合常規的多選習慣，但是在實際業務場景中真實存在。
2.權限設置
在很多權限設置/流程設置的頁面中，常常會用到多選框，需要注意的是各個場景中選中，取消，默認，重置等不同狀態下，頁面的變化，狀態扭轉時交互邏輯的合理性和易用性。
3.表格多選
表格頁面情況多且復雜，對于勾選有兩種形式一種是勾選多選框，一種是點擊行數據選擇，需要明確哪一種更適合當前的業務場景。另外表格的中最多的功能即是全選操作或是部分選擇操作，需明確操作后對整個表格的影響
三.開關
開關用于兩種相對對立的狀態的切換,多用于「開/關」「啟用/停用」等，不同于單選和多選開關是一個即時性的操作，這也導致開關使用的特殊性。開關能明確的展示當前的功能狀態，讓用戶能高效的進行跳轉操作。
使用場景
1.用于對流程的快速開啟，如表格中開啟或關閉某條數據/功能
2.權重較高的功能或設置，如配置表單的停用/啟用，用戶權限的啟用/停用
3.用于開啟/關閉全局權限，后設置其他功能的操作，如業務規則的設置等
交互邏輯
1.開關 配有對應的文字說明，開啟/關閉某種功能或權限
2.開關具有聯動性，通過開關去控制下層功能的操作
3.開關的每一次變更狀態都要有相應的反饋，輔助用戶進行狀態判斷
四.下拉選擇
下拉選擇B端業務中最常用的組件，且下拉選擇的類型也比較廣，一般有下拉單選，下拉多選，下拉級聯，下拉樹等基本場景是可選項過多時，會使用下拉選擇器對所有選項進行整合方便用戶高效錄入信息。選項層級建議不超過 三層且需要有一定的邏輯排序，通常包括觸發器和下拉面板兩個部分當選項數量過多的時候，建議增加「搜索」功能。
下拉選擇結構
1.標簽文本：選擇器標題，明確選擇內容
2.選框：與文本框類似，需有一個外邊框，為可操作的熱區范圍，主要功能是與下拉菜單進行聯動
當選項較多的時候，多選框會配上搜索功能，目的是為了讓用戶快速找到對應的選項，而形式主要有以下兩種
3.右側標識(可選)：每個選框右側的圖標，都是選框類型的象征。常見的是下拉箭頭，默認朝下；展示選項列表時，箭頭朝上。
4.占位符：保持暗提示的簡潔，避免把暗提示作為選擇器的輔助說明，默認占位文字，格式為「請選擇xxx」
5.回顯值：回顯值通常包括兩種類型
1）當下拉單選，一般采用純文本回顯即可
2）當下拉多選，需要同時展示多個選中項，因此在錄入框中采取Tag形式，使單個選項也可以點擊刪除形成完整的閉環
6.選項：下拉選擇一般針對選項數超過5個
內容：1）選框 + 文本 + 副文本； 2）選框 + 文本； 3）文本 + 副文本； 4）文本。除了選項內容的不同，形式中也有較為復雜的，重點分析級聯選擇和樹：
1)樹展示，可選擇的數據是一個樹形結構時，例如公司層級、學科系統、分類目錄等，樹結構中可以自由選擇子節點和根結點。
2)級聯展示，針對的一般是有所屬關系的選項且所屬關系比較明確，層級一般3-5級，選擇到最末子級才能完成選擇一般是由大到小進行選擇，選項數量上3>2>1，比如省市縣選擇
3)分組展示,選項過多時考慮使用的方式，使用分割線將同一類選項進行劃分，用戶選擇時會思考從大的分類到具體的選項。但選項過多則還是建議用樹結構
7.選項面板：承載所有可選擇的選項列表，在選項數量過多時會對下拉菜單的高度進行限制，即設置下拉菜單的最大高度，當超過最大高度時，出現滾動條。面板相當于一個容器可以根據業務需求承載復雜的形式 例如tab分類、錨點、字母定位等，
選擇器狀態
默認（Default
懸停（Hover
1.未選擇，若選框有搜索功能則光標變成文本輸入狀態，若沒有搜索功能則光標變成小手（示例
2.已選擇，選擇后懸停狀態下全部清空的功能，不是所有場景下配置該功能， 要考慮實際業務中是否需要清空
激活（Active
1.未選擇，點擊框體激活下拉面板，單選一般是勾選后自動關閉面板，多選則需要點擊面板以外確認關閉面板
2.已選擇，若是已選擇再次激活，需要將已選擇的選項高亮，再次點擊已選選項則取消選擇；選項熱區，一般將整行作為熱區擴大點擊范圍，方便用戶操作。
禁用（Disable
1.選框禁用，用戶無法激活，選框置灰，在設計工程中需要將禁用于正常狀態之間拉開差距，這樣用戶能快速識別
2.選項禁用，表示該選項無法被選擇，不影響整個選擇器的功能，只用將該選項置灰即可，光標置入時會變成Not allowed
回顯規則
單選，多數單選選擇后下拉面板自動收起，回顯選擇的選項，選項回顯時有一些特殊情況如存在極端情況文案過長則結尾用「…」展示， hover 顯示「文字提示氣泡」；或者選項中存在主文本副文本，考慮實際業務場景回顯時可只顯示主文本。
多選，以Tag形式展示已選擇項使單個選項也可以點擊刪除形成完整的閉環；存在的極端情況是當選項過多時的展示效果，一般有兩種形式撐開高度和選項融合
1）撐開高度，一般用在需要完全展示選擇項同時可快速調整已選項的場景中，通過改變錄入框的整體高度來展示完整的選型，撐開的高度能在表單中實現一些疏密變化，一般也不會無限撐開，會有一定的限制，并且在右側增加滾動條。
2）選項融合，對選項展示不作要求的場景中可根據文本框的寬度進行選項融合，展示具體的選項數量即可，這樣能最大程度的保證表單的的整齊，讓選擇器的適配性更高。
3）省略展示選項，以文本形式展示，鼠標hover氣泡展示全部選項信息
問題思考
何時用下拉選框，何時用彈窗選擇？
大部分情況下，單選優先用下拉選框，用戶比較高效的完成選擇，同時也可以明確自己的選擇。而多選場景中對于選項數量可控，選項復雜度較低的可以用下拉選框。但是對于選項結構復雜，內容過載，用戶頻繁的滾動容易造成誤操作影響選擇的準確性和高效性，此時會考慮使用彈窗，且多選彈窗一般需要配有搜索區，選項區，已選區。需要注意的是，已選項在彈窗內的顯示以及回顯形式。多選彈窗一般可以比較直觀的展示已選項，所以可以采用省略展示選項的方式。
選擇搜索如何顯示？
如下彈窗選擇中，對于數量和層級比較復雜的選擇項，搜索是很有必要的，對于搜索結果的展現形式不同的場景可能會有不同，用戶使用搜索一般是對于選項比較明確，所以推薦搜索結果展示末級，用戶可以更高效的做出選擇，避免復雜的層級關系干擾。
五.時間與日期選擇器
兩種類型
1.時間點選擇，選定某一個時間/日期點，B端時間點選擇的業務場景較少
2.時間段選擇，選定某一個時間范圍，一般有開始時間和結束時間，時間段的應用一般是在數據篩選的場景中
確定時間類型后，要考慮時間粒度，時間粒度分為年、季、月、周、天、時、分、秒，B端圖表頁面中針對年度、季度、月度的篩選時很常見的，需要結合場景選擇時間粒度。
日期選擇器中一般是通過點擊讓用戶選擇時間，除了讓用戶點選外，時間選擇器還會提供一些快捷選項例如“今天、本周、本月，本季度“等。選擇后回顯的時間顯示格式有多種如“2022-01-01”“2022年01月01日”“2022.01.01”“20220101”“2022年01月01日”平臺需要確定統一的樣式，避免增加用戶的認知成本。
時間段選擇，常見兩種形式分段式和連體式，在不同的平臺都有應用，在交互上的區別分段式需要用戶點擊兩次分別選擇開始時間和結束時間，連體式是用戶點擊一次調起時間選擇時間段，相對而言連體式操作更便捷，但是分段式理解更簡單，連體式存在一定的認知成本，總體上來說其實區別并不大，平臺需要建立統一的標準，這樣能形成較為統一的體驗和習慣。
選擇器在實際工作中應用廣泛，B端業務復雜，總會遇到各種新的場景，總結會有不足不全之處，歡迎大家一起探討交流。
文章來源：站酷 作者：MuMu魚
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
藍藍設計的小編 http://www.syprn.cn