Dribbble 平臺對于互聯網 UI 界面設計有著舉足輕重的定位，對 Dribbble 設計的研究會讓我們看清設計的方向。
為了保證這篇文章的質量，Dribbble 年度的每個作品都超過 550 贊。在此原則下挑選了 828 件作品，作品總的大小為 2.2G。
從挑選出的 828 件作品中，排名前十的作品中 9 件為 B 端設計，另一件作品也是 B 端產品 C 端化的產物。其中：
明眼人都能看出其中的比重關系，B 端設計再次大火，為什么是再次？因為 B 端設計之前火過，只不過沒有趕上一個好的時代，在 C 端設計風光的十年里而忽略了其存在。隨著 C 端市場飽和與數字化的浪潮下，實體經濟、ToB、ToG 的產業再次迎來了它的曙光。視頻動效的作品占比也已超過 C 端界面設計，相信今年視頻動效作品占比還會再次提升。
Dribbble 年度最佳作品來自大家最熟悉的 UI8 團隊中的 Tran Mau Tri Tam ?，作者來自越南西貢，最佳作品截止目前355K瀏覽量，2933個贊。
為什么看似平平無奇的作品卻能獲得 Dribbble 年度最佳作品呢？既不是 C 端也不是純 B 端的作品，更像一個網頁與平面的結合體。如果去掉搜索圖標、分類圖標和按鈕，你可以理解它就是一個平面作品，一個字體加幾何形體構建的作品，為了豐富畫面的層次，讓畫面更加的活潑采用了多彩加幾何色塊，讓標題閱讀有停頓感和呼吸感。faster 底部的橫線讓它從標題文字中脫穎而出，這種使用線條突出重要信息的設計也是今年Dribbble 設計流行趨勢之一。
MetroUI 是 Windows8 的界面設計語言，在 2010 年至 2013 年間曾經風靡一時，那也是移動互聯網的發展元年，現在國家推行實體經濟、數字化帶動 To B、To G 的發展元年，通過幾何色塊（MetroUI）實現 B 端產品與 C 端設計風格的傳承與銜接，你會發現歷史總是驚人的相似。最后背景結合今年最流行的微軟風，毛玻璃的多彩高斯模糊漸變風，年度作品當之無愧。
最后來看下按鈕的設計，正常的按鈕要么文字加色塊，要么左圖標加右文字，它設計成左文本加右圖標，更加注重信息的可讀性和易讀性，也體現 B 端設計重功能和交互體驗，視覺點到為止的設計理念。
下面我們來欣賞年度最佳作品里面的流行趨勢吧。
1. 易讀性（停頓感）
字體三原則：可讀性、易識性、易讀性。當你同時讀一篇文言文和一篇設計文章，肯定設計文章的內容可讀性更好。易識性是用在字體設計上，不能過于浮夸的改變字體骨架、形體而不易識別。易讀性和每個位設計師都息息相關，因為我們都需要編排文本。當我們小時候寫作文時，不會寫的文字可以用拼音代替。這時候讀者讀到拼音時會有停頓感，更加適合用戶閱讀。
通過給用戶制作停頓感來增加用戶的易讀性。可以在相關聯文本后面添加圖片、表情、圖標來更好的理解文本內容，豐富文本內涵。比如情侶間表達愛意時會輸入文本，“我愛你”、“我 Love 你”、“我 ai 你”、“我??你”，哪個更加會有情感共鳴呢？不言而喻，相信你心中已經有答案了。
2. 曲線
在標題文字上添加曲線來突出重要文案是 2021 Dribbble 最流行的趨勢之一，第一個設計目的就是突顯文字，其次就是想表現鉛筆真實書寫的感覺。之前很多帶有簽名的設計中，簽字的文本都是手寫體的感覺，手寫體對比電腦的機械字體會帶有一種人文氣息，也會讓兩者之間產生一種對比、矛盾。
除了突顯文本外，曲線還有視覺引導的作用。通過視覺引導讓用戶按照設計師編排的順序進行瀏覽界面。當然還有比這更科學的工具就是眼動儀測試，通過真實用戶眼睛瀏覽界面顯示對應的熱點圖。
3. 多彩高斯漸變風
多彩高斯漸變風是從色彩的角度來傳達和豐富畫面的，多彩高斯漸變風其實是從制造矛盾到平衡矛盾的過程，多彩漸變多為冷暖對比來制造畫面的沖突，需要控制冷暖畫面的大小來實現平衡。主流的還是以暖色突顯為主。多彩漸變主要起到活躍氣氛、吸引目光、平衡畫面的作用。
多彩高斯漸變還可以結合輕擬物、幾何圖形、三維等新的組合方式去創新，給用戶呈現一種更加新穎的視覺表現形式。最后我們還是要回歸到內容上，為了更好的傳達信息需要去設計與內容相匹配的視覺風格。
1. 側邊欄 Sidebar
B 端設計的火爆帶動了 B 端相關模塊設計，更多的人也愿意嘗試 B 端相關模塊設計，側邊欄作為產品架構中重要的導航系統，好的側邊欄設計能為用戶帶來更好的效率。主流側邊欄都做了展開、收起、拖拽等交互效果，也是受限于 PC 屏幕為展示更多數據而騰空間。側邊欄主要承擔的功能有導航、分類、自定義篩選、共享、新增等。Dribbble 的 B 端產品設計已經不再是假大空概念設計，而是一套實用美觀可落地的設計。
2. 儀表盤設計
儀表盤設計是一個很好的隱喻，想象一下開摩托車或汽車主駕駛前面的屏幕，汽車儀表有燃油表、車速表、里程表、水溫表、轉速表、故障指示燈等。B 端類產品后臺界面的儀表盤設計也需要展示一些重要的數據和各種狀態，大體分為側標欄、導航欄、待辦任務、個人信息、報表數據、消息中心、快捷入口等。當然最重要的就是報表數據，團隊收益、任務進度、轉化比例、新增、存量、團隊工作時長等都是老板或領導關心的內容。每個公司業務不同、每個人員權限不同，自定義的儀表盤也各有差異。重要的是突顯數據和業務狀態，需要分層級系統性去思考和設計。
3. 流程設計
復雜的事情簡單化，簡單的事情標準化，標準的事情流程化，流程的事情自動化。流程設計是每一個企業核心功能和業務，可自定義的管理流程系統搭建也是 B 端產品設計的難點，需要對業務高度抽象，讓每一個業務人員可自定義的流程才是好的流程設計。
4. B 端 C 化
B 端 C 化是 B 端產品設計的視覺表現力慢慢往 C 端產品設計的視覺靠齊，國內 B 端產品界面設計視覺水平還有很大的提高空間。除了視覺上的提升外，由于業務的發展，B 端產品也開始移動化、智能化，國內主流還是通過小程序、H5 來現實 B 端產品 C 端化。
5. 輕代碼化
輕代碼化是一種低代碼賦能無代碼的方式，彌補無代碼拓展性差、覆蓋場景少的問題。在保有無代碼靈活、易用、快捷的同時，又能覆蓋低代碼使用場景。簡單理解就是無需代碼開發即可如搭積木般快速、靈活地創造屬于你的個性化管理系統，輕松實現多元業務場景的數字化管理。
輕代碼化將功能進行打包，升級成全局可以用的配置，技術人員配置好后，業務人員在應用編輯時直接選擇使用模版，綁定對應的變量即可使用。
1. 人文氣息
為什么人加色塊的組合方式能流行起來？還是 B 端行業流行帶動的。B 端講的更多的是企業對企業。企業對企業除了講行業解決方案外，還需要傳達公司的價值觀、使命、愿景。人加色塊的組合方式非常適合體現公司的企業文化。對于一家全球化的公司不同膚色的人物組合在一起，這種人文氣息和價值觀已經就不言而喻了。
當然企業也需要進行營銷，抓人眼球。幾千年來的遺傳證明了，人的大腦對食物、性、動的東西、人臉和眼睛、危險的動物很敏感。人加色塊的組合方式也具有抓人眼球營銷的功能。真可謂一舉兩得。
這種風格更適合大公司，國內的一些手機廠商 OPPO、VIVO 等也會通過手機+背景+人物來體現科技與人文的結合，而對于中小型公司產品差異化和行業解決方案展現應該還是重中之重。
2. 毛玻璃效果
毛玻璃效果加大了模糊程度，透明效果更加扁平，很好的順應當下 UI 扁平化的設計趨勢。蘋果 Mac OS Big Sur 系統的圖標、界面中運用了大量毛玻璃和半透明元素，界面更扁平。至于 C4D 三維彩色玻璃的視頻教程可以在 B 站搜索“透光藝術-C4D 創建彩色玻璃的 4 個技法”，完全能滿足 UI 設計師。當然還有一個好消息就是 Mac 用戶可以享有 OC 一年免費的使用權，具體安裝購買方法上某寶就可以輕松搞定，真香。
3. 輕擬物
輕擬物這幾年一直流行，在 UI 設計中趨于穩定的位置。從寫實到扁平再到輕擬物，其實是設計師們一路不斷探索的結果。本質就是光影對形體產生的視覺感受。在色彩中對高光、亮面、明暗交界線、暗面、反光（環境光）五個部分的處理。寫實三維的圖標等設計更適用于簡潔的畫面中，扁平等設計更適用于復雜一點的界面中，比如 B 端產品界面中的功能圖標。輕擬物可使用的范圍更廣，效果更佳。Sketch、Figma 軟件對于漸變、高光、投影、高斯模糊處理已經非常簡單且出彩。
4. 簡潔設計
簡潔設計遵從了密斯·凡德羅的“少即是多”的設計原則，在 B 端產品界面中更加需要簡潔設計，我們最熟悉的 Sketch 軟件界面已經是相當的簡潔了?；氐浆F實當需求功能不斷增加，產品界面的編排如何取舍，如何保證界面的簡潔是設計師需要深度思考的問題？如何與上級溝通？該功能是否可做可不做？是否需要埋點用數據說話？如果只是一味競品有我們就需要有，功能不斷累加只會讓界面越來越重。
5. 幾何圖形
幾何圖形和幾何插畫有異曲同工之妙，幾何圖形多為產品界面和宣傳內容的抽象，產品界面的幾何圖形多為占位符形式，加上色彩和幾何色塊讓其成為一個整體。B 端產品視覺設計 C 端化的進程中，幾何圖形、幾何色彩不失為最好的突破口，相信今年Dribbble B 端產品的視覺設計一定會更上一個臺階。
幾何圖形另一個場景化的地方就是品牌，作為一名 UI 設計師一定會經歷從圖標到幾何圖形到品牌設計的過程，品牌設計的技巧基本還是以幾何圖形為主，至于品牌的內涵需要更深層次的解讀。掌握主流品牌設計的技巧對產品定位、品牌宣傳打下扎實的基礎。
6. 暗黑設計
暗黑模式的設計是解決在微弱環境下內容也可以有更高的可讀性。隨著用戶夜晚及深夜使用電子設備時長增大，如何在夜晚這個特定場景下使用更加舒適。合理使用暗黑模式可以減輕眼睛疲勞，提高在夜間使用的可讀性。
在設計暗黑主題時，不能為了突顯視覺上的逼格，而去使用高飽和度鮮艷的色彩來突顯界面的品質感。而應該把舒適度、可讀性作為設計的衡量指標。Material Design 給出了暗黑主題的設計準則，即正文和背景之間的對比度應至少為 15.8:1。按照此標準設計，可讀性都還不錯。這里介紹一個插件“Stark”（Figma、Sketch、XD、Chrome 插件）用來測試界面的對比度。
7. 模塊化（組件化）
為什么叫模塊化，而不叫組件化，組件化更多的利用原子系統從原子、分子、組織、模版、頁面來快速的搭建界面，但在 B 端產品設計中基礎組件和業務組件的搭建是以提高工作效率為前提，是否有從 0 到 1 搭建 B 端產品組件的經歷是設計師一生中最寶貴的經驗之一，它能提高設計師的系統化思維、邏輯思維和抽象思維能力。
產品模塊化設計就是將產品分成幾個部分，也就是幾個模塊，每一部分都是具有獨立功能，具有一致的連接接口和一致的輸入、輸出接口的單元，相同種類的模塊在產品族中可以重用和互換，相關模塊的排列組合就可以形成最終的產品。通過模塊的組合配置，就可以創建不同需求的產品，滿足客戶的定制需求 。
8. 插畫
插畫作為設計的一大品類，不同的插畫師都有自己擅長的風格，本質是都有自己的個性，但是在產品設計中更多是需要共情、共性來講故事，表達產品理念和價值觀。這就需要插畫師去嘗試并探尋出適合互聯網產品設計類的插畫風格。設計的本質是舊元素的重新組合，插畫不會過時，而是需要結合當下和產品找到最匹配的設計風格。
9. 幾何插畫
幾何插畫算是插畫簡化的一種表現形式，人和物的形態不再寫實，而是抽象成幾何圖形拼湊的感覺，同時保留人物形態的神韻。加上幾何色塊與人物交互形態的表現，傳達出簡潔、科技的現代感。難點還是在人物形態的表現上，平時多練習練習速寫還是很有必要的。
10. 線面插畫
線面插畫最近一兩年非常流行，準確的說是非常適合。首先線面插畫主要是由線條和塊面組合而成，用塊面表現人物形態時某些結構會表現不出來，這時候用線條簡單勾勒后，結構就會清晰明了。其次當線面插畫運用在界面上時，可以打破界面純文字或組件化的機械和沉悶感。線面插畫的風格提升畫面熱鬧感的同時，還能保持界面的干凈整潔。
1. 微交互
界面微交互動效會讓用戶的體驗更加精致到位。想要打造優秀的產品設計，微交互和動效設計是繞不開的，UI 界面設計通過微交互反饋告知用戶當前正在發生的事情，所處的狀態。細微的動效更能調動用戶情緒，取悅用戶。C 端產品微交互和動效已經很成熟了，一部分功勞來自 iOS 系統原生自帶的效果。B 端產品的微交互和動效更多還是在學習海外產品，還需要給前端工程師灌輸微交互和動效的設計價值，共同打造產品體驗細節。
2. Mg 動畫
Mg 動畫需要很好的節奏感、韻律，每一個場景動畫都需要其中的元素進行連接變化，讓轉場動畫更加自然，MG 人物動畫通過點線面的動效變化讓畫面更加有趣、自然，通過粒子效果讓特定場景無限循環會讓人更加印象深刻。
1. 三維圖標
MacOS Big Sur 系統圖標的更新帶動了三維圖標的流行，三維圖標的應該場景還是需要有較大留白空間的界面，因為三維圖標太小后就看不到更多細節。三維圖標感覺又回到了擬物化和扁平化哪個更好的問題上？設計師應該保持開放多元的視角。設計本身也在不斷的演化融合，存在即合理。合適最重要，它們都會有適合自己的場景和設計價值。
2. 輕三維
為什么輕三維在界面設計中占有一席之位？一個是設計師不斷追求差異化的產物。另一個是更好的表現內容，并與用戶產生共鳴。輕三維的基礎模型都是來自手機界面中的各種元素，比如組件、開關、按鈕、占位符、圖表、幾何圖形、圖標、進度條等，這些都是用戶日常使用系統軟件常見的元素，通過簡單的幾何形體建模—打燈光—加材質—渲染—PS調色。難度系數不大但效果很出彩。第一個出彩點是模型帶有厚度的倒角，結合燈光渲染的光澤是二維軟件不能比擬的。第二個出彩點就是材質自由添加，特別是當下流行的毛玻璃效果，玻璃材質渲染效果更佳。第三個出彩點就是可以加局部燈光，局部的漸變色或環境光更加出彩。
3. P4D（PS+C4D）
P4D 是 PS 加 C4D 的設計表現技法，也是視覺設計的最后一個環節，通過 PS 對 C4D 的渲染圖片進行調色，利用 PS 的調色技巧可以很好的解決 C4D 打燈光的瑕疵，還可以利用 PS 強大的合成功能，將渲染圖片與圖片素材進行合成，來表現畫面的視覺度，當然三維軟件比較難實現的水、粒子、煙花等效果，也可以通過 PS 的后期合成來實現，這也是 P4D 的強大之處。
4. 卡通 IP
卡通 IP 設計最近三四年技術的迭代已經慢慢的走上成熟，卡通 IP 也從傳統的純 PS 手繪技法，轉到 C4D 建?！巧壎ā狹D衣服制作—OC渲染—PS（靜態）/AE（動態）調色。
卡通 IP 火的本質更適合做營銷，相比于品牌或 Slogan，卡通 IP 具有親和力和畫面感。隨著各種手辦行業大熱，受互聯網大廠影響下，卡通 IP 已經是互聯網 B 輪以上公司的標配了。如果團隊中沒有這樣能力的人，也可以通過繪制好二維，一套三維可以選擇外包完成。
對于 UI 設計師來說學習是有成本的，暫時并不是必備技能，如果喜歡完全可以學習，從設計差異化的角度來看三維視覺確實有一定的競爭力。
5. 三維動畫
C4D 三維場景動畫通過構建實物和場景模擬生活中的現實場景，會讓用戶體驗真實感，三維軟件制作動效的最大優勢是通過動力學和表達式來模擬真實感，未來在 AR/VR 領域會有更好的發展。相對于界面動效學習成本難度也相對較大。在三維動畫中 C4D 軟件對于域、動力學還是有一定的優勢。
上一次寫 Dribbble 流行趨勢還是兩年前了，通過兩年的沉淀對趨勢流行有了更深的認知。十年的互聯網行業風風火火，隨著最近的互聯網裁員潮大家也慢慢的進入到反思層，客觀的看待和理解這個真實的世界，曾經的流行趨勢也需要慢慢的沉淀下來。
存在即合理，趨勢流行稍縱即逝，注定是不長久的，只有大浪淘沙歷史遺留下來的風格才能更長久。但我們也不能不去關注，因為哪有什么所謂的創新，只不過是舊元素的重新組合，并符合當下這個時代人的審美需求。香奈兒的“時尚易逝，風格永存”大概就是這個意思吧。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
客戶與公司的商務售前進行溝通，客戶的痛點和建議會傳達給產品經理，產品需求明確后，做出原型圖給到設計師。等設計師拿到需求的時候，基本已成定局，合不合理、如何優化的空間都會比較小了。造成這個現象的根本原因是設計師能看到的視角范圍有限，B端業務場景本身比較專業，難以直接帶入使用者的角色，就比較難取得大的突破了。
如何打破這一僵局呢？答案只有一個，那就是設計師要主動更前置的加入到產品方案設計中，深刻理解業務，為產品升級提供助力。這就涉及到用戶研究了，本文將和大家分享用研的相關理論基礎和方法。
雙鉆設計模型由英國設計協會提出，該設計模型的核心是：發現正確的問題和發現正確的解決方案。
雙鉆模型是一個結構化的設計方法，被很多設計師喜愛和使用。
探索/調研——透析問題（發散）
定義/合成——聚焦領域（集中）
發展/構思——潛在問題（發散）
傳達/實現——實施方案（集中）
實際工作中用到雙鉆模型會有一些變體，舉個例子：
下圖是對阿里內部款移動運維產品的分析，分析其從0-1的方向探索和從1-1.5的發展歷程：
下圖是曾經在一個設計講座中，滴滴CDX 一位設計師的分享，她把雙鉆模型利用到設計的研究和輸出階段，個人感覺此模型的使用場景也很貼切。
不僅僅是在完整的一個項目中，在單一的某個階段雙鉆模型也是理念很好的承載容器。在每一個“確定”前后，都有用研的身影。
用研旨在通過實驗和觀察結合的研究方法來提高產品的可用性，指導產品的設計、開發和改進。重點是通過觀察技術、任務分析和其他反饋方法來了解用戶的行為、需求和動機。
在獲取后臺數據之后，我們會分析為什么留存、為什么流失、為什么買這個不買那個，
設計師認為很棒的新功能，真的是用戶想要的嗎？用戶真的會用嗎？
觀察數據只是一種手段，而非結果。當一個頁面中出現值很低的功能時，我們不能直接判斷他就是不重要的，也可能是因為視覺上太弱或者交互操作不方便引起的。只有做用戶研究才可以真正了解用戶的行為背后的原因，真正的動機。
如上圖，是一個紅包發放頁面的設計前后對比，從數據中了解到使用優惠券的用戶不到30%，埋點發現大多都點擊了返回，用戶沒有按照期望的路徑走，調研發現操作路徑不清晰，沒有形成閉環。由此可見，發現問題時，先埋點細化問題——再分析問題——結合用戶研究，提出優化方案，才能真正發現問題解決問題。
產品的發展周期分為產品概念期、設計開發期、宣傳推廣期、平穩發展期和產品衰退期五個階段，在每個階段都有相對應的用戶研究測試可以做。
對應上文的產品發展周期可以做的用戶測試，我們要找到相對應的人群：
最后就是將用戶研究進行落地了，如何讓用戶研究達到預期的目的和效果呢？可以在開始前的準備階段問問自己如下的問題：
接下來我們看看到實際落地環節，有哪些用戶研究的類型可以做以及怎么去做。
桌面研究又叫“文案研究”，指不進行一手資料的實地研究和收集，而是通過電腦，雜志，書籍，文檔，互聯網搜索等現有二手資料進行分析和研究的方法。
完整的桌面研究分為以下五個步驟：
在需求細分階段，可以用到SWOT 分析、波特五力模型、PEST分析、波士頓矩陣等模型
收集數據通?？梢詮膬炔繑祿屯獠繑祿碓磸V泛獲取然后結合分析。
內部數據來源：市場營銷數據、產品后臺數據、其他相關報告等。
外部數據來源：政府部門、國際組織、行業協會、專門調研機構、聯合服務公司、其他大眾傳播媒介、商會、銀行等金融機構、官方和民間信息機構等。
定性研究是指通過收集、分析和解釋那些不能被數量化的信息，來挖掘問題、理解事件現象、分析人類行為與觀點的方法，主要作用是探索“可能性”。
定性研究專注于更小但更集中的樣本，通過非結構詢問和觀察來獲得不能量化的信息。
流程如下：
常用的定性研究方法：
我們需要明白訪談適合哪一種項目研究，比如要針對新功能進行一次面訪。
接下來我們需要進行用戶的招募，因為面訪比較耗費時間和精力，所以最好準備一些禮品，否則很難招募到用戶。招募用戶的渠道可以是產品中投放問卷、社群招募等方式來邀約難度用戶。
用戶訪談環境，準備一個安靜的房間，準備好水、紙、筆、錄像、錄音筆等工具。
整理訪談內容，每訪談完一位用戶進行一次小結。
接下來模擬一次用戶訪談的整個流程：
開場：首先介紹一下自己的情況，并且讓用戶了解這次訪談的目的，建立一個輕松的談話氛圍。
探索：針對研究目的進行探索，比如目的是做用戶體驗地圖，了解用戶在使用過程中遇到的問題。
注意：如果直接問平時怎么使用我們的產品，用戶會比較懵。這個時候最好給他一個確定的環境，比如你能不能演示一下你平時是怎么管理貨源的，這個時候他就明白原來需要我進行這樣一個任務。
觀察：在用戶回答提問和操作演示中，查看用戶碰到了什么難題。比如有超過一半的用戶多次點擊一個按鈕，說明這個按鈕設計的大小不太合理。
思考：深層次挖掘。比如用戶反饋字太小，但實際操作中并沒有瞇著眼或更靠近屏幕，可能原因一是他們本身就把手機屏幕文字調為最大，二是信息排布過于密集，效率低，并非因為字小。
定量研究是指確定事物某方面量的科學研究，將問題與現象用數量來表示，進而分析和解釋，從而獲得意義的研究方法。定量研究的數據分析，主要作用是回答“多少”的問題。
定量研究的意義：
用一個數值來表示你產品的可用性。數值有時比質量檢測的結果和視頻更有說服力（特別是當你試圖說服像高管或客戶這樣的人）時。
比較不同的設計（比如，你的產品的新舊版本，或者是你的產品與競爭對手的產品相比），并且確定你觀察到的差異是否具有統計學意義，而不是隨機的。
改進用戶體驗權衡決策。比如，如果預期的設計改進成本很高，那么它值得做嗎？定量研究方法可以幫助你驗證重新設計是否值得。
常用的定量研究方法包括：可用性研究、A/B Test、問卷調查和滿意度調查。
測試的重點是收集數據指標，比如任務時間或者成功率，一旦你收集了相對較大的樣本量（大約35個或者更多），你就可以使用它們來跟蹤產品的可用性，或者將其與競爭對手產品的可用性進行比較。
在A/B測試中，團隊需要創建同一界面的兩個不同的最新版本，然后將每個版本展示給不同的用戶，用來確定哪個版本的性能更好。基于分析的實驗，對于決定同一個設計的不同變體非常有用，并且可以結束團隊關于哪個版本最好的爭論。
問卷調查是一種靈活的用戶研究工具，調研時可以同時獲得定量和定性的數據，比如評分、多項選擇題中的答案的比例，再加上開放式問題的答案。你甚至可以把對調查的定性回答轉化為數字數據。
問卷的一個優點是：可以經常將你的調研結果與行業或競爭者的分數進行比較，看看你做得怎么樣。即使你創建了自己的自定義問卷，也可以隨時間的推移對自己產品平均分數進行追蹤，來監控產品的改進情況。
可以根據你的研究問題進行定制，這些方法通常會首先讓參與者接觸到產品（通過向他們展示靜態圖片或者要求他們使用現場產品或原型）。然后，要求用戶通過從描述性的詞語列表中選擇一個來描述當前設計。
如果你獲取自身目標用戶的樣本量足夠大，那么整體趨勢就會顯示出來。例如，你可能會有84%的受訪者將此設計描述為"最新"。
比如這次改版用戶對新版本的滿意度怎么樣。只有確定了目標，你的問卷才是有價值的。
因子分析法要求調查數量是調查問卷問題數量的5-10倍，因此，如果調查問卷中共有20個問題，那么調查樣本數量可以大概確定為100～200個，有效回收樣本30份即可。
問題順序的基本原則
往前放：
熟悉的問題
簡單的問題
引起興趣的問題
往后放：
開放式的問題
個人背景資料
簡潔明確：
?你用了多久的Google map？（?）
?你第一次使用Google map是什么時候？（?）
這兩個問題看似類似，但是當用戶在思考的時候，第一個問題顯然會思考更多的時間，用戶很可能在想，是想知道我第一次用的時間，還是我用了多久的時間。
中立、無誘導性：
?你喜歡這個功能的設計嗎？（?）
?請您對這個功能的滿意程度進行一個打分，最低1分最高5分？（?）
避免使用帶有引導性的問題，問用戶是否喜歡、是否滿意，這樣通常用戶都會偏向于回答喜歡。
設置選項時，要做到：
定量分析的結果多以數據、模式、圖形等來表達。
?眼動追蹤，英文Eye Tracking，是指通過測量眼睛的注視點的位置或者眼球相對頭部的運動而實現對眼球運動的追蹤。
眼動儀是一種能夠跟蹤測量眼球位置及眼球運動信息的一種設備，在視覺系統、心理學、認知語言學的研究中有廣泛的應用。
注視分析——分析注視軌跡、先后順序與流暢度
注視熱點圖——分析最關注區域和忽視區域
興趣區分析——分析平均注視時間與各興趣區注視順序
通常需要輔助測試（如定性訪談）來收集更多實驗數據
?腦電研究，大腦活動時，腦內億萬神經元活動引起頭皮表面的電位變化，含有大量心里信息，測量腦電信號可繪制腦電圖，以不同波形反映出來。
利用生理探測技術，研究用戶對產品的情緒反應
相比傳統調研，更加能夠排除從眾行為、事后回憶偏差、社會贊許效應等的干擾
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
很多網站在短時間內就取得了巨大的進步 —— 那些過去十年里最知名的品牌網站，與第一次迭代相比發生了很大的變化，這令人感到無比驚訝。
網站最初用于商業目的時，人們并沒有過多地關注用戶體驗。過去的目的是將盡可能多的內容塞進一頁里?，F在，設計師們通過大量研究、數據挖掘和優化等方式來吸引用戶的注意力，同時在正確的時間提供合適的內容、功能和選項。
越來越多的公司正在采用先進的心理學研究，以推動用戶參與更多的互動和付費項目，這一現象使得曾經被認為是一門藝術的東西轉變成了一門科學。
1997 年的 Apple 網站
除了許多必要的元素之外，好的設計總是會考慮到用戶的情感和心理需求。讓我們來看看什么是「說服式設計」，并探索如何將影響人類行為的心理過程應用到設計中。
“說服” 這個詞往往與操縱、欺騙相關聯，尤其是對一個善于使用「互聯網陷阱」的設計師來說。但是，我們要明確一點，說服式設計中的 “說服” 并不是這個意思。說服式設計可以使網站易于使用，從而改善用戶體驗。因為，說服式設計是源于對心理誘因、用戶行為的理解和運用。
（互聯網陷阱：興于 2010 年，由當時英國用戶體驗咨詢師 Harry·Brignull 首次提出，指的是網站或應用程序采用誘導性或脅迫性設計，迫使用戶采取或不采取某種行動）
例如，亞馬遜就很好的運用了說服式設計，它通過推薦其他產品和配件，以及展示 “查看過此商品的顧客也購買了某物品” 的選項，引導用戶繼續購買更多商品。為了快速完成銷售，他們還為購物者提供了一鍵購買商品的功能。
亞馬遜運用說服式設計的案例
我們都一直在花費大量時間上網，設計師可以利用從線下行為中學到的知識來創造更好的用戶體驗。無論你是想優化現有網站還是構建應用程序，說服式設計都將引導和支持用戶的在線體驗。
設計師要如何利用心理學的研究成果來增強其設計的影響力呢？
理解心理學原理可以讓你對工作的基本原理有更透徹的理解。它可以：
讓我們來討論一些心理學理論。
作為人類，我們天生就需要控制。這可以追溯到我們最本源的需求。在劃分需求層次時，心理學家亞伯拉罕·馬斯洛（Abraham Maslow）在提出需求層次時，將我們最基本的需求命名為：健康、食物和睡眠。所有這些都需要我們對環境進行一定程度的控制。
馬斯洛需求層次
作為 UI 設計師，我們需要確保用戶在我們為他們創建的環境中擁有積極的體驗。這就意味著需要通過提供合適的工具來增強用戶的能力，以幫助用戶在產品的使用過程中獲得控制感。
“今天，你可以調整屏幕的亮度，禁用通知，并可以決定手機是否應該同時連接蜂窩數據和 Wi-Fi …… 即使這些調整只會將手機的電池壽命延長幾分鐘，但這種可以掌控一切的成就感也會使用戶感到溫暖?！?-- 用戶體驗顧問 Nadine Kintscher
我們需要創建能夠平衡功能和視覺吸引力的界面，并將掌控權提交給用戶，以便他們有更滿意的體驗。
澳大利亞房地產搜索網站 Realestate 成功的做到了這一點，它讓用戶能夠根據自己的偏好篩選所有房產，并讓他們可以選擇按不同的標準進行排序。
澳大利亞房地產搜索網站 https://www.realestate.com.au
我們該如何設計一種數字體驗，才能使用戶在適當的時候進行所需的行為？這需要了解一個簡理論 -- 「福格行為模型」：一個人行為（Behavior）的發生需要滿足至少三個條件，動機（Motivation）,能力（ability）和誘因（trigger），用公式表示即 B = MAT，這三者必須同時具備，缺少任一條件都不會導致行為的發生。對于任何試圖實踐勸導心理學的人來說都是理想的選擇。理論表明，一個行為得以發生，行為者首先需要有進行此行為的動機和操作此行為的能力，接著，如果他們有充足的動機和能力來實施既定行為，他們就會在被誘導時進行此行為，預期的行為就會發生。
（福格行為模型：由斯坦福大學「說服技術研究實驗室」Persuasive Technology Lab 創始人 BJ Fogg 研究而來）
動機 -- 人們做出這一行為的原因是什么，做出這一行為的原始動因是什么；
能力 -- 人們做出此行為需要滿足什么能力，人們是否有條件來完成這個行動或者做這件事；
觸發 -- 是什么誘發用戶會做出這個行為，什么因素會導致用戶會完成這個。
福格行為模型（https://behaviormodel.org/）
尼爾·埃亞爾（Nir Eyal）和瑞安·胡佛（Ryan Hoover）合著的書籍《上癮》中曾提到過 福格行為模型，揭示了很多讓用戶形成習慣，甚至“上癮”的互聯網產品服務背后的基本設計原理，告訴你怎樣打造一款讓用戶欲罷不能的產品。作者根據自己多年的研究、咨詢及實際經驗，提出了新穎而實用的 「上癮模型」（Hook Model），即通過四個方面來養成用戶的使用習慣。通過連續的“上癮循環”，讓用戶成為“回頭客”，進而實現循環消費的終極目標，而不是依賴高昂的廣告投入或泛濫粗暴的信息傳播。
上癮模型
一個很好的例子是 TurboTax，在《為心靈設計：勸導式設計的七個心理學原則》一書中討論過。
即使交稅不會使我們感到開心，我們仍有很強的動力來報稅。然而，與其他所有國家一樣，美國的稅收制度過于復雜，難以理解。TurboTax 在書中提到，使用戶能夠通過詢問基本問題更輕松地完成納稅，可以有效的提高用戶的納稅能力。在 TurboTax 的設計中，他舍棄了冗長的文檔，相反，創建了一個工作流，使用戶可以進行簡單的逐步操作。最終便捷的操作方式會成為誘因，使用戶愿意嘗試在線提交稅款。
TurboTax 設計的報稅系統
用戶有充足的動機和能力，同時又具備誘因，三個要素完美結合的情況可能會讓人感到過于理想或不自然。事實上，其中某一因素占比多也沒關系。發微博就是一個很好的例子，沒有什么重要事情的話，發微博的動機可能很低，大多都是瀏覽；但觸發因素隨時都可能出現，提醒你可以開始行動了，可能是一個轉發抽獎的活動、可能是朋友正好生日；同時，發微博的操作非常便捷，用戶具備能力隨時都可以發布。
作為設計師，我們可以使用該理論來檢查是否為用戶建立了足夠的動機和能力，并提供誘因來引發他們的行為。
以上兩種理論（控制感，以及 動機、能力和誘因）都需要進一步的研究，它們在設計界面時非常有用。
或者，有一些更簡單的心理學理論，不需要較復雜的研究，即可用到你的設計中，比如 稀缺 和 害怕錯過（FOMO -- Fear of Missing Out）的概念。
亞馬遜在商品上增加 “只剩下 1 件存貨” 強調庫存不足，使用 FOMO 加強緊迫感
幾十年來，心理學家一直對人們保持注意力的能力不斷下降而感到困擾。
眼動追蹤已經存在一段時間了，它主要用于測量用戶注視某一點的位置和持續時間。研究表明，互聯網的平均注意力持續時間不到幾秒鐘，用戶會立即做出有關網站的決定，如果不適合，就會離開。
數據驅動的設計（https://www.eyequant.com）
EyeQuant 將這一想法向前推進了一步，利用眼球追蹤數據構建了一種預測算法。你無需自己進行眼動測試，而是將設計上傳到他們的網站，他們會告訴你用戶在使用你的網站時關注點在哪些地方。
他們找了德國的參與者，并利用這些參與者建立了一個龐大的數據庫，該數據庫包含了大量吸引用戶注意力的內容和不吸引用戶注意的內容。研究發現，高對比度色彩比較容易吸引用戶，表情和粗體的文字也是如此。
眼動追蹤軟件可能很昂貴。取而代之的是，諸如 Sumo Heat Maps 的在線分析軟件，可用于顯示訪問者單擊的內容和位置，以及吸引最多注意力的內容。然而，請記住，雖然我們可能會抓住大腦的注意力，但我們也有可能會把用戶從更重要的事情上拉走。
使用眼動追蹤或熱力圖可以使設計人員立即獲得有關其設計的客觀反饋。作為設計師，它可以用作用戶體驗想法的驗證，并為你的設計決策提供數據，允許你通過 A / B 測試來優化設計。
眼動追蹤可獲得用戶行為的客觀反饋
你是否曾經注意到人類天生會有模仿他人的欲望？一個人的欲望也會促成他人的欲望。這種理論是由勒內·吉拉德（Rene Girard）提出的，理論認為，如果某人表現出對某件物品的渴望，你也會渴望得到這件物品。廣告商就是利用這一方式促成人們對某物的渴望，顯然，廣告成功的激發了人們更多的欲望。
你我都是模仿生物。Darren Bridger 的《神經設計》一書就探索了這一理論，研究發現我們有一個鏡像神經元系統。換句話說，僅看到某人執行某項操作（例如撿起一件物品）就會使你的大腦反映出該活動。
模仿一詞的英文解釋
模仿欲理論意味著如果我們看到別人擁有某樣東西，我們便也想擁有 —— 這一點可以用 「社會認同」（或從眾心理）來解釋。
一種社會認同是來自 “用戶的認同”，就像是推薦。推薦之所以有效，是因為它們來自擁有共同愿望和價值觀的人。例如，專門為企業家服務的媒體 Foundr 不僅使用用戶的聲音，而且還顯示人臉，從而觸發了鏡像神經元系統。
Foundr 專門為企業家提供媒體服務
另一種社會認同是來自 “專家的認同”，即你的產品獲得了專家的認可，例如你的產品被 Twitter 提及、新聞引用、甚至有大 V 專門為你的產品撰文。Google 在其最新的 Pixel 手機廣告系列中使用了這種技巧，用 Google 自身的品牌影響力作為最強力的背書推薦這款手機。
僅僅強調這款手機是 Google 出品，無須多言
對于設計師來說，現在是一個令人激動的好時代 -- 有豐富的資源和研究可以支撐我們的工作。
設計趨勢正在向體感，語音、虛擬現實（VR）、增強現實（AR）、混合現實（MR）和物聯網（IoT）轉變；隨著這些交互技術的不斷發展，人們需要以更直觀的方式來使用界面。
我們將迎來許多新的設計機會，而心理學將在其中發揮著重要的作用。
下一個我們日常生活中與設備交互方式的重大轉變，將從觸屏變為使用腦電波交互。該技術已經可用，使人們能夠通過思想直接控制其設備。
隨著我們逐漸接近人們的真實想法，心理學在設計中的應用以及設計師的道德責任將發揮越來越重要的作用。
除了使用分析法、用戶研究、用戶體驗地圖和其他方法來幫助做出設計決策并迭代產品外，設計師還應考慮使用上述四種有說服力的設計方法來完善其 “技巧工具包”。
有說服力的設計并不邪惡。它是一種工具，并且像任何工具一樣，它可能被濫用。然而，通過正確的研究和深思熟慮的應用，它可以成為任何設計師工具箱中的寶貴補充。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
前兩篇，探討了個人對交互設計價值觀的理解，以及其對從業者和用戶的價值。
這一篇，我們就來探討一下，如何做到之前提到的 4 點價值觀。
先從“周到“開始。
僅為一家之言。歡迎留言交流，說出你的看法。
本著嚴謹的態度，先捋一捋概念。
常言道，金杯銀杯，不如百姓口碑。
同理，周不周到，最終還是用戶說了算。那用戶是怎么評判的呢？通常是憑主觀感受。
拿上篇文章中網易號文章編輯頁面的例子來說，因為“保存”和“存草稿”功能做的不夠好，所以給筆者留下了不夠周到的印象。
翻譯過來，就是，一些體驗細節，影響了用戶的印象。
《設計師要懂心理學》這本書中有條原則，叫“整體認知主要依靠周邊視覺而非中央視覺”。
講的是視覺和 UI 層面的用戶認知。就是說，用戶會關注并不顯眼的邊邊角角的設計，而且這些邊邊角角的設計會影響用戶對整體設計的認知和印象。
舉個例子。假如說，微博信息流頁面的掃一掃圖標，在風格、大小等方面和其它圖標不統一，就會給用戶留下比較糟糕的印象，用戶很可能會覺得微博的設計不夠專業。
這些是 UI 設計層面的。在交互設計層面，也是類似的道理：體驗細節會影響用戶的認知。
總的來說，至少在常用的交互細節上，不要給用戶留下負面印象，也不要讓用戶產生負面情緒，避免所有的不周到，才算是周到。
個人覺得，最關鍵的地方，是滿足好小需求。
啥是小需求？
個人觀點，籠統的講， 小需求是一種共性需求， 主要是一些體驗細節。比如信息的分類與展示、銜接不同頁面的各種彈窗與提示、對各種狀態的提示、對各種情況的到位解釋，等等。
有小需求，就有大需求。
所謂大需求，更多是一種個性需求， 不同的產品，會有不同的大需求。比如短視頻產品，它的大需求會包含視頻的拍攝、上傳、播放等；資訊類產品，它的大需求則包含文章的撰寫、編輯、發布、查看等。
工作經歷，筆者見過一些交互設計不夠周到的產品。它們的共同特點就是： 大需求基本上得到了很好的滿足，小需求沒有得到很好的滿足。
這一大段，就圍繞如何更好的滿足小需求來展開。主要建議如下。
筆者有個客戶，是從事教育行業的，之前并沒有接觸過互聯網行業的產品與設計工作。
這位客戶找到筆者的時候，是想要設計一款小程序的界面。當時客戶非常自豪的對筆者說，這個（原型）是我用墨刀畫的，現學現做。
說起墨刀，本人也用過。和 Axure 相比，確實好用太多，在簡潔性和智能性方面，感覺和 Sketch 有異曲同工之處。
關于墨刀如何好用，網上已經有太多溢美之詞。筆者就結合自己的使用經歷，簡單總結一下：
1 好用，上手快。零基礎，只要會操作常用辦公軟件，簡單學一下就能上手
4 能查看頁面之間的跳轉邏輯。借助工作流功能，可實現這一點
以上主要是墨刀自身的優點。結合本段主題，我們再探討一下，對于日常工作，墨刀這把利器有哪些優勢。
1.1 可以把更多精力花在創作上
當我們不會用一款工具時，通常會有一些挫敗感。如果必須要用，接著很可能就會有一點焦灼了。
而墨刀，基本上不會讓我們體會到這些感覺。
我們也不用花無謂的時間去學習一些艱難的高深的技法，而是可以把更多的時間花在“創作”這件事上。
1.2 可以更好的去滿足小需求
部分公司，可能面臨如下情況。
公司沒有專門的交互設計師，產品的原型由產品經理來畫。產品經理本身還兼任項目經理。
如果項目又特別趕，客觀上，產品經理確實沒有太多時間去關注交互的體驗細節。
主觀上，如果產品經理對這些交互細節的興趣或重視程度不足、同時產品經理上面的決策層也不去抓這些體驗細節，最終的結果，就是產品的原型上可能會丟失很多體驗細節。
筆者就有類似的經歷。
一款 App，產品經理用 Axure 畫的原型。評審或宣講需求的時候，大家都是在電腦或會議室大屏幕上來看這個原型，同時所有人最先關注的是大需求。
理解完大需求，會有部分同學就大需求提出自己的看法或建議。最后，才會有部分同學就小需求指出不足并提出建議。
受限于職責、時間等各種因素，大家也不可能針對小需求提出太多建議。結果就是，仍然會有相當數量的小需求被遺漏，或者沒有被很好的滿足。
墨刀有兩個功能，可以較好的規避這些問題。一個是工作流功能，一個是手機端預覽功能。
工作流功能，類似流程圖，即把所有頁面以合乎邏輯的方式鏈接起來?？陀^上，會促使我們畫出所有包含小需求的頁面，包括彈窗、狀態提示等。
支持多人的手機端預覽功能，使得我們在手機上，可以通過點擊等方式來模擬體驗這款 App。這樣的環境下，我們會更容易理解大需求，也更容易發現小需求存在的問題。
所以，個人的建議，就是用墨刀來畫原型，同時把工作流和多人手機端預覽（針對 App、小程序）這兩項，作為硬性標準。
一款產品，在體驗或使用時，非常容易發現問題。
因為這時候，我們可以松弛下來，把自己切換成普通用戶。忘掉所有費腦子的需求和設計原理，只依賴經驗和直覺來用這款產品。我們的主觀感受，會告訴我們，這款產品的交互，到底周不周到。
據陸樹燊的《微信團隊的實驗室文化》一文顯示，張小龍評審微信的功能，不看原型圖，不看設計稿，也不看 Demo，而是體驗前后臺代碼開發好后的產品。這就意味著，如果一個功能在給到用戶前有 N 個方案，就會有 N 個方案對應的前后臺代碼。
一定程度上，微信團隊就是通過這種在正式發布前反復試錯、不斷打磨的方式，最終給用戶提供了優秀的交互體驗。
估計，絕大部分團隊和公司，都做不到微信這樣，開發 N 個版本，并去一一體驗和比較這 N 個版本。
無法體驗已經開發好的 N 個版本。但是，在真實的設備上體驗 N 個原型，我們還是可以做到的。
原型雖然沒有開發好的產品那么順暢和流暢，但是，如果用墨刀在手機端體驗一款加了鏈接和動效的 App 原型，一樣可以發現很多問題。
不過，根據經歷和觀察，筆者發現，我們人類，是不喜歡體驗原型的。
想一想，平常工作中，我們可能會樂此不疲的去體驗開發好的測試版產品。但對于原型，大部分時候，都是匆匆忙忙就過掉了。
個人有個猜測，就好像人類喜歡逗貓遛狗、卻不太喜歡逗桌子上的模型貓和模型狗一樣，我們人類是不太愿意花費太多時間和精力去和原型這種“假產品”互動的。
所以，某種程度上，體驗原型，是一種反人性的行為。
但卻是一種非常經濟和高效的方法。
因為首先，大部分時候，我們都是先選中一個原型方案，然后去設計、去開發；其次，等到開發好進入測試環節，這時候，原型往往就成了測試的標準，依靠測試來優化原型是不現實的。
所以，結合現狀，綜合來看，小需求能不能得到很好的滿足，很大程度上還是要依靠原型。
也就是說，很有必要對原型進行優化。具體方法，就是在真實的設備上體驗原型、反復體驗、多人體驗，并進行相應優化。
如前所述，用利器來創作原型，反復在原型里體驗產品，這些強調的是內部力量，即自身的努力。
下面，再談一談外部力量，即外界海量的知識與經驗。
說起外界知識，除了直接參考其他產品的設計以外，大家參考最多的，可能就是《iOS Human Interface Guidelines》和《Material Design》這些設計規范了。
根據筆者的實際經驗，這兩個來自蘋果和谷歌的設計規范，很多時候，我們都是拿它們當字典用。即哪一點不會或不太確定的時候，去翻一翻查一查。
雖然這倆規范很優秀，但是卻很難被我們“物盡其用”，因為它們的知識體系過于龐大，有點像一本字典。拿著“字典”里的每一條原則去檢驗我們的交互設計，這是很難做到的。
但是有一個設計規范，去非常適合拿來檢驗我們的交互設計，那就是尼爾森十大可用性原則。
太詳細的就不贅述了，這里我們再簡單回顧下這十條原則。
1) 狀態可見
用戶時刻清楚，正在發生什么
2) 環境貼切
營造一個用戶熟悉的環境，比如語言、詞語、圖標等
3) 用戶可控
控制權交給用戶，并且多數時候，考慮支持撤銷重做
4) 一致性
方方面面的統一，比如文案、視覺、操作等
5) 防錯
盡最大可能，幫助用戶，避免用戶犯錯
6) 易取：識別比記憶好
通過把組件、按鈕等元素可見化，降低用戶記憶負擔
7) 靈活高效
優先考慮人數最多的中級用戶，同時兼顧高級和初級用戶
8) 易掃：優美且簡約
閱讀體驗要好，掃視體驗也要好；保持簡約和美觀
9) 容錯
幫助用戶識別、診斷，并從錯誤中恢復
10) 人性化幫助
日常的使用最好脫離幫助文檔，但有必要提供幫助文檔
個人非常建議，在日常工作中，把尼爾森十大可用性原則作為一把標尺，來時時刻刻檢驗我們的交互設計。
交互設計，在涉及體驗細節的小需求上，避免所有的不周到，方才是周到。
用利器創作原型，要包含流程圖；多體驗原型或產品，以體驗結果為準、而非討論結果為準；參考優秀的設計規范，用尼爾森十大可用性原則來檢驗原型。
以上三點，可以幫助我們做到交互設計的周到。
其中，個人認為，最為核心的是第二點：多體驗原型或產品，直到自己覺得周到為止。
因為，正如電影《霸王別姬》的一句臺詞所說：人，得自個兒成全自個兒。
最近有同學問老王，UI設計師是不是需要交互設計能力？
當然需要，不懂交互的UI不是好UI~
首先UI設計不僅僅需要把功能需求可視化，還需要注重用戶體驗。所謂用戶體驗，其實就是用戶與頁面的交互。而在交互設計中有很多的方法和理論，如格式塔心理學、尼爾森可用性原則、7+2法制、3次點擊法制、功能可見性原則、菲茨定律等。他們大多的方法也是共同的。
所以呢，今天老王來說說交互設計用的最多的原則——尼爾森十大可用性原則。
很多情況用戶是不知道當前狀態的，所以在適當的時間內做出反饋很重要。不僅能讓用戶知道情況，還能防止用戶發生錯誤操作。常見反饋有刷新提示、新頁面加載提示、支付提示、下載提示。除了結果反饋提示外，對于進程中的頁面會用進度條進行表現。
今日頭條APP首頁中，看過的文章標題變為了灰色、而沒讀過的文章標題依舊保留了黑色字體。
簡單來說就是讓軟件看起來跟符合真實世界，還原現實認知。通過直觀的視覺快速傳達給用戶。
音樂軟件通過模擬現實唱片并結合旋轉的播放動畫，從而降低了學習成本，更輕松的理解界面。
說白了就是給用戶發后悔藥，當用戶誤操作時要給用戶提供提供撤銷、取消、重做等相關功能。買錯商品可以無條件包郵退回。
拼多多凸顯了“退貨免運費”“7無理由退回”服務，解決了用戶買到不滿意產品的售后擔心。減少了承擔運費的成本，從而促使了用戶快速下單。
一個好的產品從視覺上首先是統一的，色彩、字體、元素保持統一，能加強用戶的記憶力。在交互中同樣如此，頁面結構、操作反饋都需要保持一致性。
QQ首頁列表中不管你點擊那一條目，下一級界面都是由右往左滑出。點擊左上角返回按鈕，會從左往右滑回，體驗完全一致；幾乎所有產品進入下一層級頁面的交互方式都是如此。
為了減少用戶錯誤的可行性，進階是給出錯誤反饋是不夠的，用心一點的設計師其實會發現很多的產品是這樣做的。為了防止錯誤的發生，會進行防錯設計。
比如在發朋圈時，點擊返回按鈕出現的提示彈窗。彈出框方式會增加不可逆操作的難度，減少操作刪除帶來的順勢。更人性化的是，提示給出了保留和不保留按鈕選擇，選擇保留退出還可以再次編輯。
通過把組件、按鈕及選項可見化，減少用戶的記憶負荷，讓使用更輕松。在使用過程中不需要記住上一頁面的信息就能完成當前頁的操作。
通常更新完APP之后，會出現新功能引導。引導提示能告訴用戶新功能所在的位置和作用。這也是協助記憶原則的體現。
好的產品不僅僅需要滿足新用戶，還需要滿足深度用戶。保證第一次使用者，能清晰明白功能。對于老用戶需要提供更高效使用方式。
對用戶重復使用的功能，提供便捷按鈕。比如叮咚買菜的再次購買。
適當的留白能讓頁面功能突出，也能讓視覺更加舒服。精致的圖形元素能給用戶留下好的印象。
很多K12的產品會運用IP形象進行延展，不僅強化了品牌記憶力，更增強了互動感。
好了，以上就老王對尼爾森十大原則的解析。其實原理很簡單，甚至很多都是很直觀的廢話，但如果不把它們一條條列出來，還是有很多人連這些廢話都做不到。
關注細節，才能成就大事！
一、什么是交互設計？
先來看一下百度百科的定義
交互設計（英文Interaction Design, 縮寫IXD)，是定義、設計人造系統的行為的設計領域，它定義了兩個或多個互動的個體之間交流的內容和結構，使之互相配合，共同達成某種目的。交互設計努力去創造和建立的是人與產品及服務之間有意義的關系，以“在充滿社會復雜性的物質世界中嵌入信息技術”為中心。交互系統設計的目標可以從“可用性”和”用戶體驗“兩個層面上進行分析，關注以人為本的用戶需求。簡而言之，交互設計是解決特定場景下的人群如何高效使用機器或軟件的目標行為。
為什么要做交互設計
在使用網站，軟件，消費產品或各種服務的時候（實際上是在同它們交互），使用過程中的感覺就是一種交互體驗。隨著網絡和新技術的發展，各種新產品和交互方式越來越多，人們也越來越重視對交互的體驗。當大型計算機剛剛研制出來的時候，可能為當初的使用者本身就是該行業的專家，沒有人去關注使用者的感覺；相反，一切都圍繞機器的需要來組織，程序員通過打孔卡片來輸入機器語言，輸出結果也是機器語言，那個時候同計算機交互的重心是機器本身。當計算機系統的用戶越來越由普通大眾組成的時候，對交互體驗的關注也越來越迫切了。因此交互設計作為一門關注交互體驗的新學科在二十世紀八十年代產生了。
從用戶角度來說，交互設計是一種如何讓產品易用，有效而讓人愉悅的技術，它致力于了解目標用戶和他們的期望，了解用戶在同產品交互時彼此的行為，了解“人”本身的心理和行為特點，同時，還包括了解各種有效的交互方式，并對它們進行增強和擴充。
通過對產品的界面和行為進行交互設計，讓產品和它的使用者之間建立一種有機關系，從而可以有效達到使用者的目標，這就是交互設計的目的。
二、交互設計常用原則和定律有哪些？
尼爾森十大可用性原則
1、狀態可見原則
系統應該讓用戶時刻清楚當前發生了什么事情，也就是快速的讓用戶了解自己處于何種狀態、對過去發生、當前目標、以及對未來去向有所了解，一般的方法是在合適的時間給用戶適當的反饋，防止用戶使用出現錯誤。
即在用戶操作界面功能時給予實時反饋，例如：頁面加載狀態提示、按鈕點擊后的狀態變化、進度條提示等。
2、環境貼切原則
設計的一切表現和表述，盡可能貼近用戶所在的環境，將現實環境的操作功能巧妙的轉化為線上功能，使其貼近用戶。使用用戶能聽懂的專業術語，涉及到專業化語言時要轉化成用戶熟悉的語言。
即模擬真實的事物，使用戶更容易理解。例如：天氣應用中的天氣插圖、音樂播放器的膠片都是生活中熟悉的場景和物品，降低理解成本。
3、操作可控原則
對于用戶的誤操作，提供二次確認或者撤銷的功能，這樣可提高用戶的操作可控性。
例如：刪除聯系人二次確認提示、消息可撤回操作。
4、一致性原則
遵循統一的產品設計規范／邏輯。這里的一致性包含產品和跨平臺產品之間的一致性。
一致性包含視覺交互、文案描述、組建樣式等，例如：微信小程序設計規范。
5、防錯原則
設置防錯的機制，減少用戶犯錯。在用戶選擇動作發生之前，就要防止用戶容易混淆或者錯誤的選擇。
例如：用戶名稱校驗提示、手機號碼位數限制等。
6、易取原則
減少用戶記憶負荷，在適合的時機給用戶需要獲取的信息。
例如：驗證碼讀取、找人轉賬提示等。
7、靈活高效原則
提供靈活的操作和高效的獲取信息能力。
例如：手機號碼一鍵登錄、消息關鍵字識別等。
8、優美簡約原則
保留產品最主要的信息，如果不是優先級最高，要盡一切可能避免去影響產品的簡潔和美觀。
9、容錯原則
用戶在使用產品過程中出現了問題，及時準確的告知用戶出現問題的原因。
例如：信息輸入提示、搜索無結果等。
10、提供人性化幫助
在用戶需要的時候提供必要的幫助說明。
例如：新功能引導、解釋說明文案等。
七個交互設計定律
1、菲茲定律
點擊一個目標的時間同以下兩個因素有關：
（1）設備當前位置和目標位置的距離（D）。距離越長，所用時間越長；
（2）目標的大小（S）。目標越大，所用時間越短。
該定律經常運用于鼠標從點A到點B的運動。
例如常用按鈕的尺寸設計等。
2、?？硕?
一個人面臨的選擇（n）越多，所需要作出決定的時間（T）就越長。
交互設計中要合理設置選項，以免用戶使用中決策時間過長，降低使用效率。
3、米勒7±2定律
喬治米勒對短時記憶能力進行了定量研究，他發現人類頭腦最好的狀態能記憶含有7（±2）項信息塊，在記憶了 5-9 項信息后人類的頭腦就開始出錯。
例如：手機號碼的分位顯示、應用中標簽欄數量等
4、鄰近性法則
人們通常將距離近的事物劃分為一組。
界面設計中可以用對象間的相對距離來區分信息層級。
5、復雜性守恒定律
每個應用程序都具有其內在的、無法簡化的復雜度。無論在產品開發環節還是在用戶與產品的交互環節，這一固有的復雜度都無法依照我們的意愿去除，只能設法調整、平衡。
例如：在智能手機出現之前，手機上的操作按鈕都是實體按鈕。在智能手機出現手，手機被整個屏幕占據后，所有的操作都集合在了手機系統之中，等于把物理操作轉移到了系統操作中，其本身的功能復雜程度并沒有發生改變，只是轉移了而已。
6、防錯原則
大部分的意外都是由設計的疏忽，而不是人為操作疏忽。因此，在設計中要有必要的防錯機制；在此，特別要注意在用戶操作具有毀滅性效果的功能時要有提示，防止用戶犯不可挽回的錯誤。
例如：登錄時用戶名校驗，手機號碼位數限制等。
7、奧卡姆剃刀原則
“切勿浪費較多東西去做，用較少的東西，同樣可以做好的事情。
”這個原理稱為“如無必要，勿增實體”，即“簡單有效原理”。
在設計中可以使用戶關注最主要的信息而非其它無關緊要的事物，從而提升使用效率。
三、交互設計如何開展工作
首先在交互設計師拿到需求后不要急著打開軟件開始繪制線框圖，而是要先分析需求，了解產品的戰略層和范圍層的業務目標。把握產品設計大方向，只有方向對了后面的工作才是有價值的。
把握了產品方向，下面就該進行需求的分析，
首先針對需求考慮5個問題：
1、為什么要做這個功能？（業務需求）
2、產品期望得到怎樣的成果？（業務目標）
3、誰來使用？（目標用戶）
4、他們要怎樣使用？（用戶需求）
5、如何讓他們都來使用？（將業務目標轉化為用戶行為）
清楚這5個問題后，再根據交互設計流程進行一步一步的進行
這實際上就是對需求的戰略層分析。
我們進一步分析業務需求（業務目的、業務目標）和用戶需求（目標用戶、用戶體驗目標），把握關鍵因素（用戶的動機、擔憂和影響目標達成的障礙）。
歸納這些需求，明確設計策略。
將“業務目標”轉化為“用戶行為”，通過引導用戶的使用來幫助產品實現目標。
從設計“用戶行為”到設計“用戶界面”，用戶行為決定了用戶界面，用戶界面也導致了用戶會出現什么樣的行為。
設計需求分析方法就是要幫助用戶創造動機、排除擔憂、解決障礙。
四、如何進行用戶研究，方法有哪些
評估的形式及方法
常見的評估形式分為三類：
1、評估主體：根據評估的主體不同來進行區分，即誰來做評估。
按照評估主體來區分主要有兩個主體：用戶和專家
用戶評估主要靠收集用戶使用數據，也就是用戶測試，它的數據相對客觀，但時間和費用較多，評估范圍較窄。
專家評估是讓工程師及設計師等專家基于自身的專業知識和經驗進行評估的一種方式。專家評估相對主觀，但費時少、費用少、評估范圍窄。
兩種評估方法可以相互補充，并結合使用。
2、評估性質：例如定性評估、定量評估或著其它方式。
按照評估的性質來區分可以分為定量評估和定性評估。
定量評估是指對可以計量的部分進行評價，如點擊量、使用率等，可以用數據來說明。
定性評估是指對非計量性的部分進行評價，如流暢度、舒適性、創造性等進行評價。它只能表示一個度，無法準確用數據來說明問題。
3、評估過程：按照評估的過程來進行區分。
從評估的過程來區分可以分為理性評估和感性評估。
理性評估相對客觀，從客觀的角度出發判斷客觀事物。
感性評估更為主觀，評估結果并沒有客觀規律。
在實際應用中也需要將理性評估和感性評估結合使用，才能完整的完成我們的任務，達到我們的目標。
常見的評估方法有四種：
1、原型評估方法：在產品研發過程中，對于界面設計以及程序的測試來獲得用戶的反饋是至關重要的。以用戶為中心和交互式設計的重要因素之一就是原型方法，原型方法的目的是將界面設計與用戶的需求進行匹配。
一般來說原型評估方法分為三大類型：
（1）快速原型：原型迅速成型并分配實施，在原型實驗收集的信息基礎上，系統從草案中得以完善。
（2）增量原型：應用與大型系統，從系統的基本骨架開始，需要階段性的安裝，及系統的本質特征是在初次安裝完成后允許階段性測試，以減少遺漏的重要特征。
（3）演化原型：對前期的設計原型不斷進行補充和優化，直到成為最后的系統。
2、簡易測試評估方法
在條件不允許的情況下，可以采取簡易的方法來對用戶體驗進行評價。步驟是：
（1）實驗室環境準備：準備好測試用的電腦或其他媒介。兩個房間，房間1用來對被測試者進行測試，房間2用于設計師和工程師的觀察。
（2）被試選擇：分為用戶組和專家組。
（3）進行測試：房間1中被試者根據自己的選擇進行操作和測試，同時說出自己的內心想法，觀察員在調查表上記錄被試者的每一次的操作情況，包括出錯情況和被試者的口語描述，當被試者在測試過程中遇到困難或操作無法進行時，觀察員要給予一定的客觀提示。房間2中通過相關設備將房間1的情況傳輸到房間2，設計師和工程師實時觀察和記錄被試者的情況，以便今后對產品做進一步的修改和完善。
（4）結果分析：通過多次測試后，將測試結果匯總，提取出交互設計中存在的問題，以及對交互設計有益的建議形成測試報告。
3、眼動評估方法
眼動追蹤可以用來評價對產品（包括硬件產品和軟件產品）設計的感性意象，評測產品設計特征。眼動評估的主要指標有注視熱點圖、搜索過程測量指標、興趣區域即用戶視覺注意的焦點區?？梢越Y合口語分析法了解用戶的所想 和所做。
4、腦電評估方法
通過對腦電信號的分析，研究者可以探索大腦的認知加工過程和受試者的心理狀況。近年來腦電評估方法在人機交互心理學等領域應用廣泛，被用來評估交互設計、人機界面、產品設計等方面的內容。但是腦電評估也有一定的缺陷，例如空間分辨率上的局限性，因而對某些認知過程和腦區的定位并不是很準確。第二，在許多相似的實驗研究中，由于研究者采用了不同的實驗材料和方法等，實驗結果也存在差異性。第三 ，由于采集記錄時間的滯后性，腦電所記錄的并不一定是當下被試者所想到的內容。
采取哪種方法來開展用戶測試和評估，要根據不同的任務結合不同的環境來開展，比如：時間、成本、資源等。
啟發式評估法
是專家評估法的一種，也被稱為經驗性評估，最初由Nielsen博士提出。簡單來說，啟發式評估是一種簡易的可用性評估方法，使用一套相對簡單、通用、有啟發性的可用性原則，讓幾個評審根據專業知識和經驗來進行評估，發現產品潛在的可用性問題。
啟發式評估的兩大要素：評估者和評估參照的原則。
對評估者的要求主要有四個方面：
（1）人數：推薦3-5人，有時會更少
（2）知識：最好同時具有可用性知識及設計知識
（3）身份：最好是非設計者本人，否者不具有客觀性
（4）崗位：設計師或用戶研究員
評估參照的原則有：尼爾森十大可用性原則、八項黃金法則、首頁可用性指南、ios設計指南、拓展原則、HHS網頁設計與可用性指南等。具體需要根據實際項目來選擇，常用的是尼爾森十大交互原則。
什么時候適合使用啟發式評估法？
交互設計和UI設計階段、測試優化和產品發布后的階段。
啟發式評估的優缺點有哪些？
優點：成本低、效率高、發現大多數可用性問題，甚至是用戶測試時不會出現的問題。
缺點：不能代表真實用戶，相對主觀、有時候發現問題過多、對評估人員知識背景要求較高。
什么時候適用？
（1）適合時間、資源有限的情況下快速發現可用性問題，降低風險及成本。
（2）版本變動不大的情況下，小成本檢驗。
（3）作為可用性測試的之前準備。
啟發式評估流程是什么？
（1）準備階段：確定范圍、背景調查、參考評估原則、評委邀約、材料準備
（2）執行階段：任務走查、整體走查、結果記錄
（3）分析階段：匯總討論、報告總結、優化方案
可用性測試
先來看一下我們在平時工作中常常會聽到這樣的問題
產品經理：我們的用戶覺得產品好不好用？使用過程中會不會遇到問題？他們是否滿意？
設計師：設計的過程有一些糾結的地方，不知道實際用戶是怎么理解和操作的怎么辦？
產品開發后：想在大推前檢驗一下產品是否靠譜，適不適合大推？
當我們遇到這樣的一些問題時，如何找到方法快速得到答案呢？
那就是接下來要介紹的可用性測試方法。
可用性測試是一種常用的、高效的方法。
它的定義是：通過觀察具有代表性的用戶，完成產品的典型任務，從而找出產品可用性問題并解決，目的是為了改善產品，讓產品更容易使用。
什么時候適合做可用性測試呢？
一般是在：交互設計或UI設計、測試優化、正式發布三個階段來做。當然是越早做越好，可以盡早發現問題并及時調整。
類型分為兩種：形成式和總結式
形成式特點：小樣本、發現問題為主、不能做定量對比。
總結式特點：大樣本（30人以上）、定量的評估、可以做對比評估
可用性測試可以解決什么樣的問題？
1、發現問題，產品在體驗上是否存在問題
2、檢驗實現，期望的設計目的有沒有達成，是否滿足了用戶的期望
3、產品評估，用戶是否會滿意
4、理解用戶，了解用戶行為習慣，了解用戶認知，找到某些問題的原因
測試流程是什么？
整體上分為4個階段：1、準備 2、測試 3、分析 4、優化
1、準備階段要做的有哪些？
確定目標：確定測試目標決定了后面測試過程要怎樣去設計
常見的測試目標有：
·對整個產品做可用性評估
·對新增的功能模塊進行評估
·提前觀察新方案對新老用戶有怎樣的影響
·提前檢測改版是否達到預計目標
·設計時存在爭議，如何選擇解決方案
·某個環節流失率較高，檢測是否為設計原因導致
·需要拓展某一類特殊用戶，測試針對這類用戶在設計上是否需要作出調整
準備測試方案
方案中應當包含以下內容：
·測試目的：明確測試的目的及范圍，測試目的決定了測試方案
·測試關注點：與負責的設計師一起梳理測試中要關注的問題
·用戶招募：招募要求，樣本配比，招募渠道
·經費預算：獎勵的形式和額度
·時間計劃：用于把控時間計劃
撰寫測試腳本：設計測試任務，通過用戶行為去觀察提問來獲得我們想要的內容
基本的流程有：
·暖場：3min，簡單聊天，消除用戶的緊張情緒
·測試說明：2min，對測試內容規則做說明
·測試前訪談：10min，了解用戶基本信息
·簡單試用：3min，讓用戶熟悉產品
·測試執行：30-45min，提示任務并觀察
·事后訪談：15min，針對疑點問點追問，填寫評價表
·道別：5min，支付禮金，送用戶離開
招募用戶
招募什么樣的用戶呢？
·根據測試目的來定，找出與測試目標有關的篩選緯度
·特別考慮用戶使用行為相關的特征，例如競品使用經驗，使用產品的目的，用戶的活躍度等
·挑選最核心的緯度，轉化成用戶招募的條件，并盡量客觀化，具體化，可衡量
·避免設置交叉條件過多，導致樣本代表性降低
·學會辨別真假的用戶信息
招募多少用戶合適？
·以發現問題為目的快速可用性測試，6-8名即可
·考慮產品的復雜性，覆蓋人群差異性，適當做調整，拓展到10-15名
招募渠道有哪些？
·公司內部
·現有產品用戶庫
·公司其他產品用戶庫
·熟人，朋友等
·推廣渠道：官微、公眾號、門戶網等
·社區，論壇，qq群等
·第三方調研公司
準備測試素材：低保真或高保真原型，或線上已經可以使用的產品，也可以準備一些量表工具來輔助測試。在測試
過程中需要用到的電腦或手機設備，攝像頭，紙，筆，桌椅等。
測試場地選擇：
·專業可用性測試實驗室：一般對測試質量要求較高，旁聽人數較多且需要采集豐富的數據的時候采用此方法。實驗室有兩個房間，一個測試間，一個觀察間，中間有單向玻璃分隔。測試間中有多角度的攝像頭，用來記錄測試過程，觀察間可以同步看到測試間里的情況，
·普通測試環境：在觀察人數較少（小于3人），條件有限時使用。
預測試階段：正式測試前進行預測試，保證測試流程通暢
·走查：記錄可能出現的問題
·預測試：找人先測試一下
·調整：調整測試流程
正式測試階段
測試參與人員有
·主持人：引導整個測試流程
·記錄員：記錄操作行為，訪談內容，發現問題等
·產品團隊：參與旁聽，觀察，結束后交流
·用戶：完成測試及訪談任務
測試過程中需要觀察的要點：
·用戶是否獨立完成了任務
·是否存在無效操作或不知所措的情況
·用戶是否滿意
結果分析
邊測試邊總結，越及時越好
·測試完一個用戶，做一次小結
·測試結束當天寫小結，與設計師當場討論
·重要問題反饋后再總結分析報告
·邊測邊改，邊改邊測
結果分析4個步驟：1、對發現分類 2、整理不確定項 3、評定優先級 4、結果記錄
撰寫報告
從4個方面來寫：
·總體如何
·有哪些問題
·嚴重程度如何
·建議是什么
·除此之外，還可以圍繞關注的問題，未滿足需求補充分析
優化跟蹤
在測試之后需要出優化的方案，測試優化的過程是循環的。
測試之后如果還有其他問題沒有得到解決，可以結合其他的一些測試方法來得到。
問卷調研
問卷調查法是以書面提出問題的方式搜集數據的一種研究方法，研究者將所要研究的問題編制成問題表格，讓受訪對象以郵寄、當面作答、在線作答或追蹤訪問的方式填寫，從而了解被試者對某一現象或問題的看法和意見。問卷調研可以用于需求挖掘階段，也可以用于產品上線后的評估階段。
如果是想了解用戶對產品上線后的滿意度，可以使用問卷調研的方法。它比較適合去了解用戶的認知態度，也可以附帶了解用戶的行為習慣，
問卷調研的優缺點
優點：統一性、靈活性、量化性、匿名性
缺點：（1）只能獲得書面的信息，而不能了解到生動、具體的情況。（2）缺乏彈性，很難做深入的定性調研。（3）調查者難以了解被調查者是否認真作答，是不是自己填寫的。（4）填寫問卷比較容易，有些別調查者會隨意選擇，或者按照社會主流觀點選擇，這樣會使調查失去真實性。（5）回復效率低，對無回答者的研究比較困難。
問卷調查的使用場景
適用于：（1）需要進行定量分析的調研。（2）需要匿名進行調研的問題。（3）對已有假設進行檢驗。（4）尋找問題隱藏的關聯。（5）對產品設計用戶認知及態度的評估。
不適用于：（1）發現和描述具體問題。（2）探索受訪對象的模糊態度。（3）獲取創新想法。（4）獲取精確的行為數據。
問卷調研流程
1、確定目標：確定調研目的、對象、分析目的和應用對象。
2、調研方案：通過訪談、經驗、理論等，確定調研框架，題目選項，分析思路，投放渠道，相本配比等。
3、問卷設計：問卷設計，問題美化，投放渠道。
4、問卷測試：多人測試，確保問卷的可讀性，邏輯通暢
5、問卷投放：按照計劃好的投放渠道進行投放，回收數據，數據清洗
6、問卷分析及填寫報告：分析及報告填寫，調研結果落地
數據分析
概述：通過在網站或應用中進行數據埋點，獲取用戶對產品的使用和行為數據，并進行基于產品體驗優化的數據進行分析。
數據分析可以做什么？
1、可以做到用戶從哪里來，來了多少
2、獲取用戶屬性，用戶地域，用戶設備
3、訪問了哪些頁面，使用了哪些功能，消費了多少錢，消耗了多少時間
4、哪些流量可能存在問題，忠誠度如何，活躍度如何，有沒有達到目標，和行業相比如何
5、流失情況如何，離開之后是否還回來
可以作為產品的眼鏡和大腦，提供客觀衡量的依據，可以持續優化改進。
數據獲取方式的對比
日志文件：優勢，完整的服務端請求記錄。
缺點，日志的獲取和清洗有過濾成本，許多頁面操作無法記錄。
JS頁面標記：優勢，數據獲取可控、靈活，可以對頁面操作記錄進行記錄，獲取數據比較完整豐富。
缺點，需要在頁面植入JS標記代碼，某些情況下無法獲取，如當用戶禁用JS功能時。
常用的數據監控平臺
1、第三方監控平臺：如Google Analytics、百度統計、騰訊云分析等
2、自研平臺
數據分析流程
1、監控 2、定義 3、埋點 4、測量 5、分析 6、優化
Web分析常用的指標
PV：是指頁面瀏覽量，網頁瀏覽數實施評價網站流量最常用的指標之一，用戶每一次訪問網站中的頁面均被記錄，對統一頁面多次訪問，訪問量累計
UV：是指獨立訪客，是通過互聯網訪問、瀏覽這個頁面的自然人
UPV：是指唯一身份綜合瀏覽量
訪問：是指在一定時間范圍內，網站所有訪問者對網站發起訪問的總次數，從訪客來到網站到最終關閉網站所有頁面，記為一次訪問
識別用戶的方式：IP、IP+User Agent、cookie、User ID、設備ID、其他
復合指標
跳出率：指用戶來到網站，只瀏覽了一個頁面就離開的訪問次數，占全部訪問次數的百分比，簡稱“來了就走”。跳出率可以被用來衡量流量和頁面質量，高跳出率表示訪問者對著陸頁面不感興趣，沒有繼續訪問更深入的頁面。也可能頁面設計存在問題，也可能是導入的用戶不匹配。跳出率可以通過調整廣告渠道，優化頁面內容來降低。
退出率：訪問者離開網站一次被記錄為一次退出，某一范圍內退出的數量/該范圍的綜合訪問量就是退出率。如果關鍵流程中的某一頁面退出率高，代表某一頁面可能出現了問題。
訪問時長：網站停留時長，頁面停留時長，應用使用時長。訪問量是訪問質量的一個衡量指標，較長的訪問時間說明用戶與產品進行了較多的互動。
訪問深度：可以理解為單個用戶平均訪問的頁面數，是PV/UV的比值。訪問深度也是訪問質量的一個衡量指標，可以考察用戶是否和網站進行了較多互動。這個比值越大，代表網站的粘性越高。
轉化率：指在一個統計周期內，完成轉化目標行為的次數占總訪問次數的比率。根據設置不同目的進行計算，例如注冊轉化率、付款轉化率等，是一個重要的分析指標。
移動端基礎指標
移動端的基礎指標監測與web端略有不同，但分析思路大致相同。指標分為：新增設備、累計設備、啟動次數、單詞使用時長。
常見分析內容
流量分析（哪里來？）、用戶分析（什么樣的用戶？）、行為分析（如何使用的？）、路徑轉化（表現如何？）、流失分析（粘性如何？）
A/B test
A/B測試是一種幫助網頁優化實驗的方法。A/B測試的目的在于通過科學的實驗設計和采集數據的方式，來獲得具有代表性的實驗結論，從而尋找到更好的產品策略。
簡單來說，就是為同一目標制定兩個方案，讓一部分用戶使用A方案，另一部分使用B方案，記錄用戶的使用情況，對比兩個方案的結果，選擇更符合的方案。
A/B test一般會在產品改版正式上線之前使用，來驗證新的設計是否可以提高產品的表現。
A/B test可以測試的元素有：標題、圖片、顏色、社交元素、段落文本、按鈕、導航、任務流程、頁面布局、價格、視頻等?？梢淮沃桓淖円粋€元素或一次改變多個元素的方式來測試，這就是兩個測試類型單變量測試和多變量測試。
A/B test工具
Google Website Optimizer：搜索巨頭提供的免費A/B test工具，一個很好的入門級工具，但是沒有一些先進的功能。
Visual Website Optimizer：一個易于使用的A/Btest測試工具，包含功能有所見即所得的編輯器，單機地圖，訪問者分割和標簽等。
Unbounce and Performable：集成著陸設計的A/B測試工具。
Vertster,SiteSpect,Webtrends Optimize and Omniture's Test&Target：企業級測試工具
App Adhoc Optimizer：國內A/B Test工具，同時支持前端（Web/H5、IOS、Android）及后端（Node.JS、PHP、Java）AB測試服務的專業Saas平臺
Optimizely：是網上現有的最專業的AB測試工具之一，它的價格要比其他的工具高很多（也可以免費使用一個月），它提供了一些非常好的功能。
Unbounce：對于登錄頁面的測試來講非常不錯，而且它不僅僅是個測試工具，還可以在無需自己編寫任何代碼的情況下來創建登錄頁面。
如何做A/Btest
1、確定目標，例如提高網站的付費轉化率，降低跳出率等
2、測試方案，建立假設：購買按鈕的顏色會影響點擊率？縮短流程可以提高復費率？改變導航可以降低跳出率等？
3、創建相比較的兩個版本，改變其中的變量
4、發布測試，將部分流量導向B方案，但不一定是5：5
5、數據分析，收集數據，對比AB版本的轉化率、跳出率、留存率等
感謝閱讀！
米勒定律背景：
1956年經美國心理學家發表了一篇名為《神奇數字7》的論文，論文中討論了一維絕對判斷的極限和短期記憶極限之間的關系：一維絕對判斷的備選數目與短期記憶極限的數目大致相當，數字都在 7 左右徘徊。在后來的好些研究雖然也對論文中的一些概念進行了改善，但這個數字7依然被保留。這也是人們關于短時記憶內容最早期的研究結果，現在也普遍適用在設計中，也就是現在的米勒定律。
米勒定律定義：
從心理學的角度來看，人類處理信息的能力是有限度的。人腦在處理信息塊的時候會受到7±2規則的限制，即人的大腦最多同時處理5到9個信息塊。原因是短期記憶儲存空間的限制，超過9個信息團，將會使得大腦出現錯誤的概率大大提高。
思考結論：人們的短期記憶有限，通常只能記憶7±2信息塊。信息塊越多，人們能記憶的信息精準度越小，越容易出錯。
米勒定律應用：
在產品設計中，米勒定律可以說是信息內容處理的一條規范準則。通過減少對信息層級的劃分、歸類分組、輔助記憶等，來提高用戶對信息的高效識別與記憶。在追求極致用戶體驗的趨勢下，用戶對信息的預見與計劃在產品設計中也是極為注重，無論在產品設計的初期還是成熟期，合理的信息處理將會大大提高用戶對產品的好感度。
01、控制數量，減少用戶選擇
人們對信息的記憶處理是有限的，通常信息越多我們將越難以記憶。所以在做產品設計的過程中應該控制好信息塊的數量，增強輔助用戶識別與記憶，提高用戶體驗。
02、信息分段，輔助用戶記憶
在產品設計時我們經常能遇見一連串信息（數字、文字、段落等）的情況，當信息數量較大的時候，我們可以采用對信息分段的處理方法，將一連串的信息以7±2個內的信息數量為一個段點，輔助用戶記憶。
03、流程分步，優化用戶操作
經常會遇到信息特別多或者復雜業務場景，特別是在B端產品設計。通常我們都會先梳理業務流程，然后分步驟處理對應的信息。從而減少單屏信息內容過多給用戶帶來的急躁，讓用戶每個步驟都沉浸與當前的操作。
04、信息排序，引導用戶記憶
人們在記憶一組多數據信息塊的時候，通常都會對首末的兩個位置信息塊的記憶會相對比較強，所以在產品設計的時候，需考慮把重要的信息放在首位/末尾位置，引導用戶去記憶該信息。這也就是系列位置效應（首因效應、近因效應）。
A、首因效應：指在整個序列的信息塊中，相比中間位置的信息，人們對最前面的信息記憶更加清晰。
B、近因效應：指在整個序列的信息塊中，相比中間位置的信息，人們對最后面的信息記憶更加清晰。
C、設計思考：人們對信息流排序的時候應把重要的元素放置在首位或者末尾。若用戶是長期記憶的的話考慮首因效應、短期記憶思考近因效因，人們的記憶不僅受到位置的影響，同時也受時間影響，在不同的場景下合理應用系列位置效應.
米勒定律在產品設計中的應用主要是解決信息塊對用戶的記憶問題，合理的信息布局和信息處理可以大大的提高用戶對信息的閱讀和記憶。還可以根據不同的業務場景引導和輔助用戶識別和交互，增強用戶對產品的好感與體驗。
文章來源：站酷 作者：TerryChen_
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、
BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
尼爾森的十大可用性原則是尼爾森博士在分析了兩百多個可用性問題的基礎上，提煉出的十項交互設計原則。被廣泛運用于網頁、APP以及各種人機交互領域。
要注意的是，這10項原則是啟發式（heuristics）的、通用的經驗法則，而不是具體的規定。
系統應該通過在合理時間內的適當反饋，向用戶通知正在發生的事情或者當前的狀態。
不要蒙蔽用戶，溝通是所有關系的基礎，無論人還是設備。
當系統響應時間小于1秒時，通常正常反饋即可；
當響應時間長于1秒時，我們通常會通過加載動畫、分步加載、占位符加載等方式，減緩用戶等待的焦慮感；
如果超過10秒還沒有得到響應，那么通常會認為這次請求是失敗的，需要給予用戶失敗提示。例如：刷新提示、新頁面加載提示、支付提示、下載提示。
當然加載時間并沒有固定的規定，有個例子是這樣的：
某個APP的用戶反饋說他們的頁面加載太慢了，希望提高服務器反應速度……于是他們對此進行了優化，優化后用戶的反應：新版很給力，很快！
那這個團隊的優化方案是什么呢？
。
。
。
——他們把小菊花轉圈的速度提快了
對用戶操作的適當反饋是用戶界面設計的最基本準則。讓用戶了解當前狀態、位置、是否成功、進度如何，減少不確定性；并引導他們在正確的方向上交互，而不是浪費精力在重復操作上。反饋有：
·狀態反饋
用戶需要知道自己的操作是否被系統感知，所以用戶操作后，應該第一時間給出反饋。最常見的就是各種按鈕的不同狀態，比如未點擊、點擊、不可用狀態，以及選中、未選中狀態。
就拿小說類批量訂閱列表來說，起點通過明顯的線面和顏色區分選中和未選中的章節；而長佩我買的時候是需要反應一下：免費不可選中是淺灰色、未選中是深灰色，選中是綠色……但是初始狀態時深灰色看起來像是選中？？
·進度反饋
進度通常有頁面加載進度、下載進度、視頻播放進度等
比如下圖的invision網站，在閱讀文章時通過頂部進度條的反饋，讓用戶知道自己的閱讀進度。
·位置反饋
因為網絡空間中用戶無法像物理空間那樣感知到自己的位置，所以我們需要在視覺上進行提醒，以免用戶迷失。
比如標簽欄、導航欄通過選中狀態來定位當前所在頁面，閱讀、看視頻、聽音樂時系統會記錄當前的位置，下次打開后繼續。
·反饋方式多樣化
反饋可以通過元素的顏色位置、文字、聲音和震動，甚至動效去表達變化。
比如京東，通過產品圖縮小-加入購物車的動效來反饋“商品已加入購物車”，直觀形象。
使用用戶熟悉的語言，單詞、短語、圖形，而不是系統導向的術語；遵循現實世界的慣例來呈現信息。
這里的語言不僅僅包括文案層面的語言，還包括產品的設計語言（圖形、配色和風格）。
產品使用的語言應該使目標用戶能夠清晰理解的。如果用戶不能理解，他們會感到被忽視和受挫敗，許多人將選擇其他產品完成目標。
特別是現在很多公司選擇耕耘細分市場的產品來分一杯羹，比如針對中老年、青年、兒童的產品，抑或商務、娛樂的產品，都要分別使用符合自己的定位的語言。
比如bilibili的設計語言和每日優鮮的文案語言——
模仿現實世界的產品或者使用映射，能夠利用人們現有的知識，降低學習成本，使他們輕松快速的理解界面。
像早期擬物化的設計，以及MD的魔法卡片模擬了物理世界中的紙張。IOS的指南針也類似現實世界中的指南針，以便用戶輕松的使用。
熟悉是這些體驗讓用戶愉快的原因。
比如微信閱讀打開書的動效就像現實世界的打開一本書一樣、給medium文章進行標記就像我們現實中使用馬克筆一樣。
用戶經常會在使用時發生誤操作，所以產品需要一個非常明確的“緊急出口”幫助他們——即提供取消和重做的功能。
用戶在使用產品時可以自由進退，遵循從哪里來就可以返回哪里去的原則；比如常用的各種二三級頁面左上角必備的返回按鈕。
當用戶誤操作時要給用戶提供提供撤銷、取消、重做等相關功能，比如聊天類產品的信息都可以短時間內撤銷。
（突然發現這張圖暴露了我每天點外賣的事實 ヽ(。>д<)ｐ
不可逆的操作需要給用戶明顯的提示，以免對用戶產生嚴重的影響。比如刪除功能通常需要二次操作，重要操作會有彈框類提示。
設計者應遵循一致性原則，統一標準能確保用戶理解各個元素在設計中，并且知道去哪里尋找哪些功能。
移動市場成熟的今天，已經有很多約定俗成的慣例。和用戶的習慣一致，意味著用戶不再需要重新學習，各種應用的切換之間沒有學習成本。這也是我認為設計的趨同化未必不是一件好事情的原因。
比如常用的幾種操作手勢、下拉刷新功能、我的/地圖/購物車圖標等
在同一個產品中，同一層級的信息應該使用一致的設計語言。
比如導航、彈窗、按鈕、列表，這是我們推行設計組件和規范的一個原因。
除此以外，顏色、文字、圓角、陰影等也是需要注意一致性的。
△谷歌google visual guidelines-google ads
用戶經常分心于手頭的事情，因此需要通過提供建議、利用約束來防止無意識錯誤。
其實限制用戶的選擇并不是一個好主意，但是如果有明確的規則來定義可接受的選項，那么限制用戶可以輸入的類型是一個很好的策略。
比如訂房時，對可訂房日期進行限制，防止用戶選錯時間。
提供清晰的提示，也能防止用戶犯錯，提示包括標簽、文字、顏色、以及反饋狀態等。
比如IOS的鍵盤，選中的字母會放大，提示用戶；輸入文字光標會放大，防止用戶操作失誤。
比如負向操作通常為紅色，紅色是一種警示色，給用戶預警防止誤操作。
盡可能減少用戶的記憶負擔，向用戶顯示他們可以識別的內容，而不是自己記憶和填寫。
選擇和輸入的操作成本相差巨大。產品應該給用戶提供選項，讓用戶可以直接選擇，而不是自己輸入。比如淘寶填寫收貨地址
在用戶使用產品的過程中，會有產生一些需要記憶的內容、或者操作路徑，這個時候我們要避免用戶記憶，把信息直接提取出來，送到用戶手里。
比如自動讀取短信驗證碼，比如bilibili會提醒上次播放的位置
內容可預期，減少用戶操作路徑，防止來回跳轉。
比如起點章節付費時可以直接看到當前的余額、
比如京東金融首頁直接顯示了余額和代還金額（本來應該打個碼的，但是想想我三位數的資產打碼還不夠費勁呢(?_?)
好的產品需要同時兼顧新用戶和資深用戶的需求。
對新用戶來說，需要功能明確、清晰，對于老用戶需要快捷高效使用高頻功能。不可迎合某一種用戶，把不必要的信息占據重要部分。
在首頁放置常用功能，比如淘寶、支付寶、bilibili等等；或者提供自定義入口，比如猿題庫可以自定義科目
對用戶頻繁使用的功能，提供重復操作入口或者模板。比如美團外賣，可以直接選擇再來一單
通過提供系統默認選項，而減少用戶多余的操作。比如美團、攜程、每日優鮮等當地服務類產品，會默認選擇當前定位的城市；購物會選擇默認收貨地址等
不要包含不相關或低頻次的信息/操作。頁面中的每個額外信息都會降低主要內容的相對可見性。
能夠方便用戶無障礙的瀏覽信息，越重要的內容越突出。
通過顏色、大小、字體的字重、對比度、元素的間距、特殊造型、動效等來表現。
頁面中背景、裝飾元素視覺過重的話，就會干擾到用戶對于信息的閱讀。
比如以圖片為背景，我們要考慮圖片上文字的識別性；列表頁過重的分割線、頁面內過多的裝飾元素都會給干擾信息閱讀……
比如下廚房菜單推薦的卡片，字體識別度特別差；移動掌廳的這個模塊，字體色和背景色對比不清晰、以及字體太小，都會干擾用戶識別信息——我們需要做的是降低這些干擾
錯誤消息應以簡單的語言表示，準確指出問題，并提出解決方案。
當發生錯誤時，提示信息一定要直觀，視覺上能夠引起用戶注意，可視化處理，文案要簡單概要。比如賬號密碼錯誤、以及各種異常狀態
當用戶遇到錯誤時，不要只是報錯，盡可能提供詳盡的說明文字和指導方向，遇到了什么問題，以及如何解決等等。
幫助性內容有一次性提示、常駐提示和幫助文檔。
多用在用戶第一次使用，或者產品更新后，通常為氣泡形式，或者snakebar的形式呈現。
用于操作時必須注意到的內容，在頁面中以文本或者標簽形式呈現。
一般用于解釋規則或者熱點問題，通常以超鏈接的形式存在于頁面中；或者以集合形式位于設置頁中，此時需要注意要易于檢索。
本篇文章主要介紹了尼爾森的10大可用性原則，以及介紹了適用范圍和案例說明。最后我們再來復習一遍加深記憶吧~
一個個看起來精致的頁面也是由這些UI設計細節組成的。對于頁面細節的處理也往往可以體現UI設計師的專業和嚴謹度，本文分享的這些設計細節，不僅新人設計師常常會忽略，就連有經驗的設計師也時常會在這些細節上處理不當。
文字細節
A．文字行距
在做段落文本時，我們很少直接使用默認的文本行距，為了保證閱讀的可讀性和舒適性，必須設置比默認值更大的數值的行距。
具體的數值可以設置在字號的1.3～1.8倍之間，一般情況下，字號越小，需要的閱讀空間會略大一些，特別是在設計一些閱讀類需要閱讀大段文本的產品頁面時，一定要加大行距來提高文本的可讀性和閱讀舒適性。
B．文字對比度
在界面設計中，應該要保證任何文字的可閱讀性，它應該有足夠的對比度，即使是提示性文字也要保證在任何類型的顯示器上都可見易讀。
間距和邊距
A．去掉多余的邊框和分割線
用大量而明顯的分割線和邊框將模塊分開，是UI設計新手常常犯的錯誤，但在設計的同時，可以停下來好好思考：用分割線分開一定是最好的方法嗎？有必要嗎？
有時用1px的邊框和分割線確實是合理的，但也有其他的方法來進行信息的歸類和分割，比如利用陰影和更大的間距。
B．避免不均勻的邊距
在進行卡片式設計時要注意內容與卡片邊緣的邊距。如果你是以常用的從左上角到右下角的方式來布局內容，那就讓頂部的邊距比左側的邊距稍大一點，看起來會比四邊都相等的邊距更加舒適美觀。
投影
在物理現實中，物體的投影絕對不會是黑色的，物體的投影顏色始終會受到其所處在的環境的影響。
應用在界面設計中，物體或是卡片的投影顏色應考慮其背景和環境顏色來進行結合設計，即不應選擇純灰色，而是選擇帶有背景色彩傾向的灰色，同時設置適當的透明度和模糊值，來營造自然舒適的投影效果。
內容填充
重復和隨意的示例文本和圖片放在設計圖中看起來會很不專業，應該避免交付這樣的設計稿，它會讓人覺得你對自己的設計是不專業不用心不愿意花時間的，同時也反應了你對與自己的設計產出的重視程度。
此外，也已經有一部分插件可以自己自動選擇填充內容，為設計師節省了這些素材的填充時間，所以在交付設計稿時，讓自己的設計稿盡量完整專業，哪怕是為了演示效果，也應該放上相應的不同的內容標題、文本、圖片，讓整個設計看起來更加專業和完整。
以上提到的每一條規則都要結合具體的產品來進行具體分析和設計，但是可以適用在在大多數情況下，設計從來沒有一個標準答案，對于設計新手要訓練的是，如何找到那個最合適當前產品的設計方式，希望這篇分享能對你有幫助，感謝閱讀。
當我們拿到網頁設計需求時，首先要確定是不是要單獨開發移動版本。因為響應式布局兼顧了手機端適配問題，但是受加載速度、手機瀏覽器、柵格化系統的限制設計發揮的自由度、等的影響很大。
柵格化設計：是針對網頁設計師。主要是為了提高網頁的規范性。
柵格設計系統：（網格設計系統，標準尺寸系統、程序版面設計）是一種屏幕設計的方法和風格，運動固定的格子設計版面布局，其風格工整、整潔。
柵格化布局：針對前端開發人員，指前端攻城獅使用的css框架，來實現頁面的響應式布局。
設計師使用縱向的柵格（列）讓頁面元素垂直方向上對齊，使用橫向的柵格（排）讓元素水平方向上對齊。設計師結合基準網格（8pt）和縱向柵格（12欄 16pt）進行設計。
基于設備的邏輯像素進行UI設計——設計開始前UI設計師要根據桌面和平板手機分辨率大小，考慮最大最小響應的屏幕，給出響應的策略設置斷點和次斷點。
斷點：(breakpoint)是頁面改變布局的臨界點，一個響應式網頁可能會有一個或者多個斷點。有時候網頁也會設置次斷點。
次斷點：(minor breakpoint)并未對頁面布局做很大的改動 只是對細節做了一些微調。
媒體查詢：（media queries）是實現斷點的一種方法，它提供了簡單的邏輯方法來根據不同的設備特征（寬度 高度 像素比）應用不同樣式，最常用的媒體查詢變量是min-width和max-width。）
設計師根據網頁的內容找到合適的斷點。設置多少個斷點由網站的內容決定，設置幾個斷點就需要設計幾套UI設計圖。設法避免列間空白太寬或太窄的情況。常見的設計尺寸1920PX（大屏電腦）、1440PX/1280PX（小屏電腦）、1024PX（橫屏Ipad）、768PX（手機和豎屏Ipad）。（這些是根據市場常見的機型分辨率來的。再根據網頁內容多少進行合理的增減。）
用chrome瀏覽器打開一個響應式網站，檢查元素，右上角會顯示視窗當前的分辨率，慢慢縮小視窗的寬度，找到頁面布局的變化點，就是我們上面說到的斷點或者次斷點。）
這個當然不是了。這個視網站中每個頁面的內容而定，甚至同一個頁面的不同內容模塊布局斷點設置也不盡相同。在我的實踐過程中，很多頁面只需要設計三套，當然比較復雜的頁面，在這五個分辨率上，都需要對布局做一些修改或者自動隱藏部分內容。
藍藍設計的小編 http://www.syprn.cn