2021-10-21 ui設(shè)計分享達人
為什么說是撕開 B 端封印呢？沒接觸過 B 端的同學(xué)，很大一部分都認為 B 端不就是簡單的列表和圖形嗎？拿開源組件拼拼湊湊就可以了，有什么可設(shè)計的？
其實這個想法完全錯了，你如果接觸后就會發(fā)現(xiàn)，B 端所需要的掌握的產(chǎn)品知識、思維邏輯、規(guī)范意識等等太多了。
而且近幾年 B 端這個詞出現(xiàn)的頻率越來越高了，因為前幾年大家都在爭 C 端市場，純 C 端的流量爭奪已經(jīng)進入了尾聲，B 端產(chǎn)品反而帶來了新的機會點，同時也被慢慢的重視起來，比起以往 B 端設(shè)計師，現(xiàn)在需要掌握的技能也越來越多。你可以查閱一下一些招聘網(wǎng)站，現(xiàn)在 B 端可視化方面的崗位是非常火爆，與 C 端相比，人才缺口更大，未來幾年 B 端也會更加火爆，有機會接觸 B 端的話就不要錯過機會。我們團隊平均招聘一個合適的設(shè)計師基本要兩個月的時間。
說了這么多，我們開始今天的主題吧！
首先在座的可能有部分設(shè)計師沒有接觸過數(shù)據(jù)可視化的設(shè)計，那么第一個問題來了，什么是可視化？大家想一想。給大家三秒鐘~
通過可視的表達來增強用戶處理數(shù)據(jù)的效率。
接下來我會從三個方面來講解如何構(gòu)建可視化：
· 靈感需要迸發(fā)，更需要積累
· 從零到一設(shè)計驅(qū)動
· 設(shè)計度量
數(shù)字時代下仍有信息不對稱的情況，尤其是關(guān)鍵技術(shù)和設(shè)計上的問題，但是如果你用心尋找，就會發(fā)現(xiàn)你的新問題則是別人很久之前的舊問題了。所以要做個有心人。
但是問題又來了，有時候真的不知道該怎么找、去哪找？這是個很常見的問題。因為可視化不比插畫、平面等這些成熟的領(lǐng)域，他是比較小眾的，所以靈感以及素材的搜尋是一個令新手設(shè)計師頭疼的事情，再加上對關(guān)鍵詞的熟悉程度不夠，導(dǎo)致很多設(shè)計師只停留在【可視化】這個關(guān)鍵詞里，最后感覺搜來搜去都是見過的圖，沒有新意。
互聯(lián)網(wǎng)信息太多了，漫無目的的找靈感，只會浪費時間，一會看到這張圖好看，一會看到那張圖好看。不知不覺幾個小時就過去了。
確定目標后，就要細化關(guān)鍵詞了。怎么建立關(guān)鍵詞詞庫呢？
關(guān)鍵詞詞庫由3部分組成：終端、設(shè)計類型、業(yè)務(wù)類型。
· 終端：大屏、移動端、web 等等。
· 設(shè)計類型：每個細分的數(shù)據(jù)可視化類別都是有一些專有名詞的，比如最近比較熱門的車載HMI系統(tǒng)，那他的類型關(guān)鍵詞就是 HMI。通過這些關(guān)鍵詞，你會搜到更精準的結(jié)果。設(shè)計類型關(guān)鍵詞比如：AR/VR、HUD、HMI、FUI等等，你要了解你們公司相關(guān)類型的關(guān)鍵詞，記錄下來。以及跟你們有關(guān)聯(lián)的，都記下來，補充自己的詞庫。
· 業(yè)務(wù)類型：智慧城市、生物醫(yī)療、監(jiān)控部署等等。
這三類單獨或組合進行搜索，就會看到更多可視化產(chǎn)品了。把關(guān)鍵詞詞庫建立起來后，就可以去常用的網(wǎng)站上搜索了，最好用的還是 behance 和 Pinterest。
企業(yè)官網(wǎng)：很多做數(shù)據(jù)可視化的公司，會在官網(wǎng)展示一些能體現(xiàn)自己業(yè)務(wù)特點、業(yè)務(wù)實力的案例，而這些案例就是這些企業(yè)最好的數(shù)據(jù)可視化設(shè)計作品了， 所以但凡有案例展示的官網(wǎng)，案列基本都是最典型最好的設(shè)計，所以從這些案例中找靈感，也是一個有意思且有效的方法和途徑。
總結(jié)一句話：你看到了別人看不到的，設(shè)計才能有所不同。如果你和別人看到的是一樣的，你怎么比別人做的更優(yōu)秀？
經(jīng)常刷短視頻/新聞網(wǎng)站的應(yīng)該知道，系統(tǒng)會根據(jù)你的點贊、收藏、瀏覽等數(shù)據(jù)來給你安排后面的內(nèi)容推送，以保證給你推送更精準的內(nèi)容。設(shè)計網(wǎng)站亦是如此，behance 等網(wǎng)站上也都是千人千面，它會根據(jù)你的點贊收藏等來讀取你的喜好，進而推送更精準的作品。所以假設(shè)你是一個B端數(shù)據(jù)可視化方向的，你就經(jīng)常搜、點贊收藏相關(guān)作品，之后你的首頁出現(xiàn)相關(guān)內(nèi)容的幾率也會變大。
最后一點，這個也是好多設(shè)計師的通病，收藏即學(xué)到。
靈感庫要求精而不是多，每隔一段時間，回來翻一翻自己之前收藏的作品，會發(fā)現(xiàn)有些作品自己已經(jīng)看不上了，因為在做靈感收集的過程中，我們的審美會自然有所提高，當輸入的作品樣本越來越多，我們對作品評價的維度也會更多，之前那些覺得好的作品，現(xiàn)在看來也就會有缺陷和不滿，這是一個很正向的結(jié)果，成長就是一個不斷剔除的過程。刪掉那些自己覺得不滿意的作品，添加更符合自己當前審美的作品到靈感庫里。
這樣慢慢完善你的地基，才能更高的向上走。
講完第一部分，我們開始搭建產(chǎn)品。
我負責(zé)從零到一的項目大大小小的得有10來個了，我認為在產(chǎn)品整個產(chǎn)品周期中設(shè)計師的話語權(quán)最高的時候就是項目初期，是可以做到設(shè)計驅(qū)動的。既然設(shè)計可以有足夠的的話語權(quán)，你就得規(guī)劃好未來的設(shè)計走向。
產(chǎn)品初期，經(jīng)常會有幾個爭議比較大的問題，我們來聊一下。
這是新項目必須要做的選擇題，再講之前你先想一下，如果是你，你會如何選擇？
我的觀點是設(shè)計先行。（當然設(shè)計先行是建立在你至少對這個項目的行業(yè)有個簡單的了解之后，先設(shè)計再用戶調(diào)研），為什么呢？因為如果用戶調(diào)研先行的話，用戶只會反饋當下最想要的東西，從而有可能給你帶來誤導(dǎo)。就比如我們經(jīng)常舉的一個例子：汽車出來之前，人們只想要一匹更快的馬。
我們要解決的不是用戶當下想要的東西，而是痛點背后用戶真正需要的東西是什么。在 0-1 的這種創(chuàng)造性的項目，往往設(shè)計者才是當下最懂產(chǎn)品的人，你把決策權(quán)交給一些不懂產(chǎn)品的人，做到最后只能是迷失了方向，鍋還是設(shè)計來背。所以一開始設(shè)計師要把決策權(quán)拿在手中，掌握航向。
這個問題在現(xiàn)在看來相對比較統(tǒng)一，但有的同學(xué)還是有疑惑，所以我拿出來再跟大家聊一下。
首先我的觀點是設(shè)計先行，在設(shè)計之前就定好規(guī)范的基本都是自己YY的，返工率極高。等你在做具體設(shè)計的時候就知道之前做的規(guī)范都是白費力氣了。一般都會選用在項目完成之后或者主風(fēng)格及主要頁面完成后再輸出規(guī)范，這樣既可以減少規(guī)范的改動，也可以保證后面功能延用規(guī)范，一舉兩得。
當然了，設(shè)計規(guī)范不是所有項目都要有的，它是為了減少工作而不是增加工作，如果是一次性項目，就不需要再額外花費精力去輸出規(guī)范了，浪費資源~
現(xiàn)在都是爭分奪秒的時代，任務(wù)是無止境的，沒有做完的時候。造成這個局面的無非就是一個問題：時間不夠用。通常的做法就是先完成再迭代，做產(chǎn)品久了你就會發(fā)現(xiàn)，完成比完美更重要，不完美你還可以再迭代，完不成就有可能錯過一個風(fēng)口，從而失去了變完美的可能~
聊完這三個問題，我們在設(shè)計的時候也要有一些注意項，真正的做到設(shè)計驅(qū)動。
對于設(shè)計師來說，我們的任務(wù)就是把復(fù)雜問題變得清晰簡單而且美，所以我們應(yīng)該成為企業(yè)和客戶之間溝通的“架橋人”。通過設(shè)計的方法，把無形的、復(fù)雜的技術(shù)，通過有形的、可視化的方式展示出來，讓客戶更直觀、清晰的感受到產(chǎn)品的功能，看得懂其在業(yè)務(wù)場景中產(chǎn)生的價值。
站在客戶視角，聚焦客戶關(guān)注的核心問題，通過情景把內(nèi)容有序組織起來，快速與客戶建立共鳴，有效降低內(nèi)容理解難度。
把復(fù)雜的業(yè)務(wù)/功能簡單化、傻瓜化，最大的降低學(xué)習(xí)成本，能幫用戶操作的絕不讓用戶親自去操作。你要讓用戶在1分鐘之內(nèi)了解你的產(chǎn)品是做什么的、有什么功能，你就成功了。
B 端項目中內(nèi)容量是巨大的，面對龐雜的信息，去粗取精，提煉各場景的核心內(nèi)容，避免冗余信息阻礙內(nèi)容有效傳達。話術(shù)語言不單要簡單易懂，還要嚴格控制文字長度，保證內(nèi)容可以被快速掃描和理解。
不要妄想改變用戶養(yǎng)成的慣性思維，你要記住慣性思維大于設(shè)計思維，他的閱讀習(xí)慣、操作習(xí)慣都是不易改變的，不要為了個性化而嘗試去改變，大部分情況下結(jié)果不會是那么的理想，除非你有極大的把握。
這個是常提到的，我就在這里簡單給大家提個醒。比如做數(shù)據(jù)對比，柱狀圖更能清晰表達出用戶想要的結(jié)果，你卻非要放個酷炫的雷達圖，他的本質(zhì)目的都沒達到，要美觀有何用？
每個圖表都適合哪些場景使用，像 antv、hicharts 等都有介紹，我就不一一贅述了，我之前也寫過一篇關(guān)于如何合理利用圖表的文章，大家有興趣的可以去看一下。
產(chǎn)品設(shè)計的好與壞我們需要去驗證、去度量。我們怎么去驗證可視化的好與壞呢？
美與丑也是主觀的，沒有絕對的美，也沒有絕對的丑。一個產(chǎn)品，總會有人喜歡有人不喜歡，但是我們要迎合大多數(shù)人的審美。
所以就需要一個方法論來驗證產(chǎn)品的好與壞，現(xiàn)在各大廠都在做自己的一套產(chǎn)品驗證的方法論，阿里在這方便算是國內(nèi)做的不錯的，我舉幾個常用的度量模型。
· 阿里云：UES
· 螞蟻金服：PTECH與易用度
· 1688：五度模型
· 優(yōu)酷：DES
UES 目前是國內(nèi)最好的，在 5 月份的阿里設(shè)計周上也正式對外講解了 UES 模型。我拿阿里云的 UES 簡單講一下吧，這么多度量模型，無論他的方法、維度有所不同，但他們的目的是相同的：通過模型來度量設(shè)計成果。
· 易用性：易操作性、易學(xué)性、易見性 ...
· 一致性：整體樣式、通用框架、常用場景及組件 ...
· 任務(wù)效率：任務(wù)完成率、任務(wù)完成時間、功能使用率 ...
· 性能：首屏渲染時間、API 請求響應(yīng)時間、頁面請求響應(yīng)時間 ...
· 滿意度：產(chǎn)品滿意度 ...
UES 分為 5 個模塊，這 5 項是整個產(chǎn)品生命周期需要驗證的。
關(guān)于 UES 我就介紹到這里吧，UES 模型要是展開講的話，半天都講不完，感興趣的話可以去阿里云官方發(fā)布的 UES 模型的相關(guān)資料中深度研究一下，看看適不適合自己的產(chǎn)品。
上面是度量產(chǎn)品的模型，接下來針對我們 B 端設(shè)計師，我們也要有一些指標來度量自己是否合格。
現(xiàn)在內(nèi)卷盛行的時代，各大廠都在講人效，畢竟時間才是最珍貴的，所以現(xiàn)在都在想方設(shè)法的提高人效。而且 B 端相對 C 端來說，可以有更多自動化的工具。
舉個我公司的例子，我剛?cè)サ臅r候基本沒有自動化工具，每個設(shè)計師每天也都在忙碌，誰也沒偷懶閑著。但是我發(fā)現(xiàn)有很多重復(fù)性的體力勞動是不需要多少思考就能完成的，但是卻耗費了將近 1/3 的時間。所以我就在想如何提高人效，把一些體力勞動用一些工具來代替，這樣就能釋放設(shè)計資產(chǎn)，去做更重要的事情。
當時就做了第一個自動化的工具：設(shè)計系統(tǒng)，現(xiàn)在大家對這個詞應(yīng)該不陌生，但是我們剛開始做的時候比較早，還沒有一些比較完善的設(shè)計系統(tǒng)供我們參考，所以我們也算是前幾批摸索設(shè)計系統(tǒng)的團隊。設(shè)計系統(tǒng)做好后是可以把這1/3 的設(shè)計時間節(jié)省了下來，而且團隊的規(guī)范性更加統(tǒng)一。
后面的話我們也是做了一些其他的自動化工具，比如結(jié)合一些插件做到 icon、組件等發(fā)布的自動化，并且與研發(fā)同學(xué)打通，有相應(yīng)的自動化提醒工具，這樣也節(jié)省了與研發(fā)的溝通成本。
在工作中，流程上能減少一步就是成功，慢慢來，萬里長征就是一步一步走出來的。
增長這個詞來源于【增長黑客】這本書，顧名思義這個詞的就是通過設(shè)計來促進產(chǎn)品增長。
這個詞用在 C 端上比較多，因為 C 端可驗證的方法比較多，見效快，所以我們常見的一些增長設(shè)計的案例都是關(guān)于 C 端的，而 B 端的話，受限制的因素較多，設(shè)計只是影響增長的一部分，而且見效慢。
但是雖說影響因素多、見效慢，我們還是可以抓住機會、多去嘗試一些方法來做到設(shè)計增長。我這個方法不行，我就換一種嘗試。大家都是在摸索中過河~
所有的設(shè)計都是要為業(yè)務(wù)賦能、為商業(yè)買單。我們設(shè)計的本質(zhì)就是為用戶解決問題，讓用戶以最直觀的方式理解產(chǎn)品。不要為了所謂“我認為很美”而與業(yè)務(wù)背道而馳。
用戶體驗設(shè)計師會越來越重要，近兩年逐步被重視，而且未來幾年會越來越重視。行業(yè)內(nèi)需要更多動腦的人而不是僅僅會動手的人。
現(xiàn)在到了互聯(lián)網(wǎng)下半場，拼的不僅是功能，用戶體驗的重視程度已經(jīng)被提升了上來，在工作中的占比也越來越重。
再加上現(xiàn)在這個超級內(nèi)卷的時代，你不提升，你的競爭對手就把你干掉了。而且你如果只是一成不變的維護老版本，你去下家面試的時候都沒有拿得出手的產(chǎn)品。
現(xiàn)在各種辦公類工具、軟件層出不窮，而且很多工具是比較類似的，有的設(shè)計師再選工具的時候就很糾結(jié)，我認為完全沒必要糾結(jié)，首先你要明確我想要達到什么目的，只要某個軟件滿足著你的需求就可以用。
工具是為人服務(wù)的，我們的設(shè)計軟件從 PS – Sketch – Figma，無論怎么變化總要圍繞一個目的：更高效的完成工作。
尤其是一些自動化工具，現(xiàn)在人工智能升級很快，要多關(guān)注設(shè)計自動化方面的工具，讓他來解放我們的雙手。
最后送給大家一句話：
這時代唯一不變的，就是變化。
藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼ben_lanlan，報下信息，會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。
免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍藍設(shè)計( axecq.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
藍藍設(shè)計的小編 http://axecq.cn