一類支持有C端前臺，支持前臺產品管理各種資源。第二類服務企業，提高企業工作效率和營收。
根據后臺功能：
1.監控運營：時效性強，旨在實時反饋異常情況，快速判斷下達命令，回復信息、多用于數據控制中心。
2.數據分析：數據結果的對比和分析趨勢，時效性要求并不高，了解整體和各部分數據水平，助力決策。
3.記錄管理類：主要用于人員、設備、資產等增刪改查，文本信息容量大，頻繁便捷的操作。
4.系統配置：權限配置、設備功能配置，操作為主。
淺色：適合文本信息多密集的表單列表類后臺，淺色更符合人眼白底黑字的閱讀習慣，瀏覽速度更快，信息獲取效率更高。
深色：圖像信息密集的后臺適合圖片、數據可視化圖表等；深色對彩色的圖像信息襯托更強。信息獲取速度較慢，長時間可能視疲勞。
較常見
經典商務風（導航深、內容淺）——專業、高效、成熟、可信賴（對照深色西裝人物形象）
優點：市面最常見的風格，普世性高，大多數用戶可快速接受，層次分明
缺點：視覺缺乏記憶點
2.輕量科技感（導航淺、內容淺）——簡潔、明快、輕量、年輕（對照白襯衫打領帶男性）
優點：視覺清新明快更年輕化更輕量，對其他文本及圖形展示包容性高，就像A4白紙一樣容器存在感弱
缺點：純白色導航+頁面層次略曖昧。
3.藍色科技風（導航中、內容中）
適合：適合科技屬性強的產品界面，圖像圖形展示
缺點：對其他色彩信息有干擾，持續性長時間觀看易視覺疲勞
4.暗黑科技風（導航深、內容深）
優點：對色彩表現力強
缺點：密集文本信息獲取速度會下降，持續性長時間觀看易視覺疲勞
比如美妝和科技行業的整體設計基調就不太相同。
理性可靠 or 簡潔輕松輕量 or 關懷普世 or 酷炫吸睛….這個可以和相關產品經理、銷售共同商討
根據目標用戶的性別、年齡層、受教育水平，審美水平考量（可能包含多種角色，選取1.2個核心角色為參考）帶入目標用戶工作場景及愛用物常用物品味，去判斷基調。
如主要用戶群：40+男性用戶，本科以上受教育水平，使用windows電腦進行專業管理操作，審美傾向明確內斂。
如主要用戶群：20-40歲，男女比例約6：4；大專；操作水平參差
例如：最常使用數據分析管理，需要快速閱覽多條數據，對數據進行比對，更適合淺色風格展示表單數據。
獨立開發的，可以采取更獨特設計。若平臺很大需要不同外包公司的合作屬于整合類平臺則更注重設計的包容性。
“731配色比例”70%的面板色，30%的導航面板色，10%的強調色。（這里的用色比例可以根據內容具體再去調節只是大概比例）品牌色或重點色：強調行動關鍵點、重要信息高亮、圖形化說明等。強調色用就要用的像蛋糕上的櫻桃。起到畫龍點睛作用即可。
后臺高頻出現的圖標，值得我們花時間去統一設計打磨，調整圓角粗細疏密，符合整體界面氣質。從圖標庫里拖出的圖標很多在線條粗細上是不統一的，好的設計在細節處也要動人。
B端工具類圖標識別性第一，美觀性第二。B端導航圖標更多是在基礎造型上打磨，不需要加花里胡哨的漸變、投影，導航圖標一般在24px-16px大小，太復雜反而看不清。在區分狀態的時候可以考慮加點品牌色
空狀態插畫是B端設計師少有能發揮自己繪畫天賦小巧思的地方。
圖形化狀態語言，輔助用戶理解內容?？梢詫a品機械蒼白的文案設計表現的更加具有溫度，具有引導性。讓乏味的工作出現一些共情小彩蛋，有趣的插圖動畫可以緩解等待的焦慮。
4.登錄注冊頁
純色背景卡片式：簡單大方更聚焦登錄操作
插畫背景：場景化展示產品的功能及亮點，讓用戶更有心理預期
幾何圖形背景：最后和品牌圖形相關，加深用戶對產品的品牌印象。
照片背景：相關場景或產品類型，具象圖片信息更直觀
不同大小的圓角傳達產品不同的氣質，大圓角親和、小圓角精致、中等圓角大眾中庸。
優化信息層級，區分信息主次可以使閱讀更快，操作更快，界面更有節奏感。
這時候你就是那個考前畫重點的老師
判斷一個頁面里最重要的是那些信息或操作，強化它！并弱化輔助信息；
判斷一個模塊里那些是重要信息，強化它！
追求炫酷的視覺效果舍棄操作效率。比如追波風滿屏花里胡哨的卡片及面板，滿屏大投影及高飽和色彩。對于B端界面來說信息噪音太多，反而干擾信息獲取效率。
2.反常規用戶習慣的操作。尊重用戶習慣，不要為了個性化去嘗試改變，不要妄圖改變用戶的操作和認知的慣性。慣性思維大于設計思維，曾經遇到過產品因為右手操作所以要把導航放在右邊的離譜例子。
3.數量多，動靜大的夸張的動效。B端與C端不同的地方在于希望操作者沉浸式工作，遵循非必要不打擾。之前看過一個反面例子后臺，在每一步操作后都出現大的場景動效鼓勵完成，如果作為一個長期使用的工作者，我會覺得每次完成任務都需要等待動畫完成可能只需要2-3s也很浪費我的時間。
4.新人建議多看Antdesign和Element等成熟的組件，創新類組件樣式，最好和和開發商量是否能夠實現。
5.在確定主要風格及2-5張主要頁面后，就應該著手基礎規范（色彩字體等，不然后面越做越亂）。
6.一段時間一個審美，同一界面中的元素風格不統一。
7.避免大面積使用高飽和高明度的色彩，及曖昧含糊的臨近色彩。長時間使用眼睛會累，產生不耐煩焦躁的負面情緒。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
“直播”作為一個大熱領域，用戶規模早在 2020 年就突破了 5 億大關，在“直播+”的模式下，電商、教育甚至是醫美，都能在直播領域下找到新賽道，并產生持續性獲客。但就是這樣一個核心領域，具體要怎么分析復盤，卻鮮少看到系統化的文章。本文主要是結合我近期參與產品直播項目的思考，總結了自己的一套直播復盤方法論和大家分享。
雖然“直播+”模式已成為行業趨勢，但在產品接入直播模塊而產生的付費效益又不明顯時，其存在的意義和價值仍時常被挑戰，因此首要的就是驗證其價值；
同時，新領域缺乏可復用的方法論，只有不斷探索、優化、沉淀才能促進其健康化生長；
最后，在產品范圍下的直播領域，定向吸引的還是產品用戶為主，持續挖掘探索直播能為產品開辟的新賽道，為產品帶來拉新，是“直播+”模式對于產品的直接價值體現。
直播具備快節奏性和強競爭性，在兼顧快速復盤的同時，還需要考慮階段性的整體化的對直播數據進行監控，因此需要將直播復盤分為快速復盤和階段復盤 2 個大方向。
1. 快速復盤
在直播結束當天或隔天對昨日數據進行快速復盤，此時重點關注單期直播下的直觀數據表現和用戶反饋。目的是獲得沉淀當天直播的經驗并快速應用至后續直播中，是一個不斷 PDCA 的過程。
在復盤維度上，可以分為數據側和用戶側：
數據側中我們重點聚焦本期的數據表現，同時橫向對比其他直播期，去明確本期的數據表現
1）橫向對比時，需要將直播關注的 3 大核心數據（總人數、最高在線人數、評論人數、在線時長均值）與其他期對比，明確該期直播的“優劣”。
當期直播核心數據
2）聚焦本期時，重點關注直播數據的整體在線人數變化趨勢，定位到最高在線點，和直播內容擬合，能夠幫助我們定位直播的“高光點”。
用戶側中則更關注主播在播、用戶在聽和答的過程，包含：
2. 階段復盤
在累計多場直播后，此時最需要的就是階段性的復盤，從宏觀角度對多期直播進行收斂分析，能夠幫助我們明確直播對于產品的核心價值，并定位核心用戶圈層、吸引點及直播應該要有的“節奏”。
在階段復盤中，除了數據側、用戶側外，我們還需要關注市場側：
數據側—不同于快速復盤，數據側我們關注整體宏觀角度上直播對產品的價值，以及直播整體的數據表現，熱點分布等
1）從直播對產品價值定位來說，在未探索付費的情況下，直播能為產品做的就是吸引新用戶，增加用戶活躍、延長用戶在產品內停留的時長上。
價值定位時關注的數據范圍
在明確價值后，就應該明確后續要如何把直播做的更好，這里數據上可以分為 2 個大的方向，一是熱點分析，二是直播節奏分析。
2）熱點分析上，需要從單期、分類、詞項拆解上看。首先，單期直播就是簡單地對單期直播數據進行排序，找到“好”的直播提煉其特征性；其次，分類分析上關注各類直播數據間的橫向對比，能從分類數據對比上，看出哪一類直播更吸引用戶；最后，通過對每期直播的標題進行詞項拆解，篩除掉無意義的詞項，再乘以對應期直播的人數，對每個出現 2 次及以上的詞項數據取出其對應的單期直播人數均值，即可定位到用戶最關注、最能吸引用戶的核心關鍵詞。
熱點分析
3）直播節奏分析上，得益于階段性復盤的龐大數據量，我們可以聚類出多期直播聚類下的直播趨勢線，在趨勢線上，亦關注 3 大核心點 “拉新、增長、流失”。
a. 用戶進入直播的高峰期（即新增高峰），可用于定位直播亮點，并對應布局以留住用戶
用戶進入直播節奏分析
b. 通過直播數據排序后的高于中位數直播、低于中位數直播的 2 種直播數據走勢的對比，我們能夠看出好的直播應有的數據走勢應該是什么樣的。以我這次分析的直播為例，能夠直觀看出，“差”的直播在增長黃金期都“爬”的很慢，而在黃金期后直播數據逐漸平緩，“差”的直播數據就成了定局。因此要做的就是在增長黃金期，去盡量促進增長。
用戶流入流出關系分析
c. 那么在增長黃金期，從產品策略來看，要做的是留住用戶？還是盡量去拉新？從數據上，我們有 2 種方式判別，分別是相關性分析和假設分析。在相關性分析中，將新增人數/流失率對標最高在線人數，以數據模型分析其相關性，從相關系數來看哪個指標與最高在線人數相關性最高，即影響最大；在假設分析中，我們可以將“低于中位數”的直播數據中的新增人數/流失率分別對標“高于中位數”直播的數據，其他保持不變，看哪種情況下，最高在線人數是更高，數據是更好的，就可以定位出更應該在哪塊發力。
用戶側—要明確直播受眾及用戶圈層，并針對這部分受眾的觀看體驗，進行服務體驗走查，更能夠幫我們明確后續業務重心、范圍及宣傳模式。
在用戶圈層上，我們對觀眾數據清洗，從年齡、性別、地域、渠道等各項維度去定位觀眾的特征。同時，考慮到直播本身是以產品為載體，其用戶圈層基本上與產品本身重合，但會存在一定差異性。因此，此處可以結合 TGI 分析，可以定位到直播用戶圈層相較于產品來說的差異點，從而更針對受眾進行直播內容調整。
用戶圈層分析
同時，直播本身因其特殊性質，也可類比至服務體驗設計的思維，因此在用戶側分析時，從直播前-中-后 3 個大環節上分析用戶行為、需求、痛點、快點，從而定位到各個環節直播優化的機會點，推進優化。
直播-體驗地圖
市場側—在市場分析時，我們不僅需要關注那些在直播領域做的好的同類競品，同時也要去多分析在受眾群體中，最近的熱門話題是什么，有助于后續在宣發時引出直播核心話題，也能夠帶領我們思考直播的新賽道，以協助產品拓寬其用戶圈層。
直播作為互聯網新賽道，直播+的模式可用于產品宣發、獲客、促活等各個方面，挑戰與機遇并存。但正因為是新賽道，也相對缺乏體系化的方法論。本文主要是分享我在工作中沉淀下來的直播復盤方法論，也歡迎大家有什么見解或者想法也可以與我分享。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
編輯導語：數據分析有助于幫助我們獲知業務效果及其他效果反饋，然而當下企業在線下業務當中，不少數據都有所流失，這就要求企業尋找更有效的數據體系搭建方式。本篇文章里，作者就線下業務的數據體系搭建做了總結，不妨來看一下。
前言
在實際的業務環境下，能夠完全通過線上留存的數據搭建業務數據體系的情況主要還是以互聯網公司為主，有大量的線下傳統公司，是沒辦法通過線上數據的積累完成業務數據體系的搭建的，在這種情況就得通過不同類型的數據來源去獲取業務中可能涉及的數據，設計合理的業務數據體系，完成線下業務數據的監控、維護和分析。
如果是從數據邏輯出發，第一步應當是監控數據，就是我們平常一直說的看數據。
但在實際業務中，尤其是線下業務中，其實有大量業務沒有留存業務發生時點的數據，在業務的各個轉化節點的數據也很難及時獲取留存，大量的數據丟失。如果需要從監控數據開始，其實相對來說難度會很大，甚至有很多業務數據沒有合適的方式被留存下來，在日后的數據分析搭建中也無法起到作用。
所以，我更建議從業務的發展方向上入手，盡量細化業務流程，明確各個業務流程對部門業務到底有什么影響，核心業務流程是什么，優先從核心業務流程入手，根據業務流程的步驟完成業務數據的監控和留存。
舉個例子，如果對保險行業熟悉的朋友會知道，保險業所有公司都有“培訓”這個項目，甚至在保險業里面“組訓”、“督訓”都是很吃香的崗位，能夠在短期內積累大量經驗，往公司中高層走更快速，這個崗位主要的業務范疇就是“培訓”，培訓外勤、培訓新人、培訓合作渠道等等。
怎么評價培訓效果呢？依靠外勤人員的銷售量、銷售額對培訓效果進行評價，剩余對培訓效果的評價來自學員和更高級的培訓講師的打分。
其實可以從上述模式看出，對線下培訓這種業務模式的評判，對培訓崗工作人員能力、業績的評估其實很難通過以上評分模式進行量化，更不用說實際培訓效果的追蹤。
還是同個例子，如果要想追蹤實際培訓對銷售業務產生的效果和影響，要關注幾個模塊：
從培訓業務的目標出發，如果想從更細化的角度去關注培訓，會有以下幾個業務方會想要關注的點：
所有這些關注點的數據，均無法從線上獲取，也很難追蹤（這還是僅僅線下業務在實際業務細化關注項提出后的一部分數據的數據量化和追蹤，如果要實現業務數據的獲取，就需要公司嚴格要求外勤人員反饋該類型數據，可想而知如果是溝通渠道獲取業務數據，就會顯得更為困難）。
在這種情況下，線下業務數據體系建立就需要建立嚴格且標準的業務數據體系，這需要與每一步工作流程相互契合，這個流程有點類似于線上數據埋點的過程，只不過因為業務不在線上，沒法在線上完成數據積累。
當然，線下數據埋點和線上數據埋點完全不一樣，因為缺乏線上工具的記錄能力，大量數據記錄只能依靠人力完成，如果想要通過人力完成這類數據登記匯總，就需要使用統一的工具，使用統一的數據字段、數據格式，這需要做到數據流轉記錄的標準化留存。
以上問題的解決方法除了需要依靠人力對數據進行核準清洗外，建議最好是按照統一的字段建立本地數據庫。
熟悉EXCEL或者WPS EXCEL的朋友會了解，這兩個軟件的處理能力隨著數據量的上漲會十分受限，如果是行數超過百萬級的話，是無法在EXCEL中操作的，會出現數據丟失。
同樣的，如果數據量在20萬以上，使用IF系的函數將會加重性能負擔，非常容易崩潰，尤其是當出現過去的某一原始主鍵重復出現的時候，利用EXCEL技巧實現等價FOR循環會變得更難。
這個時候我們會更傾向于在本地建立MySQL數據庫，可以利用MySQLworkbench或者NAVICAT對本地數據庫進行處理， 利用本地數據庫的字典表的字段完成線下交互數據EXCEL/CSV表格表頭字段的統一，在簡單獲取了線下匯總回來的數據之后利用update函數完成數據更新，形成本地數據庫。
作為參考，這個是阿里天池某次比賽的測試集數據源，測試數據集的文件不超過100M，模型處理后的預測集也就100M-150M，這部分數據條數約為20W，如果是數據條數在70-80W左右的線下數據，文件大小會達到超過200M，如果還需要清洗、維護這些業務數據，僅僅依靠EXCEL是完全不現實的。
既然要建立數據庫，線下數據的維護同步時間就極為關鍵，線下數據的收集端口需要明確，不同部門、不同渠道之間進行數據交互的人員要固定，交互時間要固定，否則就容易出現數據交互不清晰，導致最后在不同的統計節點的數據無法統一，不斷會出現數據重復更新的情況，不利于數據檢測監控。
這要數據監控和數據維護以及數據統計在同個周期內完成，同時還要確定所有數據的每一次更新都是以數據覆蓋的邏輯，即每一次新增更新的數據范圍和內容必須是完全新增的數據。
舉個例子，新增的數據版本為C，數據庫內現有數據版本為B，更早的版本為C，上傳的時候就不允許C版本的數據中含有A版本的數據內容，這樣會導致數據的轉化順序存在混亂，涉及時間續流的數據就出現問題。
以上是線下數據體系中數據監控和數據維護的部分，接下來我們聊聊線下數據分析體系的搭建.
和線上數據類似，所有的線下“埋點”的數據回收都是服務于實際業務數據分析的，可以這么說，我們要的不是數據，而是數據告訴我們的事實，以及我們根據歷史事實能推導出的合理預測，從邏輯方法論上面，就是歸納—演繹。
想進行數據分析，首要的是需要對歷史和現階段的事實情況進行歸納統計，這就需要加入線下“埋點”的數據進行統計分析，即，先深入了解知道自己的情況。
深入了解自己的情況可以從以下幾個方向去深入思考：
了解了這些自身情況之后，還需要深入了解，那些和你在做一樣事情的人，在面對同類型業務核心指標的人，他們的工作情況、業務完成情況、實際業務流程轉化，和他們歷史的情況。
當然，所有的這些外部事實情況都可能不準確，這就需要從業人員實際判斷這些外部信息的準確性和可用性。
這些事實怎么得出？通過數據的形式。
這些事實怎么校驗？通過數據的形式。
舉個例子，還是以我們上說的保險公司培訓部門的例子。
假設當前保險公司的業務正常，市場正常，政策上國家沒有對保險市場提出什么更為嚴苛的政策要求，在這些條件下：
這些是相對比較概念化的事實，這時候就需要利用數據把所有的事實細化描述清晰，且所有的數據都需要和工作流程相關聯。
同時，所有的業務數據分析都需要建立“時間”的概念，我們可以畫一個時間軸來看這個業務流程：
每個業務流程下其實都需要一定時間完成當前工作狀態的信息收集，數據本身就具有時間的特性，如果是金融公司、金融部門，還會對數據的時間序列有更嚴格的要求，因此，數據本身就需要打上所屬時間的標簽。
在業務流程中，記錄每個事件發生時間點的數據，留存這些時間標簽下的數據，完成基礎數據源的匯總。
在分析中可以將分析劃分為幾層，可以先按“事前—事中—事后”的順序留存各個事件發生時點的數據，從中盡量明確有規律性的節點，例如：
這些時點的數據收集可以幫助你深入了解業務流程，在日后做到各類自動化有很大程度上的幫助，這就是業務體系初步建立之后再進行優化的工作了。
在關注了業務的核心指標后，找到能夠對核心指標產生影響的因素，將這些因素拆分成“事前—事中—事后”的形式，設定一定的主鍵完成數據特質化的積累。
以電商為例，電商可以以“訂單號—用戶ID”的形式，如果是在保險培訓的角度下可以參訓外勤人員ID作為主鍵，當然，不同的業務模式會有不同類型的主鍵，涉及的后續的一些數據內容也不一致。
還是以保險培訓為例，在培訓中有大量數據是沒有辦法輕松進行積累的，也同樣不能很明確地進行量化，這時候就要建立評分卡的制度，用于量化一部分難以直接估量的行為數據。
比方說，A講師培訓營銷技巧和保險學原理課程，兩門課程完全不屬于同一個課程體系下，在實際外勤作業中，營銷技巧所能給實際業績的增長是短期高效的，而保險學原理課程可能在提升外勤人員金融素養方面更為突出，可能在面對高凈值客戶的時候能更體現優勢。
這部分提升并不會很直接的在實際銷售業績上有明確的體現，這時候就會需要對實際的培訓效果進行分類歸納，建立不同評分評級制度。
類似于量化投資，這些數據都會需要和業務核心指標建模擬合判斷，根據歷史經驗，最好是建立相關的多元線性回歸模型，機器學習模型雖然在預測方面更具有優勢。
但是實際可解釋性并沒有那么強，在實際業務總結反饋的時候并不能明確的找出問題所在，所以在預測分析的角度還是更推薦從線性回歸的角度配合相關性進行分析。
希望分享的這些給現在還在線下摸索業務數據體系搭建的朋友們一些啟發。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
文章來源：人人都是產品經理 作者：Logan_RRRC
前言：如何讓你的設計更有價值，設計有價值代表你的方案有價值，你的方案有價值代表你的理論有價值、你的理論有價值代表你的專業能力體現，歸根到底，說明了什么人作出什么樣的作品的同時會帶來相應的價值。站在設計師的角度看，在公司里，屬于站在用戶體驗上的提出的設計建議或者設計方案，基于“以用戶為中心”理念和交互設計原則，通過自己的設計思維與專業能力，為公司創造更大的價值，不單只是一個美觀的輸出。
目錄：
一、設計行業的發展趨勢
a）設計與產品的關系
b）找到自身價值的重要性
二、了解設計師的價值分層
a）設計協同
b）推動業務增長
c）設計驅動產品
三、設計師需要具備的哪些思維？
a）雙鉆模型解決問題
b）“五度”設計成果評估模型
c）培養數據思維，利用數據提升設計的價值
一、設計行業的發展趨勢
a）設計與產品的關系
以前，設計師在團隊里的位置會比較尷尬，因為沒法驗證自己對業務的推動是否產生了什么明確的價值。而大數據的來臨，設計的價值變得顯性化，作為與用戶關系密切的設計師，善用好數據，可以發揮的作用其實很大。我們可以通過自己的設計思維與專業能力，為公司創造更大的價值，不單只是一個美觀的輸出。這就使得設計與產品業務關系越來越密切，是整個行業發展的必然趨勢。
舉一個設計以小成提高業務的實例。這是我之前做的分揀軟件迭代首頁的自定義配置組件。在改動前分揀首頁功能多，甚至有時候需要滑動尋找。尋找點擊率大概是不到16%，改動后提高到了40%，不消耗任何其他人力、物力成本，就可以用設計讓CTR翻倍。
設計目標：減少首頁模塊尋找的時間，加大成功點擊率，考慮延展性發展
現有問題：主次功能混淆、視覺點不夠集中、點擊按鈕不明顯
優化方案：1、主次布局調整，主上次下；2、面積放大提高模塊命中率；3、色彩區分主次按鈕；4、添加“?”自定義配置首頁主功能，加入人性化設計理念。
體驗連接：https://www.growingio.com/projects/lPQ7bOj9/product-analytics/heatmap/j9yvlyRy（賬戶/密碼miaomiao/liuge1)
b）找到自身價值的重要性
自身價值顧名思義就是你的工作成果會帶來什么價值，按照公司更看重我們的設計能給產品的發展帶來多大的價值。雖然職位的性質已經很明確你的價值的體現，但是這里注重成果的價值，設計師的成果更多是設計方案，方案成果的價值的接受度也是需要從易到難的漸進的。
舉一個設計價值體現的實例。這是我之前做的新Station組件庫——GM Design。設置組件和設計規范不僅保持了產品的統一性，且減少用戶在使用過程中的行為認知負擔，快速同事達成合作，還可以減少不必要的操作和排查，提高易用性。
設計目標：保持產品的統一性，減少認知負擔，降低時間和人力成本，提高易用性
現有問題：同個功能存在組件多樣、組件學習成本高、反復修改，
優化方案：1、建立組件庫；2、功能類型劃分，采用同一個組件的變形處理；3、組件集中化；
體驗連接：https://lanhuapp.com/url/rKmeX
二、了解設計師的價值分層
設計師的價值可以分為以下三層：設計協同、設計推動業務增長、設計驅動產品。
a）設計協同
一個完美的執行者，能夠在拿到需求后高效又完美地實現落地。簡單地說就是手上功夫好。
做好這個階段需要有優秀的專業能力，良好的溝通能力，并參與到產品的探索與構思中來。
舉一個設計協調的實例。Q2階段的B-Shop商城交互迭代。前期輸出設計基礎和設計規范，有助于開發高效實現，實時跟進UI進度和設計協助。在產品的探索中發現數字鍵盤組件的問題點，由于自己寫的數字組件具有局限性，導致體驗上無法滿足部分需求，如：輸入框的定位在數字鍵盤之上?；谶@個問題點，我們提出A/B方案，A方案是自己寫的數字組件，B方案是自己寫的數字組件延用原生的邏輯，從用戶測試得出，A方案是更符合用戶操作習慣。
設計目標：組件高效快捷輸入，側重交互體驗提升，視覺優化，提高易用性
現有問題：學習成本高、缺少設計基礎、信息分層不明顯、體驗差
優化方案：1、劃分主次信息，閱讀更直觀；2、建立設計規范；3、組件優化，符合用戶操作習慣；4、圖文結合，按鈕優化，加強頁面指導性
體驗連接：https://bshop.guanmai.cn/?cms_key=miaotest×tamp=1561085945884#/product(賬戶/密碼miaomiao/1qaz2wsx)
b）推動業務增長
這個階段的設計師，會比上一個階段更能體現設計師的設計價值，并對產品產生一定的影響力。能在以用戶為中心的基礎上，推動業務的增長，所以這個階段的設計也被稱為UGD（User Growth Design）。
需要設計師具備用戶洞見力，數據分析能力，從這兩個維度出發，去熟悉業務、分析業務，從而推動業務。
舉一個推動業務增長的實例。Q2階段的采購APP的交互迭代。表頭的功能布局與標簽欄的“?”添加功能的調整，其實在用戶調研階段的熱力圖數據和觀察法分析得出，工具類移動端側重點在功能區，需要一目了然知道我的當前任務數是很重要的信息，且是高頻操作，所以放置頂部；標簽欄的添加功能是為了快速添加采購單據和詢價為目的，用戶群體特殊性，需要一鍵新建添加的需求。
設計目標：側重交互體驗提升，提高工作效率，提高易用性
現有問題：學習成本高、缺少設計基礎、操作路徑長、體驗差
優化方案：1、操作路徑簡化，采用路徑集合彈框；2、建立設計規范；3、組件優化，符合用戶操作習慣；4、一鍵新建“?”的功能，達到快速新建
體驗連接：http://station.env-bugfix.dev.k8s.guanmai.cn/purchase_assistant/#/login（賬戶/密碼zhangsan0001/ liuge1)
c）設計驅動產品
這個階段的設計師，在團隊中的價值可以說是非常大了。從被動的需求接收方，轉化為從戰略層，能主動提出需求的一方。也是UXD發展的終極方向。
三、設計師需要具備的哪些思維？
a）雙鉆模型解決問題
什么是雙鉆模型?
雙鉆設計模型由英國設計協會提出，該設計模型的核心是：發現正確的問題、發現正確的解決方案。一般應用在產品開發過程中的需求定義和交互設計階段。
雙鉆設計模型把設計過程分成4個階段：發現問題（挖掘）、定義問題（創意）、構思方案（制作）和交付方案（落地）。
采購APP進行雙鉆模型思維構建的基礎，提供交互迭代的底層設計理論支持，在挖掘需求階段，屬于用戶調研階段；創意階段，關注點在于問題梳理、實現目的、設計層面；制作階段，尋找潛在的解決方案；落地階段，解決方案的分析和驗證，輸出最適合一個。
b）“五度”設計成果評估模型
用戶體驗周期（由阿里巴巴UED提出概念）
用戶體驗周期指的是用戶與產品的關系隨著時間變化而形成的不同周期階段。用戶體驗周期可以分為「當前」和「長遠」兩個階段，每個階段中有不同的細分。
「當前」階段，分為 3 個過程：
觸達：用戶來訪問網站，包括第一次訪問網站的新用戶和再一次訪問網站的老用戶；
行動：用戶在網站上進行相關操作；
感知：用戶在操作完成后對產品形成的主觀感受。
「長遠」階段：分為 2 種表現：
回訪：用戶自己再次使用該產品；
傳播：用戶推薦給其他人使用該產品。
如何在具體項目中體現呢？下圖，運用一個具體項目舉例：
c）培養數據思維，利用數據提升設計的價值
項目與需求上線后，去驗證自己的設計是否有效地達成了目標。這個時候你就需要去看數據反饋。沒有數據就就沒有比較，沒有比較就不能進步。
關于數據的用處有很多，舉個例子，當兩個人對各自的方案爭執不休，分別覺得對方不好，但站在各自的邏輯上似乎都能說得通，那怎么辦呢？分別做一個A/B測試，數據不會說謊，哪一個方案更有效，一目了然。
那么如何將數據結合到我們的設計中呢？首先在設計前,我們需要先定一個目標，而每一個目標就應有一項對應的數據指標。比如，提高了某一塊的CTR（點擊通過率），提高CVR（轉化率），提高商品曝光、1/7/15/30日留存率等等。方便之后去驗證自己的的action是否完成了自己的Goal。
拿到了數據之后，還需要分析數據。不管是有沒有達到目標，都要去分析原因，進行復盤總結。復盤的好處是可以讓我們在這一次項目中吸取有價值的經驗—失敗了就找失敗的原因，方便以后避開同樣的錯誤；成功了就分析成功的原因，并將成功的策略復制運用到今后的工作中，增加以后的成功率。如此，不管有沒有成功，都能給我們帶來最大化的價值。我們也會更加的接近用戶、接近產品、接近業務。從而幫助我們進一步洞察用戶、挖掘新的需求。
以上就是今天所要分享的全部內容。再帶大家回顧一下，一共分為三部分：第一個是了解設計師的發展趨勢，第二個是趨勢下的設計師價值分層（設計協同、設計推動增長、設計驅動），第三個就是在價值分層的逐步遞升中所需要培養的雙鉆模型、GSA的策略、數據增長思維等。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
我們每天都會收到很多應用軟件推送的短信或者push消息，它們總會推送各種消息吸引我們打開APP。鑒于我每天都要手動清除這些通知消息，并且有時候打擾到了我的生活（午休的時候被推送消息吵醒），除了微信和工作軟件外我基本關閉了APP消息通知，下載新的app也會選擇不開啟消息通知。
消息通知能提升用戶活躍度，但是推送過多的消息對用戶來說是一種信息負擔，也打擾了用戶的生活，用戶輕則關閉消息通知，重則卸載應用。每天接觸這么多消息通知，大家有沒有想過他們是怎么推送這些消息的？
不管是to c 產品還是 to B 產品，消息推送是運營必不可少的一部分。to C產品在產品運營環節通過消息推送，能提升用戶活躍率、留存率，提升業務轉化率，to B產品通過消息推送能提高工作效率，及時知曉業務問題（畢竟用戶只會在工作需要的時候使用系統）。
近期我在做crm系統移動端的版本時，銷售反饋系統推送的消息太多，打擾了正常工作，他們覺得很煩，表示都不相干收到這么多消息通知。接到反饋后，我盤點了系統推送的所有消息，發現消息類型多達20幾種，并且集中在周一上午10點推送，導致銷售短時間內會收到十幾條消息。對此，我把盤點出來的消息進行篩選，精簡了通知數量，優化了推送策略，優化后銷售的滿意度和消息觸達率都高了許多。
我們不能把消息推送看做是一個簡單的功能，要有一個系統性的思維，從盤點消息項、制定推送策略、設計消息文案/內容、建立推送任務、選擇推送渠道、篩查有效用戶、消息存儲等各個階段流程，都包含了很多因素需要我們仔細考慮的。
本文將以系統通知消息為例來介紹消息推送功能。
告訴用戶消息來自哪里，誰發送的，讓用戶對消息內容快速建立認知，同時增強用戶信任度，避免認為是垃圾消息；
什么情況下會推送這條消息，如任務到期沒有完成。
什么時候推送給用戶，多久推送一次
消息應該推送給誰，誰會受到消息，可能是系統中的全部成員，也可能是某個部門，或者某個人。
怎么樣可以把消息發送到用戶的設備上，如短信，app通知。
用戶收到這條消息可以干什么，如處理待辦任務。
用戶需要做什么，可以得到什么結果，如收到線索分配通知，需要跟進線索。
推送的消息既不會打擾到用戶，又能達到運營目的，我們需要在合理的時間選擇合適的渠道推送合適的消息給合適的用戶，這句話有點繞但是就是這個意思。
建立推送任務之前，我們要盤點系統中所有的通知消息，列出消息清單。根據上述消息推送描述的幾大要素，以下是我在優化crm系統通知消息列舉的消息項，
以銷售訂單和開票明細兩個業務對象為例：
可以從以下三個角度來盤點消息項：
1、按通知來源：業務消息（線索、商機、回款、訂單、任務等）、系統消息、用戶信息等；
2、按觸發條件：運營消息（回款預警、商機跟進等）、用戶發起、待辦消息、系統反饋等；
3、按通知對象：所有成員、部門、個人
我們要列出所有可能用到的消息項，不怕多，就怕遺漏。盤點完所有的消息后，可以按照上述表格列出消息清單，再根據業務目標、運營需求、用戶需求、對消息去重、精簡消息項，只留下必需推送的消息類型。
列出消息清單后，要明確什么類型的消息應該推送給什么人，即通知消息要匹配正確的通知對象。
系統給用戶推送了消息，用戶對消息內容感興趣，點開了消息查看詳情并進入目標頁面或者處理通知消息，才能實現推送消息的目的。
to c產品需要對用戶信息、用戶行為等構建用戶畫像，用于精準推送或者個性化推送。to b產品的用戶結構相對簡單一些，一般是企業人員（員工、部門負責人、管理層等），根據業務使用場景
對用戶劃分角色，再以角色為基礎匹配功能權限，進行權限控制，如銷售、研發、財務、運營等對應不同的業務場景，推送消息側重點也不同。
確定好了通知對象，我們需要思考以下問題：
1、什么時候推送消息既不會打擾到用戶，又能引起用戶的注意？
2、是主動推送還是由用戶觸發后被動推送？
3、多久推送一次合適，推送是一次性的還是持久性的？
4、這個消息推送觸發后要立即處理嗎？
3、用戶怎么樣能收到消息？收到消息后要做什么？
以下這個金字塔圖可以解決上述的問題：
消息清單上的消息項，我們不能一股腦全部推送，要根據信息的提醒強度平衡通知量、推送時間、推送頻率，避免對用戶造成干擾而影響推送效果。
消息類型：對于需要用戶立即處理，或者用戶確認才能繼續進行的操作，如預警、異常、錯誤、驗證碼、重要消息等，讓用戶及時發現并采取措施。以飛書為例，飛書上要是有人給你發了緊急消息，會以短信的形式提醒你。
推送渠道：電話、短信，但是一般不會用電話，一是成本高，二是對于用戶來說是強打擾，而且陌生電話用戶一般不太會理。
消息類型：無需用戶立即處理，但是需要引起用戶注意的操作，如運營消息、待辦提醒、審批通知、系統公告等。對用戶會產生一定的干擾性，此時要給用戶一定的控制權，可以通過設置通知方式或者關閉通知提醒，減少消息打擾。
推送渠道：系統推送、應用內提醒，郵件。
消息類型：無需用戶立即處理，僅提醒用戶有新的狀態，或者對用戶操作后的反饋，如應用更新提醒、狀態變更通知、操作成功提示等，對用戶幾乎不產生干擾。
推送渠道：一般只在應用內提醒或者系統內提醒。
提醒強度越強，通知數量越少，呈金字塔形狀，強提醒通知數量要比弱提醒少很多。通知消息數量較多時，要權衡推送數量，推要克制，對于推送頻率比較高且用戶不需及時處理的消息，可以通過合并通知的方式減少消息推送的數量，減少對用戶的打擾。
根據提醒強度選擇推送渠道，多渠道組合協同推送，能夠提高推送效率，但要保證多渠道消息內容一致。一般來說to b產品通知消息是以系統內提醒和辦公協作應用（第三方工具，如飛書、企業微信等）內提醒的形式通知用戶。
對于系統內的通知消息，不同強度的提醒消息會對應不同的消息通知組件。
強提醒的內容對用戶來說是高關注度的，要求及時、主動的把消息推送到用戶面前，用戶要立即采取措施，對用戶當前操作具有強干預性。
中提醒的內容對用戶來說是中關注度的，要在合適的時間推送，可以是系統主動推送也可以用戶發起的，用戶可以延后處理，對用戶當前操作的干預性為中等。
弱提醒的內容對用戶來說是低關注的，可以是用戶操作后的及時反饋，短暫的出現后就消失，或者可以延后處理的消息，對用戶當前的操作幾乎無干擾。
用戶正在使用crm系統辦公，同時飛書也在線，我們該如何推送消息？
用戶可能已經在系統內查看了消息，再把消息推送到飛書上對用戶來說就是重復提醒了。如果飛書上已經讀了消息，那么系統內該條消息就要標記為已讀。
用戶收到推送消息后，要能快速抓到重點內容，知道這條消息表達了什么，是否需要進行處理。
一般我寫消息內容時是會遵循3w1h原則：what（發生了什么），why（什么原因），when（消息觸發時間）、how（我該怎么做），再根據實際情況進行適當調整。在設計消息文案時要考慮用戶的預期，不要標題和消息內容不一致，或者消息內容和詳情頁不一致，可以通過推送點擊率輔助判斷推送是否達到預期效果。
上述原則并不是固定死的，需要根據實際推送目的進行調整，如運營信息可以通過標題、摘要或圖片吸引用戶，可以直接附帶鏈接跳轉到詳細信息。
設計消息文案/內容的要點：
1、消息文案要簡明易懂；
2、重要的信息要放在前面；
3、不同推送渠道的消息內容要保持一致；
4、通過短信或者郵件推送的消息要說明信息來源平臺，避免用戶認為是垃圾信息，如【騰訊】【網易】等。
消息推送給用戶后，用戶看完不一定會立即處理，延后處理的時要能夠找到相應的消息，此時需要消息中心呈現所有的push消息。
消息中心受產品定位、系統框架等因素影響呈現形式會有所不同。消息中心的入口主要有頂部圖標（懸浮通知）、左側tab等形式。
1、頂部圖標：適用于消息數量較少，或者消息不是產品核心業務場景的情況。一般會在頂部導航右邊，或者左側導航下方，以 badge 的形式在圖標上提示新消息的數量；
2、左側 tab：適用于消息以用戶間通訊為核心場景的情況。可根據消息類型進行分類，以 badge 的形式提示未讀消息或未處理消息的數量。
消息列表按時間維度排序，可以對信息進行分類展示，如全部，未讀、稍后處理的tab分類形式展示，消息類型比較多的情況下通過選擇消息類型快速找到相應消息。
消息推送并不是簡單的把需要提醒用戶注意的事項全部推送出去，合理的推送策略才能到達推送目的。
消息推送前的思考：
1、應該推送什么消息，推送給誰？
2、什么時間適合推送，為什么要推送這條消息？
3、怎么推送？
4、推送的這條消息是否能引起用戶興趣？
4、用戶查閱了這條消息知道要干什么嗎？
思考完以上問題基本上能確定一份消息清單 ，要保證推送效果還要注意以下推送的要點：
1、權衡消息推送數量，只推送必需的消息；
2、選擇合適的推送時間、推送頻率，避免對用戶產生打擾；
3、消息文案簡明易懂；
4、多渠道推送保持消息文案一致，不要重復推送；
5、需要用戶采取措施的消息提醒，在用戶解決問題之前，要持續提醒；
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
文章來源：站酷 作者：仲夏M
設計行業每天發生著翻天覆地的變化，隨著專業的發展，我們也在不斷的學習新的技巧和趨勢，但同時我們也要明白，設計中那些基礎的UI準則，才是好的趨勢和風格建立的基礎。今天我們就一起來聊聊做好設計最重要的能力之一：區分視覺層次。
視覺層次不僅僅包含文字有關，它還包含我們的圖片，視頻按鈕以及文字以外的視覺元素。所以當你設計一個網頁時候，除了網站整體的顏色，排版，圖片也能夠影響視覺層次。那么如何讓設計的層次更清晰，常用方法有哪些，今天我們一起來聊聊關于設計層次，希望可以幫助到你。
▲如上圖插畫的比重很大，在設計這種大的元素時，你的每個元素比例和細節處理都被同時放大了，我們可以看見這副插畫四周還運用了很多元素，讓頁面達到平衡，同時這個畫面和旁邊的文字場景也很好融合在一起。一個好的設計一定是通過視覺手段讓用戶理解信息更加準確，在看完頁面文字和圖片后，很自然的引導到底部的按鈕，這才能算是一個很引人注目的設計。
▲設計師熟悉的medium官方App設計，在正文閱讀時，同樣采用不同的視覺重點來突出重要信息，比如左邊通過字重以及文字背景綠色底色和正文對比，非常醒目。右側通過淺綠色作為背景強調突出。
▲同樣在一些重要位置，Medium也是運用視覺重量處理，如左圖通過頂部提示條提示可以通過語音播放，在右側付費文章通過行動按鈕引導用戶升級付費。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
前言：如何讓你的設計更有價值，設計有價值代表你的方案有價值，你的方案有價值代表你的理論有價值、你的理論有價值代表你的專業能力體現，歸根到底，說明了什么人作出什么樣的作品的同時會帶來相應的價值。站在設計師的角度看，在公司里，屬于站在用戶體驗上的提出的設計建議或者設計方案，基于“以用戶為中心”理念和交互設計原則，通過自己的設計思維與專業能力，為公司創造更大的價值，不單只是一個美觀的輸出。
目錄：
一、設計行業的發展趨勢
a）設計與產品的關系
b）找到自身價值的重要性
二、了解設計師的價值分層
a）設計協同
b）推動業務增長
c）設計驅動產品
三、設計師需要具備的哪些思維？
a）雙鉆模型解決問題
b）“五度”設計成果評估模型
c）培養數據思維，利用數據提升設計的價值
一、設計行業的發展趨勢
a）設計與產品的關系
以前，設計師在團隊里的位置會比較尷尬，因為沒法驗證自己對業務的推動是否產生了什么明確的價值。而大數據的來臨，設計的價值變得顯性化，作為與用戶關系密切的設計師，善用好數據，可以發揮的作用其實很大。我們可以通過自己的設計思維與專業能力，為公司創造更大的價值，不單只是一個美觀的輸出。這就使得設計與產品業務關系越來越密切，是整個行業發展的必然趨勢。
舉一個設計以小成提高業務的實例。這是我之前做的分揀軟件迭代首頁的自定義配置組件。在改動前分揀首頁功能多，甚至有時候需要滑動尋找。尋找點擊率大概是不到16%，改動后提高到了40%，不消耗任何其他人力、物力成本，就可以用設計讓CTR翻倍。
設計目標：減少首頁模塊尋找的時間，加大成功點擊率，考慮延展性發展
現有問題：主次功能混淆、視覺點不夠集中、點擊按鈕不明顯
優化方案：1、主次布局調整，主上次下；2、面積放大提高模塊命中率；3、色彩區分主次按鈕；4、添加“?”自定義配置首頁主功能，加入人性化設計理念。
b）找到自身價值的重要性
自身價值顧名思義就是你的工作成果會帶來什么價值，按照公司更看重我們的設計能給產品的發展帶來多大的價值。雖然職位的性質已經很明確你的價值的體現，但是這里注重成果的價值，設計師的成果更多是設計方案，方案成果的價值的接受度也是需要從易到難的漸進的。
舉一個設計價值體現的實例。這是我之前做的新Station組件庫——GM Design。設置組件和設計規范不僅保持了產品的統一性，且減少用戶在使用過程中的行為認知負擔，快速同事達成合作，還可以減少不必要的操作和排查，提高易用性。
設計目標：保持產品的統一性，減少認知負擔，降低時間和人力成本，提高易用性
現有問題：同個功能存在組件多樣、組件學習成本高、反復修改，
優化方案：1、建立組件庫；2、功能類型劃分，采用同一個組件的變形處理；3、組件集中化；
二、了解設計師的價值分層
設計師的價值可以分為以下三層：設計協同、設計推動業務增長、設計驅動產品。
a）設計協同
一個完美的執行者，能夠在拿到需求后高效又完美地實現落地。簡單地說就是手上功夫好。
做好這個階段需要有優秀的專業能力，良好的溝通能力，并參與到產品的探索與構思中來。
舉一個設計協調的實例。Q2階段的B-Shop商城交互迭代。前期輸出設計基礎和設計規范，有助于開發高效實現，實時跟進UI進度和設計協助。在產品的探索中發現數字鍵盤組件的問題點，由于自己寫的數字組件具有局限性，導致體驗上無法滿足部分需求，如：輸入框的定位在數字鍵盤之上?；谶@個問題點，我們提出A/B方案，A方案是自己寫的數字組件，B方案是自己寫的數字組件延用原生的邏輯，從用戶測試得出，A方案是更符合用戶操作習慣。
設計目標：組件高效快捷輸入，側重交互體驗提升，視覺優化，提高易用性
現有問題：學習成本高、缺少設計基礎、信息分層不明顯、體驗差
優化方案：1、劃分主次信息，閱讀更直觀；2、建立設計規范；3、組件優化，符合用戶操作習慣；4、圖文結合，按鈕優化，加強頁面指導性
b）推動業務增長
這個階段的設計師，會比上一個階段更能體現設計師的設計價值，并對產品產生一定的影響力。能在以用戶為中心的基礎上，推動業務的增長，所以這個階段的設計也被稱為UGD（User Growth Design）。
需要設計師具備用戶洞見力，數據分析能力，從這兩個維度出發，去熟悉業務、分析業務，從而推動業務。
舉一個推動業務增長的實例。Q2階段的采購APP的交互迭代。表頭的功能布局與標簽欄的“?”添加功能的調整，其實在用戶調研階段的熱力圖數據和觀察法分析得出，工具類移動端側重點在功能區，需要一目了然知道我的當前任務數是很重要的信息，且是高頻操作，所以放置頂部；標簽欄的添加功能是為了快速添加采購單據和詢價為目的，用戶群體特殊性，需要一鍵新建添加的需求。
設計目標：側重交互體驗提升，提高工作效率，提高易用性
現有問題：學習成本高、缺少設計基礎、操作路徑長、體驗差
優化方案：1、操作路徑簡化，采用路徑集合彈框；2、建立設計規范；3、組件優化，符合用戶操作習慣；4、一鍵新建“?”的功能，達到快速新建
體驗連接：http://station.env-bugfix.dev.k8s.guanmai.cn/purchase_assistant/#/login（賬戶/密碼zhangsan0001/ liuge1)
c）設計驅動產品
這個階段的設計師，在團隊中的價值可以說是非常大了。從被動的需求接收方，轉化為從戰略層，能主動提出需求的一方。也是UXD發展的終極方向。
三、設計師需要具備的哪些思維？
a）雙鉆模型解決問題
什么是雙鉆模型?
雙鉆設計模型由英國設計協會提出，該設計模型的核心是：發現正確的問題、發現正確的解決方案。一般應用在產品開發過程中的需求定義和交互設計階段。
雙鉆設計模型把設計過程分成4個階段：發現問題（挖掘）、定義問題（創意）、構思方案（制作）和交付方案（落地）。
采購APP進行雙鉆模型思維構建的基礎，提供交互迭代的底層設計理論支持，在挖掘需求階段，屬于用戶調研階段；創意階段，關注點在于問題梳理、實現目的、設計層面；制作階段，尋找潛在的解決方案；落地階段，解決方案的分析和驗證，輸出最適合一個。
b）“五度”設計成果評估模型
用戶體驗周期（由阿里巴巴UED提出概念）
用戶體驗周期指的是用戶與產品的關系隨著時間變化而形成的不同周期階段。用戶體驗周期可以分為「當前」和「長遠」兩個階段，每個階段中有不同的細分。
「當前」階段，分為 3 個過程：
觸達：用戶來訪問網站，包括第一次訪問網站的新用戶和再一次訪問網站的老用戶；
行動：用戶在網站上進行相關操作；
感知：用戶在操作完成后對產品形成的主觀感受。
「長遠」階段：分為 2 種表現：
回訪：用戶自己再次使用該產品；
傳播：用戶推薦給其他人使用該產品。
如何在具體項目中體現呢？下圖，運用一個具體項目舉例：
c）培養數據思維，利用數據提升設計的價值
項目與需求上線后，去驗證自己的設計是否有效地達成了目標。這個時候你就需要去看數據反饋。沒有數據就就沒有比較，沒有比較就不能進步。
關于數據的用處有很多，舉個例子，當兩個人對各自的方案爭執不休，分別覺得對方不好，但站在各自的邏輯上似乎都能說得通，那怎么辦呢？分別做一個A/B測試，數據不會說謊，哪一個方案更有效，一目了然。
那么如何將數據結合到我們的設計中呢？首先在設計前,我們需要先定一個目標，而每一個目標就應有一項對應的數據指標。比如，提高了某一塊的CTR（點擊通過率），提高CVR（轉化率），提高商品曝光、1/7/15/30日留存率等等。方便之后去驗證自己的的action是否完成了自己的Goal。
拿到了數據之后，還需要分析數據。不管是有沒有達到目標，都要去分析原因，進行復盤總結。復盤的好處是可以讓我們在這一次項目中吸取有價值的經驗—失敗了就找失敗的原因，方便以后避開同樣的錯誤；成功了就分析成功的原因，并將成功的策略復制運用到今后的工作中，增加以后的成功率。如此，不管有沒有成功，都能給我們帶來最大化的價值。我們也會更加的接近用戶、接近產品、接近業務。從而幫助我們進一步洞察用戶、挖掘新的需求。
以上就是今天所要分享的全部內容。再帶大家回顧一下，一共分為三部分：第一個是了解設計師的發展趨勢，第二個是趨勢下的設計師價值分層（設計協同、設計推動增長、設計驅動），第三個就是在價值分層的逐步遞升中所需要培養的雙鉆模型、GSA的策略、數據增長思維等。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
最近有設計小伙伴咨詢，怎么樣的交互說明才是最好的，是大家都喜歡的。他寫的交互說明文檔提交給需求評審會的成員審核時，大家都建議他再寫的合理些，這讓他傷透了腦筋。
我告訴他：
第一、崗位對象不同：沒有一份十全十美的交互說明可以打動所有人，讓所有人為之驚嘆。畢竟，由于閱讀交互說明文檔的對象不同，他們會對交互說明文檔有不同的要求，這是崗位屬性導致的結果。例如前端開發希望詳細到字段、初始默認值、數據調取接口等，而領導只要看保證業務方向沒有錯誤的大交互鏈路。
第二、同崗位不同認知：同一崗位不同成員的認知、從業經歷、個人喜好、性格脾氣等也會導致不可能有完美適配所有人的交互說明文檔。例如在一個行業已經深耕多年的前端工程師，即使你的交互說明文檔寫的沒有那么詳細，他也可以從你現有的文字中推敲出其他方面，同時還能幫你補充完善；而針對剛入行的前端工程師，你要是寫的不詳細，他就會抓狂，項目時間緊急的時候還會自己腦補交互細節。之后你走查時候也會抓狂，但是沒用呀，誰讓自己沒有寫明白交互細節，遺漏了呢。
第三、使用場合不同：不同場合需要的交互說明文檔也不同。例如與對方面對面溝通，交互說明文檔可以少寫點；但是通過線上工具與對方溝通，就需要寫的盡可能詳細；如果是會議型的評審，那就要方方面面都做足功課了。簡單來說就像準備一份 PPT：針對同一個主題的 PPT，在外部演講和在公司內部演講，同一份 PPT 會需要設計兩個版本，一個是內部版，一個是外部版，原因在于使用場合不同。
第四、產品階段不同：交互說明文檔闡述的是一個產品的交互，而不是闡述其他的。如果產品所處階段為成熟期，那往往產品的交互文檔已經沉淀了很多通用法則，可以被復用，那么現在的交互說明文檔少寫點，問題也不大；但產品處于探索期或成長期，通常來說可復用性的交互資產是不存在的，那交互說明文檔就需要準備的相對完善。
有些設計小伙伴就說了，既然不可能滿足所有人，那我就按照自己的想法隨意寫好了。這可不行哦，畢竟我們的主要工作有一部分是撰寫交互說明文檔，這就必須要有認真、嚴謹、專業的工作態度，把這部分工作做好。那我們來看看，編寫一份友好的交互說明文檔要注意哪些。
交互說明文檔是用來告訴參與產品研發的團隊成員頁面交互相關細節的一個說明文檔，包括頁面間的邏輯跳轉、頁面內模塊的交互、頁面功能的狀態等。交互說明文檔寫的越詳細越有利于參與產品研發各方的正確執行。
我匯總了一些日常工作中有待改進的交互說明文檔形式，看看都存在哪些問題。
1. 文字密密麻麻，無結構
幾乎所有剛初入職場的設計師，在編寫交互文檔時，會怕自己寫少了別人覺得自己不專業，怕寫的不全沒辦法表達頁面細節，導致交互文檔密密麻麻都是文字，這讓閱讀者幾乎無法閱讀，找不到視覺落腳點。
2. 描述簡單，不完整
有幾年工作經驗的設計師，由于很多通用交互法則已了然于心，他們在編寫交互說明文檔時就比較簡單，一些交互就沒有寫在文檔上，這導致在開發時，忽略了某些交互。
3. 數據太假，沒有邏輯
交互稿數據沒有邏輯，是很多設計師經常會出現的問題，一部分原因可能在于產品經理沒有理順產品邏輯和細節就提交設計師畫圖了，另一部分原因可能在于設計時間緊張，來不及對交互稿中所有的數據都做到邏輯合理。
曾經遇到過的情況有，關聯數值關聯不上，表格中字段對應的值對不上，表單填寫的數據和實際情況不符。
建議大家在時間允許或有條件反推產品經理協助完善數據的情況下，盡量數據展現的真實與符合邏輯，如此有助于開發及相關閱讀者高效理解。
4. 圖文太遠，找不到
有幾次我注意到設計師提交上來的交互說明會標注“見圖 X”這樣的文字。也就是一段說明讀完了，還得去頁面的某個角落尋找對應的圖，這種體驗非常不好。
在交互設計原則中有一項為“足不出戶”?！白悴怀鰬簟钡囊馑际侵改茉诋斍绊撁娼鉀Q的事情，不要去其他頁面；能在就近完成的事情，不要距離過遠。頻繁的切換和跳轉會導致用戶心流被打斷，容易引起用戶思緒中斷、思考不流暢，甚至可能對產品產生反感。
同理，我們交互說明文檔中的圖文也應盡量相鄰，通過一眼文字一眼圖，讓用戶看的順暢、舒適，理解的快速。
5. 零散，東一句西一句
東一句西一句是指交互說明文檔中本該成為一體去描述的文字，被分成了好幾個部分去闡述，這對看文檔的人來說簡直是災難，他需要自己重新梳理交互思路，將交互規則串聯起來。
我們自己在編寫交互說明文檔時，盡量規避上述常見的問題。
對于什么是好的交互說明文檔，網上一搜一大把，這里我根據自己的經驗，和大家分享下什么是好的交互說明文檔。
首先我們來明確下，什么是好，有了好的標準以后，再來談談如何做到好。
通常情況下，交互文檔會給產品經理看，用來評審設計方案是否滿足需求；給視覺設計師看，用來指導視覺方案的呈現；給前后端開發人員看，用來指導開發邏輯；給測試工程師看，用來協助測試編寫測試用例?；诖?，好的交互說明文檔關系著設計方案是否可被最大程度的實現。并且如果交互文檔文字冗長、邏輯不清晰，不僅看的人吃力，還會需要增加額外的時間來和開發工程師溝通。好的交互文檔，我認為至少需要具備以下 7 點：
為了讓大家一邊學習一遍實踐，我使用“表單校驗”的交互案例給大家進行講解。
明確價值
能協助項目成員通過文檔更順利地完成工作任務，能幫助用戶解決問題，能達成產品目標，則是好的交互說明文檔。文檔對各方有價值，是一份好的交互說明文檔的起點。那么，如何編寫才能達到上述結果呢？
一方面是將此次文檔的價值寫清楚，包括寫明此次交互設計的背景與需求來源、需求清單，標明交互設計的理論依據，可以給用戶帶來的價值等。另一方面要和成員宣導這些內容，讓成員感受自己要做的工作是有價值的。
“表單校驗”上場：
考慮全面
拋開文檔閱讀對象等相關影響因素，通常來說交互需要考慮到以下幾方面:
a. 整體交互流程
整體交互流程是指產品頁面與頁面之間的交互邏輯。
b. 頁面模塊交互說明
頁面模塊交互說明是指模塊自身的交互說明，或同頁面內獨立模塊之間的交互邏輯，或不同頁面模塊之間的交互邏輯。例如點擊導航樹節點會聯動右側表格內容刷新；點擊 banner 跳轉到對應的商品詳情頁，且定位到頁面 1/2 位置。
c. 頁面功能交互說明
頁面功能交互說明是指單個功能的各種情況闡述。例如搜索框內輸入文字，通過 enter 觸發對應頁面跳轉。
d. 盡量真實的數據展示
雖然是交互說明，我們也盡量做到模擬真實數據，否則很容易讓閱讀者產生錯誤判斷。并不是所有人都會一字一句的去閱讀文檔，因此，盡量真實的數據，有利于閱讀者更有效的了解。
e. 特殊情況額外補充說明
很多情況下，會因為某些原因出現極端交互情況，此時也需要補充完整。
f. 通用交互一處即可
建議交互團隊為產品建立通用型交互說明庫，遇到類似的情況，直接調取即可。
實際上我們在編寫交互說明的時候，不太會分得那么細，很多說明是混合在一起表達的。
“表單校驗”上場：
通俗易懂
通俗易懂是指要讓文字、語言、圖片等做到讓受眾易于理解和感知，從而在信息傳遞過程中盡量少的出現損耗，這一點同時也與人類的理解能力有關。
百度百科是這么解釋理解能力的：
“理解能力是指一個人對事物乃至對知識的理解的一種記憶能力。
理解，有三級水平：
當我們了解了人類的理解能力水平是參差不齊后，我們就要盡量在工作中將專業知識化繁為簡（也可以針對人群化繁為簡），增強溝通效果，最終達到完成團隊目標的結果。
交互文檔盡量做到講人話，不要講一堆專業術語。記得之前有個交互設計師在會議上闡述自己的交互方案時，提到用了“提供邀請”原則。由于與會成員是開發工程師和產品經理，他們問到什么是“提供邀請”原則，并且在這個問題上大家討論了很久。
由此可見，表達通俗易懂，是很必要的。
結構清晰
交互說明文檔除了要表達通俗易懂外，還需要結構清晰。
結構清晰的內容不僅使閱讀者一目了然、理解成本低，還可以讓閱讀者了解撰寫者的意圖。要做到文檔結構清晰，除了需要遵守一些規則外，也不能脫離當前文檔的實際情況。
“表單校驗”上場（把文字進行分段處理，并取出關鍵詞）：
圖文并茂
圖片和文字相得益彰可以加深閱讀者對文字的理解，同時避免閱讀者去想象文字對應的結果。由于人們對同一段文字的理解不完全相同，因此建議設計師盡量安排交互說明對應圖解。
“表單校驗”上場（左圖右文）：
僅此一份
僅此一份是說交付給團隊交互說明文檔的時候不要多份。之前我們的前端小伙伴拿到了兩份交互文檔，一份是純原型交互文檔，一份是視覺稿交互文檔，兩者描述的信息大同小異。此時，建議交互文檔的信息做合并，只提交一份完整的給前端小伙伴，讓前端小伙伴能專心致志理解一份。
修訂記錄
建議交互說明文檔留存修訂記錄，一方面可以了解交互文檔的變更歷史，另一方面有利于回溯和查找信息。修訂記錄一般包括修訂人、修訂時間和修訂內容。
由于項目進度、業務復雜程度等不同，我們不可能每次都能寫出一份最好的交互說明文檔，但我們可以想辦法寫出一份相對可讀性高、可理解性高的友好的交互說明文檔。我們常說自己是做用戶體驗的，那交互說明文檔就是體現我們交互能力一個方面。
除了完成交互說明文檔，想要讓開發小伙伴真正理解交互說明，還需親自和開發溝通，千萬不要認為我寫的很詳細了，他怎么還是實現的有偏差。事實上，就如開篇所說：同一崗位不同人的認知理解、從業經歷、個人喜好、性格脾氣等也會導致理解不同。特別是對于一些我們非常創新的、特殊的交互點，需要重點和開發說明。
并且，交互說明文檔基于業務的發展，也會不斷的迭代，我們要抱著多聽、多想、多思考、多接受的態度去不斷優化我們的文檔，盡力寫出一份友好的交互說明文檔。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
最近我們產品做了一次全新改版的項目。作為此次項目的設計師，從項目的前期分析、設計、交付開發、驗收上線，整個流程，在項目走查驗收階段我們設計師投入了30人/天！在我們覺得應該設計投入最少的階段，卻占了我們大量的工作 且最后還原度也遠不達預期。
在這個項目中我遇到了哪些問題：
還原問題不單單是設計師把設計稿做的多精準，標注的多仔細，這么簡單就能解決的。是設計和開發，團隊之間的合作共識問題。我把整個和開發對接工作分為前中后三個階段，在這里從頭來梳理一下，聊一聊設計師和開發如何高效對接，也是對自己的一次復盤總結。
在評審環節，設計師本人一定要將自己的設計稿進行宣講、幫助開發理解。注意給技術講述一些適配要求、設計規范、交互狀態及動效等，同時解答技術同學的一些疑問，這樣就能將一些可預見的問題解決掉，解決后期的溝通成本。
有一些地方有多種實現方式，如果前期沒有跟開發溝通清楚，就會導致最終實現的效果存在誤差，比如：下方這個tab項，單給一張圖，開發根本不知道設計師想要的實現方式是什么，固定間距還是固定菜單寬度，還是每項平分寬度，最后很大可能就會按照自己的理解去做了，導致出現重復返工的現象。
再比如一些點擊熱區，如果不手動標明，有可能就做的很小
下圖是我們手動標注的熱區
每個開發負責的具體頁面模塊不一樣，別人對具體了解程度也不會不一致，所以在評審會議上，一定要具體開發者在場，如果對應開發沒有發表意見，設計師可詢問，確保他已經理解需求。
設計師在講解自己的要求后，開發也要及時反饋是否有還原困難，如：是否有技術限制？是否有組件改動困難（牽一發而動全身）？實現成本過高（投入產出的性價比不夠）？等意見和原因，設計師也可拋出之前是否遇到過類似的阻礙，幫助開發去了解。
評審過程的問題和重要講解點，一定要記錄下來，會議中開發提出的一些問題及解決方案、或者沒有達成共識的地方，記錄下來等領導決策，在會議結束后以郵件形式、或wiki文檔發送前端們，抄送產品，確保會議內容的傳達到位。后面也好跟蹤。
還有一點就是，我們之前遇到的情況，在宣講會上 講解的一些要求，開發在做的時候可能就忘記了，讓開發改他認為設計沒有明確要求、會有點難推動，就會搞得雙方都有抱怨。有會議記錄也可避免此類情況發生
在前面我們做了詳盡的溝通和評審，但有時也避免不了在開發過程有些問題才發現暴露。這個就需要開發同學能重視還原問題，積極溝通反饋，和設計確認商議 是否有其它可替代方案，切勿自己發揮，等到后期驗收的時候才說出問題可能會影響進度
開發者在完成自己負責的模塊界面時，可自己對齊設計稿自查一遍，參考【3.1驗收標準】的表格，可幫助判斷問題，在此階段也可發給設計者確認效果。
這里可以提前在項目排期階段，設計師將所需的驗收工時同步給技術和測試，將驗收時間考慮進去
為什么要求測試同學保證還原度至少在70%呢？
因為如果不要求測試走查還原度，設計驗收的時候就會有大量的問題，最后變成設計在測試界面而不是驗收。設計師不像測試對整個流程的測試配置那么熟悉方便，反復驗收需要測試和設計不斷配合，雙方的工作量都會加大。
理想的狀態應該是測試整個流程走通，視覺和交互還原問題也要著重測試，設計和產品在測試沒什么大問題后再進行驗收。
參考【驗收標準】的表格，可幫助判斷還原問題
最好是提前知道模塊的開發者，這樣驗收的時候一對一進行模塊的打版驗收效率更高
技術對功能上的BUG，可以自己很好的判斷哪些是嚴重的緊急的，但對于視覺和交互層面的感知就比較低。在提問題單的時候，我們可以幫他標注出優先級，告知開發哪些是比較嚴重的需要優先修改的，不然 開發自己很難判斷，可能就會挑一些比較好改的先改了，重要的問題反而被擱置了。尤其在項目時間比較緊張的時候，有優先級標注 開發能夠看出哪些是可以為項目進度做出妥協的，哪些是必須要修改的。
設計提BUG單的不能簡單的說這里出錯了，請參考設計標注重新調整。要直接給出正確的尺寸、增多少、減多少、這樣可幫助技術提高更高效率，也能避免開發自己去看又出現誤差、又要返工修改。
設計師在驗收過程中容易遇到的一個比較頭疼的問題就是，技術和產品小伙伴可能因為項目上線時間緊，覺得視覺還原和頁面交互體驗上的問題不重要不給予修改，優先保障功能上線。
除了這些原因，設計側也在檢討總結，自己有哪些做的不足的地方，所以 以上文檔也是對接下來工作的優化方案。設計還原度也是日常考核之一，需要大家重視，好的產品要嚴格把控精心打磨，希望這次的總結、相關流程和經驗，在接下來工作中能夠提升設計驗收效率和還原度。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
文章來源：站酷 作者：飛行的考拉
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
柵格系統（grid systems）
規則的網格陣列來指導和規范網頁中的版面布局以及信息分布。
基本原理
在網頁設計中，把寬度為“W”的頁面分割成n個網格單元“a”，每個單元與單元之間的間隙設為“i”,把“a+i”定義“A”。他們之間的關系如下：
W =（a×n）+（n-1）i
由于a+i=A，
可得：(A×n) – i = W
我們通常把a稱為“柱”，對應代碼中的Column；i稱為“水槽”，對應代碼中的Gutter；a+i=A稱為“列”
設計柵格系統，本質就是定義a，i，n的數值。
UI設計中有一個通用做法，就是元素的寬度盡量是8的倍數，基于今天的大多數的網頁設計，畫板寬度都為1440px ，此時我們將a=24,i=24,n=24,這是一組簡單美妙的數值，可算得W=（24x24）+23x24=47x24=1128px；將柵格居中于畫板(偏置156px)，此時的柵格系統如下：
1128柵格系統：
得到的這個柵格布局被廣泛使用，比如站酷網首頁:
觀察計算公式W=1128=47x24=（24+23）x24，這里的47不是8的倍數，我們容易想到把它變成48，
將a=25,i=24,n=24,算得W=（24x24）+（25-1）x24=48x24=1152px；此時的柵格系統如下：
1152柵格系統：
這個柵格系統的美感在于，寬度W=48x24=1152px，兩邊的留白為畫板1440px寬度的1/10等于144px。Ant Dseign中運用了此柵格：
以上兩個柵格布局都是24柵格系統，使用24柵格系統的好處是，它可以輕松實現2等分、3等分、4等分、6等分、8等分、12等分，也可以進行1：2：1、 1：3：2、 1：2、 1：3 等不對稱分割的布局。
除了最常見的24柵格布局外，也可進行36柵格布局，例如：
a=16，i=16，n=36，W=（16x36）+16x（36-1）=16x（36+35）=1136
1136柵格系統：
a=26，i=24，n=24，W=（26x24）+24x23=24x49=1176px
例如騰訊文檔：
1176柵格系統：
“廠”型布局網頁的柵格布局：
以上的網頁布局都是瀑布式布局，在許多應用型網站中，常使用“廠”字布局，對于“廠”布局的網頁，該如何設計合適的柵格系統呢？
我們可以先確定左側菜單欄的寬度，例如飛書管理后臺中左側菜單欄的寬度為228px，在拉動瀏覽器時，這部分通常是不動的，再確定主體內容去和左側菜單欄間的間隙，比如12px。
此時可以計算W=1440-228-12x2=1188。
使用24柵格系統時，12a+11i=1188，方程中有兩個未知數，我們設定其中一個時，就可計算出另一個。另i=12,解
W =（a×n）+（n-1）i
1188=（ax24）+23x12
a=38
是幫助，而非限制
對開發者而言柵格是實現動態布局的手段，而設計師對于柵格的理解源自平面設計中的柵格，不應把柵格系統當成一種限制，而是幫助，也不用總是擔心元素超出柵格。
藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。
文章來源：站酷 作者：隔岸吃瓜
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
對于網頁設計來說，柵格系統的使用，不僅可以讓網頁的信息呈現更加美觀易讀，更具可用性。而且，對于前端開發來說，網頁將更加的靈活與規范。
藍藍設計的小編 http://www.syprn.cn