Nathan Yau 在《數據之美》中寫到，可視化并不僅僅是一種工具，而更像是一種媒介，能最大化幫助我們挖掘數字背后的信息，讓數據「開口」講故事。
可視化設計將信息和數據轉化為用戶能夠理解的圖表、圖形和地圖等元素，通過色彩、樣式凸顯其中的變化，幫助用戶更的獲取信息、判斷趨勢、識別變化等。那么在可視化設計中怎么讓用戶能更好的看清看懂數據或信息、讓用戶快速感知數據變化、讓數據于用戶所處的情境相呼應是微交互思考的方向。
通過可視化表達，將不易理解的信息呈現的更加清晰明了，幫助用戶理解吸收。
1. 支付寶-基金指數
運用一般人對紅綠燈的理解，將其綠燈行紅燈停的概念，運用在基金投資上，幫助新手能簡單理解指數估值的走勢，更容易去判斷該基金買賣的時機，綠燈為值得購買，紅燈為建議賣出。
2. 支付寶-基金收益
欲購買基金時，透過尺標的形式選擇購買金額，同時下方展示購買該金額的預期收益，并用實際生活中的物品舉例，幫助用戶理解獲益的金額價值。
3. 手機淘寶-金幣小鎮
做任務簽到獲取能量，使用進度條的形式，來表達能量與金幣值轉換的關系，如當前獲取多少的能量，能兌換成多少金幣。
可視化中的變化凸顯能幫助用戶快速達成目標，在最少的時間內獲取更多的信息，并引導用戶進行更深層次的探究?？梢暬械淖兓癸@能幫助用戶快速達成目標，在最少的時間內獲取更多的信息，并引導用戶進行更深層次的探究。
1. AirVisual-空氣質量指標
依據顏色與人臉圖形表達空氣質量程度，顏色從綠黃橙紅紫暗紫色，人臉圖形從開心、難過的表情、戴口罩到戴防毒面具等，來表達空氣質量從好到壞，讓用戶能直接看到顏色與圖形就能感知到當前情況，且知道對應的防范方式。
2. 我的天氣-3D地圖
日出日落的時間以動態的地球展示，地球滑動操作，讓用戶能實際感知到地球的光照情況。
3. 騰訊手機管家-充電狀態
手機充電時，以整個屏幕作為充電量的比例展示，以虛擬鴨子游水的有趣形象，透過水位的高低表達當前已經充電到達的數值。
在可視化中增加與用戶情境相關的元素，能夠讓用戶獲得更貼切，更直接的信息感知。
1. 高德-導航
當開車導航的當下，如果車速過快，在屏幕的雙側會顯示紅色的超速效果提示，比起左上角的車速展示，能更直接快速的感知到已經超速了。
2. 高德-用時預估
查看行程導航的預估用時，運用柱狀圖直觀展示不同出發時間到達目的地的所需時間，滑動時有震動的切換效果，同時上方地圖會顯示該時段路途上的擁堵情況，顯示預計到達時間。
提供足夠便捷的篩選或操控組件，方便用戶查看更多視圖空間，快速定位想要的內容。
1. 攜程-機票票價對比
運用柱狀圖展示不同日期的機票票價，能直觀看出價格間的差異，點擊后，可切換到該日期，查看具體航班資訊。
2. 攜程-機票低價提醒
機票的價格是浮動的，可透過低價提醒的設置，主動提示用戶票價已到達該預期價位，設置時如果價格設置的過低，到達的可能性越低，因此以價格滑動條操作，并以綠橙紅表達成功率的高低做提示。
文章來源：優設 作者：AlibabaDesign
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
如何產出一個對實際落地更有指導性的設計分析？本文結合實際項目中常常會遇到的一些問題，總結了前期設計分析的一些實踐經驗。
設計分析是作為交互設計師必備的一項基礎能力，一套有效的分析思路可以幫助我們找準設計發力點，更效率的推導出合理的設計方案，它是一種思維能力，也是一種方法工具，但是在我們的實際項目中，常常會遇到這樣幾種場景：
新手設計師或者第一次做活動的設計師，設計分析不知道要如何入手
花了很多時間做分析，但感覺對實際畫稿子并沒有什么幫助
分析過程中發散了很多很好的點，但最后大多都落不了地
這些情況常常會導致設計分析流于形式，套用了很多方法、花了很多時間、輸出了很長的文檔，內容看上去似乎很豐富，但落地的方案卻平平無奇，甚至也會自我懷疑設計分析真的有用嗎？
總結下來，會出現這些場景的原因有兩點：首先是設計分析太泛，沒有聚焦到核心問題；其次是時間分配不合理，沒有抓到發力重點。那么結合我們目前的項目來看，怎樣做一個更有用的設計分析呢？
根據活動產品化設計思路，可以把我們的日常項目分為兩類：迭代型項目以及探索型項目。
迭代型項目是指過往已有過積累的成熟項目，例如大促主會場、我的專屬會場、榜單會場、攻略等等，通常是一些已經比較固化的經典業務，或基礎的功能類業務；探索型項目則是一些全新的業務方向，例如下沉會場、直播會場等等，剛處于進入期或成長初期。
迭代型項目容易陷入的一個誤區是時間分配不合理，沒有抓到發力重點，尤其是對于很多新手設計師來說，往往大部分的精力花在重復之前已經做過的內容，比如花了很多時間重新去分析用戶、分析方向、分析行業趨勢等等，但是對于已經比較穩定的迭代型項目來說，這部分背景內容相對來說已經比較固化（除非有明顯的變化），這就可能會導致重復分析出來的結論跟之前的差別并不大，也很難帶來實際業務提升。
既然迭代型項目過往已有過經驗和策略的沉淀，也經歷過多輪的數據迭代，核心思路應該是先定義要解決什么問題、然后才是如何解決，這樣才能找準關鍵發力點。
要解決什么問題
首先要思考是不是真的有問題，沒有問題的項目也可以不用再花時間做分析，效率做即可，例如像全部會場，本身的業務模式就比較簡單，過往的效果也相對比較穩定，如果不考慮進行突破性的創新，通常是可以效率復用的，這種時候則不需要再去做分析，畢竟也要考慮投入產出比。
那么怎么定義要解決什么問題呢？有三個常用的思路：看數據、看用戶反饋、看運營策略。
第一，從數據分析中找到關鍵問題，例如根據618的項目數據復盤，我們發現預售會場、品牌會場的頁面跳失率較高，那么雙11核心可以圍繞“如何降低跌失率？”“如何提升流量利益效率？”去進行分析，從而推導出更有針對性的設計策略。
第二，根據用戶反饋來找到關建問題，例如過往的主會場，用戶調研一直都會反饋主推樓層太長而找不到感興趣的內容，那么可以圍繞“如何更好的進行需求匹配？”“如何提升屏效？”來思考和分析，解決實際存在的問題，才更有可能提升體驗和數據。
第三，結合運營策略，很多業務雖然已經相對穩定，但隨著每次大促戰略的變化，運營策略上也會有一些新的需求，那么就根據這些差異化的訴求去找到發力點。例如針對我的專屬會場，在原會場定位不變的情況下，在近兩次大促中運營側都提出需要由這個會場來承載平臺服務內容曝光的訴求，那么服務內容如何匹配“專屬”會場的用戶心智，則是這個會場可以重點解決的問題。
如何判斷真正有效的解決方案
在定義清楚核心要解決的問題后，就可以按照常用的設計方法進行方案的推導，在發散解決方案的過程中，如何判斷方案的合理有效，確保最后的可落地性，是讓我們設計分析有價值的關鍵，因此總結了兩個常用的技巧。
首先要理解業務邏輯，減少無用的策略發散，很多時候我們的方案很難推動落地的原因，是沒有考慮到業務的訴求，越能夠深入的了解業務，才能更好的解決業務側的顧慮，保證方案的可落地性。
其次是要跳出來從整體來看優先級，我們在進入自己的思維邏輯中時，會比較容易陷入細節，有時候自己覺得很棒的想法花很大力氣去推卻很難獲得其他人的重視，并不是因為我們的方案不夠好，而是沒有關注到整體優先級，因此要學會看全局，通過多溝通多評估的方式來讓自己的判斷更加準確。
探索型的項目沒有過往的參考依據，相當于需要從零開始去探索如何做，對于設計分析的能力要求會更高，那么常常容易陷入兩種極端相反的誤區，要不就是容易被方法論套路，設計分析過泛但得不出實際有價值的結論，要不就是完全沒有頭緒，屬于想一步做一步的類型，分析的內容之間缺乏邏輯。
因此，探索型項目的核心思路是要先有分析框架、再做縱向深挖，就像畫交互稿的過程一樣，需要先定義交互框架，縱再進行交互細節的打磨，才能夠保證設計效率及效果。
確定分析框架
確定分析框架的過程主要分為兩步，一是先想清楚要分析哪些內容，包括哪些環節是必要的，哪些是重點的，時間要怎么分配。例如當我們第一次做寵物品類活動時，需要對這個品類有深入的理解，因此我們在前期需要去分析養寵人群的特征、寵物行業的發展現狀、京東寵物貨品的優勢等內容，而如果我們做的是一次大促的綜合會場，其主要用戶群體如果跟常規站內主流群體并無差異時，則不需要再花費大量的時間單獨去分析用戶畫像，因此，需要結合項目情況先想清楚需要分析的內容、以及這些內容的必要性和優先級。
第二步是梳理清楚內容之間的邏輯關系，常見的邏輯結構有兩種，一是遞進式的推導（A→B→C），分析維度之間是先后關聯的，通過嚴謹的邏輯步步推導而來，例如先梳理用戶畫像、才能進行用戶行為痛點的分析、進而推導解決方案；另一種邏輯結構是進行綜合歸納（A+B→C），即通過幾個不同的維度綜合推導，例如經典的五導家分析方法，結合用戶目標以及業務目標綜合推導出設計目標。
在很多設計分析中，我們也會參考一些方法論，其實方法論提供的就是分析框架，在理解了這一步之后，相信也能更靈活的應用。以下是根據我們日常項目梳理的一些常用分析框架。
縱向深挖如何得到有價值的策略
有了分析框架后，接下來就可以進入每個模塊的具體分析了，如果要得到有價值的策略，同樣有兩個小技巧。
首先，策略要足夠具體、有差異化，盡量避免提出過于籠統的結論。例如針對如何提升流量利用率比較泛的策略就是要進行流量精細化運營，這個大的方向沒有錯，但如果只到這一步是很難指導具體內容落地的，所以需要細化到流量的渠道有哪些、這些渠道有什么樣的特征、針對不同的渠道用戶可以用怎樣的內容吸引他們，才能夠更準確的判斷是否會存什么問題。
其次，策略最好能夠關聯驗證指標，可以參考UGD數據增長思路，在推導策略時要能預判它能帶來哪些數據指標的提升，以保證設計分析的結論是有理有據的。
文章來源：站酷 作者：大蔥設計
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
故事線，即故事框架，在前面的系列有略微提到過，畢竟如何串起信息點以及頁面的構圖方式是服務于故事線的。在我們服務用戶的過程中，發現有些項目的表述方式是重復的。那重復的原因是啥呢？簡單的想了下這些問題，不難發現用戶吸收信息的方式和業務邏輯大致是相似的，所以我們在做項目的過程拿到用戶給出的需求后想出的解決辦法中也是具有一定的相似性。
解決辦法中的表述方式是單獨存在的，是對應不同的業務場景，我們想要的是將故事線的方法論總結下來，畢竟思想是永恒的。專門用一章講一下我們總結的方法論是因為這些故事線本身是抽象的，具有高度的總結性，能夠適用于大多業務，也方便新人設計師在做需求的時候有一定之規可以參考。
發現現象-提煉問題-問題分析-解決問題這條故事線，是我自己寫文章的時候想出來的，確實故事線最早的體現就是工作報告之中。這個可算是黃金故事線，百分之八九十都能套進去。因此適用面特別廣，我們經常使用這條故事線來講民生問題，特別在脫貧攻堅的專題中用的較多。那么就圍繞脫貧攻堅專題來講一下怎么鋪開這條故事線。
以茶農的故事作為切入點，我們發現實際的場景是這樣的。A地的茶葉產業鏈較完整 ，B地是A地的幫扶對象，但是B地的經濟民生一直不溫不火的狀態。從大數據的角度，通過監控B地產業鏈的指標不難發現其實是有文章可以做的，簡單來論述下主要是以下四塊內容。
發現現象：B地移植了A地的茶葉產業做法，本以為能大力提升B地經濟 ，但是從B地的GDP、產業增加值、人均可支配收入并沒得到明顯持久性提升。
提煉問題：通過監控B地的茶葉市場調研數據，不難發現B地的市場和A地的高度重合。B地的經濟不溫不火應該是做法全盤照抄A地，并未形成自身特色，在市場上未拉開差距，一直以低廉利潤來維持銷量，產生不了其他高額的產品附加值。
問題分析：通過分析B地的茶葉市場調研數據，發現在其他緯度上B地的茶葉產業市場并沒有拓展。比如A地深耕多年在銷售渠道上，建立了產業全國銷售網，從數據上分析上表示祖國東南板塊基本被A地壟斷，但是其他板塊并沒有全部滲透，B地是否可以向那些板塊進軍。諸如此類的問題都可以從數據層面分析出來。
解決問題：當核心問題被提出分析后，得到一些改良意見。那么未來的產業運轉以這些意見為參考，建立起合適的監控指標，用來佐證這些改良意見是否具有成效。
這條故事性適用性廣，挺多問題都能放進去。但是需要明確一件事，每一步的對應指標需要有代表性，不然說明不了問題，還有上面的故事線是如何鋪開的僅僅作為解釋。
宏觀-中觀-微觀這條故事線，是我在做經濟項目的過程之中挖掘出來的。當時在做項目的時候主要還是從宏觀和微觀兩個角度去論述，通過化繁為簡、以小見大來表達我們的想法。最后通過總結整理后，發現加上一個中觀緯度會更加順暢和飽滿。這條故事線適用于不同領域至上而下的政策傳導和政府關懷的信息串聯。
就拿這個經濟項目為例子講一下這條線怎么鋪開。當時拿到的需求是客戶想通過數據看下十三五規劃后一個變化，怎么去響應中央的號召，怎么通過解讀工作將政策和人民群眾建立起橋梁，怎么將人民群眾落到實處。其實這就是一個從宏觀到微觀過程，換句話說就是方向-工作-成果。通過歸類提煉信息點，我們不難發現可以將信息分成三塊內容。
宏觀：中央經濟會議的主基調、國家層面的重大項目、國家統計局頒布的監測重點指標；
中觀：省委或者地方上是怎么解讀政策的，并且針對自身特點增添了什么內容；
微觀：人民群眾的生活變化——物價的監控指標、人均收入的監控指標、生活質量的監控指標；
分清楚這些后就用設計語言一步一步的表述下去，形成從上到下的一整套解釋。順便提一嘴，需要在橫向上做上數據比對分析。這樣縱向有業務，橫向有數據，整條線才算飽滿。
基礎-工具-落地-成果這條故事線，是我同事在和警察叔叔斗智斗勇好幾個月后積累出來的，經過我們不斷實踐總結出這條故事線。這條故事線是從大量的業務邏輯中提取的，環節和環節之間并不是完全獨立，是互補互存的，描述的過程中需要4個環節同時存在才能為最后形成的結論產生背書。這條故事線適用于描述自有業務的從無到有的演變過程，體現自身在對應領域的耕耘。
那么就拿我同事這段不堪回首的往事來解釋這條故事線是怎么鋪開的（dog臉~）。當時的需求是這樣的，我們的客戶即警察叔叔需要向外界介紹他們工作成果（向保護我們安全的警察叔叔致以最高的敬意?。Ｎ覀兂檎{了很多相關的歷史重大事件的破案歷程來詮釋警察叔叔的辛苦，但是警察叔叔們均不滿意。他們認為還是太片面了，并沒有將大局講清楚。反復和客戶溝通最終確認了業務，因此有了這條故事線的雛形。簡單來論述下主要是以下四塊內容。
基礎：公安存檔的犯罪記錄庫與人臉識別前端設備相結合產生大量的預警，在庫內形成預警日志；
工具：簡單來說同一類犯罪，比如賭博經常出現在某個片區，通過建立模型可以知道大致動向。那么不同的規則不同的對象可以建立不同的模型，即犯罪模型就是工具；
落地：把模型推廣用出去，使用模型進行分析。比如多位賭博人員被捕捉到經常出現在大屏上某個特定的片區，多地協調開始偵辦該犯罪活動。
成果：將繳獲贓款、犯罪人員、案件細節反補入基礎庫中，形成業務上的閉環。
這條故事線需要將自身想表達的業務嵌入這四個環節之中，并且從頭至尾必須同時存在，缺少哪個環節最終的閉環無法形成。多地業務反饋，形成良好的閉環是優勢互補、避免資源浪費的最好體現。
核心-緯度1/緯度2/...緯度N這條故事線，是在做西湖項目的時候發現的。主要的做法就是以一個核心為內容，分不同的緯度去詮釋這個核心的價值。在表達方式算是總-分的概念，可能最后在從分的地方再繞回來。相比其他的故事線，這比較“面”。將一個大問題分割成幾個小問題，一塊一塊去介紹。這條故事線適用于核心內容比較寬泛，涉及業務領域較多的主體單位。
簡單介紹下這個項目用來解釋這條故事線是在怎么鋪開的。西湖的項目是一個大結合體，是西湖管委會關于自身治理的一個成果展示。由于管轄的區域中存在較多不同領域的內容，故此采用這種方式論述。主要是以下五塊內容。
核心：西湖景區主要是旅游產業，對應的核心是景區游玩人數（即公園年卡辦理數、收費景點入園人數）。那么圍繞這個核心就有挺多緯度是可以影響的，最后確定下來的是五個緯度。
緯度1：治景。監控實施客流，以及分景點監控其客流量和停車服務，實現動態分析擁擠程度；
緯度2：治業。監控與西湖相關的產業和企業的狀態值，掌握周邊合作企業的發展狀態；
緯度3：治安。轄區內以網格為單位，監控網格內治安事件的狀態，比如綜合治理、市場監管等事件的發生數；
緯度4：治水。西湖大面積是水，因此監控西湖的水質水量也是重要的一環；
緯度5：治山。監控西湖的山體內基礎資源的布設，是便民利民的體現，也是管理成果之一；
形象的解釋就是核心是塊大餅，不同的緯度就是去分這塊大餅。最終的目的是讓受眾更好的了解故事，因此分大餅的時候請不要過于深入展開某個緯度，各個緯度偏向均衡介紹。避免過于陷入某個緯度導致宏觀核心不可觀。
起初-然后-接著-最終這條故事線是按照用戶行為沉淀出來的，一般人在介紹自己經歷的事情的往往也是用這樣的格式。其實這個故事線我們也是偶爾在需要點題的內容上做分析詮釋，拿出來講只是想多個內容多個探討的資源。這條故事線適用于具體案例一步一步按照節奏講述的場景。
那我們拿一個用戶滿意度的流程來解釋這條故事線是在怎么鋪開的。這個用戶滿意度的項目是分析市民來窗口辦理業務的效率以及情緒，從宏觀層面統計轄區內所有網點窗口的業務辦理效率。需要我們將市民來窗口辦理業務的整個流程清楚細致的剖析，通過對業務流程的觀察，我們利用這條故事線大致分了以下四步。
起初：排隊取號階段。分析目前所有網點窗口排隊取號的擁擠程度（取號量和等待人數）
然后：業務辦理階段。分析目前所有網點窗口業務辦理的速度效率（辦結量、過號量、辦理時長）
接著：現場評價階段。分析目前所有網點窗口現場及時反饋的情況（數量、滿意率、網點排名）
最終：回訪評價階段。分析目前所有網點窗口業務辦理的質量（是否最多跑一次、回訪評價）
按照節奏講述具體案例有個需要明確的是，信息的接收方會隨著介紹陷入具體的場景，這時候當講完后繞回來輔以幾個總結性指標來概括整個場景，會更加適合信息傳達。
以上五條故事線均是從表達中抽離出來的，它和視覺手法等都是為信息傳達服務的，目標都是為了受眾更好的接受信息。故事線本身是抽象的，需要多使用在業務上才會熟悉。上述講述的這五條，其實大家細心點會發現并不是完全獨立，存在換套說辭就可以融在一起的情況。我們自己在使用的過程中也是多條一起講問題，衡量的標準就是把故事講清楚。
文章來源：tob.design 作者：王亮亮同學
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
引子
說起大數據這個領域，可是近些年相當炙手可熱的產業，而伴隨這個產業提供了很多就業機會。黨和國家大力推進政府數字化轉型，我們也受益于這波浪潮并在其中得到了成長。我們主要是作為第三方企業幫助政府推動數字化轉型，在這個過程中承擔數據可視化設計的環節。大數據時代下，黨政機關的數據量也是龐大且復雜的，我們的用戶也需要新的技術去面對日常工作，對于設計而言是一個頗有挑戰的課題。
寫本系列的初衷是想把工作過程中的一定之規總結沉淀下來，坦誠的講我們也是站在前人的肩膀向前。比如我們的后臺數字化解決辦法中融合了螞蟻金服AntDesign的精神和阿里云對于體驗的標準化反饋機制，并且針對自身業務在某些緯度上做了傾向性的調整和變化。
在此多說一句，我們很榮幸站在這個時代的浪潮上去觀賞中國崛起的史詩畫卷，但是我們也時刻保持著冷靜和客觀。我們很欽佩那些將比較成熟的東西標準化，拉高整個行業的體驗基準線的團隊。標準化一定是一件需要全行業一起推動的事情，在此獻上我們的一些總結和思考。
與傳統的數據可視化設計體系相比較，由于我們的用戶是黨政機關、事業單位，因此更有傾向性的選擇和探索。長時間的觀察用戶，發現外界普遍存在夸大事實的宣傳和固執己見的成見。對于LOGO又大又紅的需求，其實有絕大多數是溝通存在了障礙。
在我們為用戶服務過程中，存在經常加班和反復改稿的現象，在一定程度上造成資源浪費。作為B端的設計師，冷靜的復盤項目過程，排除其中的主觀因素，客觀的分析現象。認為問題可能是很多同事無論在業務理解和前期規劃都有一定的障礙和不適之處，不能和用戶達成目標的一致性。發生這樣的問題是因為組內大部分設計師C端的思維并未完全過渡到B端，在工作中沒有凝煉自己的方法論。故此，寫本系列是奔著將我們過去總結的方法論給到新人設計師，為了更好的融入工作，減少試錯成本。
要搞清楚這個問題，首先我們需要解釋下什么是數據可視化。
數據可視化主要旨在借助于圖形化手段，清晰有效地傳達與溝通信息。但是別輕易認為是簡單的將數據轉換成圖表，而是以數據為視角，看待世界。換句話講就是用一些方式方法將以數據為內容的信息直觀清晰的展現在用戶面前，幫助用戶了解真實的世界，明白數據背后隱含的變化規律。
那么問題來了，用戶需要看的是什么？
舉個例子：有的時候我們給黨政機關做可視化大屏的時候，用戶在宏觀角度下并沒有明確表達需要展現的內容，往往這個過程中我們需要挖掘用戶的心態。一千個人眼中有一千個哈姆雷特，每位來視察的領導對于看到的內容都有不一樣的詮釋。通過經驗判斷，有些常用的內容是有價值的，比如GDP增速、一產二產三產的產業增加值等。這邊我不是說讓大家都去碼這些指標，這種拿來主義我們從來不倡導。我們是想讓大家明白，用以上的指標是因為這些內容是地方官員工作成果和工作成績的體現，這些指標是通過大量計算的一個結果值，是反應政績的一種量化指標。以往匯報的時候，講訴的時間并不長，因此要抓住機會講結果。
知道用戶關注哪些內容后，就冒出一個問題，讓用戶怎么看！簡而言之，你怎么去碼這些關注的內容。在政務系統長期的建設下，我們對用戶的數據有多龐大是有所了解。哪怕歸集數據的主體是一個小的部門，定義其工作性質的就有幾百個指標。你需要理解用戶是長期在哪種環境下的，收到的信息是以什么樣的方式傳遞的。
舉個例子：你注意下我們這篇文章的主次關系，有沒有發現是按照大標題-標題-中標題-小標題-正文的方式敘述的。有空看下政府的紅頭文件或者當地的報刊雜志，都是按照規范的行文方式傳遞信息的。那么用戶長期在這樣的環境，就會依賴這種方式去接受信息。
將信息結構化，用寫文章寫書那樣的方式將信息傳達，建議使用總-分或者總-分-總的方式。當你這樣還不能梳理清楚，可以借鑒扉頁-目錄-章節等方式去表達。
有的時候，緣分就是那么巧妙。我們的自我要求和用戶的訴求趨于同步，一個故事講的好不好直接關系著一群人的工作成果。這里的故事化換句話說，就是框架。正所謂大道至簡，信息傳播最牛逼的就是把一個特別復雜的內容用最樸素近人的語言總結，比如獨立之精神，自由之思想。
我們以一個案例來剖析如何有組織有節奏的表達內容，以下是有關于經濟的內容，僅供參考。
首先，先拆解經濟的信息點，信息本身是有層級有關系的。單獨存在的信息點沒有比較，是無法從側面反應客觀規律的。為了我們盡量少的產生紕漏，先開始逐層拆分。我們明確信息點有哪些，根據上一節的內容，我們獲知信息點取決于用戶需求，而傳播信息點又受傳播媒介影響，即表達目的?？偨Y而言，就是用戶想看什么和你想讓用戶看什么？這個地方需要仔細想想，不然起步就錯了。
在經濟大屏中領導一般關心的是工作成果和工作成績。
當確定這兩個內容的時候我們繼續細化拆分信息點。當前這兩大類是很籠統，不具備結論性。我們需要繼續拆分信息點，直到可以對這兩大類提供結論。此時我們的慣用方法就是用宏觀-微觀作為拆分依據，如下：
故事化的作用就是將信息點有組織有節奏的表達出來，零散的信息點毫無意義的。換句話說就是用框架的形式清晰完整的表達內容。好的故事是有主有次，主能概括、次能點題。
主要故事線：用戶接受度高，能夠概括整個屏幕的內容，快速了解頁面概況或者特別關注的重要信息。
次要故事線：對主要故事線起到解釋補充的作用，能夠全面闡述頁面信息或者點題的作用。
那么這邊就清楚了，主要故事線就是宏觀內容，次要故事線就是微觀內容。解釋下，次要并不是說不重要。像這邊的微觀內容代表的就是地方上的信息，需要存在但不是全面展開，它是宏觀的基礎土壤，往往我們在介紹的時候是用來點題，以小見大的。
最早我們就說用戶關注的不是數據項，數據項是過程的產物，真正的關注點是最終處理后的信息。我們訴求的信息點是從用戶想看什么和你想讓用戶看什么中挖掘出來的，需要有數據背書。即數據關聯信息點。
1.明確用戶關心的內容是重中之重，它決定起調的方向。有的時候陷入項目之中，往往是關注項目細節忽略了大局觀，所以經常低頭做事也需要抬起頭看看路。
2.按照用戶習慣的方式去梳理信息點，減小使用成本。用戶長時間沉浸在有條理有層次的環境中，因此灌輸信息的方式也要依循這個節奏。
3.歸類提煉信息點，用故事去串聯信息，用數據背書信息。有條有理的去表達我們的想法，能夠讓人更好的接受并且理解。
文章來源：tob.design 作者：王亮亮同學
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
編輯導讀：經過這次疫情，很多還在猶豫要不要經營私域流量的零售商都行動起來了。隨著公域流量越發昂貴，私域流量似乎成為了保持增長的新藥方。但是，想要玩轉私域流量并非手到擒來。本文將從三個方面對此展開分析，希望對你有幫助。
一年之前，對于很多品牌商和零售商來說，要不要經營私域流量，要不布局私域業態，可能還是掛在PPT上不痛不癢的概念。
疫情逆轉了這一切，從公域到私域全線布局，成為了品牌商和零售商的常態化選擇——這不僅關乎增長或者下跌的多寡，甚至還關乎不少實體業態的生死。
當線下客流越發稀落，公域流量越發昂貴，私域流量、私域業態，似乎成為了保增長的新藥方。
所謂的私域，與之對應的概念就是公域，是指一次獲取之后，可以反復觸達、長期運營的客戶關系，如企業通過公眾號、小程序、微信群等圈定的用戶群體。
私域玩得好，增長跑不了？
話雖如此，但玩轉私域流量，也并非手到擒來那般簡單，厘清存量增量關系，擺正公私兩域位置，是順利開張的前提。
從線下發家的名創優品創始人葉國富，一貫不怎么看重線上渠道。
線上渠道，在名創優品一直是小打小鬧——2019年底之前，其線上營收貢獻率只有1%左右。
但過度倚重線下的模式，在疫情面前，被打得七零八落——名創優品關店率一度高達50%，開業門店業績一度下跌了95%。
要活下去，除了轉道線上別無選擇，這是名創優品第一次把線上當作第二主場，微信群、小程序、公眾號等工具迅速集結起來，公司業績也在年中恢復到疫前水平。
于名創優品來說，快速回血的私域大盤，相當于風險緩沖帶。
而那些趁早挺入私域的零售商，如步步高，在疫情期間，業績不降反增，4月交易額相比去年12月提升了四成左右。
一個疑問隨之而來，疫情期間迅速膨脹的私域大盤，到底是特殊時期的曇花一現，還是可以長期持續的數字資產？私域大盤和傳統的客戶群體，到底是零和的替代關系，還是全新的增量？
這個答案非常復雜——從短期來看，似乎是零和關系，或者說從行業大盤來看，有一定的替代性；
但對于單個企業來說，增量效應顯著——客戶從線下大盤到線上大盤的趨勢性轉移，很大一部分沉淀在私域大盤里，私域業態走到前列的企業，可以攫取結構性紅利。
對此問題，天虹數字化經營中心總經理譚曉華很有發言權。
天虹與微信生態結合，始于七年前，目前已經積攢了3000多萬會員，此前，天虹百貨的線上銷售額貢獻率不到1%，如今已經常態化維持在15-16%左右，疫情結束之后，也沒有明顯回落。
增量體現在市場的拓寬上。在線下，天虹僅在8個省份的26個城市開設有線下門店，但借道私域大盤，天虹的商品銷往了22個省份的300多個城市。
“你的服務范圍跨越到原有的門店3公里、1公里范圍之外，在產生銷售的時候，那就是百分之百的增量?！弊T曉華很是滿足。
私域帶來的交易，還能緩沖線下渠道凋落的風險，有望成為彌補實體門店業績下降的第二條增長曲線。
譚曉華的危機感一直高懸，實體比重的下降是長期趨勢，做私域，未必能“馬上就能彌補下降，但是至少有了這一塊的增長和增量，是可以讓下降的趨勢，比如從原來下降的10%，現在只下降2%了”。
私域大盤的增長，還提升了天虹博弈品牌商的話語權。
此前，天虹線下門店中，只有一家蘭蔻專柜，并不是很受重視，“以前這種品，是不愛跟百貨商超一塊玩的”，譚曉華并不諱言。
但今年3月份，天虹發起的一場小程序直播，幫助蘭蔻賣貨230多萬元，讓后者很是驚喜，心甘情愿給出了A+級別的線上代理授權。
如果看不到私域的增量價值，那么商家斷然不會全力投入。
嚴格來說，流量并不稀缺，稀缺的是低成本流量——公私兩域流量，也并無絕對的好壞之分，而私域的獨特價值在于其再生和循環。
因此，多數商家都是“公私兼顧”，但在不同平臺的布局，具有互補性和差異性。比如全渠道布局的蘭蔻，在微信上聚集的是粘性用戶，因此，加強限量特供、新品種草和專屬服務是其側重點。
即便在微信生態體系里，也是既有公域，也有私域。
在微信支付運營副總經理雷茂鋒看來，視頻號算是微信生態里的公域流量挖掘機，幫助商家從微信12億用戶的公海里，引流轉化。
歸根結底，私域與公域的關系，就如同海洋和河流——不與海洋銜接的內陸河，面臨水流干涸之險；大河東流，百川入海，又為海洋引入綿綿不絕的水流。
與此同理，私域流量和公域流量，也并非互斥關系；開源活水之下，雙方可以互相引流，互為增量。
舉例而言，企業開通視頻號直播時，可以通過提前預告等方式，把沉淀在小程序、公眾號、企業微信群的忠實會員導流過去，為視頻號直播增加人氣，這就是私域為公域引流。
正是借助公私兩域流量聯動的打法，今年11·11，香港莎莎的小程序銷售額同比增長了830%。
相比于其他平臺可以快速引爆的公域流量，微信平臺私域流量的挖掘和積攢，可能是個慢功夫，但其價值在于，一旦沉淀下來，轉化率要高得多。
今年2月底，上門定制男裝品牌量品的首場直播帶貨，沒有網紅加持，也沒有經驗支撐，兩小時內僅僅吸引了1.1萬人觀看——這個觀看量著實有些拿不出手，但銷售額卻超過了50萬。
而天虹常態化的直播里觀眾甚至只有幾千人，也能賣貨幾十萬。
如今，微信支付的月活用戶已經邁過12億大關；今年1-8月，小程序實物商品GMV同比增長115%，品牌自營GMV同比增長210%。業內人士預計，今年其交易額有望突破2萬億元。
12億用戶，2萬億GMV明晃晃的擺在那里，但能否把公海的水舀到自家池塘里，需要本事。
對于開設了線下門店的商家來說，前期存在一個低成本的紅利轉換期——比如在支付完成頁，設置積分優惠、會員跳轉等功能，把一次性顧客轉化為長期會員，而后通過企業微信、小程序、公眾號、視頻號等持續激活，通過存量的線下服務去連接顧客，基本上無需太多額外投入。
當然，接下來，在存量客戶全部在線沉淀后，想要繼續擴大私域基本盤，可能就需要通過微信朋友圈廣告、支付頁廣告等去拉新轉化。
但花錢買來的私域流量性價比高不高，歸根結底在于能不能持續轉化——微信平臺的小程序觸點繁多，立體組合應用挑戰大，可運營點容易遭到忽視，因此，提升流量利用和交易轉化效率，才是重中之重。
于商家來說，河道建起來不是終點，不能轉化的私域流量也沒有價值。
社區電商興盛優選的方法是發動外部的螞蟻雄兵，依賴社群裂變，引導幾十萬名團長轉發商品和活動，11.11當日日訂單突破1200萬單。
天虹的路徑則是“全員持槍上崗”，5萬名導購“人人會直播”。
其實，除了少數種子選手外外，不是每個導購都擅長直播。最開始，天虹導購們心理壓力很大，覺得一場直播賣不出去幾萬十幾萬，都拿不出手。
但譚曉華的看法是“聊勝于無”，“哪怕你搞一場直播，只有三個人觀看，你在店里一次只能服務一個顧客，現在能服務三個，這就是價值”，譚曉華說，“我們從過去的功利模式過渡到了現在的養生模式”。
所謂的“養生”指得是，并不僅僅以銷量為單一KPI，“特價搶購、新款種草、展示搭配，云走秀，都可以”，門檻低一點，才能實現總動員。
歸根結底，公域、私域流量，沒有好壞之分，都是多多益善，因此，公私兼顧、公私合營，可能才是最優選項。
連接一切的微信，既要考量C端用戶體驗，又要顧及B端商家利益。
挖掘私域價值時，如何做到不打擾不討嫌，避免變成人人嫌惡的微商？
這是商家和微信面臨的共同挑戰。
不打擾用戶，是微信一直堅持的底線，但具體到某個功能，邊界的精準拿捏，殊為不易。
雷茂鋒認為，解決方案就是把所有的選擇權交給用戶——用戶一旦覺得打擾，就可以關閉相關功能。
此外，微信也在分層開發針對B端商家和C端用戶的不同產品，來設置隔離帶和緩沖帶，企業微信就是典型例證。
早期，顧客添加導購個人微信，后者朋友圈可以無限制發放導購和廣告信息，可能會對用戶造成打擾，而且，導購還能查看顧客朋友圈，有些顧客注重隱私，可能就不愿意添加好友。
但企業微信用戶看不到好友朋友圈，而且發布朋友圈次數也有限制，如此一來，很多顧客就打消了顧慮。
而對于商家來說，企業微信的優勢在于好友無上限，無需再增設微信小號做運營；支持人滿自動裂變新群，無需手動拉群；支持離職繼承功能，一線導購離職后，客戶和群都可以100%平移給交接人，避免客戶流失，等等。
也是因為顧忌到C端用戶的體驗，微信上線商家功能的步子，邁得都比較謹慎。
品牌商向微信提出一個需求時，通常收到的答案是“我們回去要商量一下”。
而后要經歷長達三四個月甚至半年一年的左右糾結和反復評估，內部論證這一功能和微信的基本價值觀是否一致。
曾有天虹的運營人員為此抱怨，覺得微信某些時候反應太慢，但譚曉華的回答是“你不要嫌他們慢，他們做出來一個東西就不會再回退，因為回退是很可怕的，或者這個平臺不經營了，對我們商家來說那是致命性的打擊。”
一旦評估某些功能會遭遇C端用戶的集體反感，這樣的功能就不會上線——比如，曾有商家提議，能否開發一個群轉移功能，直接把朋友圈潛在顧客遷移到微信群，方便商家運營轉化，但這樣明顯打擾用戶的功能，應該永遠都不會上線。
盡管微信拓展私域業態的進展也不是一帆風順，盡管商家私域業態的進展快慢不一，但2020年，顯然是私域業態的大年景，疫情之后，沒有多少商家再對私域流量“視而不見”。
文章來源：人人都是產品經理 作者：財經故事會
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
配色一直以來都是設計圈內老生常談的話題，一幅優秀的作品離不開合理協調的顏色搭配。不同的顏色所表達的含義不同。即便是相同的顏色，明度和純度不同，給人的視覺感受也不同。雖然說配色是感性的，但每個人對于色彩的把控力和敏感度不盡相同，所以導致配色能力也參差不齊，這時候我們就需要運用到一些配色規則，提升我們對色彩的感知力。商業設計師跟藝術家不一樣，配色要考慮普通用戶的認可度和接受能力，有效的傳遞信息才是最重要的。所以在商業設計中，配色并不是越有藝術感越好，如何做到協調才是重點。
文章來源：優設 作者：美工美邦
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
今天分享的題目是從品牌到UI，用設計的思想與這個世界和解；這里的我說的和解比較寬泛，大家可以理解成與客戶和解，也可與產品經理和解，也可以是與自己和解；
為什么選這個主題呢，原因是之前在網上聽一群人總是說互聯網走到了下半場，我和好奇，就去查這個下半場到底是什么，后來總算知道了，互聯網行業走到現在，已經從增量時代轉為存量時代，這個存量時代就是下半場，人口、流量、資本的紅利都逐漸收緊。
在這種情況下我的產品如何從同類產品中脫穎而出，或許增加品牌屬性是種方法，希望大家在聽完這個分享后，會有一些啟發。
在互聯網的增量時代，品牌設計與UI設計是兩條平行線，幾乎沒有交集，你做你的畫冊、slogan、包裝，我做我的網站、app、微信小程序，偶爾互相模仿，但也不是主流，畢竟兩者載體不同，目的不同，用戶也不同；
但是到了存量時代，影響用戶選擇的一個重要因素是「品牌」，一個產品要想從同類產品中區別出來，需要有個性，UI+品牌成為產品生命周期中重要的一環，下面我們看看如何在用戶心中植入產品品牌；
在在品牌植入方便，國外很多產品已經走在了我們前面，我們來看看谷歌，谷歌開發者大會上對 Material（ Design做了更新，我印象特別深刻的是Google對圖形語言單獨拿出來做一個模塊解釋它，它提取了圓形作為視覺DNA，并沿用到產品的每一個控件；
當然，如果我們想傳達我們產品的品牌理念，只在圖標組件里運用是遠遠不夠的。
誕生于1886年的可口可樂，每年都做產品運營推廣，不斷大量的重復它logo的弧線元素和瓶子的外形；
還有剛剛過去的雙11，從2012年11月11日開始的天貓節，現在是全球最大的B2C平臺，天貓貓頭運用也是滲透到全產品線里面去了，問大家個問題，大家有沒有人知道這個貓頭品牌是誰創立的？其實就是馬云的繼任者，現任阿里巴巴集團董事局主席張勇；講的有點遠了，我們再回到我們的主題；
這個圖很好的解釋了品牌與產品與用戶的關系，產品需要品牌牽引、支撐，現在互聯網產品越來越趨于同質化，UI 設計師已經不能局限于界面的表現層，更要了解產品背后的邏輯，然后以業務為依據設計品牌，以品牌為基準去設計產品。
第一章意義Significance，這個章節我們講講從品牌到UI的意義
第一個意義是對內：可以規范統一，協作
品牌本身就可以作為設計規范的一個重要指導原則，通過對配色、文字、圖標、控件等建立設計規范，可以有效減少設計決策時間，傳達一致的品牌調性。
第二個意義是對外：可以提高認知，溢價增值
如果一個產品失去了個性，不看 logo，單純看界面的話，很多時候根本分不清是到底是哪一家公司的產品。如果能夠關注設計細節對品牌的影響，肯定能更好地提高用戶對產品的認知，當你對一件產品注入了感情，同時也就為產品提供了營銷推廣的立足點；也可以這么說，設計師創造的情感性價值，直接實現了產品的溢價增值；
第二章感知Perception
有位設計界的前輩講過，品牌知名度其實就是信任度的體現，他說世界上最成功的品牌就是宗教，這里沒有詆毀任何宗教的意思，但是宗教建立的品牌信任度，遠遠超過了任何商品；
這里我們從用戶的角度出發，看下用戶是如何從產品感知品牌的；
在設計產品的時候常常會發現我們覺得理所當然的地方，用戶往往沒按我們想的方式去使用。那是因為設計師通常有整體觀，站在金字塔頂端去規劃一個產品的設計，而用戶則恰恰相反，在金字塔底端往上爬，他們不知道這個金字塔多高，也不知道從哪一面開始最好爬，所以會遇到各種問題。
同樣，用戶對品牌的感知由低向高的，用戶通過各種場景接觸到產品，再通過產品的視覺呈現、功能體驗、信息內容等感知品牌，最后在心中形成印象，構建品牌信念，從而影響下次產生相應需求時對產品的選擇；
可以聯想下我們的購物體驗，是不是總是從同一個地方shopping，這就是購物APP品牌價值已經使你已經形成了習慣選擇；
作為設計師，我們需要充分理解品牌內核，由內向外將抽象的品牌內核轉化為具象的視覺符號，再延伸到用戶與產品的各個接觸點，從而將品牌理念植入用戶內心。
第三章融合Integration既然上面我們講品牌和UI最終要走的一起，這一章我們講他們如何在工作融合
第一步，明確定位，提取關鍵詞，建立情緒板
當代廣告教皇，美國奧美廣告創始人大衛.奧格威說，“最重要的決定是如何定位你的產品?！?/span>
在大師的指引下，我們發現首先找到品牌定位，定位自己的細分市場和目標用戶；
2.圍繞品牌定位提取關鍵詞；
3.建立情緒版，將抽象的概念轉化為可感知的視覺；
第二步，提取視覺表現元素，并設計融入品牌定位。我們重點從顏色、圖形、紋理、字體四個方面講一下。
有時甚至不需要任何圖形，單憑顏色就能產生對某一事物的聯想。
現在UI設計流行的極簡風，我們發現這些應用采用極簡化設計的同時，圖標也變得更鮮艷，更引人注目，說明這些產品也在尋求一個平衡，在 UI 設計變得極簡趨同的同時，仍然能保留核心的品牌基因。
顏色在 UI 中的表現有 logo、導航欄底色、圖標、文字、可視化圖表、插圖、按鈕等等。 
現在UI設計流行的極簡風，我們發現這些應用采用極簡化設計的同時，圖標也變得更鮮艷，更引人注目，說明這些產品也在尋求一個平衡，在 UI 設計變得極簡趨同的同時，仍然能保留核心的品牌基因。 
圖形
我們知道顏色是抽象感知，圖形是相對具象的表現方式。
一旦某個特有的圖形在用戶心中形成烙印，用戶見到相似的圖形組合都能往該圖形聯想，從而關系到圖形背后所代表的品牌，這也是很多企業做品牌升級的時候 logo 都越來越簡潔的原因，因為這樣能有效降低用戶的認知負擔，提高品牌認知。
圖形通常從 logo 本身提取，并在 UI 中延伸應用。比如馬蜂窩、百度網盤、京東做品牌升級的時候都不約而同地從 logo 中提取了一個代表微笑的弧度，傳遞友好、溫暖的品牌形象。
飛豬提取了 logo 中「豬的發型」用于搜索框，韓國的電商品牌11街也將 logo 延長作為界面中的搜索框。
紋理
在 UI 設計或者運營推廣運用中，通過提取品牌圖形元素，再運用分形、排列、重復、平鋪等設計手法形成品牌紋理。
我們看看京東的啟動頁用 Joy 的外形旋轉做成的紋理背景；
國外著名的聊天應用 Whatsapp，在聊天頁的背景用涂鴉插圖紋理做背景；
還有騰訊文檔的啟動頁、登錄頁用了漸變的菱形作為紋理，輔助品牌的視覺表現。
我們還在聊圖形復制變形的時候，國外的UI設計已經細化到了十分驚人的程度
例如UBER 在做的品牌升級，設計師出來將每個國家富有代表性的圖形提煉， 然后重復運?平鋪，形成帶有地域特色的?何紋理，運?到閃屏和線上線下的產品當中。
字體
字體是最容易被忽視的設計元素，很多人會認為 UI 中的字體用系統默認的就行。其實字體對于產品氣質的體現著很大的作用，很多品牌都把字體設計當成品牌基因中重要一部分。
字體的選擇需要契合產品功能特點與品牌調性。
微信讀書使用了方正宋三，讓人閱讀起來有種文字秀麗的浸入感；每日故宮使用了方正清刻悅宋體，字里行間隱含著歷史古韻，滲透著文化氣息；澎湃新聞使用方正準雅宋體，體現其作為新聞產品「專注時政與思想」的嚴肅一面。
英文字體也可以使用契合產品氣質的英文字體。比如常被用作數字字體的 Din、經典的襯線字體 Playfair Display、?歌御用的 Roboto 等。
第三步，融入品牌觸點
這里我解釋下品牌觸點這概念，是指一款產品中品牌信息接觸點，是決定用戶對產品品牌印象的關鍵；
我們看幾個案例，
啟動頁：知乎的啟動頁采用 slogan 加 logo 的方式來體現品牌，這也是絕大多數應用的做法；每日故宮啟動的時候伴隨著一聲鐘聲，頁面會有一個光線流動的動畫，極具儀式感，一下子就把用戶帶入故宮莊嚴的氛圍當中。
圖標：東家的每一個圖標都融入了印刷式字體的元素，體現其匠人的品牌基因；mono 則直接把產品名稱「 M O N O」用于導航欄。
插圖：Dropbox 的兒童風格的插畫與 B站 的二次元插畫都非常契合品牌特征。
品牌觸點式多樣的，除了上面的啟動頁、圖標、插圖之外，還有預加載圖、loading、動效、新手引導等等都能體現品牌觸點，這些品牌觸點，都是講述品牌故事的關鍵載體，幫助產品從同行業中脫穎而出，這里由于時間的關系我們就不展開講了，有興趣的同學，我們可以單獨交流哦
互聯網行業已經過了拓荒時代，行業沉淀下了許多有價值的知識，也有許多非常好的 UI 組件和規范文檔可以直接使用；
另一方面，很多公司對于 UI 設計在整個產品生命周期中的價值，普遍覺得不是非常重要，UI 設計部門只是一個業務支持部門，起不到主導作用。而如果 UI 設計師做的工作還是停留在把產品的原型文檔變漂亮，肯定是不行了。
設計師不僅需要對產品業務和商業有深入了解，更重要的是對于品牌在整個產品鏈路中的應用與把控。
我們需要走出舒適圈，主動去挖掘更深層次的設計價值，提升自我價值。
誠然改變一個大的設計生存環境是非常漫長的過程。要不停的嘗試，就像不停的迭代做新產品一樣，不能因為一兩次的失敗打消掉設計的積極性。
設計的終極最后就是和解 Compromise
開篇我提到了與世界和解，分享下我是怎么和這個世界和解的，我相信三句話，可以跟這個世界和解
再次謝謝大家聽我叨叨，如果大家喜歡，下次我們可以叨叨點關于設計的更有意思的事，謝謝
文章來源：tob.design 作者：無名大師29aef85c40
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
移動互聯網的迅速崛起，讓移動網頁，移動客戶端越來越重要，客戶端的頁面設計也是一門很大的學問?？萍佳杆侔l展的今手機屏幕的尺寸越來越放大化，但卻始終 很有限，因此，在APP的界面設計中，精簡是一貫的準則。這里所說的精簡并不是內容上盡可能的少量，而是要注重重點的表達。在視覺上也要遵循用戶的視覺邏 輯，用戶看著順眼了，才會真正的喜歡。
接下來為大家分享六款精美的app UI設計案例：
藍藍設計(北京蘭亭妙微科技有限公司）是一家專注而深入的UI設計公司，公司對UI設計的追求一向很高，致力于為卓越的國內外企業提供卓越的手機 ui設計、軟件界面設計、網站設計，用戶研究、交互設計等服務。
藍藍設計秉承設計優秀，不斷超越的理念，誠信敬業、專業耐心的工作作風，一直堅持注重用戶心理體驗及“設計與營銷”等領域的理論與實踐相結合。10余年專注努力，300+案例磨練。我們對手機 ui設計，用戶體驗與交互設計，各種類型軟件界面設計，國際化標準和流行趨勢，進行過不斷的學習和實踐。藍藍設計提供的是可以信賴的ui設計服務，我們內部有一套管理要求，比如去客戶現場每周一次的檢視和溝通、內部提案會議、每天下班前的整理反饋成果發郵件、隨時溝通的qq、電話，階段性的匯報和進度記錄整理。多勞多得的獎勵機制，客戶滿意度評價獎勵機制，鼓勵大家用心、平和、耐心、勤奮、創新的做事.
北京藍藍設計團隊來自清華美院，工作多年，行業經驗豐富，專業性很強。我們是熱愛設計，設計不僅是我們的專業，我們的職業，還是我們的愛好。每一個藍藍設計的設計師都希望自己的設計越來越好，以高標準，敬業用心的態度、專業的技藝得到客戶的認可。為此，我們不惜代價，愿意額外的付出時間、精力，去學習、去嘗試、去研究、去探索。工作賣力，玩的開心。做好卓越的界面設計，成為這個領域的資深專家，幫助客戶取得成功，是我們的目標。
在手機 ui設計方面，我們先后參與過一起海帶app設計、詞覓app設計、外賣寶貝H5界面設計、樂自由我app界面設計、贊同科技app界面設計、近鄰寶界面設計、民生銀行手機界面設計、快遞通手機界面設計、沃安科技app界面設計、聯通營業廳界面設計、Iphone手機界面設計等成功案例。
--手機appUI設計--
更多精彩文章：
無論是從個性化內容還是用戶體驗上來說，為界面內容選擇正確的選擇類控件可能比想象的要難，全文10,856字 ，預計閱讀20分鐘， 建議收藏。
本文主要研究選擇控件的設計細節，雖然是很常見的控件設計，但也有非常多需要注意的地方。能提煉總結常見事物的一般規律，這本身就是對自己已有知識理解加深的過程。
對數據進行便捷選擇
單選框(Radio button，也叫“單選按鈕”)—— 用戶從一組選項中必須選擇一個選項。
復選框(Checkbox)—— 當有一個或多個獨立選項時，用戶可以選擇任意數量的選項，包括零個、一個或多個。
切換開關(Toggle Switches)—— 兩個互斥狀態（打開和關閉）之間的可視切換。
選擇標簽(Choice chips)—— 是按鈕選擇的一個替代方案。至少兩個選項，用戶可以選擇一個或多個。
列表選擇(List Select)——可以單擊容器框中隨附的項目，以從列表中選擇一個或多個。
下拉菜單(drop-down menu，也叫“下拉按鈕”)——按鈕包括一個單箭頭指示符，單擊后會顯示包含選項列表的菜單。
單選按鈕的命名（Radio）來源于舊收音機上用于頻率和預設電臺之間切換的的實際物理按鈕。當一個按鈕被按下時，所有其他的按鈕都會彈出，使被按下的按鈕成為唯一處于“按下”狀態的按鈕。
后來被用于錄音機，盒式錄音機和可穿戴音頻播放器中，90年代初-用于“播放/暫停/快退/快進”控件。
UI概念是由Xerox PARC的研究首次引入的，Xerox PARC是一家研發公司，幾乎涉及到我們現在每天使用的計算機技術，包括：以太網，圖形用戶界面（GUI），面向對象的編程，計算機鼠標，激光打印等。Xerox Star 8010工作站是第一款在圖形用戶界面中帶有單選按鈕的設備。
單選框用于對信息的選擇，允許用戶從一組選項中必須選擇一個，通常以2-5組顯示，單選框應互斥。單選框的外觀一般是一個空白的圓洞，旁邊則通常有文字標簽。標簽的用途除了描述之外，還可以作為操作區域，當用戶選中標簽，所應的單選框就會被選上。已選上的單選按鈕一般會在圓洞內加上一小圓點。單選框僅顯示合理和正確的選項。
單選按鈕的狀態為打開（實心圓圈）或關閉（空圓圈）。
單選框一旦選上，除了選擇另一個選項之外，便沒法取消。所以有時會有空白的選擇、重置或默認選擇。
每個單選按鈕的標題應清楚地描述選擇它的效果，通常句子結束沒有標點符號。此外，考慮使用下拉菜單，會比顯示所有選項占用更少空間。
復選框是一種按鈕類型，可用于打開或關閉選項。當存在選項對象時，復選框允許用戶從一組對象中選擇一個或同時選中多個和全部項目。每個復選框都是單獨的個體，因此選中一個復選框不會影響其他復選框的取消選中狀態，全選除外。
復選框使操作在兩個相反的狀態，操作或無操作之間進行選擇。復選框在屏幕上顯示為一個小方框，選中時，它被認為是“開”，選中的復選框包含復選標記，正方形將充滿復選標記。；關閉時，則被認為是“關”，它是空的矩形框。復選框一般放置在可選信息左側(圖片、視頻以宮格形式表現的頁面除外）。
復選框可以用作單個元素，也可以組合成一個列表或嵌套式的層級列表以從中選擇多個。如果需要將選擇項分成幾組，則使用多級復選框。
混合狀態，僅在多級復選框時出現。如果使用復選框組，全局啟用和禁用多個子復選框，當這些子項并非都處于同一狀態時，父復選框應顯示為混合狀態（用短劃線表示）?；旌蠣顟B常在嵌套層級等對多個對象一同操作時使用，以代表該選項下的子選項沒有被全選。當半選的復選框被點擊時，它便會變成平常的復選框，而它的子選項亦會跟隨全選或取消全選。
如果存在多個復選框時，考慮使用分組標簽來進行描述。并將標簽的基線與組中的第一個復選框對齊。通常，當復選框垂直列出時，更容易區分它們的狀態。通常，復選框應左對齊，當您需要表示層次結構，例如當父復選框的狀態控制子復選框的狀態時，請使用縮進格式。
開關是兩個互斥狀態（打開和關閉）之間的可視切換?？傆幸粋€默認使用，撥動開關即立即生效。它是在打開時顏色是可見的，關閉時出現無色或灰色。
移動端中切換開關一般有交互動效，PC端沒有。
開關與其他選擇控件最大的區別是：開關操作后，程序立即執行相關操作。而其他選擇控件一般用在表單里，僅反映當前的選擇狀態，如果要執行操作并生效，需要點擊額外的提交按鈕。
注意:
不要為切換開關創建層次結構，避免使用開關控制單個細節或次要設置。開關的層級結構這在視覺上更容易分散注意力，而且會造成一種錯誤的印象，即所有的子選項都是開著/關著的。所以禁止濫用開關按鈕。
開關具有比復選框更明顯的視覺效果，因此它控制的功能應比復選框更為強大。如，可以使用開關打開或關閉一組復選框設置。因此它控制的功能應比復選框更為強大。如，可以使用開關打開或關閉一組復選框設置。
注意加載狀態
如果開關所執行的操作需要考慮加載狀態，例如開關切換狀態不是瞬間（短時間）完成的話，開關則需要顯示加載狀態。
另外一種目前比較流行的加載方式是視覺上加載成功，服務器隨后加載成功。用戶操作開關之后，開關視覺上立即響應改變，然后再向服務器相應改變，中間會存在一定的時間差，這樣能帶給用戶更流暢的體驗。
避免在開關內添加說明標簽。關于開關的打開或關閉，可以通過視覺樣式讓用戶很明確的感知。額外的提供文本標簽描述開關狀態是多余的，還會使界面混亂不堪。
單一的 icon 通過顏色或圖形的變化來表示開或關的狀態。常見的且體驗比較好的設計方案是將開關樣式設計為當前狀態樣式。如下圖相機界面內HDR與AI功能的關閉與開啟狀態。
當然也有其它情況。最典型的就是視頻的播放暫停開關，他們表示的就是操作后的狀態而不是當前狀態。
名稱變化，名稱變化指的是開關按鈕依賴于其名稱的變化告知用戶開關的當前狀態和操作，如：關注與取消關注，已關注與已取關。名稱變化的開關由于語言的模糊性，仍然造成了部分歧義。我們可以在操作后加入其它提示來消除歧義（如：toast 提示）。
是否統一操作狀態倒不是關鍵，關鍵是我們是否能夠讓用戶理解按鈕相應的意圖，不做出混亂的選擇便可。
通常用于切換不同的視圖，或者在表單中作為單選組件使用。一個分段tab通常會由2-6個單選項，可以是圖標和短詞，它適合導航形式，被設計成一個水平或豎直的容器進行單選。一組選項卡中的所有內容應該根據較大的分組原則進行分組，每個選項卡的內容與其他選項卡的內容都互相獨立。
可以包含下拉列表的選項和使用翻頁。
固定的選項卡應該只包含有限數量的選項，并且保持選項的位置不變，有利于用戶記憶?？蓾L動選項卡用于有很多選項或選項數量可變的情況，但不推薦使用。
優點：將所有選項都擺在一行或一列，對空間的利用率能達到最佳，設計樣式也可以做到非常直觀，漂亮。
缺點：不大適合處理長詞，短語，如果要將這些內容放在選項中，就須精簡文本。水平空間非常有限，尤其是移動端，即使是少量的選項，有時候你仍然要精簡文本。
Tab選擇時，不要加載整個頁面，只有選項標簽及其內容區域應更改。交替切換標簽時，用戶應該感覺自己在同一位置。不要在選項卡內容中包含支持滑動手勢的內容，因為滑動手勢是用于在選項之間導航的。例如，避免在選項卡中包含一個可以拖動的地圖，或者一個可以滑動刪除的列表。
當功能不可用時，顯示空狀態，加入情感化提示，不要刪除選項卡，確保所有選項卡都啟用。
空狀態：是用戶在使用產品時某個界面無法顯示的時刻，即沒有其他元素。良好的空狀態可以讓用戶知道正在發生的情況，發生的原因以及該怎么做。
這是四種常見的空狀態類型：
首次使用——新產品沒有內容可以顯示時，例如打開新注冊的印象筆記時會遇到這種情況。
內容被清除——當用戶完成類似清空消息或收件箱等操作后，會出現一個空白的屏幕。
出現錯誤——產品由于網絡問題造成離線時，會出現空狀態的使用。
無結果——如果用戶進行搜索，但是查詢內容為空時會發生這種情況。
具有3個選擇項的Tab標簽，我們能明顯區分選中和未選中狀態，應為Tab標簽是單選控件。但是，如果只有兩個選項，又是矩形按鈕的選擇項，則很難區分當前選擇是哪個，哪個為選中狀態？我自己某段時間一直默認顏色填充形按鈕是選中狀態，但經同事一提，一陣猛驚，那另一個是否為選中狀態？在兩個選項中存在選擇疑惑，我們如何確定狀態呢？
因此，我努力在統一風格的提前下，找出固有的特征，增強選中狀態。這個大家如果有更好想法，歡迎留言。
標簽選擇通常用于要從3-10個選項中進行多次選擇操作情況，它們最適合用一到兩個簡短的單詞或數字。它們設計的形式一般是一個個按鈕，通過背景色來區分“選中”和“未選中”。由于不存在2個選項的情況，所以
面對多選標簽時，面對多個選擇項的彼此堆疊，需讓讓用戶知道他們可以選擇多少個選項。添加輔助說明，既可以明確它是多選，又可以規范的最大選擇項；選項過多時進行標簽分類。
優點：節省空間，標簽堆砌在一起的具體樣式是由文本長度決定的。它們給人的印象是輕量的，有趣的。
缺點：這種形式與tab選項形式有一樣的弊端，都不能很好的處理長詞。不建議對文本進行折行或者調整大小，會不方便用戶閱讀，同時使用兩行以上的標簽會使得每個標簽非常難以快速掃描。
其他樣式：用圓形或其他形狀來表示一個個標簽選項，比較重要或更受歡迎的選項形狀更大，用戶選中多個圓形就是選擇了多個選項；也可以在常見的按鈕中加入圖片的元素，這種的話樣式新穎，但要注意選中時的文字圖片的對比，文字是否具有可見性，適當加上文字選中效果。
Tab標簽和多選標簽
選項數量是tab控件和標簽控件之間最大的區別。一個連續的背景幫助用戶理解他們必須要選擇一個，而一個分離的背景表明他們可以選擇多個。
列表選擇控件包含選擇按鈕，容器框，項目列表和標簽。用戶可以單擊容器框中隨附的項目，以從列表中選擇一個或多個。列表框可能會滾動，具體取決于它包含的項目數和可見區域，更復雜的列表框允許用戶通過將項目從一個列表框移動到另一個列表框來調整容器框的大小，重新排列項目列表以及進行選擇。
優點：
交互成本低：列表框不需要用戶單擊任何內容即可在進行選擇之前顯示其中的選項（但是，如果有太多項，它們可能需要用戶滾動列表）。
增加了可見性：一次查看多個選項的能力可以加快決策速度并提高選擇準確性。列表選擇為內容提供了更多的空間。它們易于閱讀，可以容納多文字，文本可以換行，還可以增加圖片。但是，應避免在多列列表框中進行水平滾動。
用多選雙列表框，用戶可以控制項目的顯示順序，并獲得所選項目的清晰概述，這在列表框包含多個選項時很有用。
缺點：
空間：他們往往很占用空間，不適合用在垂直高度受限的頁面中。
陌生：用戶可能不知道如何立即與列表框進行交互-特別是，如果多選列表框中未包含復選框，則他們可能不知道如何選擇倍數。這就是為什么將復選框包含在多選列表框中非常重要的原因，除非它們將注意力集中在多選功能上或增加不必要的屏幕混亂。
用戶可能無法一次看到所有選定的選項：如果在可見區域中看不到更多的可用項目，則用戶可能無法同時看到所有選定的項目。為避免此缺點，請在列表框上方將所選項目顯示為標記，或在不可滾動的列表中突出顯示所選項目。
可以根據選擇類型進行分類，這些列表框形式都可以滾動。
用戶只能從互斥選項列表中選擇一項。最初的單選按鈕被用于列表中超過6個選項時，被設計成垂直方向，圓形輪廓，并擺在列表項的開頭，這就是列表單選?，F一些設計中，選中被設計成在列表選項外加一個描邊框形式或帶有背景色，用以節省水平空間。
這種類型的列表框包括使多個選擇更加明顯的復選框，設計樣式上，web通常是在列表開頭處設計一個正方形描邊框（復選框）。
這種類型的列表框由兩個列表框組成，兩處的列表框內容可以相互拖拽。比如左側的列表框已選中項目可拖拽至右側列表框，同時支持表內上下拖拽更換順序。
點擊“ 右箭頭”按鈕可將左側的列表框所選項目移動至右側列表框。多選雙列表框實際運用較少。
這是是一種彈出按鈕，單擊后會顯示包含選項列表的菜單。下拉列表以最簡單的形式包含四個主要部分：一個容器框，一個朝下的箭頭按鈕，一個項目列表和一個標簽。用戶可以單擊向下箭頭以顯示互斥項的列表，從中只能選擇一項。標準下拉菜單是針對我們所理解的“下拉”這個動詞。在激活狀態，當你點擊文本輸入欄的地方時，它會打開一個菜單。列表項僅在單擊向下箭頭后出現，選擇一個項目或在下拉列表的外部單擊將其關閉。
下拉列表的優點：
為用戶提供最佳選項的功能，默認情況下處于選中狀態。
淡化替代選項和更改：由于下拉列表隱藏了其他可用選項，因此它們很好地淡化了替代選項并過分強調了進行更改的能力。（這在默認值可以滿足大多數用戶的情況下，并且其他選項可能對非專業用戶來說是危險的或令人困惑的情況下是有利的。）
熟悉：下拉列表是大多數用戶熟悉的選擇機制，因為下拉列表在Web和本機應用程序中得到廣泛使用。
缺點是需要點擊項目列表中的選項，包括：
列表包含過多的內容，可能會很麻煩地滾動。
當用戶習慣于捕獲眾所周知的值時，它們會使用戶放慢速度。例如，當輸入生日或信用卡到期日期時，與下拉列表進行交互相比，在直接鍵入內容通常更快，更容易。
忽視：由于表單內容非常緊湊，因此用戶可能會意外忽視表單，網頁和應用程序中的下拉列表。
容易消除：不小心將光標從框中移開會關閉下拉菜單，不得不重新開始選擇過程。
當長型下拉菜單的設計不是特別理想時，你可以把列表分組，這樣搜索起來更加簡單。
可編輯的下拉菜單在菜單上方顯示當前選擇的菜單項，用戶可以輸入菜單中未列出的值。您可以將用戶可以輸入的值的類型限制為某些類型。例如，設計軟件中輸入字體大小時，系統會默認一些數值，同時支持你編輯修改。
為了更方便用戶的填入，支持字詞搜尋，填寫一半時，就會出現帶有關鍵詞名稱選單。在選項很多的情況下，這個功能變得格外實用。
下拉菜單多選是復選框的延伸：用戶可以在同一個輸入區域選擇多個。這件控件用的比較少。
這種控件我一般在多個對象進行對比時才使用，如選擇多個公司比較他們的能耗水平與用電規模，由于公司字段比較長，在查看選中狀態時需注意容器能否充分顯示選擇的字段，在導航菜單中會明顯擁擠，在表單中使用相對自由。如果可以的話，篩選中盡量避開這種類型。
將站點，應用程序或系統的所有不同部分合并為一個長列表，該列表進一步細分為子類別，并可以從導航欄中訪問，例如下面華為云的下拉列表，大型下拉菜單用于顯示大量的選項，分類，數據集或其他類型的相關內容組。
任何偏離你所設計的平臺標準的行為都會給用戶帶來額外的認知負擔。
選擇控件在操作過程中必須更改其狀態/外觀，以便用戶知道是否能選中，是否被選中。添加這些小的視覺反饋，以使用戶正向的理解，但是差異化設計又不能喧賓奪主。
默認就是選擇器的開始狀態。向用戶表明，可對該選擇控件進行操作。
選擇按鈕置灰顯示，用戶將無法與選項進行交互。除非產品規則指定，否則很少會遇到這種狀態。
像按鈕一樣，選擇控件應向用戶指示它們是可交互的。通常，通過突出顯示鼠標懸停項目區域的背景來突出顯示，吸引用戶的注意。觸摸設備沒有懸停狀態。
當用戶按住鼠標/手指點擊，選擇控件處于被點擊的狀態。
列表多選支持批量選擇和清除
使用列表多選，一次全選或取消已選擇的多個選擇項毫不費力。
下拉列表狀態
下拉列表在按下狀態時會打開選項列表，還有種常見做法是懸停狀態時直接打開選項列表。我更喜歡第一種，第二種在我沒有明確操作的情況下，下拉列表就自動打開的這點讓我比較困惑。
列表選擇狀態
列表選擇控件在管理文件時，只有通過按下選中選項才能進行編輯性操作。
點擊按鈕進入批量編輯狀態，狀態未選擇時，操作按鈕置灰。按下/勾選列表選項后，操作按鈕點亮，展示已選項的數量，即對當前勾選操作的反饋。點擊操作按鈕，進入對應操作編輯流程。
一般都是用戶沒有進行選擇，單擊“提交”按鈕后收到失敗反饋。
在實際的使用過程中，選擇控件有默認、禁用、懸停、按下等不同狀態，雖然這些狀態看起來很多，但是這些狀態涉及到實際交互的需求和不同場景，并且是實現可靠交互的基礎。
這個針對于單選框控件
如果用戶不想做出選擇，那么應該提供一個中立選項。為用戶提供一個明確的方向，中立選項比錯誤選擇要好。
在單選框的選擇時，要充分考慮用戶的實際情況，給出的選項要覆蓋到所有的情況。例如，要考慮到用戶不進行選擇的情況，這時需要提供一個“無”的選項；給出的選項有可能都不符合用戶的情況，如果所有的選項用戶都不會選，就需要提供一個“其它”選項。
單選框所有選項應該滿足“互斥”的原則，因此選項之間要避免存在交集，選項覆蓋要全面，不能出現遺漏。例如，在一個年齡的選擇設置上，如果提供的選項為“20-30歲”和“30-40歲”，那么如果用戶剛好30歲該如何選擇？
這個針對于單選框，Tab切換，下拉列表
單選框最好有一個默認選項，當單選框把選項默設置為為選中時，一旦選擇了一個單選按鈕，用戶就不可撤銷，無法返回默認狀態；而默認選中一個則可以防止這類問題，一開始就向用戶傳遞信息必須要在這組單選項之中選擇一個。
下拉菜單中默認選項優與請選擇，如果根據權限或使用頻率能定位到適用于大多數用戶的選擇項時，就不要默認為“請選擇”，而是使用默認選項，這樣做可以降低交互成本和節省用戶的時間和點擊數。
如“國家”和“語言”字段。在這種情況下，根據權限IP，默認選項是合理的，絕大多數用戶也不會更改選項，因此繼續選擇就會很煩人，耽誤時間。
帶有默認選項的單選按鈕組合是給用戶的強有力建議——甚至是推薦。默認選項可能會引導用戶做出最好的決定，并在接下來增加他們的信心。尤其是默認選項可以輔助用戶，并讓用戶向著產品所希望的方向傾斜。
在用戶需做出復雜決定或處在不熟悉領域時特別有幫助。當標題和描述都很陌生的時候，默認選項可以引導用戶在各個可能未能理解的選項里做出最好的決定。
在產品上總想說服用戶做出對產品有利的動作。默認選項就會引誘用戶去走特定的道路。常見的例子就是活動頁面，對于忍痛離開按鈕低調置灰顯示，對于留在頁面按鈕高亮顯示。
當然也有許多時候是不帶默認選項的：
不知道用戶行為或想要什么
選擇是否會冒昧，如性別，稱呼等
防錯，保證用戶能夠看到選項并動手做出選擇，比起用戶會出錯并事后給出警示強
如果希望用戶只選擇一定數量的項目。要強制執行此操作，如果用戶單擊的次數多于所選數量，則他們最早的選擇將會被最近的選擇替換。同時注意需要加上輔助說明。
選項排序會影響用戶操作，因此需要遵守一定排列原則。
你應該將所有選項按邏輯順序擺放，比如按被選中可能性由大到小，按操作難易度由簡單到復雜，按風險由小到大，將最安全的操作放在前邊，列表選擇一般按照信息時間排序，由新到舊。
選項的順序可以說服用戶進行選擇，就像前面說的默認選擇項一樣，他們可能只是因為第一個選項在列表中的位置而選擇了第一個選項?？梢暂o助用戶，也可以讓用戶向著產品所希望的方向傾斜。
一般情況下，左側對齊排列發揮最佳效果，標簽選擇除外。豎直排列相對于水平排列而言，容易讀取和定位，每行一個選項足以，可以提高用戶的瀏覽效率并減少錯誤。
但是豎直排列會占用較多的垂直空間，如果垂直空間受限，可以考慮水平排列。水平排列的時候，要注意每個選項之間的間距盡量大一點，以清晰的傳達選項對應哪個標簽。
移動端更多的情況是左側標簽對齊，右側按鈕對齊，二者與頁面留出相同的邊距。垂直屏幕占比小，常用于呼出選擇、開關等有選擇操作的表單標簽。
交互區域要適當大。單選框的面積較小，用戶在點擊的時候會比較困難，尤其是在移動設備上，易誤操作，可以通過擴大點擊區的交互區域來提高易用性。復選框和單選按鈕一般都很小，點擊或點選會很麻煩，可點擊區域中應同時包含按鈕和標簽，增加操作區域的面積，方便用戶操作。
列表選擇中可以點擊容器框所在行區域來切換行對象的選中和未選中。
每個選項都要配合相應的文字標簽來指示該選項含義。
最好在每個區域上提供同類型的標簽，這樣可以給用戶一種視覺穩定性的感覺。同時盡量保證每個文字標簽用語的表達的一致性，避免否定詞，不要出現有的用名詞，有的用動詞的情況。
不要在同一組標簽中混用文字和圖標
一個分段就像是一個按鈕，按鈕內當然可以使用文字或者圖標代表其含義，但是請不要在同一個Segment Controls中混用文字和圖標，避免讓用戶覺得混亂和不一致。
文字標簽需要簡潔明了，一般使用短語而不是句子，因此不需要以句號來結尾。如果需要解釋說明，可以在選項下方使用單獨一行文字說明。僅體現每個個體之間的差異，不用重復選項之間相同的部分，將重復部分提出來放在整個選項的上方。
輔助提示很好地補充在消除歧義上的不足，但我們也需要合理使用，進行克制，否則就會造成不必要的視覺噪聲。
暗示指的是用戶在操作選擇前，給予用戶的提示，用戶根據這些提示可以判斷當前狀態以及操作后狀態。
比如在界面風格模式，主題色，導航模式切換中，用戶可以通過當前界面的樣式判斷當前是是什么模式，以及選中其它選項后會產生什么結果，如下圖（來源螞蟻設計語言）在選擇圖標中就給予相對應模式的提示。
下圖，白天模式與夜間模式，用戶可以通過當前界面的樣式判斷當前是否已經開啟了相關模式，從而判斷撥動開關后是什么結果。
環境暗示的優勢是我們不需要其它設計和反饋告知用戶當前狀態，可以通過選擇對象和當前界面環境給予直觀暗示。
由于按下開關控件后立即執行操作，如果操作比較危險，請在危險操作后加入二次彈窗確認，告知用戶當前狀態以及潛在風險，避免造成嚴重損失。
當用戶操作后，提示框氣泡反饋告知用戶，讓用戶知道自己是觸發了開啟還是關閉。彈窗提示強度大，使用在一些危險、重要的反饋中，提示框則使用在一些輕量的提示中。
輔助文案指的是在選擇控件主體之外另外放置一些文案信息來充當說明。下圖是手機信號設置和省電設置相關的選擇，開關的主體是名稱，但是下面的一行輔助文案很清晰地傳達了開關開啟后的后的狀態。
并不是所有提示都需要讓用戶看見，我們可以給予用戶其他感官的信號告知用戶當前狀態。界面設計與交互中，我們也仍然可以使用聽覺和觸覺來消除開關的歧義。
在安卓微信聊天列表中，選擇一行聊天對象長按，手機會輕微振動一下，表示已點擊，給予觸覺反饋，同時展開的多個選項可進行選擇操作；手機在關閉電源時，手機會卡擦一下，給予聽覺反饋，表示已關閉屏幕，而不需要眼睛盯著屏幕關閉。
我們很容易陷入到特定控件的中，所以我最好是從整體上開始思考。然后做出最佳決定，決定使用哪種選擇設計最有利于一致性、差異性和層次感，控件的高度，寬度，樣式設計和選項數量都是至關重要的因素。我們可以從被選擇對象是單選還是多選出發，來確定使用哪種選擇控件，可以根據下圖情況選擇，當然由于使用場景和內容的不同，請選擇性參考。
單選按鈕認知成本低，它能可見所有選項并讓用戶容易做出選擇。
單選框，用戶能夠很快看到有幾個選項以及每個選項是什么，而不用點擊或其他操作再去發現這些信息。讓所有選項都可見，使用戶可以方便地進行比較，這樣可以減少認知負荷，幫助表單更加透明。
涉及到選擇項與內容組之間以及在相同層次結構中進行導航時，使用Tab標簽。不要將標簽用于無關的目的地，也不要加載選項卡的整個頁面，只有選項卡及其內容區域進行更改。
如果選項的數量超過6個時，應考慮使用下拉列表中或列表單選，因為單選按鈕太多，也會令人不知所措并引起混亂，用戶無論如何都無法記住所有的選項。
下拉列表簡潔。更多適用于可預測的、類似的或增量的選項(年份選擇 )。數量較多且相類似的選項選擇用下拉菜單整合。
如果屏幕空間有限，請使用下拉菜單。如果不是，請使用列表框。使用下拉菜單，可以使用默認選項，并淡化其它選擇。
選擇項標簽短小且一致時，使用復選框，可以方便地進行比較，這樣可以減少認知負荷，幫助表單也更加透明。
列表多選一般應用于6個以上選擇項進行多選的情況，數量更多出現將翻頁或滾動情況，需要告知用戶已選多少條數據，并在選中選項時出現相關操作。
選擇項數量在3-10之間，標簽不能過長，考慮使用多選標簽。多選標簽它們給人的印象是輕量的，有趣的。
切換開關是一種數字開關。任何由切換開關觸發的效果應立即生效。如果不是這樣，最好用單個復選框替換切換開關。
多選標簽不能很好的處理長詞。不建議對文本進行折行或者調整大小，因為會不便于用戶閱讀，使用兩行以上的標簽會使得每個標簽非常難以快速掃描。
你應該防止出現很難看清選擇哪個控件的情況（確保按鈕和文本標簽的間距），可以考慮使用選擇標簽或拉大間距以此來在視覺上清晰地分隔選項。
本文介紹了多種選擇類控件，從用戶使用選擇類控件的角度闡釋了模式定義，涵蓋了大多數錄入場景。選擇類控件本身也需要不斷進行迭代、優化和拓展，以適應更多的應用場景。后續我將持續關注，希望本文的能幫助你。
歡迎留言糾正，感謝閱讀。
文章來源：tob.design 作者：小龍
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務
藍藍設計的小編 http://www.syprn.cn
