著：[英] 賈爾斯·科爾伯恩
譯：李松峰
人民郵電出版社
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
1. 梳理知識框架，記錄閱讀收獲、心得，本身就是一個加深理解、溫故內化的過程。
2. 摘錄重要知識，存儲在數字媒體上，方便隨時按需查閱。
3. 鍛煉思維和表達。
百利無一害，來吧，走起。
本書講述了一個產品價值觀和四個策略。
一個產品價值觀：作者崇尚簡單體驗的產品設計。簡單的產品更容易制造 (成本也更低)，也更容易使用 (市場也更廣)
① 這里的產品指數字產品或實體產品。
② 本書主要考慮大多數用戶 (主流用戶) 的體驗。
四個策略：刪除、組織、隱藏、轉移。本書的核心內容就是講述如何通過這四個策略（我理解就是方法論）設計大多數用戶喜愛的簡單體驗。這幾個策略適用于簡化功能和內容。
1. 知識原理很多都是相通的
① 本書的刪除策略與奧卡姆剃刀
奧卡姆剃刀：“如無必要，勿增實體”。講的也是簡單性原則。
他說：“切勿浪費較多東西去做，用較少的東西，同樣可以做好的事情?！?講得真好，不能贊同更多。
② 組織策略與親密性原則
親密性原則：彼此相關的項應當靠近，歸組在一起，成為一個視覺單元?！秾懡o大家看的設計書》Robin Williams，非常棒 推薦
組織策略與親密性原則講的都是正確組織信息的方法論。
③ 簡單與別讓我思考
別讓我思考 (可用性最重要的原則)：你的目標應該是讓每一個頁面或屏幕都不言而喻，這樣的話，普通用戶只要看它一眼就知道是什么內容，知道怎么使用它。即他們不需要思考就能明白?？捎眯允顷P于人，關于人們如何理解和使用產品的，它和技術沒有關系。技術日新月異，人本身的變化卻非常緩慢?！饵c石成金》史蒂夫·克魯格，很棒 推薦+1
2. 凡事過猶不及。
書中有一個案例驚嘆不已，講的是東京蘋果專賣店，沒有按鈕的電梯 (電梯內和外都沒有操控按鈕)，自動在每一樓層?？?、自動開和關門 (乘客干預不了)。置用戶于完全失控的環境中（要是深夜一個人乘坐，估計得嚇不活了）。難以置信，誰能想到以優質體驗設計征服世界的鼎鼎大名的蘋果，居然還有這種反人類的逆天設計！
3. 這本書的閱讀體驗跟《寫給大家看的設計書》極相似
① 簡單、輕松、通俗易懂兩者都為讀者創造了簡單、輕松的閱讀體驗。把知識融入情境、故事，以圖示意，短小的一篇一篇像在和你講故事，娓娓道來、言之有物、簡明扼要、通俗易懂。
② 知識框架扁平、濃縮為極簡，過目難忘《簡約至上》把全書核心凝煉為：刪除、組織、隱藏、轉移?！秾懡o大家看的設計書》將復雜的設計原理凝煉為：親密性、對齊、對比、重復。合上書，就能回憶起來，太簡單又太深刻，真的想忘記都難。
4. 好書亦師亦友
“雖然這世界上不能改變的東西很多，但眼前的設計還是有很多簡化的途徑可循。”、“你能做到”... 像不像一個智慧溫暖又真誠善良的朋友在不斷的給你信心和鼓舞？
(小聲說，我也喜歡)
以我淺薄有限的認知來看，人們喜歡簡單不僅因為簡單順應人性，還因為簡單帶來高效：
① 簡單順應人性簡單意味著不用思考，以現有的認知水平一看就明白，在人的舒適區，啟用的是人低耗能自動模式，是本能來的。而復雜的事物，如思考、學習、鍛煉、做一件難的事，都是更多的消耗人的腦力、體力、意志力、自控力、耐心、時間，都是調用人的高耗能模式，所以復雜這個東西本質上是反人性的。
② 簡單帶來高效不管是工具任務型產品還是內容型產品，用戶使用產品的邏輯路線是一樣的，都是經由認知 -> 決策 -> 行動 -> 達成目標；如果簡單就會：認知快 -> 決策快 -> 行動快 -> 高效達成目標；所以，簡單是大多數用戶的剛需了。
1. 越復雜或少用的知識，忘記就越快。
2. 簡單源自專注。明確自己的目標，更容易迷途知返。
3. 解決問題前，先搞清楚狀況。糾結于某個設計時，退一步想想：“用戶在這里真正想干的是什么？” 聚焦用戶。
4. 共識：把所有利益相關方的目標都統一到最終用戶身上，通過共識構建愿景。然后，阻力和爭斗就會減少。
怎么讓利益相關方聽自己的？答案是必須理解他們的想法。
先從傾聽他們和理解什么對他們最重要開始。把匯總的意見恰當地反饋給他們，他們會知道你已經明白了。在感覺被人傾聽后，他們才會樂意敞開心扉。
“我也希望看到最適合用戶的設計，我們一塊看幾個，看看是否可行。”
不要嘗試說服別人，聽他們說，讓他們自己判斷，讓他們自己承認而不是回避問題，然后再去尋找解決他們問題的方案。
5. 產品使用環境是觀察用戶的最佳地點，必須使軟件設計符合環境需求。你的用戶體驗應該簡單到不受這些干擾的影響，能夠在人們被打斷的間隙生存。
6. 為主流用戶 (大多數用戶) 而設計，忽略專家型用戶。
7. 體現品牌特征① 實用性——這個品牌能做什么對我有幫助的事情？(如讓飛行更簡單)② 這個品牌給了我什么感覺？(如充滿活力，好玩)③ 這個品牌崇尚什么？
8. 簡單就是讓用戶感到自己在掌控一切。你的設計不能跟這種掌控的感覺有什么抵觸，而是應該放大這種感覺。
9. 設計之所以會變復雜，通常是因為某些不重要的步驟擠占了核心特性。關注用戶行為 (而不是你的設計)，并且從用戶的視角把它描述出來。
10. 在研究某個問題的時候，你需要把它轉換成一種認識。故事是描述認識的一種好方式。與一大堆需求描述相比，故事更容易讓讀者明白什么重要和為什么重要。故事應該用三言兩語把核心體驗表達出來。
11. 極端的可用性
① 任何人都可以使用
② 毫不費力的使用
③ 瞬間響應
④ 一目了然
⑤ 始終工作
⑥ 不出錯
⑦ 恰好夠用的信息
⑧ 在混亂無序的環境中工作
爭取你不可能達成的目標有一個重要的好處：保持正確的方向。
12. 堅持不懈是達成簡單最重要的一步。
“乍一看到某個問題，你會覺得很簡單，其實你并沒有理解其復雜性。當你把問題搞清楚之后，又會發現真的很復雜，于是你就拿出一套復雜的方案來。實際上，你的工作只做了一半，大多數人也都會到此為止……但是，真正偉大的人還會繼續向前，直至找到問題的關鍵和深層次原因，然后再拿出一個優雅的、堪稱完美的有效方案?！?——史蒂夫·喬布斯
13. 簡化意味著改變，而改變始終意味著痛苦。多數人會不惜代價避免痛苦。收集需要改變的證據很重要。
14. 挑出正確的點子，確保能夠得到很好的執行。
刪除：通過刪除來簡化設計，刪除所有不必要的，直到減無可減。
15. 刪除雜亂的特性可以讓設計師專注于把有限的重要問題解決好，而且也有助于用戶心無旁騖地完成自己的目標。
16. 不要等著別人不分青紅皂白地、無情地刪除最有意思的功能。要總攬全局，保證只交付那些對用戶體驗而言真正有價值的功能和內容。
17. 體驗的核心是最能打動用戶的東西。找到它，刪什么留什么就一目了然了。能夠消除用戶挫折感的功能同樣也會受到歡迎。
18. 刪除殘缺的功能、導致出錯的功能、不必要的功能
19. 如果一個小變化導致了復雜的流程，就應該退一步去尋找更好的解決方案。
20. 錯誤：即使非常小的錯誤也會讓用戶煩惱。消除錯誤是簡化用戶體驗的重要途徑。無論顯示什么錯誤信息，好像都沒有那么友好、親切和簡單。
21. 不要以功能的多寡來認定產品的價值，而應該看產品能否滿足用戶最高優先級的目標。
22. 刪除視覺干擾因素，讓用戶注意力保持集中。界面中的各種小細節會增加用戶的負擔、打斷用戶的思維，會像公路上的減速帶或坑坑洼洼一樣降低用戶的效率。
23. 太多選擇容易讓人反感。
24. 清除減速帶：選擇聰明的默認值可以減少用戶的選擇。
25. 刪除視覺混亂和噪音，意味著人們必須處理的信息變少了，能夠把注意力集中到真正重要的內容上。
26. 刪減文字、精簡句子：重要的內容“水落石出”，消除了分析滿屏內容的麻煩，用戶更有掌控感，把文字變得簡潔、清晰、有說服力。
27. 簡化對話，長話短說。一次交互就是用戶與設備之間的一次對話。
28. 砍掉時間?？车艄δ芎蛢热菘梢怨澥r間，因為決定少了、按鈕少了、思考少了、閱讀少了。要在對用戶真正重要的事情上節省他們的腦力。
組織：通過組織來簡化設計
29. 通過組織的方式簡化設計，要點在于只強調一兩個最重要的主題。
信息布局、分類、排序、搜索、使用顏色分層 (地鐵線路圖)，找到組織信息的正確方式，可以極大的簡化用戶體驗。要想知道設計是否成功，可以瞇起眼睛來觀察屏幕，看是否能區分出不同的層。
隱藏：隱藏不重要的，避免分散用戶注意力
30. 無論隱藏什么功能，都意味著你在用戶和功能之間設置了一道障礙。這個障礙可能是遙控器上的塑料倉門，也可能是網站上一連串的點擊。為了避免給用戶造成不必要的麻煩，必須仔細權衡要隱藏哪些功能。
31. 不常用但不能少，如個性化設置不會經常改變，因此非常適合隱藏。
32. 隱藏所有需要隱藏的功能，在你需要時出現在合適的位置上。
33. 細微的線索足以提示隱藏的功能。
轉移
34. 轉移合適的功能到其他設備上、系統組件中，向用戶轉移。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
“先有思想，后有設計”設計師自身應該逐步建立一套自己的設計體系，需要對設計方法論有專業的認識和理解。一直想收集整理日常說到的各類設計理論知識，也希望通過整理和總結能有新的收獲，加深記憶。
格式塔心理學是視覺排版及設計中應用比較廣泛，主要指人的眼腦作用是一個不斷組織、簡化、統一的過程，正是通過這一過程，才產生出易于理解、協調的整體。格式塔的理論核心是整體決定部分的性質，部分依從于整體，人腦知覺到的東西要大于眼睛見到的東西。
古登堡法則是又稱對角線平衡法則，由14世紀西方活字印刷術的發明人約翰·古騰堡提出。古登堡圖表將要畫面顯示的東西分成了四個象限：
1.第一視覺區(Primary Optical Area)：左上方，讀者首先注意到的地方。
2.最終視覺區(Final Optical Area)：右下方，視覺流程的終點。
3.強閑置區(Strong Follow Area)：右上方，較少被注意到。
4.弱閑置區(Weak Follow Area)：左下方，最少被注意到。
通過古登堡法則我們知道用戶的視覺中心往往在頁面的左上方，而結束瀏覽時視線往往落在右下角，所以合理利用這個法則可以幫助用戶更好地獲取內容并采取行動。自上而下的界面設計，自左向右的界面設計，頁面中通常將操作按鈕放在右下角。
菲茲定律：從一個起始位置移動到一個最終目標所需的時間由兩個參數來決定，到目標的距離和目標的大?。▓D中的 D與 W），用數學公式表達為時間 T = a + b log2(D/W+1)。意味著小而近的目標用戶不需要花費太大的精力就能輕易觸及或者關注，相反小而遠的目標則需要花費用戶更多的時間和注意力，菲茲定律闡述的是效率相關的問題
思考結論：1.必要時讓按鈕更大，2.讓相關信息更近
?？硕?span style="margin:0px;padding:0px;outline:none;box-sizing:inherit;color:#080808;">：一個人面臨的選擇(n)越多，所需要作出決定(t)就越長。用數學公式表達為反應時間T=a+b log2（n）。在人機交互界面中選項越多，意味著用戶作出決定的時間越長。如比起2個菜單，每個菜單有5項，用戶會更快從有10項的1個菜單中做出選擇。席克定律在產品應用中主要用于通過合理的選項及功能規劃提高用戶的決策及完成任務效率
應用場景：
1.分類編組，提高決策效率
2.過濾選項，隱藏/刪除低頻率功能選項
3.分布執行，提高流程轉化率
米勒定律：頭腦最好的狀態能記憶含有7（±2）項信息塊，在記憶了 5-9 項信息后人類的頭腦就開始出錯。米勒定律在產品應用中主要在于合理的信息布局和信息處理可以提高用戶對信息的獲取效率和記憶難度。
應用場景：
1.控制數量，減少用戶選擇
2.信息分段，輔助用戶記憶
3.流程分步，優化用戶操作
4.信息排序，引導用戶記憶
臨近性原則：當對象離得太近的時候，意識會認為它們是相關的。在交互設計中表現為一個提交按鈕會緊挨著一個文本框，用戶會理解為按鈕于文本框有關聯性。換句話說當相互靠近的功能塊是不相關的話，就說明交互設計可能是有問題的。
泰斯勒定律（復雜守恒定律):該定律認為每一個過程都有其固有的復雜性，存在一個臨界點，超過了這個點過程就不能再簡化了，你只能將固有的復雜性從一個地方移動到另外一個地方。
應用場景：
1.合理縮短用戶使用路徑，在設計中可有適度的簡化縮短操作流程但是到一定的程度可能會影響整體的功能和價值。
2.將固有的復雜性從一個地方轉移到另一個地方，例如搜索中歷史記錄，信息商品的收藏等功能，實際都利用了此定律。
3.將功能進行拆分，一次性無法降低復雜度的功能可以進行拆分。
奧卡姆剃刀原理：奧卡姆剃刀原理只承認確實存在的東西，認為那些空洞的普遍性的東西都是沒有用的，應該剔除掉，概括起來就是“如非必要，勿增實體”實際上無論實體、視覺或認知上，多余的負擔都會削弱表現效能，去除解決方案的雜質，讓最后的設計會更嚴謹、更純粹。在設計蘋果產品的時候，喬布斯一直堅持認為：為了實現一個功能而造出一堆復雜的東西，沒用，簡單的才最好。Google專注于搜索，主頁上也只有搜索，其他搜索引擎就沒有做的這么徹底，這也是為什么Google用戶量最多的原因之一。
防錯原則：最早應用于汽車制造領域中，工程師新鄉重夫（豐田精益生產莊家）于上世紀60年代，創造了這個理念。防錯原則認為大部分的意外都是由設計的疏忽，而不是人為操作疏忽，例如硬件設計上的 USB 插槽，醬油瓶口。防錯原則有四項基本原則包括，輕松原則，簡單原則，安全原則和自動原則。
狀態可見原則：保持界面的狀態可見，變化可見，內容可見。讓用戶知道發生了什么，在適當的時間內做出適當的反饋。 比如用戶在網頁上的任何操作，不論是單擊、滾動還是按下鍵盤，頁面應即時給出反饋。
貼近場景原則：用用戶的語言，用詞，短語和用戶熟悉的概念，而不是系統術語。遵循現實世界的慣例來呈現信息，功能操作符合用戶的使用場景。進一步來說貼近場景，也是要求在設計的時候要考慮，產品面對的人群和人群所在的環境，比如，同一款產品在不同地區呈現形式需要考慮文化差異。不同屬性的產品例如兒童教育和辦公產品，需考慮使用人群的特性。
可控原則：操作應該是可逆的，可以支持“撤銷”和“重試”，以此來離開“非預期” 的狀態，簡單來說就是不要讓用戶走進死胡同，提供出口和退路。例如微信發送消息可以撤回可重新編輯等。很多web端的表單，文章發布等都支持自動保存，很大程度上避免錯誤或者意外操作。
一致性原則：遵循平臺的慣例。也就是，同一用語、功能、操作保持一致。
防錯原則：核心觀點是如何有效的在用戶出錯之前就盡量避免錯誤發生，在互聯網產品中，比起回退修改錯誤信息或者操作更好的是，用設計防止這類問題發生。很多轉賬功能中輸入數字后會顯示千萬等說明文字，用戶輸入卡號后會自動識別關聯銀行，避免用戶出錯。
1.限制操作范圍和條件。例如很多手機登錄等交互中默認設置手機號為11位避免了用戶出錯，提高了易用性。
2.對有風險的操作進行二次確認。
易取原則：盡量減少用戶對操作目標的記憶負荷，動作和選項都應該是可見的。用戶不必記住一個頁面到另一個頁面的信息。系統的使用說明應該是可見的或者是容易獲取的。 很多產品搜索功能的關鍵詞聯想搜索，即使用戶不能完全記住關鍵詞也能輕松搜索。
1.讓用戶選擇而不是輸入，選擇和輸入的操作成本相差巨大，產品應給給用戶提供選項，讓用戶可以直接選擇，而不是自己輸入，比如填寫收貨地址。
2.自動讀取、記錄信息、減少操作路徑。在用戶使用產品的過程中，會產生一些需要記憶的內容、或者操作路徑，這個時候我們要避免用戶記憶，把信息直接提取出來，送到用戶手里
高效靈活原則：為大多數用戶設計，兼容少部分特殊用戶。允許用戶進行頻繁的操作，更加便捷靈活的代碼和反饋。各大產品中常使用的搜索功能，提供歷史搜索功能。微信朋友圈發布中選擇可見/不可見人群時，提供上次選人記錄。
1.提供快捷入口，例如支付寶的首頁可以自主配置常用的小程序，微信下拉對話頁面可以快捷進入歷史小程序
2.方便用戶重復操作，例如外賣平臺中自動定位常用地址，訂單中可以再來重復的一單等
3.預知用戶操作縮短操作路徑，例如截圖后打開微信對話框會關聯截圖發送
簡約原則：審美和簡約設計，頁面不應該包含無關緊要的信息，頁面的每個額外信息都會降低主要內容的相對可見性。
容錯原則：錯誤信息應該用語言表達（不要用代碼），較準確地反應問題所在，并且提出一個建設性的解決方案。比如404。
人性化幫助原則：有必要提供幫助和文檔。任何信息應容易去搜索，專注于用戶的任務，列出具體的步驟來進行。幫助性提示最好的方式是：1、一次性提示；2、常駐提示；3；幫助文檔。
通過這些方法的總結歸納，我發現其實很多原則原理我們在平時的設計中有意無意的總會用到，在實際工作中設計很大程度上是做選擇，哪一種是對產品對用戶最優的方案，有的設計師可以通過自己的經驗作出選擇，沒有經驗的可能需要多多理解這些原則原理，交互設計之父阿蘭·庫珀說過“除非有更好的選擇，否則就遵從標準”只有反復的遵循使用標準才能建立自己的一套設計方法論，讓工作更加得心應手。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
來源：站酷
作者：有魚MUMU
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
“少即是多”是經常掛在嘴邊的話題，在設計過程中，設計師們都會想盡一切辦法去簡化交互流程、組件元素及各種設計屬性，讓用戶使用起來更簡單。當產品簡化到一定程度，就必須要面對其不可簡化的復雜性。
諾曼曾說過 “復雜是世界的一部分，但它不應該令人困惑 ”，如果復雜性是合理的，我們應該學會如何去管理復雜，考慮好復雜的問題在流向用戶后以何種方式處理，篩選控件就是用戶自行處理復雜信息的方式之一，只要是符合用戶行為做出的設計，將應有的復雜以篩選的形式呈現給用戶，讓其自行決定，用戶反而會樂意接受。
篩選控件的使用頻率非常高，本文根據筆者對各類篩選控件的拆解及自身經驗進行分總結，整理了在移動端中常用篩選控件的類型、使用場景以及設計思路，幫助大家在設計中更好的選擇適合自己產品的篩選控件。
一、現實生活中的篩選
二、篩選功能的重要性
三、常見的篩選類樣式
四、篩選的幾個維度
五、篩選功能設計準則
六、總結
在日常生活中，我們天天都在跟篩選打交道。設想一下，當你走進超市，在沒有任何分類指示的情況下，看到琳瑯滿目的商品是否會不知所措，答案是肯定的，且不論超市規模大小、商品的多少，相信沒有任何一個人愿意在不清楚的情況下花時間去找一個很可能不存在的商品，即便這點時間會很短。
道理還沒說完，大家都感覺自己很懂，可依然逃脫不了如今在各種形形色色的應用中找不到自己需要的功能而苦惱，那么這些應用又是誰設計的呢？答案就是「大多數人」。
換言之，如果我們能通過標識牌、平面圖指引（模糊查找），詢問服務員、記憶指引（精準查找），就容易很多，這些指引路徑就完全充當了篩選功能，至于通過什么方式，只能根據人們自身或現場條件自行選擇，能滿足自己的需求即可。在功能繁多、交互流程復雜的互聯網產品中也是如此。
在我們設計篩選控件之前，需要清楚了解什么是篩選，東施效顰不是什么明智之舉。篩選，即用戶根據自身需求、通過一個或多個特定條件，在已有的內容中快速找到滿足自己當前條件的信息，單獨呈現的同時、并將未滿足條件的信息暫時作隱藏處理，以便用戶完成自己的目標需求。
篩選也可以稱之為過濾器，是搜索框架的一部分。這里需要說明一點，篩選不同于搜索，它是系統結合用戶提出的條件，對內容進行規則性的查找，準確的說，用戶屬于被動，篩選出的結果在產品側「精準」、用戶側「模糊」；而搜索則是用戶通過明確的目標主動進行精準查找，要么直接找到自己想要的結果、要么對結果不滿意，搜索出的結果在產品側「模糊」、用戶側需要「精準」。說直接點就是，搜索直接查找出結果、篩選只是縮小查找范圍（并非絕對，也可以對搜索結果縮小范圍）。
在電商應用中，如果有目標的用戶更多使用的是搜索，那么沒有目標的用戶更多使用的則是系統推薦或商品分類，不管是哪種類型的用戶，前面雖然已經進行過一次范圍縮減，但下一步還是逃不掉要面對的海量商品，這時，不給用戶提供選擇上的便利，用戶很可能因瀏覽商品耗時過長、選擇性困難等原因扭頭就走，即便離轉化僅一步之遙，也無法避免用戶流失的問題。
增加篩選功能就能很好解決這個困局，用戶通過篩選、設置接近于目標需求的條件，縮短查找路徑，就能從海量的商品信息中快速找到符合條件的內容，大大降低了用戶的查找成本，節省了很多查找時間，用戶體驗得到很大程度的提升，由此可見，為什么要使用篩選，不言而喻。
1）系統定義篩選需求
方向性的篩選：用戶通過系統提供的多種類型進行頻道切換，還會存在多少子級，可定義為一級篩選。例如訂單列表（待支付/待發貨/待收貨/待評價），優惠券（未使用/已使用/已過期）等，用戶從已有的類型列表中選擇自己所需。
2）用戶自定義篩選需求
精細化篩選：當系統已提供方向性的篩選，用戶依然可從分類篩選出的結果中進一步細化。例如針對單個類型的商品列表自定義價格區間、發貨地、品牌...等，也可稱之為二級次篩選，相比一級篩選，其篩選的結果會更精細化，也更接近于用戶的真實需求。
（PS：系統定義篩選條件后，配合用戶自定義二次篩選條件以及排序功能，則更容易滿足用戶需求）
Tab式篩選條件大部分在操作前、操作中、操作后基本都會一直顯示，有橫向Tab和縱向Tab兩種，如新聞、視頻類型的應用大多使用橫向Tab，通過將不同的內容以大的方向、區塊進行分類，便于用戶隨時切換、篩選出不同的內容；縱向Tab更多則是在電商類應用中出現，且會存在多個子級，例如我們在京東購買「鼠標」，則需要在tab分類中依次找到「電腦辦公>外設產品>鼠標」進行篩選。
Tab類型主要以大的維度進行篩選，所篩選出的結果可能模糊且信息量極大，如果想要結果更加精準，則需配備其他類型的控件進行二次篩選。
操作中以蒙層的方式彈出，其他時候均為隱藏狀態。彈窗類型的篩選最大的優點是占用空間小，僅需一個入口，能在有限的彈出空間中從多個維度展示篩選條件，用戶選中或自定義對應的篩選項，即可快速篩選出自己想要的信息。
介于Tab式與彈窗式之間，篩選條件初始為隱藏狀態并提供一個入口。點擊后展開，期間不影響當前頁面的任何其他操作且一直處于展示狀態，需經過再次點擊才會將篩選條件隱藏。
基于自定義篩選條件過多，為滿足用戶個性化需求，點擊后會跳轉到新頁面操作多個條件進行篩選。相比前面提到的Tab、彈窗更為復雜，對篩選的要求較高。
高級篩選適合用在顆粒度很細的場景，為的是避開其他視覺元素的干擾，讓用戶更專注于當前頁面較為復雜的篩選條件，降低因受其他因素影響而出錯的情況。例如：在選擇汽車時，需要對服務、價格、級別、排量...等各種情況作出非常細致的選擇，這時用高級篩選就再合適不過。
篩選、排序組合方式算是商品列表中的標配了，尤其在空間資源有限的移動端設備中，能最大化的將多個控制條件一次性展示給用戶，在篩選出結果后再使用排序功能，便于更快找到想要的商品。例如美團、餓了么將篩選與排序控件形成組合，極大的提高了用戶篩選的效率。
單維度的篩選不管是設計還是操作都相對簡單，無需操作確定/下一步按鈕，觸發篩選條件后會就會更新信息列表，大家最熟悉的訂單系統（待支付、待發貨、待收貨...）即是單維度篩選。
另外，單維度具備短、明、快的特點，為方便用戶識別，單個標簽一般不超過5個文字，且語義明確，用戶不用任何思考就能快速理解。
當產品中的屬性過多，使用單維度篩選不僅會降低篩選結果的精準度，還可能會導致用戶因反復/重復無用的操作而產生挫敗感，已無法滿足用戶的需求。這時，需采用多維度篩選幫助用戶縮小查找范圍，讓其快速找到符合自己需求的內容。
多維度篩選條件一般以按鈕（單選/多選）、輸入框為主，有些還會以滑塊來控制數據范圍。設定好篩選條件需通過重置、確認操作按鈕，用來清空篩選條件或進入下一步。在移動端，因屏幕空間有限，一級篩選數量最好不要超過9個，如果太多，建議進行整合或并入二級篩選。
在多級篩選控件中，可以把當前篩選條件的上一級看成是篩選分類菜單，每個等級中可包含一個或多個單維度/多維度的篩選條件，移動端最多不超過3個等級。
從表面看，多級篩選與多維度篩選其本質是一樣的，但多級篩選會存在下一級或再下一級，而多維度會將所有篩選條件平鋪在空間中。當單維度、多維度篩選還是無法滿足用戶需求，多等級就能作為最好的延伸。
在設計篩選之前，需要思考用戶為什么要使用篩選、在什么樣的場景下使用篩選、以及如何滿足用戶的心理預期等，有了清晰的用戶需求，設計出來的篩選才能更好的幫助用戶滿足其需求。
以「餓了么」用戶點餐為例，使用點餐服務的用戶類型雖然很多，不過主力還是來自于辦公室白領、宅男/女這兩大用戶群體，有目標的用戶會從搜索、收藏、訂單記錄等入口直接去購買，但絕大多數用戶因長期點外賣的原因，“吃什么”就成了最大的問題，這時如果用戶還要“吃”，就必須得使用篩選功能，從Tab分類（模糊）到彈窗式篩選（精準）再配合排序功能滿足自己的點餐需求，得出結論：
1）一群不知道“吃什么”的白領、宅男/女用戶；
2）需要使用篩選功能解決自己“吃什么”的問題；
3）問題很快得到解決后，對結果及使用體驗非常滿意。
上面的案例可以看出，用戶想要在海量的信息中找到自身所需，從表面上看，最直接、真實的需求就是找到滿意的商品去下單。站在產品的角度并非如此，最應該解決的應該是效率的問題，這才是篩選的終極目標，不管用戶花多長時間，筆者相信都能找到想要的，但所花費的時間成本越少，滿意度就會越高，其產品的可信度、使用粘性、用戶體驗也隨之提升。
篩選并非千篇一律，不要一上場就來一波大眾化的篩選條件，很多APP首頁設計就是最好的例子，什么都不考慮，直接導航欄+輪播圖+金剛區+內容推薦...傳統的一套流程走下來，結果可想而知。
設計篩選功能時，不同類型的產品需要根據其產品定位、用戶目標以及使用場景來定義篩選條件，用戶需求是用來設定篩選條件范圍的決定因素。例如：購物類產品需要結合商品的銷量、評價、價格及知名度等，而新聞類產品側重于用戶偏好、點贊量、熱度值來提供篩選，方便用戶快速找到感興趣的內容。
在滿足上述兩個條件后也不能將篩選項一股腦的挨個排出來，即便是在同一個頁面內，也需要結合當前內容的屬性對篩選條件進行優先級排序，將用戶高頻使用的條件按先后順序依次排列，不重要的也可將其隱藏于某個入口。
以淘寶為例，在「手機」商品列表，篩選條件中首先看到的是品牌，其次是內存、容量...，我相信很少人不在乎手機品牌吧；而在「鋼釘」列表中，依次是價格排序、銷量...，品牌條件隱藏在了高級篩選中，試問，如果是你購買釘子這種實用性的商品，是在乎價格、還是品牌呢？
篩選功能旨在滿足用戶查找需求，通過縮短用戶選擇商品的范圍，節約查找時間，快速將符合條件的信息呈現出來，并讓用戶在這一過程中產生愉悅的使用體驗，以發揮產品的最大價值，從而增強用戶的使用粘性。
至于在設計中該使用何種篩選控件則取決于用戶需求和使用場景，設定符合需求的篩選維度及條件，且根據內容屬性做靈活變動即可，切記篩選的核心需求是通過簡單易用的方式來幫助用戶提高操作效率。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
整個報告分兩個部分，
一部分是調研概述，主要描述調研是如何進行的，包含：用戶方法闡述，調研對象說明，用戶畫像等，簡單清晰的告訴別人你數據是如何獲取的，增加后期問題及數據闡述的科學性。（還有一部分，就是關于調研涉及人員，可以在合適的時機帶一下是UED全員協作完成的整個過程的。）
另一部分是調研結論，我的描述思路是：總-分-總，先描述總結論，讓觀看報告的人對整體結論有個初步了解，然后詳細描述各模塊分結論，最后提出各模塊共性問題。
結論部分是整個報告的重點，所以前面的概述就簡單介紹清楚就好了，不需要占太多篇幅。
調研流程，確定標準，是匯報，也是邀功，調研本身就是個繁瑣的過程，我們把過程直觀的呈現出來，讓老板知道我們整個調研過程，前前后后做了哪些準備。付出了哪些努力，體現工作量的同時，也能體現我們的專業性，但是不是記流水賬，得有總結。
我把整個路程大體分了3個部分，第一個部分是調研前的準備，第二個部分是調研，第三個部分結果闡述。結果匯報，后期工作計劃，匯報很重要，調研做得再好，你的結果無法呈現，問題就沒辦法結論，那就只會停留在發現結論。
評估緯度是為了闡述我們從哪些緯度去收集答案的，想要驗證什么問題。
由于大部分人對調研都只是停留在問卷調查的層面，所以對樣本量的選擇有不理解，可用性測試主要是為了觀察用戶操作路徑及反饋，所以樣本量不需要太大，這個可以簡單的解釋下是如何挑選用戶的。
數據整理也是匯報的一部分，一方面，材料佐證我們做過的努力和準備，另一方面，數據存檔。
我們整個調研采用了錄音與錄音相結合，錄音是為了便于后期多人協作幫忙整理問題，錄屏是記錄用戶操作路徑，收集用戶使用過程中的卡頓，去挖掘卡頓原因，這是是我們做可用性測試的主要目的，這也是跟問卷調研最主要的差異。
在寫報告的過程中，我一直在想關于整體滿意度的結論，是放在第一部分還是第二部分，但是鑒于第二部分主要描述問題，所以思慮再三，還是把他放到了第一部分。
我們拿到各模塊的數據后，要怎么用著很關鍵，單個零散的數據是體現不出問題的，只有對比著看才能看出問題。
通過數據對比我們明顯能發現，付費用戶對產品的整體要求要比增值服務的要求高得多，畢竟不要錢的，好不好用無所謂，好用我就用，不要用我就不用。但是如果是用戶花錢了的，那他就需要考慮，我獲取到的服務和花的錢是否成正比，這也就間接確定了我們后面問題處理的優先級。
這里建議做個中場頁。
前面說過，問題描述采用的總-分-總的節奏，所以最開始描述了一下我們收集到的所有問題的概述，包含，總共多少個問題，已經分類類型的分類占比。
這里分享一個問題整理的表格，表格跟PPT的作用不一樣，PPT是為了匯報成果，獲取支持，表格是為了后續跟進落地，解決問題。
當然，先把問題整理出來也是為了更好的輸出PPT。
共享文檔可以讓更多人清晰的看到問題，因為匯報的效果比較好，老板給了明確支持，所以匯報后我們將表格發給了各個產品，與設計師配合，認領問題，給出優先級和排期計劃，整個過程推進的很順利。
分結論部分，主要通過用戶體驗地圖去描述用戶路徑，直觀闡述用戶使用過程中的情緒和痛點，右邊整理出來了需要重點關注的一些點。
用戶體驗地圖主要描述的是用戶發現，不一定是問題，屬于啟發類，可以為后期優化方案的輸出提供方向引導。
問題整理則是明確的已知問題描述。
各模塊可以根據實際情況去描述各自的問題，這里就挑了幾個典型的模塊舉例了一下，就不一一闡述了。
再來說一下，分結論講完之后，整理的共性問題。先說問題，再說涉及的模塊，體現問題的嚴重性。
到此，整個PPT就結束了，匯報完成后，老板就開始給各業務線下達任務了，就又回到了表格上，我們把之前的問題以界面緯度進行整理，跟產品確認優先級和排期計劃，并與老板就排期計劃進行了確認，然后責任到人，目前第一輪優化方案已經在陸續落地中，整個發現問題到推進落地的過程，還是比較順利的，
UI 設計師必備的一項基礎能力：規范能力。
為了避免重復造輪子，反復掉入同樣的陷阱，閱讀并熟知主流平臺的設計規范，是非常有幫助的。
本文內容主要介紹了iOS 、Android、Ant Design的相關規范，為的是不重復累贅描述同一個知識點，涉及到移動端和PC端，主要為了幫助基礎同學學習，適當地刪減了一些有難度的規范。
設計師在設計時并不一定要嚴格遵守，但對這些規范應有所了解，并融會貫通。
通過設計規范的約束，保證產品的色彩使用、圖標圖形、空間、文字、頁面布局等內容保證嚴格的一致性。
規范能延續產品風格及特性，保證產品視覺及交互層面的統一，包括技術帶來的變革，增強用戶的認知性，不同程度得提升用戶體驗。
多人合作完成一個項目時，需要視覺規范。遵循設計規范，保證視覺統一、提高工作效率。
輔助技術層搭建框架及布局的規則更清晰明確，如按鈕、顏色、字體大小等，提高開發效率，確保應用軟件最終實現效果與視覺設計相符合。
視覺設計規范是指對設計的具體技術要求，是設計工作的規則。包含了目標、功能、技術指標，以及限制條件等。
① 視覺設計規范，是量化的設計指標，具有指導性、約束性。
視覺設計規范要確定?般可用性原則和審美常識下的避免犯錯的方法，以及一旦出現錯誤后的補救方案。規范的第一個目的是減少設計過程中出錯的次數，針對新手設計師、第三方團隊，可以很好地做到經驗傳遞，迅速了解上手。減少標注時間，提高前端開發質量。
② 視覺設計規范，是確定關鍵因素，要有有效性、復用性。
獲得該設計規范針對范圍內的關鍵點，包括設計方向和設計元素，以通過項目設計的過程，達到團隊成員的更加密切的配合效果。促進多人協作，解決視覺不統?現象。
① 品牌規范：塑造形象以及應用的規范。主要包含了標識的標準制圖，配色字體等。以及常用的搭配方式。
?個企業或者?個產品，都有相應的品牌視覺識別系統（VIS）。品牌視覺識別系統是視覺設計最好的參考基礎，既然是?種指導體系或者說是參考，那么也相應地會有品牌的規范。
② 平臺設計語言規范：平臺理念、遵循規范的好處、某種應用的生態。比如 Google 和 Apple 制定的規范。針對第三方的規范，主要旨在讓這些第三方的設計更兼容平臺應用。通常制定了大的方向和規則。并且會提供很多基礎的設計元素和插件。
③ 產品業務規范：側重在產品設計和實現層，內容清晰并且實用，標注詳盡，方便設計師們使用。更注重個性化的部分。
https://material.io/
Material Design 規范在于統一 Google 多種平臺下的一致性，代表 Google 全新的體驗。 包含豐富的色彩、空間的層次、流暢的動效、多樣的組件。
谷歌的想法是讓谷歌平臺上的開發者掌握這個新框架，從而讓所有應用就有統一的外觀，就像是蘋果向開發者提出的設計原則一樣。
從設計角度：建立共同的設計語言，將產品風格、品牌及交互形式統一起來。
從使用角度：提高產品認知度，提升品牌延續性及產品體驗的一致性。
Material Design 是基于三維空間的設計語言。 包含光線、材質、陰影。在 Material 環境中，虛擬燈光照射整個場景。
Material 有自身固定不變的外在特征和內在行為邏輯 ，理解這些固有的屬性有助于實際的設計項目。
? 立體性
? 空間位置的唯一性
? 不可穿透
? 形狀可變化
? 沿水平方向做變化
? 不可彎曲
? 能與其他材質對象合并
? 分裂，再合并
? 可沿任何軸上移動
Material 借鑒了現實物理世界中的物質特性，并將其運用在虛擬三維空間中的 Material 元素上， 有利于幫助用戶理解信息層級，同時可以統一各應用之間的體驗。
投影提供了元素深度和運動方向的重要視覺線索；在運動中，投影提供了元素移動方向及高度變化。
https://developer.apple.com/desig
iOS 設計規范逝之蘋果開發者官網上面的 iOS 人機交互指南（iOS Human Interface Guideline）。制作這個規范的目的是為了讓所有安裝到 iOS 系統的 App 都遵從某些特定的視覺特性、交互特性，以達到風格一致的使用體驗。另一層面，也是便于讓設計人員和開發人員能夠更好地理解 iOS 系統，更合理的運用系統提供的功能和接口，更高效地制作出 App。
在整個 iOS 系統中，每一種尺寸下的文本信息都應該是易讀的，圖標應該是精確易懂的，每一個裝飾應該是精巧適當的，而且更加需要注重功能驅動設計的原則。利用留白、色彩、字體、圖像和界面元素巧妙的突出重要內容并傳達其不同的交互性。
在簡潔美觀的界面中清晰流暢的動畫效果可以幫助用戶更容易理解內容并與之進行交互，而不會對用戶的操作產生干擾。內容全屏顯示時，半透明或者模糊處理的方式可以提示用戶更多的內容。減少使用邊框，漸變及陰影可以使界面輕 量化，突出顯示內容（內容優先）。
不同的視覺層次和逼真生動的動畫效果 可以表達界面更深層次的內容，賦予了界面活力，使用戶對界面內容更容易理解。易于發現并易于觸摸的元素可以提升用戶體驗的愉悅感，用戶在操作功能時不至于迷失。當用戶在瀏覽內容時，流暢的轉場效果提供了一種縱深感。
為了最大限度地提高影響力和覆蓋面，在應用設計規范時應牢記以下原則：
（1）審美完整（Aesthetic Integrity）
審美完整性體現了 App 的外觀和行為與其功能的整合程度。例如，一個幫助用戶執行嚴肅任務的 App 可以通過微妙、不顯眼的圖形、標準控件和可預測的行為來保持他們的專注。
另一方面，沉浸式的 App，比如游戲 App等，就可以提供吸引人的外觀，傳遞樂趣和刺激感，同時鼓勵發現。
系統提供的界面元素、眾所周知的圖標、標準的文本樣式和統一的術語來實現熟悉的標準和范例可以使得一個 App 的設計符合一致性。
易用性指的是用戶可以理解屏幕的內容，用手勢、觸動屏幕等動作直接操作，并且，用戶通過直接操縱，可以看到他們的行動的直接的、可見的結果。
反饋指對用戶的行動進行了確認，并且通過顯示行動結果以使用戶了解情況。iOS 系統的 App 要為用戶的每一項操作提供可感知的反饋。如：輕觸時會突出顯示交互元素；進度指示器會傳達長時間運行的項目的狀態；動畫和音效有助于闡明操作的結果。
當一個 App 中的虛擬元素以及動作都是用戶對熟悉事物的隱喻的時候（包括現實世界和數字世界），用戶會學習的更快。比如，用戶移動視圖來查看更多內容；拖拽內容；切換開關、移動滑塊并且直接滾動來選取值；甚至可以像翻書或雜志一樣輕快的翻頁。
在整個 iOS 中，用戶是掌控者，而不是 App，App可以建議一個行動方案或者警示危險后果，但 App 不能替用戶做決策。
好的 App 可以在用戶授權和避免不必要的結果之間找到正確的平衡。
App 可以通過交互元素，確認、取消的提醒以使得用戶覺得自己在控制。
https://ant.design/index-cn
Ant Design服務于企業級產品的設計體系，常用于PC端設計規范，基于「自然」、「確定性」、「意義感」、「生長性」四大設計價值觀，通過模塊化解決方案，降低冗余的生產成本，讓設計者專注于更好的用戶體驗。
1.Ant Design平臺的設計原則
如果信息之間關聯性越高，它們之間的距離就應該越接近，也越像一個視覺單元；反之，則它們的距離就應該越遠，也越像多個視覺單元。親密性的根本目的是實現組織性，讓用戶對頁面結構和信息層次一目了然。
正如「格式塔學派」中的連續律（Law of Continuity）所描述的，在知覺過程中人們往往傾向于使知覺對象的直線繼續成為直線，使曲線繼續成為曲線。在界面設計中，將元素進行對齊，既符合用戶的認知特性，也能引導視覺流向，讓用戶更流暢地接收信息。
對比是增加視覺效果最有效方法之一，同時也能在不同元素之間建立一種有組織的層次結構，讓用戶快速識別關鍵信息。
相同的元素在整個界面中不斷重復，不僅可以有效降低用戶的學習成本，也可以幫助用戶識別出這些元素之間的關聯性。重復元素可以是一條粗線、一種線框，某種相同的顏色、設計要素、設計風格，某種格式、空間關系等。
正如 Alan Cooper 所言：「需要在哪里輸出，就要允許在哪里輸入」。這就是直接操作的原理。
eg：不要為了編輯內容而打開另一個頁面，應該直接在上下文中實現編輯。
能在這個頁面解決的問題，就不要去其它頁面解決，因為任何頁面刷新和跳轉都會引起變化盲視（Change Blindness），導致用戶心流（Flow）被打斷。頻繁的頁面刷新和跳轉，就像在看戲時，演員說完一行臺詞就安排一次謝幕一樣。
根據費茨法則（Fitts's Law）所描述的，如果用戶鼠標移動距離越少、對象相對目標越大，那么用戶越容易操作。通過運用上下文工具（即：放在內容中的操作工具），使內容和操作融合，從而簡化交互。
很多富交互模式（eg：「拖放」、「行內編輯」、「上下文工具」）都有一個共同問題，就是缺少易發現性。所以「提供邀請」是成功完成人機交互的關鍵所在。
邀請就是引導用戶進入下一個交互層次的提醒和暗示，通常包括意符（eg：實時的提示信息）和可供性，以表明在下一個界面可以做什么。當可供性中可感知的部分（Perceived Affordance）表現為意符時，人機交互的過程往往更加自然、順暢。
人腦灰質（Gray Matter）會對動態的事物（eg：移動、形變、色變等）保持敏感。在界面中，適當的加入一些過渡效果，能讓界面保持生動，同時也能增強用戶和界面的溝通。
「提供邀請」的強大體現在 交互之前 給出反饋，解決易發現性問題；「巧用過渡」的有用體現在它能夠在 交互期間 為用戶提供視覺反饋；「即時反應」的重要性體現在 交互之后 立即給出反饋。
就像「牛頓第三定律」所描述作用力和反作用一樣，用戶進行了操作或者內部數據發生了變化，系統就應該立即有一個對應的反饋，同時輸入量級越大、重要性越高，那么反饋量級越大、重要性越高。
雖然反饋太多（準確的說，錯誤的反饋太多）是一個問題，但是反饋太少甚至沒有反饋的系統，則讓人感覺遲鈍和笨拙，用戶體驗更差。
當然，這并不代表了解這些就能做出優秀的設計方案了，英文水平比較好的同學建議直接讀原文，直接從 Material Design 和 iOS 的官網進行規范學習，效果更佳。當然如果英文水平有限，網上也有很多譯版方便大家閱讀。
而關于Ant Design的設計規范，可以去官網查閱更多的詳細內容，但PC端的設計規范平臺還有很多，字節、騰訊等設計官網都有。
記得對于規范不需要死記硬背，練多了自然能夠記住。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
好的配色不但能傳達出鮮明的產品主題調性，并且能為用戶的視覺行為產生引導作用，構成良好的用戶體驗。
對于UI設計師來說，不但要考慮顏色在給予用戶的感受上的作用，同樣應當考慮其實用性，避免重形式而輕內容的問題發生。
所以本文的內容是基于色彩的基礎知識，為大家介紹 UI 設計師常用的配色方案、配色流程，當然也包括其他視覺設計工作者在工作中要用到的基礎色彩常識。
顏色或色彩是通過“眼、腦和我們的生活經驗”所產生的?種對“光”的視覺效應。但是人對顏色的感覺不僅僅由“光”的物理性質所決定，還包含著“心理”等許多因素，比如人類對顏色的感覺往往受到周圍顏色的影響。有時人們也將物質產生不同顏色的物理特性直接稱為顏色。
顏色的應用在 UI 設計師的工作中是非常關鍵的一環。
（1）色相
是指色彩的相貌，色相被用來區分顏色，根據光的不同波長，色彩具有紅色、黃色或綠色等性質，這被稱之為色相。
（2）明度
是色彩從亮到暗的明暗程度，黑色的絕對明度被定義為 0 （理想黑）,而白色的絕對明度被定義為 100 （理想白），其他系列灰色則介于兩者之間。
（3）純度
純度通常是指色彩的鮮艷度。從科學的角度看，一種顏色的鮮艷度取決于這一色相發射光的單一程度。色彩的純度強弱，是指色相感覺明確或含糊、鮮艷或混濁的程度。
（1）HSB ：在 HSB 模式中，H（Hues）表示色相，S（Saturation）表示飽和度，B（Brightness）表示亮度。
（2）RGB ：三原色紅、綠、藍疊加最終為白色（加色模式）。常用于光源光情況下，例如顯示屏幕。
（3）CMYK ：三基色洋紅、黃、青疊加最終為黑色（減色模式）。常用于反射光情況下，例如印刷。
（4）LAB ：LAB 色彩模型是由亮度（L）和有關色彩的 A，B 三個要素組成。L 表示亮度（Luminosity），A 表示從洋紅色至綠色的范圍，B表示從黃色至藍色的范圍。
色彩心理作用是指色彩作用與人的情感所產生的心理感受與綜合性生理感覺作用。它影響著人們的記憶、感知、聯想和情感，刺激著視覺，在設計中有著不可忽視的作用。色彩的直接心理作用對設計有著重大的影響，關系到對用戶心理的把握。
色彩心理作用包括色彩的直接心理效應和間接心理效應。
（1）直接心理
色彩的直接心理效應是色彩本身的屬性即色相、明度、純度等感官印象造成的心理感受。它包括很多不同的心理效應，一般可分為 9 類，即色彩的興奮感和沉靜感、色彩的冷暖感、色彩的輕重感、色彩的華麗感和樸素感、色彩的明快和陰郁感、色彩的軟硬感、色彩的明暗感和色彩的空間感。
（2）間接心理
色彩的間接心理效應是由色彩的直觀感受反映到大腦所產生的聯想效果。在設計中常常利用色彩間接心理效應來傳達廣告信息。
1）灰?：正式、重?、成熟
2）棕?：保守、親切、穩定
3）粉?：?性、天真、?春
4）??：注意、提醒、快樂
5）紫?：奢華、浪漫、創意
是一種充滿神秘的顏色，在自然界中較少見到，所以被引申為象征高貴的色彩。
在UI設計中的應用場景為紫+粉常用于女性化的產品調性。
6）??：新鮮、清潔、健康
白色常常被認為是無色”即不是色彩。
在UI設計中的應用場景，常用于背景色，緩和各種顏色的沖突，以襯托其他色彩，提高畫面明度，提高文字可讀性。
圖源-dribbble
7）??：正式、權?、?練
是一種充滿質感的顏色，它是所有色彩中最有力量的，能很快吸引用戶的注意力。
在UI中的應用場景，常和其他色彩百搭，比如黑色+金色，黑色+紅色等等，以及現在UI設計中的暗黑模式。
圖源-dribbble
8）藍?：信任、舒適、放松
純凈的藍色通常讓人聯想到海洋和天空，讓人的內心感到平和，有助于人的頭腦變得冷靜，減少工作中的煩躁和沖動。
在UI設計中應用場景，常用于工具、商務、科技類等產品，B端設計也經常運用。
圖源-dribbble
9）綠?：??、?然、成功
綠色是大自然中最常見的顏色，代表著健康、生命、青春、寧靜、自然、和平、安全、舒適，是一種充滿希望的顏色。
在設計中的應用場景，健康、醫療、運動及少兒類產品使用較多，一般在軟件中表示安全、成功。
圖源-dribbble
10）橙?：信?、能量、樂觀
它烘托出的活躍氣氛沒有危險的感覺，反而是一種友好。
在UI設計中應用場景，電商、金融以及服務類的產品使用較多，比如淘寶。
圖源-dribbble
11）紅?：危險、重要、激情
最醒目和強勢的顏色，甚至能引起一些生理反應，例如心跳呼吸加快等。
在UI設計中應用場景，紅色常用于電商、金融、服務等行業。紅色也最能烘托氣氛，在中國傳統節日里都使用熱鬧的紅色來裝飾，比如新年春節階段。同時紅色也代表了警示、告誡，所以在界面設計中常用紅色的文字和按鈕來警示用戶慎重操作。
圖源-dribbble
5.UI中的色彩
Ul配色一般包含主色和輔助色、強調色、中性色。
主色通常與品牌色一致，輔助色一般選擇與主色色調一致且能拉開層次的顏色，強調色選擇與主色相對立的互補色。
中性色主要用于界面中的線條和背景
圖源-dribbble
每?種色彩都有其自身的特質，而這?特性的發揮，還需要依賴于色彩在整個配色時所處的位置、面積等，即色彩與其他色彩所形成的秩序。
顏色同樣有主體，和輔助。確定主體色系，有助于頁面整體基調的把控。在實際的操作過程中，顏色要適量，通常2-3種就可以了。多了往往較亂（并非絕對）。
單色系配色法：同?個色系內根據顏色的明度和純度不同去做區分，形成層級關系、對比關
系的配色方法。例如：深藍、天藍、淺藍這樣的層級變化。
鄰近色配色法：相鄰的色系進行搭配。例如：黃色、橙色、紅色。
對比色配色法：對比的色系進行搭配。例如：黃色、紫色。
一套 App 配色基本由背景色、主題色、輔助色、點睛色 4 種色調組成。
flatuicolors （https://flatuicolors.com）
提供多款扁平?彩配??案，可以根據 UI 設計的需要選擇使?。
Paletton （http://paletton.com）
是?個在線的?環配??具，我們可以根據需要選擇單?、相近?、對??等規則來查看配?，也可以實時查看其在??中的搭配效果。
uigradients（https://uigradients.com/）
UIgradients 以分享美麗漸變?彩為主的分享站，??接近上百種漸變配??案，設計師可根據???格來選擇搭配，此外我們還能直接獲得對應漸變配?的CSS代碼。
webgradients（https://webgradients.com/）
富有超多好看漸變漸變配?的?站，只需要復制?彩編號填充漸變，或者直接下載PSD，Sketch，圖?，CSS代碼。
CoolHue（https://webkul.github.io/coolhue/）
富有超多好看漸變配?的?站，可安裝Sketch 插件，或者直接下載圖?和CSS代碼。
中國色網站（http://zhongguose.com/）
只有中國的顏色, 才能這般,美得不可方物
Adobe Color【工具】（https://color.adobe.com/zh/create/color-wheel）
Adobe色輪配色工具，可以選擇色彩模式與調和規則
ColorSpace（https://mycolor.space/）
功能強大的漸變色在線生成器，支持單色、雙色，甚至三色漸變。
色彩是設計中的重要組成部分，不同的色彩傳遞不同的情感和態度給用戶，這也是UI設計規范中需要注意的部分，即做到色彩統一、色彩平衡。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
前言
圖標是用戶界面中重要的組成部分之一。它是一種表示命令、內容并揭示功能背后含義的視覺語言。
你設計的圖標應該可以被用戶立即理解和識別。
如何在你的產品中設計和使用圖標？怎樣給品牌帶來獨特的感覺？我的以下幾點建議建議可以來幫助你設計更棒的圖標。
技巧1 -設置網格
你永遠不會創建單獨一個的圖標，因為圖標總是一套的。為了讓你的圖標具備統一性，你需要一個網格。
定義安全區域并設置邊框。使用生成的網格作為模板，以固化所有圖標的比例和大小。
技巧2 -保持一致
在設計一組圖標時，使用相同的線寬、角半徑和填充樣式。這將確保你的圖標看起來品牌統一和更容易識別。
例如：線寬 - 2px，角半徑 - 3px;
Icon set from Super Basic Icons.
技巧3：表達清楚
在圖標設計中，少即是多。使用清晰的隱喻和點到為止的細節，使每個圖標易于識別和理解。
技巧4 -使用相等的間距
在你的圖標元素之間使用相等的間距，使你的一整套圖標看起來和諧。
你可以通過按住 Figma、Sketch 或 XD 中的 ALT 鍵來計算向量線之間的距離。
技巧5 -視覺矯正
基于視覺中心對齊圖標元素，平衡視覺重量。
技巧6 -填充空間
旋轉局促的圖標，充分利用空間來獲得更好的可讀性。
技巧7 -組合樣式
使用填充和輪廓樣式來描述界面狀態，幫助用戶找到正確的圖標或按鈕。
技巧8-便捷的工具
工具
Icons8.com
iconfinder.com
flaticon.com
thenouproject.com
資源
每個人都是從初學者開始他的設計之旅的，你的審美眼光也要像其他事物一樣經過訓練?？?Dribbble 的設計可能是非常有幫助的，但有時候你只是欣賞設計，卻不明白為什么。
沒有靈感、沒有優質的設計素材、不知道要設計什么，所有這些原因都可能會拖慢你的速度，讓你感到沮喪。所以現在我將和你分享 10 個極其簡單的設計技巧，幫你改善你的設計作品，而且不需要額外學習新的技能哦。
請記住，我提供的不是必修遵守的規則，而是大多數時候都有效的技巧。
如果你沒有好的想法或優質的設計素材，那么你可以把你的作品去色。你可以通過正確的構圖獲得野獸派的設計。這么做有助于你理解平衡、留白，以及如何使用文字和幾何圖形。
讓我們來看一個案例：
我自己發明了一套測試畫面的方法：用簡單的幾何圖形代表畫面中內容，然后通過比較頁面中色塊的面積來確定頁面是否平衡。當你在自己的作品中使用這個方法時，會得到下圖這樣的效果。
通常你需要通過視覺進行判斷，但這里我們可以做一些簡單的計算幫助理解：
左邊區域的黑色矩形加起來約為：
(236 * 138 ) + (934 * 132 ) + ( 313 * 69 ) + (674 * 44) = 207109 PX
而右邊的大長方形數約為：
446×446=198916PX
他們只是相差了一點點 3.9558%。
注意：圓形比長方形小，但由于相當銳利和細致，使它更吸引人的注意。
我在設計之前沒有計算過。經過多年的練習，這只是成為自動的，因為你的眼睛會感覺到錯誤的平衡。
我之前帶來的例子是在灰色背景上呈現的，但你可以嘗試不同的東西。這有助于為你的設計創造一些景深。但要注意，在一個真正的網站中，你不會有那么多額外的空間，所以這只是一個展示技巧!
不要再整天浪費時間去實驗字體大小。一般情況下以下字體大小是合適的：段落使用 14-18 pt 左右，副標題使用 24-36 pt，標題使用 96-144 pt 左右。Figma 的默認大小對于排版來說是相當不錯的。雖然它們看起來會很小，但這是正常的。
有些字體相對于其他字體會偏大或者偏小，所以你應該以標準字體為基礎。比如 Roboto：如果字體大小接近 14-18 pt 的 Roboto，那就非常適合用于段落。
如果你有一些具有透明區域的圖片，你可以利用它們來創建一些分層。
在網頁開發中，CSS 代碼有一個 Z-index 的參數，可以用來把圖像帶到其他項目的后面或前面，給人一種立體的錯覺。
讓我們看看我的一個簡單的設計，其中就利用了這種技巧。
鮮艷的色彩雖然美好，但往往會導致畫面過于刺激?，F在非常流行在設計中使用更加柔和的色彩，你可以在下圖拾色器中紅色標記區域內選取更柔和的顏色。
在我看來，多一些留白要比沒有留白更好。雜亂無章的設計就通常都很糟。你可以通過以下方式獲得呼吸感。
1、保持大量的背景可見。
2、用間距避免文字墻效果。
3、使用不會吸引太多注意力的圖片。
4、精煉你的文字。
通常當我們想到設計的時候，我們會想到干凈、流暢、清晰等概念。但完美就存在于缺陷之中。
在你的設計中，當你想給自己的網站一個優雅或藝術的外觀，噪點是一個強有力的朋友。
此外，應用微妙的噪點讓你的構圖看起來像電影一樣，這對視頻和動態網站來說效果非常好。
你可以通過使用 Photoshop，在白色背景上創建一個 2-4 K 的高斯模糊，然后將其應用在你的畫板上，從而獲得一些噪點紋理。
我們電腦上預裝的字體通常都不是很好的選擇。要想找到更好的字體，可以開始上網沖浪或看 youtube 視頻，了解精彩的字體和字庫。
但要注意：很多字體都不是免費的，在沒有授權的情況下使用它們可能會給你帶來麻煩。不過不用擔心，大多數的字體都有免費版本!
雖然有大量不同的字體和風格，但一般來說，我把它們分為三大類。
1、古典字體
2、現代字體
3、正文字體
通常情況下，前兩種也可以用在正文中，只是字體的設計者希望你把它們當作標題來使用。
古典字體包括Abril Fatface、Playfair Display、Volux、Chalga和許多其他字體。
現代字體包括Metropolis, ITC Avant Garde, Redwing, Takota, Gotham....
這可能是最難利用的技巧，但如果應用得當，畫面會非常有沖擊力。
利用幾何圖形有助于強化布局中的概念和秩序，甚至不需要使用額外的圖像。找到合適的幾何圖形是很難的。目前我還是不能很好地掌握它。
但是有一個訣竅是，把你的文案中的字母、數字和標題當作幾何圖形：把它們做成巨大但微妙的形狀，或者用一些特定的字母作為形狀（字母 A 就很好用）。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
Logo 勝過千言萬語。一個偉大的 Logo 不用一個字就能講述一個故事。
最近，許多公司的商標都經歷了一次轉變。從通用汽車（GM）這樣的汽車公司，到漢堡王（Burger King）這樣的餐廳，再到品客（Pringles）這樣的食品公司，很明顯，許多公司都在嘗試重新設計商標。
然而，在重新設計的同時，也有反對聲音。反對改變的聲音是向來常見，然而不喜歡某一個特定的設計語言卻比較鮮見的，那么到底發生了什么?
通用汽車（General Motors）改變了自 1964 年以來一直使用的標志是廣為周知的，它用以保證電動汽車的發展。Dezeen /通用汽車
為什么要修復一些沒有損壞的東西，為什么要改變一個已經受到喜愛的標志?這是每個人都會問的問題，每當一個新的標志出現，我們就必須考慮到一個標志的重新設計是不便宜的，往往會花費數百萬美元和多年的研究。乍一看，一家公司這么做毫無意義，然而每隔幾年就會有很多公司這么做。
雖然我不是平面設計師，但我個人認為 Logo 和品牌的重新設計有兩個主要驅動因素：技術和市場。
技術對設計影響很大，它既支持又限制了它。計算機硬件和軟件的采用和改進等技術進步為設計師們提供了嘗試新事物的機會。技術對設計也會有限制，比如有限的屏幕尺寸或能量消耗，但同時也會驅使設計師發揮創造性。雖然技術可以影響設計決策，但市場(在某種程度上可以等同于消費者)才是主要的決策者。
市場，無論是企業客戶還是目標消費者，在設計決策方面自然是最高的權威。如果一個公司覺得自己不能從中獲益(畢竟 Logo 的設計并不便宜)，重新設計 Logo 就很少發生，即使這可能會引起現有消費者的強烈反對和抵制。重新設計 Logo 可以是一個新的開始：向消費者傳達他們對未來的期望。
動物星球的標志變化過程，它隨著每一次迭代變得越來越簡單。
所以讓我們來談談這個非常顯而易見，而又容易被忽略的問題。從 iOS 7 到純果樂——極簡、極簡或扁平化的平面設計風格已經興起近十年了。我們已經討論了技術和市場是如何決定趨勢的，但是對于我們今天所面臨的當前趨勢：以最小的、扁平的、最簡單的標志重新設計，它又說明了什么呢?
技術的訴求——對在線展示的日益增長的需求是公司簡化其標識的主要原因。快速增長的移動設備使用率導致高度詳細、高度程式化的徽標設計的舊設計方案越來越難以實現。在可伸縮性和文件大小等方面，矢量的圖像變得更加流行，與柵格圖像相比，它們更容易創建、操作和編輯。像 Airbnb、Animal Planet 和谷歌就采用無襯線和塊狀字體的商標，之所以這樣做，是因為這樣在手機等設備上更容易閱讀。
市場需求——企業和消費者似乎都支持（當然并不是沒有阻力），應該走更簡單的道路。更簡單的平面設計意味著它更容易被廣大用戶理解和識別。許多扁平化設計的支持者認為有效、友好、干凈和中性的特征是扁平化風格的優點。誰還記得在 2000 年代，Windows Aero 的頂級設計是多么的混亂不堪?時代當然變了。
當平面設計成功時，就可以創造出華麗而有意義的標志，它們經得起時間的考驗；IBM 和 Shell 的標志就是我最喜歡的幾個。但是，盡量簡單更容易創造出一些最好的標志一樣，也很容易失去目標。
是不是過于簡單了？
最近十年間，平面和極簡主義設計的標志重新設計正在興起。
在最近的十年里，很多公司一直在用扁平化風格來重新設計 Logo，Logo 隨著時間的推移變得越來越簡單，盡管在線社區的用戶們的感受各不相同。
任何重新設計都會遇到各種各樣的反對。沃爾什（Walsh）、凱倫?溫特奇（Karen Winterich）和維卡斯?米塔爾（Vikas Mittal）的一項研究顯示，消費者對品牌(品牌態度)的認知，在消費者對重新設計的看法中扮演著重要角色。
2003年，像蘋果這樣擁有高品牌忠誠度的公司決定更換 Logo，在宣布后數小時內就收到了網上請愿書，這一點就很明顯。沃爾什、溫特奇和米塔爾認為，商標的重新設計擾亂了已經形成的相對穩定的關系，消費者顯然對此感到不安。
一位推特用戶對 firefox 徽標的改變非常憤怒，盡管它并沒有被實現。——UnfunnyLuigi
有一些被重新設計的 Logo，比如漢堡王卻受到了熱烈歡迎，而其他的，例如火狐和動物星球則受到了嚴厲的批評。漢堡王不僅采用了更簡單的設計，還抓住了人們的懷舊情緒，因此比動物星球（Animal Planet）這樣的 Logo 更容易被接受。
需要指出的是，扁平化的 Logo 設計本身并沒有什么錯，許多 Logo，如可口可樂、IBM 和殼牌，都由于其簡單易記的特性成為永恒的杰作。導致人們強烈反對扁平化 Logo 設計的原因可能是人們對企業和企業文化越來越反感和憤世嫉俗。像企業藝術風格、企業孟菲斯和全球同質化等概念通常會被指責為“過度簡化”標識設計浪潮的罪魁禍首，因為很多設計決策都是冷血的，缺乏人文特征的，讓人感覺不自然或虛假。
不喜歡過于簡化的商標已經成為網絡熱點，尤其是在YouTube上?！猂evified
由于許多內容創造者和互聯網熱點已經導致了文化抵制現象出現，人們不再只是隨意在社交媒體上發泄不滿；人們把這些過度簡化的商標描繪成冷酷無情的科學實驗的結果，有些人甚至證明了如果這種趨勢繼續下去，過度簡化的商標會導致什么，它們會創造出一個乏味的世界，每個商標都是一樣的，沒有個性。
Youtube 用戶 Solar Sands 在他的視頻文章《為什么企業的藝術風格讓人覺得非常虛假》( Why do corporate art styles feel fake )中指出，許多公司，尤其是大型科技公司，這些公司曾經多次產生消費者的信任問題，而它們恰好使用了許多扁平化設計風格。我們就把負面問題與這種設計風格的聯系了起來，對這種風格留下了糟糕的印象，因此我們憎恨它；我們覺得這些冷血的公司正在奪走我們所愛的東西。在這波憤世嫉俗的浪潮之后，Solar Sands 以一段出人意料的評論結束了他的視頻：任何潮流都有保質期。
接下來將是什么?
百事可樂不斷演變的標志讓我們很好地洞察了各自時代的設計趨勢。——Logaster
設計趨勢總是周期性的，每個趨勢都有保質期。百事可樂的商標就是一個很好的例子，它說明了設計世界是多么地充滿活力：從簡單的設計到復雜的設計，再到簡單的設計。沒有一種設計風格是絕對好的，但它必須與時代相適應。
微軟的 Fluent Design 吸收了一個新的風格,強調光,深度、材料和尺度?！④?
隨著大眾對當前設計趨勢的不滿不斷發酵，扁平化設計風格可能要終結，但人們永遠不知道什么時候或者什么會取代這個簡約至上的時代。許多蘋果和微軟等公司都將新擬物風格和玻璃擬態的元素融入自己的設計語言，試圖為其添加性格和細節。雖然我們肯定不會在一夜之間回到過去那些充滿華麗而又過分精細的 Logo 的日子，但扁平化設計的流行趨勢可能會開始消退。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
一個好的設計不僅是解決正確的問題，還要為用戶創造積極的情感。一個實體產品可以通過人類的 5 種感官來創造情感；但對于數字產品來說，因為它只是在設備屏幕上進行干巴巴的交互，然后提供服務，所以很難創造良好的情感體驗。
所以數字產品設計師需要深入了解每一種情感，以及能夠創造情感的心理學原理，才能更好地設計相關產品。
唐·諾曼認為，可以從三個方面對用戶的情感體驗進行設計：本能層、行為層和反思層。
本能層："用戶想要的感覺"
行為層："用戶想做什么"
反思層："用戶想成為什么樣子"
在第一個層面，設計將通過用戶的視覺和與產品的互動產生情感。因此，這也是 UI 設計師大顯身手的地方。除了審美和基本的平面設計原則外，以下是我目前在設計中運用的心理學規則。
1. 格式塔原則
相似性原理
人的眼睛往往會把相似的元素連接成一組，大腦會認為這些元素有相同的作用。
因此，在設計具有相同功能或內容的界面元素時，要使其一致。
應用場景：導航、畫廊、卡片、橫幅、內容、分頁。
連續性法則
人的眼睛將排列在連續體中的元素視為一組。這個規律與對稱性和相似性頗有關系。通過在一個序列上創造相似和重復的元素，我們可以將用戶往我們想要的方向驅動。這使得閱讀信息更加連貫和清晰。
輪播圖就是應用了這一規則的設計，為用戶提供了還有信息可看的提示。
應用：菜單/子菜單、列表、產品排列、輪播圖、進度指示器。
封閉法則
當看一個不完整的圖像時，大腦會依靠以前的經驗，把剩下的填滿。
這是圖形或 Logo 設計中常用的規則。但在產品設計中，我們可以將其用于圖標和加載。
應用：圖標、加載、數據可視化。
鄰近法則
這是 UI 設計中必不可少的規則，因為人的眼睛會把任何相鄰的元素當作一組。
在設計的時候，我非常注意利用間距將元素組合在一起。我通常用大的空間來分隔大的內容群，然后用小的空間來分隔大的內容群中的小的內容群。
應用：導航、圖庫、卡片、橫幅、內容、分頁。
對稱法則
我們的大腦喜歡看到對稱和平衡的事物。這是在所有設計領域中最常用也是最安全的法則。它幫助我們創造一種穩定和秩序感。
在設計需要簡單、視覺化、和諧的產品時，我經常會將對稱性應用到其中。當觀眾需要專注于重要的東西時，這也有助于他們感到更舒適。缺點是，如果過度使用，產品會變得枯燥單調。通常，我應用于頭部或行為召喚按鈕，以更好引導用戶產生行動。
應用：圖庫、焦點圖、重要內容、產品展示、列表、導航。
主體/背景原則
這個規律是關于人的眼睛傾向于注意到脫離背景的事物，或是被框為一組的內容。
我用這個規則來引導用戶的視線去預覽重要信息。通常是在卡片設計中，用淡淡的下影在背景上方鋪設一層。此外，構圖組也是應用這個規則的一種方式。
應用范圍：卡片、內容、列表、服務、摘要。
共同命運法則
在同一方向上移動的元素被認為比靜止的元素或在另一個方向上移動的元素更有關系。這一規則的應用有助于我們建立群體和狀態之間的關系。
我在做動畫的時候，經常比較明確地使用這個規則。但是，我們也可以應用到更多方面。
應用：導航/下拉菜單、折疊菜單、折疊面板、工具提示、滾動條、視差滾動和指標。
2. 焦點
當我們看某樣東西的時候，我們的眼睛往往會先關注最突出的元素。理解這種行為將幫助我們在設計中創建一個 "錨點"，從而推動用戶按照我們的方案去瀏覽內容。
應用：內容頁、落地頁、價格頁、產品頁、焦點圖。
3. 馮·雷斯托夫效應
又稱隔離效應，它表明人們傾向于注意和記住與其他部分不同的部分。這個規則很容易與焦點法則相混淆。不同的一點是，應用這個規則的元素往往是獨立存在的，并沒有額外的功能和信息。
應用：定價表、促銷橫幅、權益升級。
4. 本能反應
基于真實世界的用戶體驗，創造出具有視覺吸引力的體驗。就像我們看一個視頻時，每一個高潮笑話都有笑聲的配音，我們就更容易笑。如果我們的設計能讓用戶感覺很好很舒服，用戶就會喜歡我們的設計。
應用：產品形象、插圖、攝影。
5. 色彩心理學
有許多研究表明，顏色對我們的潛意識有特別的影響。不同性別、不同宗教、不同文化的人對色彩的看法也不同。
另外，我們也不要忘了早期被廣泛使用的系統的顏色：
紅色：錯誤
綠色：成功
藍色： 進行中
黃色：警告。
6. 形狀心理學
和顏色一樣，人的潛意識對不同的形狀也有不同的反應。比如:
圓形 、橢圓形：傳遞一個積極的信息，通常與社區或關系有關。
正方形和三角形：傳遞強烈的信息，通常與力量和穩定有關。
豎線：代表強度、力量或侵略性。
水平線：代表平靜、平等或安靜。
7. 雙重編碼理論
這個理論解釋了人類需要視覺和語言信息來盡快處理信息。而且，人類是視覺動物，我們的大腦處理圖像的速度是文字的 6 萬倍。而為了達到設計的最大效果，我們不應該刪除說明性文字。
一個明顯的例子就是應用程序的導航欄。大多數新的應用程序或具有復雜功能的應用程序都是用圖標和標簽來設計的。
另一個例子。
8. 并行設計
相較于其他元素，人的眼睛往往會更容易注意到平行的元素。我經常用這個原理將同一屏幕內的兩組不同內容進行分類。最容易看到的相關案例可能是 Facebook 的消息界面，“故事”并排而消息水平平行排列。
9. 共同區域
這個原理就像《格式塔原理》中的相似性法則一樣，但它并不以相同為終點。共同區域是通過我們使用劃分的方式，通過線條、形狀或顏色來創建的。
如果一個屏幕需要用戶大量滾動來查看內容，我們應該有一些方法來將其劃分得更清晰，而不是僅僅使用間距。
應用：列表、信息流。
10、掃描模式
根據 NNGroup、UXPin 等機構或團體的各種研究，最常用的兩種掃描模式是 "F 模式"和 "Z 模式"。
其中，"F 模式"的應用最為廣泛，尤其是對于內容較多的網站。
“Z 模式”用于那些不太注重文字的網站，往往在最后強調行為召喚按鈕。
當我們了解了這些模式的使用方法后，我們就可以有效地選擇布局和安排元素來實現我們的設計目標。
第一印象是最難忘的，積極的體驗可以在用戶和產品之間建立長久的關系。如果我們能讓用戶在第一時間愛上設計，我們就為我們的產品創造了相當好的優勢。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
藍藍設計的小編 http://www.syprn.cn
