97精品亚洲永久免费精,男人和女人操逼的网站,性欧美牲交xxxxx视频欧美

首頁

212024-10

講講AI在B端設(shè)計上的應用方法

B 端設(shè)計領(lǐng)域的 AI 應用

大多數(shù)同學目前對 AI 應用的認識只有文生圖、對話、駕駛等領(lǐng)域，但 AI 應用的場景遠遠不止它們。

和頭部的明星 AI 產(chǎn)品、模型相比，細分市場的 AI 應用就非常沒有存在感了。比如使用 AI 進行財務(wù)的審核、飲料配方的調(diào)節(jié)、工程安全的模擬等等，它可以幫助企業(yè)節(jié)約大量的人力完成工作。

概括起來，就是一些可以通過計算機完成的（也不止）重復性勞動或標準化流程，都可以引入 AI 的技術(shù)進行降本增效。

那在 UI 設(shè)計領(lǐng)域中，這些重復性和標準化的工作內(nèi)容有嘛？

有，但是并不會像外行或者新手想象的那么多。AI 難以覆蓋的場景我們過去的分享探討過，等等也會做進一步的說明，而這里我們先要探討的，就是能用 AI 實現(xiàn)的 B 端設(shè)計場景，具體有哪些。

我們都知道市面上現(xiàn)在有很多開源的 B 端前端框架，各個大廠前赴后繼地對它們進行更新和完善，里面包含了非常豐富的組件庫。

這些組件庫不不止是 UI 的組件，也包含了前端的對應代碼，前端工程師可以快速調(diào)用這些代碼組件而不用自己去重新寫一遍樣式和交互。

原則上，使用現(xiàn)成的組件開發(fā)就可以快速完成整套項目的前端內(nèi)容，這可以給前端工程師節(jié)省大量時間。所以即使項目中有完整的設(shè)計稿，前端在開發(fā)過程中也會偷懶直接略過，直接套用框架內(nèi)的組件實現(xiàn)。

這和設(shè)計師直接套用素材完成運營圖設(shè)計一樣，明明有現(xiàn)成的素材在那里，為什么要浪費一大堆時間自己重新畫一遍還是用 3D 建模渲染？同理，要是組件足夠豐富，滿足項目的需要，設(shè)計師也可以直接復用官方的組件素材，不用自己設(shè)計。

組件化思維的運用，就是項目工作標準化和重復性的根源，不僅應用在設(shè)計領(lǐng)域，對于前、后端開發(fā)來說同理。

基于這種思路，催生出了一種新的 SaaS 模式 —— 低代碼 Low-Code 服務(wù)。

即通過少量的代碼，或者干脆不用代碼，僅通過可視的工具和組件實現(xiàn)軟件的開發(fā)，并完成相應的配置和部署的工具。

這概念咋一看不就是建站工具？比如有贊、微店之類的，用戶可以在里面直接創(chuàng)建并配置店鋪，然后以網(wǎng)頁、H5 或小程序的形式發(fā)布。

但這只是最初級的應用，傳統(tǒng)的建站工具屬于幫你預制好了主要的參數(shù)和功能，用戶只能在這個范圍內(nèi)做少量的自定義編輯和設(shè)置。但進階的 Low-Code，會賦予用戶更大的編輯范圍和自由度，讓用戶通過可視化的界面創(chuàng)建自己想要的產(chǎn)品和功能。

這類產(chǎn)品已經(jīng)衍生出一個規(guī)模不小的市場，因為有大量的中小企業(yè)不想投入太多的精力和成本進數(shù)字化平臺的搭建上，

并希望能快速創(chuàng)建不同的管理工具來匹配企業(yè)日新月異的發(fā)展需要

。

這里要劃重點，對于一部分企業(yè)來說，經(jīng)營模式和業(yè)務(wù)流程是持續(xù)迭代的，如果使用傳統(tǒng)的開發(fā)模式那么很難跟上這種迭代。

以連鎖餐飲品牌舉例，前期只在一個城市經(jīng)營，和后期擴張到全省或全國，采購流程和供應鏈管理必然會持續(xù)進行調(diào)整，提交一個采購工單所需填寫的字段就會發(fā)生變化，同理展示的表格、詳情頁也要跟著調(diào)整。

這類變化往往并沒有修改界面的視覺、交互、組件，僅僅是增加和減少字段數(shù)據(jù)，而用傳統(tǒng)的收集需求再輸出進行開發(fā)的模式效率非常低，所以它們就成為 Low-Code 的最佳應用場景。業(yè)務(wù)方自己配置、修改直接上線，省掉產(chǎn)品經(jīng)理、設(shè)計師、程序員中間耗差時……

并且對于很多企業(yè)來說，只需要應用一些非?；A(chǔ)的功能服務(wù)和頁面類型。比如我經(jīng)常提到的 B 端管理系統(tǒng)的四個核心頁面類型：

Low-Code 就是把常規(guī)需求標準化，并運用組件化的框架，讓用戶通過簡單的填寫和編輯就能生成出想要的頁面和功能。

既然需求不復雜，功能、組件、頁面、代碼都可以標準化，那不用 AI 降本增效還有王法嘛？

所以，使用 AI 生成 B 端頁面（不是設(shè)計稿）的工具已經(jīng)在大廠內(nèi)部開始應用了，開發(fā)專屬大模型，再把做好的組件喂給模型，用戶只要在相應的表單內(nèi)填入需求，就可以快速生成出落地的頁面。

并且各家大廠內(nèi)部的 B 端組件庫，可遠遠不止對外分享的這些開源框架里包含的數(shù)量，還有很多特殊的業(yè)務(wù)組件，可以讓模型得到更好的訓練和產(chǎn)出，比普通 Low-Code 模式更簡單高效，大幅度提升企業(yè)內(nèi)部B端產(chǎn)品的落地和運用效率。

從已經(jīng)了解到的信息中，有一部分業(yè)務(wù)部門已經(jīng)開始進入實踐環(huán)節(jié)了。且隨著技術(shù)的迭代，這種工具必然會越來越強大，功能越來越豐富。

所以，了解完這個趨勢，設(shè)計師和前端工程師迎來大結(jié)局了？要被AI技術(shù)清洗了？現(xiàn)在該捧起《從0到1學習炒粉》學習了嘛？

這就是下面要討論的內(nèi)容。

B 端 AI 和設(shè)計的關(guān)聯(lián)

前面做了不少鋪墊，就是為了強調(diào)，適用于 Low-Code 和 AI 生成的 B 端產(chǎn)品，是有前提條件的，包含下面這些要素：

完整成熟的前后端組件庫
需求使用基礎(chǔ)做法就能實現(xiàn)
需要經(jīng)常變動調(diào)整的業(yè)務(wù)需求
對設(shè)計和交互本身要求不高

而這里面最關(guān)鍵的東西，就是標準化。必須要知道在今天的 AI 的應用發(fā)展中，要生成出符合實際工作需要的結(jié)果，絕對不是靠輸入信息以后它自己 “蒙” 出來的。為了讓結(jié)果盡可能準確，那么喂給模型的數(shù)據(jù)也就要越多且越有針對性。

理論上面向 B 端的 AI 工具，只要不斷提供給他新的組件、頁面，就能拓展它可以實現(xiàn)的范圍。但不管你怎么訓練它，都要滿足標準化的前提。

而標準化，恰恰就是國內(nèi) B 端業(yè)務(wù)的命門……

我們都知道國內(nèi) SaaS 行業(yè)現(xiàn)在發(fā)展非常的混亂，雖然在不同的細分領(lǐng)域有自己的獨角獸，比如財務(wù)領(lǐng)域的金蝶，OA 領(lǐng)域的釘釘，ERP 領(lǐng)域的用友等等。

但是這些公司就發(fā)展狀況良好利潤豐厚了？24年一季度的 SaaS 頭部公司業(yè)績非常蕭條，比如網(wǎng)上找到的統(tǒng)計，和國外 SaaS 頭部公司的估值和利潤形成鮮明的對比：

為什么國內(nèi) SaaS 市場那么慘淡？說到底就是在國內(nèi) B 端領(lǐng)域很難實現(xiàn)真正的標準化，而不是國內(nèi) B 端市場規(guī)模太小。

比如釘釘、飛書這樣的 OA 軟件已經(jīng)很成熟了，但它們的實際普及程度一點都不高，而中大型企業(yè)又有各種考量，現(xiàn)成的不用就熱衷于開發(fā)一套自己的系統(tǒng)，簡稱定制化。這就倒逼 SaaS 工具為了滿足更多的企業(yè)需求，拼命疊加功能，使得這些 SaaS 工具一個比一個臃腫。

而我們前面提到的 AI 生成，想要普及同樣需要面對這種困境，因為模型不管怎么做，它都是基于特定標準化下的產(chǎn)物，它可以滿足其中一部分需求，但難以滿足其它需求。尤其是國內(nèi) B 端定制化需求中，混亂、抽象、聯(lián)系復雜的問題非常突出。

換句話說，國內(nèi) B 端市場的大多數(shù)系統(tǒng)，是非標準化的，需要產(chǎn)品團隊在面對這些非標準的需求下做出創(chuàng)新和適配，就必須要考慮很多抽象的因素，領(lǐng)導、背景、體驗、交互、周期、難度等等。這個過程不可能由業(yè)務(wù)方自己完成，且最終導出的設(shè)計結(jié)果，往往會和常規(guī)方案有很大的差異。

按常規(guī)邏輯考慮的話，那有多少組件我們整理多少組件，早晚有一天不得窮盡設(shè)計師思考范圍的邊界？

且不說獲得不同商業(yè)項目的業(yè)務(wù)組件有多困難，如果組件之間沒有更底層的思路去規(guī)范它們的設(shè)計和交互，那么硬湊到一起的項目是非常割裂的，而 AI 在短時間內(nèi)沒辦法做到真正理解交互的邏輯并根據(jù)使用場景做理性的推理。

所以基于一套團隊產(chǎn)出的組件必然是有限的，它們或許可以滿足自己項目，但不可能滿足市面上所有項目的使用需求。

還有一個很關(guān)鍵的疑問，就是很多人會想，一個項目中的特殊組件往往只是少數(shù)，我們用 AI 工具生成多數(shù)頁面，少數(shù)進行定制和獨立開發(fā)不就行了？

這思路在邏輯上很合理，但實踐起來的問題非常多。舉個例子比如設(shè)計稿直接生成網(wǎng)頁這種技術(shù)，從20年前我剛了解到網(wǎng)頁設(shè)計那天說到現(xiàn)在了，這個實現(xiàn)邏輯理應不需要 AI 的參與都能做到，中間也問世了不少產(chǎn)品和工具，但沒有一個做成了，反而網(wǎng)頁前端工程師都成為一個獨立熱門職業(yè)了（以前是 UI 寫）。

原因就是作為商業(yè)項目來說，團隊需要 “可控性”，機器生成代碼雖然容易，但是如果要修改里面的東西怎么辦？實際情況就是前端對這些外部代碼深惡痛絕，因為改起來太麻煩，而越大的項目改起來難度也越高。而且這個版本的一部分你改了，下個版本工具再生成的代碼要不要兼容你前面寫的東西？

所以現(xiàn)在即使有設(shè)計稿直接生成代碼的工具前端也寧愿自己寫，但當他們用到第三方框架的時候，能不動框架里面的東西就不動。想要理解這個感受，只要拿這些框架的組件素材用它們的組件、自動布局形式做完一個項目，你們就會產(chǎn)生 —— 還不如自己重做一遍的想法。

所以生成工具，要不然能一次性完整滿足所有需求，要不然就會因為兩三成的缺口形成致命的瓶頸。當然，還有遠比這些復雜的進一步因素，我就不在這里展開。

標準化無法在定制化的面前獲得優(yōu)勢，這是國內(nèi) B 端行業(yè)面臨的直接困局，當然這里有壞的影響也有好的影響。

壞的影響，就是頭部 SaaS 企業(yè)沒辦法得到快速的發(fā)展，推高整個 B 端軟件業(yè)的收入水平和吸引力，AI 生成頁面這些技術(shù)適用范圍小，沒辦法真惠及全體，行業(yè)處于反復造輪子但根本沒辦法停下來。

好的影響，則是頭部的 SaaS 企業(yè)發(fā)展不起來，市占率就低，它們就沒辦像 C 端市場一樣形成非常顯著的馬太效應，形成事實的壟斷。大家重復造輪子，那么提供的就業(yè)崗位才多，才能讓我國的炒粉行業(yè)沒有那么卷，競爭沒有那么激烈（？？？）……

如果你關(guān)注過 B 端市場足夠多年，你就會明白任何企圖用一種標準、方法論直接平鋪整個行業(yè)的做法，注定是徒勞的，而無序、野蠻、熵增才是不變的主旋律。

但 AI 的作用短時間內(nèi)完全發(fā)揮不了嗎？也不是。除了前面提到的一些簡單的項目之外，還有一個非常大的可能，就是中小模型的開發(fā)會變得越來越容易，而基于項目自研的界面 AI 生成工具很有可能會普及起來。雖然它們不能隨心所欲生成任何需求的樣式，但可以完全根據(jù)業(yè)務(wù)方的實際需要進行定制，去服務(wù)小范圍的群體。

這不代表項目里面就不需要設(shè)計師，符合這套項目的標準依舊需要設(shè)計師去制定，也需要設(shè)計師持續(xù)輸出特殊的頁面和組件。

所以，未來很長一段時間內(nèi) AI 和 B 端 UI 設(shè)計師之間會是互補的關(guān)系，而不是替代關(guān)系。這也會對崗位要求形成進一步的影響，所以下面是我對 B 端 UI 設(shè)計師所需技能的建議：

進一步提升交互能力，尤其是基于業(yè)務(wù)認知輸出交互方案的抽象思維能力
進一步鞏固項目設(shè)計規(guī)范的創(chuàng)建能力，深入了解規(guī)范的應用和落地流程
進一步提升全局性設(shè)計思維，能提煉核心價值觀并在項目中進行應用
進一步了解編程開發(fā)邏輯，能更好的配合前后端完成項目的輸出提高效率

這些能力的掌握是 B 端 UI 設(shè)計師應對未來市場變化的核心競爭力，也是 AI 在短時間內(nèi)絕對無法替代的東西。

不管是作為已經(jīng)入行的，還是準備入行的 B 端設(shè)計新人，都不用對 AI 技術(shù)在 B 端的影響太過擔心，自怨自艾，因為

如果 B 端項目的設(shè)計都那么簡單的話，那么從前端框架普及的那一天起，B 端 UI 設(shè)計師就可以集體下崗，而不用等到 AI 應用的那天

。

換個表述方式，祝大家不會菜到那么輕易就被 AI 給取代了……

作者：酸梅干超人
鏈接：https://www.zcool.com.cn/article/ZMTYzNzg4MA==.html
來源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。

藍藍設(shè)計(bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計，以及相關(guān)的軟件開發(fā)服務(wù)，咨詢電話：01063334945。我們建立了一個微信群，每天分享國內(nèi)外優(yōu)秀的設(shè)計，有興趣請加入一起學習成長，咨詢及進群請加藍小助微信ben_lanlan。

評論(0) 瀏覽(266)

182024-10

好的UI規(guī)范讓系統(tǒng)視覺更加統(tǒng)一，交互更加高效～

資深UI設(shè)計者

好的UI規(guī)范讓系統(tǒng)視覺更加統(tǒng)一，交互更加高效～

評論(0) 瀏覽(457)

182024-10

Web后臺管理系統(tǒng)套件分享｜可視化搭建平臺的創(chuàng)新應用

資深UI設(shè)計者

后臺管理系統(tǒng)是企業(yè)信息化建設(shè)的重要組成部分，它通常具備內(nèi)容管理、用戶管理、權(quán)限設(shè)置、系統(tǒng)配置、數(shù)據(jù)分析和安全管理等核心功能。在選擇或開發(fā)后臺管理系統(tǒng)時，應考慮其功能需求、易用性、安全性和擴展性。

評論(0) 瀏覽(489)

172024-10

Web端設(shè)計語言庫——數(shù)據(jù)可視化

ui設(shè)計分享達人

一、可視化原則

數(shù)據(jù)可視化是把相對復雜、抽象的數(shù)據(jù)通過可視化手段，表達數(shù)據(jù)內(nèi)在的信息和規(guī)律，促進數(shù)據(jù)信息的傳播和應用。

Dreawer Design 團隊總結(jié)了以下四個可視化原則，供設(shè)計者參考及使用：

1. 準確

數(shù)據(jù)圖表需精準、如實地反應數(shù)據(jù)信息的變化特征。

2. 清晰

讓設(shè)計服務(wù)于數(shù)據(jù)內(nèi)容，給用戶以最為清晰、明確、迅捷的數(shù)據(jù)展示。用戶看到可視化圖表時，應能在 5 秒內(nèi)了解到它的用途，而不是花幾分鐘都不能理解各個數(shù)據(jù)的含義。

3. 簡單

可視化結(jié)果應該是一看就懂，不需要思考和過度理解，因而選定圖表時要理性，避免為了視覺上的效果而選擇一些對用戶不太友好的圖形。

下面為圖標類型與認知成本對比：

4. 美觀

優(yōu)秀的數(shù)據(jù)可視化界面，會有一套非常嚴謹一致的版面。這里的一致性需要考慮到布局、結(jié)構(gòu)和內(nèi)容。

二、圖表解構(gòu)

1. 構(gòu)成元素

我們從標題、坐標軸、圖例、標簽、提示信息、數(shù)據(jù)圖形這 6 個大類，對數(shù)據(jù)圖表進行進一步元素拆解及闡述。設(shè)計過程中，需遵循可視化原則來精簡數(shù)據(jù)圖表，讓用戶快速獲取圖表中的關(guān)鍵信息，完成任務(wù)。

圖表構(gòu)成 6 大類，元素細分：

1. 標題：圖表標題；

2. 坐標軸：X/Y軸線、刻度線、網(wǎng)格線、X/Y軸標題、X/Y軸標簽；

3. 標簽：數(shù)據(jù)點、引導線、（文本）數(shù)據(jù)值；

4. 提示信息；

5. 圖例；

6. 數(shù)據(jù)圖形：線、矩形、扇形、環(huán)形等。

下面為數(shù)據(jù)圖表的基本構(gòu)成元素示例（為了便于觀察，某些字母做了大寫處理）：

除了以上的常規(guī)元素，還有常用于餅圖、環(huán)形圖中的“引導線”：

2. 標題

標題是概括圖表主題的說明文字，一個明確、精簡的標題可以迅速讓讀者理解圖表要表達的內(nèi)容。

2.1 位置

一般位于數(shù)據(jù)圖表卡片的左上方。

2.2 使用建議

標題需言簡意賅、符合圖表主題；盡量控制在 20 個字以內(nèi)，標題寬度盡量不要超過卡片寬度。

2.3超長處理

當標題超過長出卡片寬度時，省略標題中間的文字，保住首尾，如“我是...標題”。

3. 坐標軸

3.1 坐標系

坐標軸包含在坐標系的概念里，因此，我們需要先了解坐標系。坐標系是能夠使每個數(shù)組在維度空間內(nèi)找到映射關(guān)系的定位系統(tǒng)，更偏向數(shù)學/物理概念。

數(shù)據(jù)可視化中，最常用的二維坐標系有兩種：

笛卡爾坐標系：即直角坐標系，是由相互垂直的兩條軸線構(gòu)成。常用于柱狀圖、條形圖、折線圖、面積圖等。

極坐標系：由極點、極軸組成，坐標系內(nèi)任何一個點都可以用極徑 r 和夾角 θ（逆時針為正）表示。常用于餅圖、圓環(huán)圖、雷達圖等。

補充說明：

1. 坐標軸由定義域軸（X 軸）和值域軸（Y 軸）組成。條形圖中，定義域軸為 Y 軸，值域軸為 X 軸。

2. X軸為水平方向的橫軸，Y 軸為垂直方向的豎軸。以下主要針對笛卡爾坐標系的坐標軸構(gòu)成進行分析：

3.2 坐標軸

定義：坐標軸指二維空間中統(tǒng)計圖表中的軸，是坐標系的構(gòu)成部分，它用來定義坐標系中數(shù)據(jù)在方向和值之間的映射關(guān)系。

構(gòu)成元素細分：X/Y 軸線、刻度線、網(wǎng)格線、X/Y 軸標題、X/Y 軸標簽。

3.3 軸類型

根據(jù)對應變量是連續(xù)數(shù)據(jù)還是離散數(shù)據(jù)，可以把坐標軸分為：分類軸、時間軸、連續(xù)軸三大類。

3.4 X/Y 軸線

顏色層級：X/Y軸線要比網(wǎng)格線層級高、顏色深，這樣能讓圖表有主次區(qū)分。

使用建議：有網(wǎng)格線時，柱狀圖/折線圖會隱藏 Y 軸線，條形圖則是隱藏 X 軸線，以達到信息降噪、突出重點的目的。

3.5 刻度線

軸刻度線是軸線上的小線段，用于指示數(shù)值標簽在坐標軸上的具體位置。軸刻度線有 3 種放置方式：置內(nèi)、置中（即交叉方式）、置外。

位置建議：刻度線置中/置內(nèi)時，可能會和網(wǎng)格線、數(shù)據(jù)圖形重疊，所以建議將刻度線置于數(shù)值坐標軸外側(cè)，以呈現(xiàn)最佳顯示效果。

顯示建議：

折線圖：刻度線、X/Y 軸標簽、數(shù)據(jù)點需要保持在同一垂直線上；

柱狀圖/條形圖：由于單個柱子有很強的對應關(guān)系，此時可以隱藏刻度線；

3.6 網(wǎng)格線

定義：網(wǎng)格線是用來輔助圖表優(yōu)化映射關(guān)系的，我們需要弱化網(wǎng)格線的視覺效果，來增加數(shù)據(jù)的可閱讀性。

作用：1. 延伸數(shù)值刻度至可視化對象中，以便觀察數(shù)據(jù)值的大?。?. 增加可視化對象之間的對比觀察度。

使用建議 1 ：使用網(wǎng)格線時，需遵從主次原則，以軸線為主、網(wǎng)格線為輔；樣式上可采用實線或虛線；避免顏色過重、使用純黑/純白色。

使用建議 2 ：網(wǎng)格線一般跟隨值域軸的位置單向顯示，柱狀圖、折線圖等采用水平網(wǎng)格，條形圖采用垂直網(wǎng)格。

3.7 X/Y 軸標題

軸標題主要用于說明坐標軸數(shù)據(jù)組的含義，也可理解為“軸單位”。當可視化圖表標題、圖例、軸標簽等已能充分表達數(shù)據(jù)含義時，可隱藏軸標題。

這樣處理體現(xiàn)了奧卡姆剃刀定律：如無必要，勿增實體。

3.8 X/Y 軸標簽

軸標簽是對當前某一組數(shù)據(jù)的內(nèi)容標注，用于提高數(shù)據(jù)的可讀性。

以下從 X 軸標簽、Y軸標簽兩方面進行分析：

a. X 軸標簽

X 軸標簽的設(shè)計重點在顯示規(guī)則上?？ㄆ瑢挾冗^窄、標簽過多、名稱過長時，X 軸標簽便會出現(xiàn)顯示問題（如標簽重疊等）。

為了解決顯示問題，我們從連續(xù)/時間軸標簽（數(shù)值類）、分類軸標簽（文本類）兩方面進行分析：

連續(xù)/時間軸標簽

顯示規(guī)則：建議等分抽樣顯示、旋轉(zhuǎn)；不尾部省略。

建議等分抽樣：連續(xù)/時間軸，通常由一組等差數(shù)列組成，具有規(guī)律性，缺失的數(shù)據(jù)用戶會在腦海中自動補全。所以建議用等分抽樣來避免標簽的重疊問題。

注意：等分抽樣盡量保留首尾數(shù)據(jù)標簽；隨機抽樣沒有規(guī)律，會影響用戶的判斷及辨認，不建議采取隨機抽樣顯示。

連續(xù)/時間軸標簽是由“關(guān)鍵數(shù)值”組成的標注點，一般都明確精簡，尾部省略會影響用戶對關(guān)鍵數(shù)值的辨認。

為了保證標簽的辨識度，我們可以將標簽旋轉(zhuǎn) 45°、 90° 。極端情況下（圖表寬度極窄），可以同時進行旋轉(zhuǎn)+抽樣。

分類軸標簽

顯示規(guī)則：建議旋轉(zhuǎn)顯示；不建議抽樣顯示。

分類軸由幾個離散數(shù)據(jù)標簽組成，標簽之間獨立存在，無緊密邏輯關(guān)系，用戶無法自動補全缺失信息。因此，不能采取抽樣顯示，應盡量展示全部標簽的全部文本。

若標簽橫向展示空間不夠（文字重疊），我們可以將標簽旋轉(zhuǎn) 45°、 90° 來達到預期顯示效果。若通過旋轉(zhuǎn)無法滿足需求，可使用條形圖，將分類軸放在Y軸。

旋轉(zhuǎn)方向說明：通常情況下，用戶的閱讀視線為從左至右、從上到下。因此，標簽順時針旋轉(zhuǎn) 45° 更符合用戶的瀏覽習慣。

b. Y 軸標簽

Y 軸標簽的設(shè)計重點在標簽數(shù)量、取值范圍和數(shù)據(jù)格式上。標簽顯示區(qū)域一般根據(jù)最長標簽寬度進行自適應縮放。

軸標簽的數(shù)量

使用建議：根據(jù)米勒定律（7±2 法則），Y 軸標簽數(shù)量應控制在 5-9 個的范圍內(nèi)；Web頁面中，Y 軸常用標簽數(shù)為：6 或 7（含標簽0）。

軸標簽的數(shù)量越多，橫向網(wǎng)格線就會越多。過多的軸標簽及網(wǎng)格線會造成元素冗余，違背了清晰、準確的可視化原則，也不利于圖表信息的表達及閱讀。

對齊方式：右對齊

軸標簽的取值范圍

基準線： Y 軸標簽取值應從 0 基線開始，以反映數(shù)據(jù)的真實性。如果展示被截斷的 Y 軸數(shù)據(jù)，會導致用戶做出錯誤的判斷。

軸標簽的數(shù)據(jù)格式

使用建議 1：標簽保留的小數(shù)位數(shù)保持統(tǒng)一。

4. 數(shù)據(jù)標簽

數(shù)據(jù)標簽是對數(shù)據(jù)點對應數(shù)值的標注，用于直接觀察每個數(shù)據(jù)點的具體數(shù)值。

若圖表主要是用來看趨勢變化、占比大小等，則不需要顯示數(shù)據(jù)標簽。若想精確了解每組數(shù)據(jù)的具體數(shù)值，則可以顯示數(shù)據(jù)標簽。

4.1 位置

數(shù)據(jù)標簽位于數(shù)據(jù)點的上方。

4.2 顯示規(guī)則

在不同類型的圖表中，數(shù)據(jù)標簽的顯示規(guī)則不同。我們可以根據(jù)數(shù)據(jù)圖形、數(shù)據(jù)值的特性，選擇合適的顯示方式，提高圖表的準確性。

a. 柱狀圖

基礎(chǔ)柱狀圖

：數(shù)據(jù)標簽可顯示在數(shù)據(jù)圖形內(nèi)部、外部。

數(shù)據(jù)標簽在圖形內(nèi)部的顯示規(guī)則：正常情況下，橫向顯示；數(shù)據(jù)標簽超長時，旋轉(zhuǎn) 90°；圖形高度 < 數(shù)據(jù)標簽高度時，不顯示數(shù)據(jù)標簽。

分組柱狀圖

：數(shù)據(jù)標簽可顯示在數(shù)據(jù)圖形內(nèi)部、外部。顯示在內(nèi)部的數(shù)據(jù)標簽顯示寬度不夠時，解決方案同上。

堆疊柱狀圖

：數(shù)據(jù)標簽顯示在數(shù)據(jù)圖形內(nèi)部。

b. 條形圖

數(shù)據(jù)標簽在圖形內(nèi)部的顯示規(guī)則：正常情況下，橫向顯示；圖形寬度 < 數(shù)據(jù)標簽高度時，不顯示數(shù)據(jù)標簽；條形圖高度需 >= 數(shù)據(jù)標簽高度。

基礎(chǔ)、分組條形圖的數(shù)據(jù)標簽也可以顯示在圖形外部：

c. 折線圖

數(shù)據(jù)標簽顯示在數(shù)據(jù)點的上方。

圖表寬度過窄，數(shù)據(jù)點多且密時，相鄰的數(shù)據(jù)標簽會出現(xiàn)重疊的問題。此時，我們會采用抽樣的方式顯示數(shù)據(jù)標簽。鼠標懸停數(shù)據(jù)點，顯示隱藏的數(shù)據(jù)標簽。

d. 餅圖、環(huán)形圖

數(shù)據(jù)標簽顯示在圖形內(nèi)部、外部均可。

由于扇形有角度，且形狀相對不規(guī)則，對數(shù)據(jù)標簽的文本長度包容度較低，環(huán)形更是如此。所以，當扇/環(huán)形分割過多、面積較小時，建議將數(shù)據(jù)標簽顯示在圖形外部。

當然，我們也可以內(nèi)外部結(jié)合使用：

e. 數(shù)據(jù)標簽顏色

數(shù)據(jù)標簽顯示在圖形內(nèi)部時，圖形為背景，數(shù)據(jù)標簽為前景。此時，數(shù)據(jù)圖形作為背景色，會影響到數(shù)據(jù)標簽的顯色度及易讀性。

為了確保良好的可讀性，我們通過對圖形顏色 HS 值的判斷，來決定文字的顏色。這樣對比度就在可控范圍內(nèi)，不會出現(xiàn)可讀性低的問題。

由于篇幅問題，剩余內(nèi)容接下一篇文章展示

作者：布魯星人
鏈接：https://www.zcool.com.cn/article/ZMTYzNzI0NA==.html
來源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。

評論(0) 瀏覽(266)

152024-10

B端用研體系框架的搭建

資深UI設(shè)計者

B端擁有復雜的業(yè)務(wù)流，用戶研究體系框架的搭建對于產(chǎn)品的成功至關(guān)重要，它不僅關(guān)系到用戶的直接體驗，還涉及到產(chǎn)品的長期發(fā)展和市場競爭力。通過用戶研究，可以更好地理解B端用戶的需求和使用習慣，從而設(shè)計出更加符合用戶期望的產(chǎn)品功能和交互流程。

評論(0) 瀏覽(379)

192024-9

以B端小二揀貨場景為例 - 視覺思維在交互體驗中的運用

ui設(shè)計分享達人

在當今時代，現(xiàn)代 UI 用戶交互體驗設(shè)計具有極為重要的地位。它絕非僅僅局限于單向的視覺設(shè)計，也不是單純地圍繞用戶的可用性進行研究設(shè)計。實際上，如今的 UI 用戶交互體驗設(shè)計已經(jīng)對視覺與可用性操作提出了更高層次的混合化要求。

對于現(xiàn)代的 UI 設(shè)計而言，我們需要從多個角度進行更進一步的深入解讀。這不僅涉及心理學方面，去探究用戶的心理需求和行為模式，以便更好地滿足他們的期望；還涵蓋視覺設(shè)計領(lǐng)域，通過精心打造的視覺元素，吸引用戶的注意力并傳達有效的信息；同時也不能忽視交互設(shè)計，確保用戶在與界面進行互動時能夠獲得流暢、便捷的體驗。

而將視覺思維理論應用于新一代的 UI 交互設(shè)計，則具有重大的意義。通過這種方式，用戶能夠憑借敏銳的視覺，靈敏地捕捉到屏幕上的信息軌跡。大腦可以快速地從不同抽象平面水平上獲取意象，實現(xiàn)表象形態(tài)感知與抽象思維的緊密連接。這樣一來，用戶便能夠高效地獲取有效的視覺信息，從而提升整體的交互體驗。無論是在工作場景中還是在日常生活中，一個優(yōu)秀的 UI 交互設(shè)計都能夠為用戶帶來極大的便利和愉悅感。

今天我們先介紹下理論知識，然后將產(chǎn)品設(shè)計案例結(jié)合（視覺思維分析模式的具體應用方法）來告訴大家怎么應用，希望可以幫助到大家。

開始話題前我們需要了解格式塔心理學是什么

我相信格式塔心理學大家都聽過，主流對于格式塔心理學的觀點是：格式塔心理學強調(diào)經(jīng)驗和行為的整體性，認為整體不等于部分之和，意識不等于感覺元素的集合，行為不等于反射弧的循環(huán)。它主張心理現(xiàn)象最基本的特征是在意識經(jīng)驗中所顯現(xiàn)的結(jié)構(gòu)性或整體性，反對構(gòu)造主義心理學把心理現(xiàn)象分析為簡單的元素，認為心理現(xiàn)象是一個整體，一種有組織的完整結(jié)構(gòu)。

主要原則

1.接近性原則

在知覺過程中，距離相近的物體容易被知覺為一個整體。例如，在一張紙上分布著一些點，距離較近的點更容易被看作一組。

接近性原則圖例

2.相似性原則

具有相似特征的物體容易被知覺為一個整體。比如，顏色、形狀、大小等相似的圖形更容易被組合在一起進行認知。

相似性原則圖例

3.連續(xù)性原則

在知覺過程中，人們傾向于將具有連續(xù)性的物體知覺為一個整體。例如，一條曲線即使中間有部分被遮擋，人們也會傾向于將其看作是連續(xù)的整體。

連續(xù)性原則圖例

4.閉合性原則

人們傾向于將不完整的圖形知覺為完整的圖形，即通過心理上的補充使圖形達到閉合。比如，一個有缺口的圓形，人們往往會自動腦補出完整的圓形。

閉合性原則圖例

對設(shè)計領(lǐng)域的影響

以上是大家所了解對的，而對于設(shè)計于界面設(shè)計、圖形設(shè)計、用戶體驗設(shè)計都有影響：

界面設(shè)計：在網(wǎng)頁設(shè)計和移動應用界面設(shè)計中，格式塔心理學的原則被廣泛應用。例如，通過合理布局元素，利用接近性和相似性原則將相關(guān)的內(nèi)容組合在一起，使用戶能夠更快速地理解和操作界面。顏色的相似性可以用來區(qū)分不同的功能模塊，提高界面的可讀性和易用性。
圖形設(shè)計：設(shè)計師常常運用閉合性原則創(chuàng)造簡潔而富有吸引力的圖形。利用連續(xù)性原則可以引導用戶的視線，創(chuàng)造出動態(tài)和富有節(jié)奏感的設(shè)計作品。
用戶體驗設(shè)計：格式塔心理學有助于設(shè)計師理解用戶如何感知和理解復雜的信息環(huán)境。通過創(chuàng)造整體的、有組織的設(shè)計，可以提高用戶的滿意度和使用效率，減少認知負擔。

界面設(shè)計圖例

魯?shù)婪?阿恩海姆的格式塔心理學理論中提出了四種 “力” 的概念，GUI 設(shè)計師對其在界面中的角色進行了深入闡釋。

第一種力是由視覺對象的外在形狀和構(gòu)造所生成的力。

例如，獨特的圖標設(shè)計通過其具象的形態(tài)傳達出明確的語意，讓用戶能夠迅速理解其功能。這種力如同一個無聲的向?qū)?，引領(lǐng)用戶在界面中準確地找到所需的操作。

第二種力是物體間或物體各部分之間的聚合張力。

它雖有強度但沒有特定方向，就像界面中各個元素緊密結(jié)合，形成一個有機的整體。各個組件相互呼應，共同營造出和諧統(tǒng)一的視覺氛圍，增強了用戶對界面的整體認知。

第三種力是在視覺對象中知覺到的有方向性的張力。

其載體具有一定的 “動力”，表現(xiàn)為具有方向標識性意識的標識及層級關(guān)系。比如，清晰的導航箭頭或色彩漸變，引導用戶在界面中進行有序的瀏覽和操作，確保用戶不會迷失方向。

第四種力主要是指視覺式樣本身及其組合所形成的視覺沖擊力。

在界面中，涵蓋引導性的動態(tài)效果可以吸引用戶的注意力，激發(fā)用戶的探索欲望。例如，微妙的動畫效果或交互反饋，為用戶帶來更加生動的體驗。

四種 “力” 的概念

這四種力是 GUI 設(shè)計中討論視知覺的核心內(nèi)容。

它們是形狀、顏色和運動的固有屬性，并非觀賞者憑借記憶中的想象強加給知覺對象的。阿恩海姆將格式塔心理美學視為一種

“視知覺形式完形理論”

。

在 UI 設(shè)計中，以格式塔心理美學為指導，視覺上的 “完形” 形式生成機制發(fā)揮作用。用戶在設(shè)計師精心構(gòu)建的色彩圖形語言引導下，無意識地進行目的性的視知覺形式達成。這種方式為無縫接入交互提供了卓越的解決方案。

在 UI 設(shè)計中運用格式塔心理學，為人機互動形式的形成和建構(gòu)提供動力機制引導，讓我們對格式塔心理美學有了全新的理解。它不僅提升了界面的美觀度，更重要的是增強了用戶體驗，使界面更加直觀、易用。通過合理運用格式塔心理學的原理，設(shè)計師可以創(chuàng)造出更具吸引力和功能性的 UI 設(shè)計，為用戶帶來更加愉悅的交互體驗。

視覺思維

人類對于藝術(shù)的感知與生俱來，積極主動。對于現(xiàn)代優(yōu)秀交互設(shè)計師而言，掌握并了解人類視覺的基本原理是必備素養(yǎng)之一。視覺思維與人類的生理和心理因素緊密相連。

1.生理方面看

這與我們的感官系統(tǒng)及其特性息息相關(guān)。人類的視覺系統(tǒng)猶如一條完整的視覺分析鏈，涵蓋了眼球、大腦皮層以及它們之間的視覺傳導路徑。

視覺大腦皮層位于大腦后端，圍繞枕葉的距狀裂周圍分布。其中，V1 區(qū)和 V2 區(qū)主要負責一系列特征處理，V4 區(qū)承擔圖案模式處理工作，而前腦葉和中腦則負責高層注意力的控制。信息由皮層 V1 通過兩條線路進行輸送。第一條路線為背側(cè)流，即位置通道，從 V1 傳輸至 V2，再進入 V5，最后抵達頂下小葉，此段主要處理視覺的空間位置信息以及相關(guān)的運動和控制部分。第二條線路為內(nèi)容通道，從 V1 到 V2 和 V4，最后進入下顳葉，用于物體的識別和長期記憶。

大腦皮層圖例

2.心理方面看

視覺思維與人類的現(xiàn)有生存條件以及以往的生活經(jīng)驗緊密相關(guān)。生理與心理因素相互作用，形成了獨特的視覺思維特性。

多年來，藝術(shù)、設(shè)計心理學家在對人腦及其視覺生理機制的研究上取得了顯著進展。在視覺藝術(shù)作品中，一系列色彩、圖形和空間關(guān)系的呈現(xiàn)，都是視覺藝術(shù)家經(jīng)過反復斟酌的結(jié)果。他們思考著哪種顏色和圖形會更加醒目，如何合理組織空間，以及在何種情況下應該用圖像代替文字來表達概念。這樣經(jīng)過深思熟慮的作品，能夠有效規(guī)避人類視覺的弱點，充分激發(fā)用戶對主體的能動性和創(chuàng)造性認識，讓觀賞者和使用者獲得愉悅的視覺體驗。這種主動的視覺感知能夠更好地傳達作品所要表達的思想與內(nèi)涵。

如果設(shè)計師能夠深入了解并分析用戶的視覺系統(tǒng)和心理，就能設(shè)計出更符合目標用戶需求的 UI 交互產(chǎn)品。例如，通過對用戶視覺注意力的研究，設(shè)計師可以在界面中合理布局關(guān)鍵元素，使其更容易被用戶察覺。同時，根據(jù)用戶的色彩偏好和心理預期，選擇合適的色彩方案，營造出舒適的視覺氛圍。此外，設(shè)計師還可以利用用戶對圖形的認知習慣，設(shè)計簡潔明了的圖標和界面元素，提高用戶的操作效率?？傊?，對視覺思維的深入理解和運用，將為 UI 設(shè)計帶來更多的創(chuàng)新和突破。

UI 設(shè)計中的視覺設(shè)計

人類的感知系統(tǒng)豐富多彩，主要分為聽覺、味覺、視覺、觸覺、嗅覺這五大類別。其中，令人驚嘆的是，高達 90% 的感知竟然來源于視覺系統(tǒng)。這一特性使得界面產(chǎn)品的設(shè)計緊緊圍繞著用戶利用視覺刺激思維以及人機交互細處理模式來實現(xiàn)人機互動，進而達成傳遞或獲取信息的目標。

比如當下流行的各類手機 APP，以其精美的界面設(shè)計吸引著用戶。當我們打開一款音樂播放軟件，絢麗的色彩搭配、簡潔明了的圖標布局，瞬間抓住我們的眼球，讓我們能夠快速找到自己想聽的歌曲。這就是視覺設(shè)計在人機交互中的重要作用，通過視覺刺激引導用戶進行操作。

在這個過程中，我們常常能聽到界面產(chǎn)品的開發(fā)人員發(fā)出這樣的抱怨：“我們討厭交互設(shè)計。” 而交互設(shè)計師則會堅定地表示：“我們不需要圖形。” 然而，視覺設(shè)計師卻往往對來自各方面的意見持相反態(tài)度，顯得一廂情愿。

但事實上，視覺設(shè)計絕非孤立的存在，它是在 UI 設(shè)計中可用性和交互設(shè)計研究的綜合體現(xiàn)。例如一些知名的電商平臺，其界面設(shè)計既考慮了用戶的操作便捷性，又通過精美的商品圖片展示和富有創(chuàng)意的頁面布局，滿足用戶的視覺需求。用戶在瀏覽商品時，流暢的交互體驗和美觀的視覺效果相輔相成，提升了用戶的購物體驗。

視覺思維，宛如一座神奇的橋梁，將感知與思維、藝術(shù)與科學緊密地結(jié)合在一起。它能夠?qū)⑷祟惐灸艿囊曈X感知、圖形設(shè)計以及視覺可視化巧妙地聯(lián)系起來。在滿足使用功能設(shè)計的基礎(chǔ)上，現(xiàn)代 GUI 設(shè)計已然成為一種輔助交互的強大力量，它不僅能滿足用戶的感知需求，還能迎合審美需求以及自我實現(xiàn)需求，成為功能性十足的視覺設(shè)計杰作。它就像一顆璀璨的明珠，在數(shù)字世界中散發(fā)著獨特的魅力，為用戶帶來前所未有的體驗。

計算機和用戶

視覺思維在 UI 交互體驗設(shè)計中的作用

在 UI 交互體驗設(shè)計中，我們確實應當將這樣的交互設(shè)計視作用戶對品牌的認知工具和用于信息傳遞的重要渠道。

從處理平面圖像的角度來看，人類的大腦具有強大的能力，能夠在一定程度上通過思維進行心智圖像的建立。想象一下，當我們在腦海中構(gòu)思一幅美麗的風景或者一個復雜的場景時，各種元素在思維的畫布上逐漸清晰起來。然而，當這些圖像被紙張、熒幕等媒介物表現(xiàn)出來時，情況又發(fā)生了變化。我們能夠把網(wǎng)頁、圖標、信息圖表等可視化指令經(jīng)過視覺思維的處理過程，快速地解決問題。比如，當我們?yōu)g覽一個設(shè)計精美的網(wǎng)頁時，清晰的布局、醒目的圖標和直觀的信息圖表能夠迅速引導我們找到所需的內(nèi)容，讓我們在短時間內(nèi)獲取關(guān)鍵信息。

而在 UI 交互體驗設(shè)計中，“視覺思維” 手段更是發(fā)揮著獨特的作用。它能夠幫助用戶提前整理視覺引導任務(wù)，為用戶的交互之旅提供清晰的方向。不同的用戶有著不同的需求和偏好，“視覺思維” 可以根據(jù)這些差異增加視覺注意力的多樣性。對于喜歡簡潔風格的用戶，簡潔明了的界面設(shè)計和少量但突出的視覺元素能夠吸引他們的注意力；而對于追求豐富體驗的用戶，多彩的色彩搭配和動態(tài)的視覺效果則更能滿足他們的需求。這樣的差異化設(shè)計使得不同類型的用戶都能在交互過程中找到滿足自己需求的視覺引導。

同時，“視覺思維” 能使人類本能的認知線索在視覺圖形語言處理中直接快速切換。在用戶潛意識的情況下，利用用戶自身的視覺引導去完成交互任務(wù)，大大縮短思考的時間。例如，在一款游戲應用中，巧妙的色彩變化和圖形動畫可以在用戶不經(jīng)意間引導他們進行操作，讓他們在享受游戲的過程中自然地完成各種交互任務(wù)，而不會感到繁瑣和困惑。

總之，在 UI 交互體驗設(shè)計中，“視覺思維” 以其獨特的優(yōu)勢成為了連接用戶與品牌、實現(xiàn)信息高效傳遞的關(guān)鍵手段。通過差異化的設(shè)計和巧妙的視覺引導，它為用戶帶來了更加便捷、愉悅的交互體驗。

成功運用 “視覺思維” 的 UI 交互體驗設(shè)計案例

一、蘋果 iOS 系統(tǒng)

蘋果的 iOS 系統(tǒng)以其簡潔、美觀的界面設(shè)計而聞名。圖標設(shè)計簡潔直觀，色彩搭配和諧，能夠讓用戶一眼就識別出不同的應用功能。例如，相機圖標是一個逼真的相機造型，讓人一看就知道其功能。在交互過程中，動畫效果流暢自然，如打開應用時的漸顯效果、關(guān)閉應用時的收縮效果等，這些動畫不僅增加了視覺吸引力，還為用戶提供了操作反饋，引導用戶的視覺注意力，讓用戶在操作過程中更加流暢和舒適。

二、Airbnb

Airbnb 的界面設(shè)計充滿了故事性和吸引力。在首頁，精美的圖片展示了各種獨特的房源，吸引用戶的目光。圖片的選擇和排版都經(jīng)過精心設(shè)計，能夠讓用戶快速了解房源的特色。在搜索結(jié)果頁面，清晰的布局和簡潔的信息展示讓用戶能夠輕松比較不同房源的價格、位置等關(guān)鍵信息。同時，地圖視圖的交互設(shè)計也非常出色，用戶可以通過拖動地圖直觀地查看不同地區(qū)的房源分布，這種視覺引導方式大大提高了用戶的搜索效率。

三、微信

微信的界面簡潔易用，圖標和文字的搭配恰到好處。綠色的主色調(diào)給人一種清新、舒適的感覺。在聊天界面中，不同類型的消息有不同的顯示方式，如文字、圖片、語音等，讓用戶能夠快速區(qū)分。朋友圈的設(shè)計也充分運用了視覺思維，用戶可以通過圖片、視頻等多種形式分享自己的生活，點贊和評論的互動方式也通過視覺效果進行了明確的提示，增加了用戶之間的互動和交流。

用戶交互體驗設(shè)計過程中的視覺思維

為了更好地體現(xiàn)用戶交互性能，我們確實需要在整個用戶交互體驗設(shè)計過程之中引入視覺思維分析模式來規(guī)范指導設(shè)計。這一模式就如同一位智慧的導航者，引領(lǐng)著設(shè)計的方向，確保每一個環(huán)節(jié)都能最大程度地滿足用戶的需求和期望。

對整個設(shè)計過程中一系列層級結(jié)構(gòu)進行視覺歸納，是一項至關(guān)重要的任務(wù)。

從 UI 設(shè)計過程中最初的方案構(gòu)架開始，就如同搭建一座宏偉建筑的基石，需要深思熟慮。設(shè)計師要以視覺思維為導向，考慮如何讓方案構(gòu)架既具有創(chuàng)新性又符合用戶的使用習慣。草圖階段，則是將創(chuàng)意初步呈現(xiàn)在紙上的過程，此時要充分發(fā)揮視覺思維的作用，捕捉那些瞬間的靈感，用簡潔而有力的線條勾勒出未來產(chǎn)品的輪廓。

動態(tài) layout 的設(shè)計更是離不開視覺思維，它要讓頁面的布局在動態(tài)變化中保持流暢和自然，給用戶帶來舒適的視覺感受。而后期特效的安排，則如同為產(chǎn)品披上一件華麗的外衣，需要恰到好處地運用，既不能過于耀眼而分散用戶的注意力，也不能過于平淡而無法引起用戶的興趣。

例如，如何使整個方案更符合目標用戶的色彩定位，這是一個需要深入思考的問題。

不同的用戶群體對色彩有著不同的偏好和情感反應。設(shè)計師要通過對目標用戶的調(diào)研和分析，了解他們的文化背景、年齡層次、性別差異等因素，從而確定最適合的色彩方案。比如，對于年輕的用戶群體，可能更傾向于鮮艷、活潑的色彩；而對于商務(wù)用戶，則可能更喜歡穩(wěn)重、大氣的色彩。通過精準的色彩定位，能夠讓用戶在第一時間對產(chǎn)品產(chǎn)生好感。

如何讓復雜的層級關(guān)系在視覺上顯示得更為簡單且明朗化，也是視覺思維分析的要點之一。

結(jié)合設(shè)計認知心理學總結(jié)出一套適合當前項目的用戶交互體驗設(shè)計的視覺規(guī)范，是實現(xiàn)優(yōu)秀設(shè)計的關(guān)鍵。設(shè)計認知心理學研究人類在設(shè)計過程中的認知和心理活動，它可以為設(shè)計師提供寶貴的理論支持。設(shè)計師可以借鑒設(shè)計認知心理學的研究成果，制定出符合用戶認知習慣的視覺規(guī)范。比如，遵循簡潔性原則，避免過多的視覺干擾；運用一致性原則，讓用戶在不同的頁面和功能模塊中都能保持一致的視覺體驗；注重可讀性原則，確保文字和圖標易于識別和理解。通過建立一套科學合理的視覺規(guī)范，能夠提高設(shè)計的效率和質(zhì)量，為用戶帶來更加出色的交互體驗。

下面介紹下我在過往項目中的實際案例，看看如何處理復雜的視覺層級

案例分享

首先我們了解一下背景：

盒馬店倉揀貨是門店倉儲作業(yè)中的一個重要環(huán)節(jié)，員工需要用到PDA實時接收倉儲系統(tǒng)分配的揀貨任務(wù)，并為揀貨員提供清晰的任務(wù)指引，包括商品的位置、數(shù)量等信息，它就像一個智能導航儀，指引揀貨員快速找到目標商品，PDA中就需要進行界面設(shè)計，保證揀貨員能高效的完成任務(wù)，但是實際倉的環(huán)境是極其復雜的，往往店倉環(huán)境較為昏暗且存在溫差，同時揀貨員往往是邊走邊揀貨，整體過程是非常緊張和匆忙的，這就對視覺識別效率要求非常高。

揀貨員的具體工作流程如下：

1.接收訂單：當顧客在盒馬 APP 上下單后，訂單信息會同步傳輸?shù)介T店的倉儲系統(tǒng)。

2.揀貨任務(wù)分配：倉儲系統(tǒng)根據(jù)訂單內(nèi)容，將揀貨任務(wù)分配給相應的揀貨員，并將任務(wù)信息發(fā)送到揀貨員手中的 PDA（掌上電腦）設(shè)備上。例如，某顧客下單購買了蘋果、牛奶和面包，系統(tǒng)就會指示揀貨員去相應的區(qū)域揀取這些商品。

3.商品揀選：揀貨員根據(jù) PDA 上的指示，前往指定的貨架區(qū)域。通過 PDA 掃描貨架上商品的條形碼或二維碼，確認商品信息無誤后，將商品揀選出來放入揀貨籃或推車中。在揀貨過程中，揀貨員需要嚴格按照商品的數(shù)量和規(guī)格進行揀選，避免出現(xiàn)錯揀、漏揀的情況。

4.復核與打包：揀貨完成后，揀貨員將揀選好的商品送到復核區(qū)，由復核人員對商品進行再次核對，確保商品的種類、數(shù)量、質(zhì)量等與訂單一致。復核無誤后，根據(jù)商品的特性和訂單要求進行打包，例如，對于生鮮商品需要使用特殊的包裝材料和方式，以保證商品的新鮮度和品質(zhì)1。

5.出貨：打包完成的商品被放置在出貨區(qū)，等待配送人員前來取貨，進行后續(xù)的配送環(huán)節(jié)，確保商品能夠及時、準確地送達顧客手中。

在這個過程中我們可以發(fā)現(xiàn)從“行為、感受、環(huán)境、設(shè)備”幾個維度來看，我們需要關(guān)注的點是非常多的，如下面所示我們需從效率和步驟感入手，保證界面清晰無障礙的基礎(chǔ)上對小小的屏幕進行占比的優(yōu)化，同時加入情感化和溫度感，這是最理想的設(shè)計目標。

設(shè)計前需關(guān)注的內(nèi)容

提煉設(shè)計目標和原則

對目標用戶群體進行深入調(diào)研，了解他們的年齡、性別、職業(yè)、文化背景等基本信息。

這些因素會影響用戶對色彩、圖形、布局等視覺元素的偏好。分析用戶的視覺感知優(yōu)勢和弱勢。例如，對于老年用戶，可能需要更大的字體和更鮮明的色彩對比；對于視力受損的用戶，可能需要高對比度的界面和清晰的圖標。通過用戶訪談、問卷調(diào)查、觀察等方法，收集用戶對現(xiàn)有產(chǎn)品或類似產(chǎn)品的視覺反饋，了解他們的喜好和不滿之處，為后續(xù)設(shè)計提供依據(jù)。

色彩定位根據(jù)目標用戶群體的特點和產(chǎn)品的定位，確定合適的色彩方案。

色彩可以傳達不同的情感和氛圍，如藍色通常給人沉穩(wěn)、可靠的感覺，紅色則充滿活力和激情?？紤]色彩的對比度和可讀性。高對比度的色彩組合可以提高文字和圖標的清晰度，便于用戶閱讀和識別。同時，要確保色彩在不同的設(shè)備和環(huán)境下都能保持良好的顯示效果。

設(shè)計規(guī)劃階段（視覺層研究）

方案構(gòu)架運用視覺思維，從整體上規(guī)劃產(chǎn)品的架構(gòu)和布局?？紤]用戶的使用流程和場景，將功能模塊進行合理的分組和排列，使界面簡潔明了，易于導航。確定主要的視覺焦點和引導路徑。通過大小、顏色、位置等方式突出關(guān)鍵信息和重要操作，引導用戶的注意力，提高交互效率。

功能色視覺研究保證視覺可讀性和清晰性

中性色研究保證對比度清晰可讀

字號字階優(yōu)化

設(shè)計實施階段

特效應用謹慎地選擇和應用特效，如陰影、漸變、發(fā)光等。特效可以增強界面的視覺吸引力，但過多或不當?shù)氖褂每赡軙е乱曈X混亂和性能問題?？紤]特效對用戶操作的引導作用。例如，使用特效來突出可點擊的區(qū)域或提示重要信息，可以提高用戶的交互體驗。

通過視覺明確任務(wù)

時效思考

設(shè)計方案

測試評估階段

用戶測試邀請目標用戶進行用戶測試，觀察他們在使用產(chǎn)品過程中的視覺反應和行為。注意用戶對不同視覺元素的關(guān)注程度、理解程度和操作效率。收集用戶的反饋意見，了解他們對界面設(shè)計的滿意度和改進建議。根據(jù)用戶的反饋，及時調(diào)整和優(yōu)化設(shè)計。
數(shù)據(jù)分析利用數(shù)據(jù)分析工具，收集用戶在使用產(chǎn)品過程中的行為數(shù)據(jù)，如點擊次數(shù)、停留時間、頁面跳轉(zhuǎn)路徑等。通過分析這些數(shù)據(jù)，可以了解用戶的視覺注意力分布和交互習慣，為進一步優(yōu)化設(shè)計提供依據(jù)。

方案調(diào)研

方案驗證可行

組件沉淀

對設(shè)計組件進行沉淀和歸納，同時定義好設(shè)計樣板間。

組件識別，需要對已有的設(shè)計項目進行全面梳理，識別出其中重復出現(xiàn)的元素和模塊。這些元素可以包括按鈕、輸入框、圖標、導航欄、卡片等。例如，在一個電商網(wǎng)站的設(shè)計中，商品展示卡片、購物車按鈕、搜索框等都是常見的組件。同時，也要關(guān)注不同項目中具有相似功能或外觀的元素，它們可能經(jīng)過適當調(diào)整后可以歸納為同一類組件。比如，不同頁面的提示信息框，雖然在內(nèi)容和位置上有所不同，但在風格和交互方式上可能具有共性。
規(guī)范制定對識別出的組件進行規(guī)范制定，包括尺寸、顏色、字體、間距等方面的統(tǒng)一規(guī)定。例如，確定按鈕的標準尺寸、顏色搭配和文字樣式，確保在不同的頁面和場景中都能保持一致的外觀和交互效果。制定組件的使用規(guī)范，明確在什么情況下應該使用哪種組件，以及如何進行組合和布局。例如，規(guī)定導航欄的位置和結(jié)構(gòu)，以及不同級別頁面的導航方式。
分類整理將規(guī)范后的組件進行分類整理，建立一個清晰的組件庫?？梢园凑展δ堋㈩愋突蚴褂脠鼍斑M行分類，方便設(shè)計師在后續(xù)的設(shè)計中快速查找和使用。比如，將組件分為界面組件（如按鈕、輸入框等）、交互組件（如彈窗、下拉菜單等）、布局組件（如網(wǎng)格系統(tǒng)、分欄布局等）。
持續(xù)更新隨著設(shè)計項目的不斷進行，新的組件可能會不斷出現(xiàn)，舊的組件也可能需要進行優(yōu)化和調(diào)整。因此，需要建立一個持續(xù)更新的機制，定期對組件庫進行審查和更新，確保組件庫始終保持活力和實用性。

總結(jié)：

在現(xiàn)代的 UI 設(shè)計中，往往存在著眾多的功能模塊和信息層級。如果處理不當，就會讓用戶感到混亂和困惑。設(shè)計師可以運用視覺層次、分組、對比等手法，將復雜的層級關(guān)系進行梳理和簡化。例如，通過不同的字體大小、顏色深淺、圖標形狀等方式來區(qū)分不同的層級，讓用戶能夠輕松地理解和操作。

如何保證特效的使用恰到好處，不會引起用戶的使用誤解，同樣需要設(shè)計師的精心考量。特效可以為產(chǎn)品增添趣味性和吸引力，但如果使用不當，就會適得其反。設(shè)計師要根據(jù)產(chǎn)品的特點和用戶的需求，合理地選擇特效的類型和強度。比如，在一些需要強調(diào)操作反饋的地方，可以使用適度的動畫特效，讓用戶清楚地知道自己的操作是否成功；而在一些重要的信息展示區(qū)域，則要避免使用過于花哨的特效，以免干擾用戶的閱讀。

設(shè)計師不僅需要對人類視覺系統(tǒng)有一定的了解，同時也需要對目標用戶視覺感知的優(yōu)勢和弱勢進行分析和歸納。人類的視覺系統(tǒng)是一個復雜而神奇的系統(tǒng)，它有著自己的特點和規(guī)律。設(shè)計師要了解人類視覺的注意力機制、色彩感知、空間感知等方面的知識，以便更好地運用視覺元素進行設(shè)計。同時，不同的目標用戶群體在視覺感知方面也存在著差異。比如，老年人可能對色彩的對比度要求更高，而視力有障礙的用戶則需要更加清晰的文字和圖標。設(shè)計師要通過對目標用戶的視覺感知優(yōu)勢和弱勢進行分析，制定出相應的設(shè)計策略，確保產(chǎn)品能夠滿足不同用戶的需求。

謝謝！

作者：小雞小小小小雞
鏈接：https://www.zcool.com.cn/article/ZMTYzMzYzNg==.html
來源：站酷

評論(0) 瀏覽(474)

192024-9

B端產(chǎn)品設(shè)計優(yōu)化-基于用戶需求調(diào)研與分析

ui設(shè)計分享達人

在當今設(shè)計和產(chǎn)品開發(fā)領(lǐng)域，用戶研究扮演著不可或缺的角色。理解用戶的需求、行為和體驗，是設(shè)計師們打造成功產(chǎn)品和服務(wù)的關(guān)鍵步驟。

用戶研究不僅是設(shè)計師和產(chǎn)品團隊的重要工具，更是提升產(chǎn)品競爭力和用戶滿意度的關(guān)鍵因素。通過深入的用戶研究，我們能夠更準確地捕捉用戶需求，創(chuàng)造出創(chuàng)新產(chǎn)品。

這篇文章將深入而全面的講解用戶研究的方法與具體實踐，包括用戶研究的重要性、用戶研究的核心因素、定性定量研究方法、基于產(chǎn)品生命周期的用研方式、用戶研究在設(shè)計流出中的具體應用等多維度探討用戶研究的核心概念及其實際應用方法，幫助讀者更好地理解如何通過有效的用戶研究提升產(chǎn)品的用戶體驗和市場競爭力。同時提供清晰的方法論和實際操作指南，幫助在設(shè)計和開發(fā)過程中有效地應用用戶研究，實現(xiàn)產(chǎn)品與市場的良性互動與成長。

B端產(chǎn)品設(shè)計優(yōu)化-基于用戶需求調(diào)研與分析

杰夫·貝佐斯是亞馬遜集團創(chuàng)始人，他曾說：“用戶的需求是創(chuàng)新的源泉，只有深入了解用戶，我們才能創(chuàng)造出真正有價值的產(chǎn)品。”這句話強調(diào)了用戶需求在創(chuàng)新過程中的核心地位。

他指出，真正有價值的產(chǎn)品來源于對用戶需求的深入了解。

也就是說，創(chuàng)新不是憑空產(chǎn)生的，而是通過仔細觀察和理解用戶的實際需求和問題而實現(xiàn)的。只有當我們真正了解用戶的痛點、期望和行為模式時，才能開發(fā)出滿足他們需求并解決他們問題的產(chǎn)品和服務(wù)。

通過以用戶為中心的設(shè)計，并通過數(shù)據(jù)驅(qū)動的決策，我們可以解鎖設(shè)計的無限潛力，創(chuàng)造出更好的產(chǎn)品和服務(wù)。

想讓用戶愛上你的產(chǎn)品，你必須先愛上你的用戶。

一、我作為設(shè)計師的小思考

作為設(shè)計師，過往我常常在思考：設(shè)計的價值是什么？用戶體驗的價值又是什么？在設(shè)計之路上不斷前行的過程中，這個問題始終如影隨形。

我在企業(yè)中遇到很多困惑，系統(tǒng)的 BUG 會造成用戶體驗不好，這只是其中一個方面。比如，當用戶在使用一款軟件時，突然出現(xiàn)的系統(tǒng)錯誤提示，會打斷他們的操作流程，讓他們感到沮喪和無奈。又或者，在一個購物平臺上，如果因為系統(tǒng)的漏洞導致商品信息顯示不準確，用戶可能會對產(chǎn)品的質(zhì)量產(chǎn)生懷疑，從而放棄購買。這些看似小小的 BUG，卻可能對用戶體驗產(chǎn)生巨大的負面影響。

而除了系統(tǒng) BUG 之外，還有很多因素也和體驗有關(guān)。界面的設(shè)計是否簡潔美觀？操作是否便捷流暢？信息的呈現(xiàn)是否清晰易懂？這些都是影響用戶體驗的關(guān)鍵因素。例如，一款音樂播放軟件，如果界面設(shè)計過于復雜，用戶可能很難找到自己想聽的歌曲；而如果操作不夠便捷，比如切換歌曲需要經(jīng)過多個繁瑣的步驟，那么用戶的使用體驗也會大打折扣。

再比如，一個企業(yè)的官網(wǎng)，如果頁面加載速度過慢，用戶可能會失去耐心而直接關(guān)閉頁面；如果網(wǎng)站的信息架構(gòu)不合理，用戶難以找到自己需要的內(nèi)容，那么這個官網(wǎng)就無法發(fā)揮其應有的作用。在移動應用領(lǐng)域，推送通知的頻率和內(nèi)容也會影響用戶體驗。如果推送過于頻繁或者內(nèi)容不相關(guān)，用戶可能會感到厭煩，甚至卸載應用。

總之，在設(shè)計和用戶體驗的領(lǐng)域，每一個細節(jié)都至關(guān)重要。設(shè)計師需要不斷地思考和探索，如何在滿足功能需求的同時，提升用戶的體驗，為用戶創(chuàng)造真正有價值的產(chǎn)品。

二、用戶研究的核心

用戶研究（User Research）是一種系統(tǒng)性的方法，旨在通過了解用戶的需求、行為、態(tài)度和痛點，來改進產(chǎn)品或服務(wù)的設(shè)計和功能。它通過各種研究方法，如訪談、調(diào)查、可用性測試和觀察等，收集和分析用戶的數(shù)據(jù)。這些數(shù)據(jù)幫助設(shè)計團隊和開發(fā)者更好地理解用戶，從而做出更明智的設(shè)計決策。

在實際設(shè)計和開發(fā)過程中，通過收集和分析以上信息，設(shè)計團隊可以更有針對性地制定商業(yè)模式、服務(wù)方式、策略重點和盈利模式，確保產(chǎn)品不僅能夠滿足市場需求，還能夠提供良好的用戶體驗，從而提升產(chǎn)品的競爭力和市場份額。

總之，用戶研究的核心在于通過深入理解用戶，為設(shè)計和開發(fā)團隊提供關(guān)鍵的信息和見解，以便他們能夠有效地創(chuàng)造出符合用戶期望和需求的產(chǎn)品或服務(wù)。

用戶研究（User Research）確實是設(shè)計和產(chǎn)品開發(fā)過程中至關(guān)重要的一環(huán)。它通過系統(tǒng)性的方法和工具，深入研究用戶的目標、需求、能力以及體驗，旨在指導如何優(yōu)化設(shè)計、產(chǎn)品架構(gòu)或工具，從而提升用戶的工作和生活體驗。

在進行用戶研究時，主要關(guān)注以下幾個方面：

1.用戶體驗（User Experience）：

這是用戶與產(chǎn)品或服務(wù)互動的整體感受和反應。通過用戶研究，可以了解用戶在使用過程中的體驗如何，哪些方面需要改進，從而優(yōu)化產(chǎn)品設(shè)計和功能。

2.用戶痛點（Pain Points）：

指的是用戶在使用產(chǎn)品或服務(wù)時遇到的困難、不便或不滿意的地方。通過深入了解用戶的痛點，可以針對性地改進產(chǎn)品的功能和設(shè)計，提升用戶的滿意度和忠誠度。

3.用戶需求（User Needs）：

這是用戶在特定情境下必須滿足的條件或期望。通過用戶研究，可以準確把握用戶的需求，確保產(chǎn)品或服務(wù)能夠有效地解決用戶的實際問題。

4.用戶行為和態(tài)度（User Behavior and Attitudes）：

研究用戶在使用產(chǎn)品或服務(wù)時的行為模式和心理態(tài)度，包括他們的偏好、習慣以及對新技術(shù)或設(shè)計的接受度。這些信息有助于設(shè)計團隊調(diào)整產(chǎn)品策略和功能，以更好地迎合用戶的期望和習慣。

三、產(chǎn)品生命周期的用戶研究考量

一個0-1的產(chǎn)品，在產(chǎn)品設(shè)計前，可能沒有大量的用戶或數(shù)據(jù),而又需要了解用戶的偏好，來定義產(chǎn)品需要解決的用戶痛點等問題,所以需要采取一些定性研究(訪談、用戶角色定義等)的方式來收集產(chǎn)品設(shè)計的核心需求。

1-N的產(chǎn)品，在產(chǎn)品設(shè)計前就擁有了一定比例的用戶和數(shù)據(jù)，可以參考一些數(shù)據(jù)來確定產(chǎn)品優(yōu)化的方向和指標。產(chǎn)品設(shè)計后，根據(jù)項目，也有兩種驗證方法: 一是做A/B測試，慢慢推向市場小范圍收集反饋，待穩(wěn)定后再大規(guī)模推向整個市場。這種做法屬于定量的范疇。二是可用性測試，招募符合要求的用戶來參與新產(chǎn)品的試用，提前設(shè)計一些任務(wù)要求用戶來完成，并可以增加一些定性研究(眼動實驗、用戶訪談等)輔以完善。

在用戶研究中，定性和定量研究恰似一對相輔相成的伙伴，二者互為補充，緊密結(jié)合使用能夠為我們提供全面而深刻的用戶洞察。

首先，在發(fā)現(xiàn)問題方面，定性研究發(fā)揮著至關(guān)重要的作用。

通過深入的用戶訪談、焦點小組討論以及實地觀察等方式，我們能夠走進用戶的世界，聆聽他們的聲音，捕捉那些細微之處的潛在問題和珍貴的機會。比如，在一款新的社交軟件的研發(fā)過程中，通過與用戶的面對面交流，我們可能會發(fā)現(xiàn)用戶對于隱私設(shè)置的擔憂，或者對于特定功能的強烈需求，這些都是定量研究難以直接觸及的領(lǐng)域。

接著，驗證假設(shè)環(huán)節(jié)，定量研究則展現(xiàn)出其強大的實力。

利用大規(guī)模的數(shù)據(jù)收集和統(tǒng)計分析，我們可以對定性研究中發(fā)現(xiàn)的假設(shè)進行驗證和量化。例如，我們在定性研究中發(fā)現(xiàn)用戶對某個新功能的興趣較高，那么通過定量研究中的問卷調(diào)查或數(shù)據(jù)分析，我們可以確定這個興趣的具體程度以及在用戶群體中的普遍性，從而為產(chǎn)品決策提供有力的數(shù)據(jù)支持。

最后，在迭代設(shè)計階段，定性反饋成為了改善設(shè)計的關(guān)鍵。

用戶的具體意見、感受和建議，能夠為設(shè)計師提供精準的改進方向。同時，定量數(shù)據(jù)的評估效果也不可或缺。通過對關(guān)鍵指標的監(jiān)測和分析，我們可以客觀地評估設(shè)計迭代后的成效，如用戶留存率的提升、使用時長的增加等。這樣的循環(huán)往復，使得產(chǎn)品在不斷的優(yōu)化中逐漸趨近于用戶的真正需求。

總之，定性和定量研究的結(jié)合，如同為用戶研究搭建了一座堅實的大廈，為打造出卓越的產(chǎn)品和服務(wù)奠定了堅實的基礎(chǔ)。

四、項目實戰(zhàn)-星漢低代碼平臺基礎(chǔ)建設(shè) 提升產(chǎn)品體驗

1.項目介紹：

星漢低代碼平臺是一款將先進的AI技術(shù)與低代碼開發(fā)理念完美結(jié)合的智能化開發(fā)平臺

旨在通過簡化且智能的開發(fā)工具

賦能開發(fā)者，提升研發(fā)效能、降低開發(fā)門檻，并增強應用效果

2.項目背景：

低代碼平臺去年下半年開始支撐教育數(shù)字基座應用開發(fā)助手的建設(shè),去年主要處于內(nèi)部打磨階段，今年上半年隨著應用開發(fā)助手前三單的推廣，直面真實客戶的需求和交付壓力，暴露出來了許多問題：功能性的、非功能性(性能、安全、穩(wěn)定性)、架構(gòu)、協(xié)作與流程等。for商業(yè)化，為保障教育規(guī)?；桓?，解決影響應用交付的基礎(chǔ)功能問題及風格換新，包括賬號權(quán)限體系、多租戶與資源隔離、第三方平臺對接、業(yè)務(wù)邏輯編排?；诖诵枨髮ζ脚_的礎(chǔ)功能進行完善，存在一下兩個問題：

1.基于多租戶與資源隔離問題：

無法支持多租戶及多租戶管理；多應用不支持共享數(shù)據(jù)、賬號權(quán)限、工作流；不支持按交付項目管理和復制多個應用等。使用優(yōu)先解決底層資源隔離的技術(shù)架構(gòu)調(diào)整、基礎(chǔ)項目管理產(chǎn)品功能，調(diào)整產(chǎn)品基礎(chǔ)功能架構(gòu)，租戶配置、模板的措施才優(yōu)化體驗。

2.基于業(yè)務(wù)邏輯編排問題：

無后端（1.業(yè)務(wù)邏輯處理，2.數(shù)據(jù)處理功能）均需要硬編碼；硬編碼部分無法隨產(chǎn)品升級而更新，與產(chǎn)品脫節(jié)需要獨立維護；教育助手無法修改硬編碼的邏輯，無法最終提供給信息化老師（弱開發(fā)者）修改的問題。優(yōu)先解決業(yè)務(wù)邏輯腳本和SQL腳本代碼在低代碼平臺中可留存可復用可調(diào)式的基礎(chǔ)功能。

3.設(shè)計目標及方法：

基于產(chǎn)品的背景，明確了設(shè)計目標是打造

“好用、易用”

的平臺操作體驗。

通過設(shè)計洞察，從易操作性、易學性和易見性的角度重新定義問題并尋求最優(yōu)解決方案。

首先通過用戶調(diào)研&體驗度量了解平臺現(xiàn)狀和用戶痛點，然后進行競品分析和體驗自查發(fā)現(xiàn)問題，最后基于發(fā)現(xiàn)的問題明確設(shè)計優(yōu)化點梳理并優(yōu)化產(chǎn)品。

4.三大指標分析：

在用戶體驗的領(lǐng)域中，滿意度、凈推薦值和費力度這三大主觀指標猶如三把衡量產(chǎn)品或服務(wù)質(zhì)量的關(guān)鍵標尺。

滿意度：短期內(nèi)衡量用戶幸福感的用戶得分

適用所有場景，適合作為補充指標做體驗評估。

滿意度的適用性非常高，可以用于詢問用戶各種問題，可以看整體的產(chǎn)品體驗滿意度，也可以看具體的某個功能的滿意度。滿意度能夠體現(xiàn)出用戶對產(chǎn)品短期內(nèi)的幸福感。

滿意度的缺陷是無法體現(xiàn)用戶對產(chǎn)品的長期態(tài)度。

凈推薦值：長期內(nèi)衡量用戶幸福感得分即客戶忠誠度

頭部廠商常用，適用于高頻高競爭對外用戶的產(chǎn)品。

是一種計量某個客戶可能會向其他人推薦某個企業(yè)或服務(wù)可能性的指數(shù)。

NPS被用于衡量目用戶長期的幸福感，廣泛用于互聯(lián)網(wǎng)產(chǎn)品來衡量用戶忠誠度。

費力度：短期內(nèi)衡量用戶完成任務(wù)的難易程度

主要應用于，ToB任務(wù)效率度量，相對于滿意度，企業(yè)內(nèi)部產(chǎn)品度量準確度更高。

費力度通過詢問用戶產(chǎn)品是否容易處理用戶的問題，來發(fā)現(xiàn)用戶對產(chǎn)品最真實的評價和用戶的痛點，從而解決用戶關(guān)注的問題以提升用戶忠誠度。

4.對整體平臺進行調(diào)研

對平臺進行分析后總結(jié)出我們的平臺更適合于用費力度進行度量，得到的結(jié)果如下

費力度度量：了解現(xiàn)階段平臺體驗費力度情況，為提升搭建效率10%做基準線輔助定位。

體驗緯度認同度度量：了解現(xiàn)階段平臺操作效率、容易上手、界面美觀、系統(tǒng)穩(wěn)定、功能全面五個維度的認同。

過程中發(fā)現(xiàn)平臺整體

產(chǎn)品服務(wù)路徑和體驗非常費力，系統(tǒng)穩(wěn)定度低

。

拆分操作效率、容易上手、界面美觀、系統(tǒng)穩(wěn)定、功能全面五個維度，結(jié)果認同度均低。?最低的為系統(tǒng)穩(wěn)定度，最高的是界面美觀度。

我們的主要競品產(chǎn)品是宜搭、輕流、明道云、簡道云。

宜搭

：是阿里巴巴自主研發(fā)的低代碼應用開發(fā)平臺，基于阿里云的基礎(chǔ)設(shè)施和釘釘?shù)钠髽I(yè)數(shù)字化操作系統(tǒng)。具有高度靈活性和適應性，支持多種應用場景和業(yè)務(wù)模式，提供豐富組件和模板，能快速構(gòu)建高質(zhì)量、可靠的應用。例如，在企業(yè)級通信、項目管理、客戶關(guān)系管理等方面表現(xiàn)出色。它還具備出色的可擴展性和易維護性，可與阿里云其他產(chǎn)品無縫集成，實現(xiàn)數(shù)據(jù)共享和協(xié)同辦公，同時支持自定義業(yè)務(wù)流程和數(shù)據(jù)字段。

輕流

：是一個無代碼系統(tǒng)搭建平臺，能幫助用戶輕松搭建各種場景應用，如進銷存、客戶管理、OA 協(xié)同辦公、項目管理等。其特點是操作界面簡潔，通過拖拽添加字段、設(shè)置業(yè)務(wù)流、分配權(quán)限等簡單操作即可讓業(yè)務(wù)數(shù)據(jù)規(guī)范嚴謹?shù)亓鬓D(zhuǎn)。它還支持自定義門戶打造業(yè)務(wù)樞紐，實現(xiàn)不同業(yè)務(wù)場景，并且有多種視圖類型，讓業(yè)務(wù)人員以自己的方式高效工作，能夠滿足絕大多數(shù)企業(yè)信息化建設(shè)的需求。

明道云

：可零代碼構(gòu)建各種企業(yè)中后臺應用，功能較為強大和靈活，例如在數(shù)據(jù)處理和分析方面有一定優(yōu)勢，支持復雜的業(yè)務(wù)邏輯搭建和數(shù)據(jù)整合。它提供了豐富的接口和集成能力，方便與其他系統(tǒng)進行對接和擴展。其應用場景廣泛，涵蓋了項目管理、業(yè)務(wù)流程管理、數(shù)據(jù)分析等多個領(lǐng)域3。

簡道云

：是一個零代碼應用搭建平臺，以表單為核心，擅長數(shù)據(jù)的收集、整理和分析。用戶可以通過拖拉拽的方式輕松創(chuàng)建個性化的表單，實現(xiàn)信息收集管理。在流程自動化方面表現(xiàn)突出，可視化調(diào)整業(yè)務(wù)流程，讓業(yè)務(wù)處理有條不紊。同時具備領(lǐng)先的報表能力，支持多表數(shù)據(jù)連接、權(quán)限管理、異常報警等，能幫助用戶進行高效決策，數(shù)據(jù)全打通，可消滅數(shù)據(jù)孤島

我們對其視覺層的形、色、質(zhì)、構(gòu)，與體驗層均做了詳細的競品分析

調(diào)研完成后進行視覺側(cè)梳理優(yōu)化點：基于用戶原聲/競品分析/體驗走查緯度等維度梳理優(yōu)化點，進行設(shè)計優(yōu)化。

基于優(yōu)化點對產(chǎn)品進行優(yōu)化升級，優(yōu)化了組織架構(gòu)，原來我們的架構(gòu)是單租戶，無法支持SaaS版本多租戶需求；無法支持多應用業(yè)務(wù)邏輯和數(shù)據(jù)表復用，僅通過連接器、硬編碼方式聯(lián)通；模版功能不完整，無法支持多應用綜合解決方案的模版新建功能。通過用戶調(diào)研發(fā)現(xiàn)用戶的痛點，單租戶形式影響了用戶的操作效率與資源的隔離。

優(yōu)化后將租戶內(nèi)加入項目作為資源隔離，行業(yè)或服務(wù)商可以在一個租戶下管理交付給不同用戶的項目，針對項目進行復制和授權(quán)；可以解決多個應用間的數(shù)據(jù)共享問題；開發(fā)者與用戶賬號權(quán)限分離，權(quán)限定位更加清晰減少安全風險。

對網(wǎng)頁柵格系統(tǒng)進行了規(guī)則劃分，確保頁面元素的對齊、平衡和一致性，主要基于的維度是：

提高設(shè)計效率：設(shè)計師可以依據(jù)柵格系統(tǒng)快速確定頁面元素的位置和大小，無需反復嘗試和調(diào)整，從而節(jié)省設(shè)計時間。
增強頁面一致性：通過柵格系統(tǒng)，不同頁面的布局可以保持統(tǒng)一的風格和結(jié)構(gòu)，提升整個網(wǎng)站的視覺一致性。
改善用戶體驗：合理的柵格布局使頁面更加清晰、易讀，用戶可以更輕松地瀏覽和獲取信息。

我們的左側(cè)導航比常規(guī)的更加短一些，方便用戶在右側(cè)更好的操作和篩選。同時新增了展開和收起的功能，給予用戶更大的操作空間。

基于顏色和情緒的關(guān)系，圍著功能屬性和特點給予了不同的顏色選擇。

藍色通常被認為是穩(wěn)定、可靠和專業(yè)的顏色。因此，對于一些科技產(chǎn)品或金融服務(wù)，藍色可能是一個合適的選擇，因為它傳達了產(chǎn)品的可靠性和安全性。

紅色則是充滿活力、激情和力量的顏色。對于一些運動品牌或能量飲料，紅色可能是一個理想的選擇，因為它傳達了產(chǎn)品的活力和能量。

綠色通常與自然、健康和環(huán)保相關(guān)。對于一些食品、保健品或環(huán)保產(chǎn)品，綠色可能是一個合適的選擇，因為它傳達了產(chǎn)品的健康和環(huán)保特點。

最后，完成了包括多租戶與資源隔離、業(yè)務(wù)邏輯編排、角色權(quán)限能功能設(shè)計。

構(gòu)建簡潔、直觀、高效且具有吸引力的用戶界面，確保用戶能夠輕松、愉悅地完成各項操作，從而提升產(chǎn)品的整體用戶滿意度和忠誠度，為產(chǎn)品的成功奠定堅實的基礎(chǔ)。謝謝。

作者：小雞小小小小雞
鏈接：https://www.zcool.com.cn/article/ZMTYzMzU2MA==.html
來源：站酷

評論(0) 瀏覽(347)

052024-9

深入探究B端產(chǎn)品設(shè)計的核心

ui設(shè)計分享達人

一、B端用戶需求的深入理解和分析

在當今高度信息化的商業(yè)環(huán)境中，B端產(chǎn)品已成為企業(yè)高效運營和持續(xù)發(fā)展的關(guān)鍵支撐。

這些產(chǎn)品不僅提供工具和服務(wù)，更是企業(yè)優(yōu)化流程、提升工作效率和競爭力的有力武器。然而，要打造一款成功的B端產(chǎn)品，關(guān)鍵在于對

B端用戶需求的深入理解與分析。

B端用戶，

如企業(yè)決策者、團隊管理者和專業(yè)人員以及普通員工，他們在日常工作中處理復雜的業(yè)務(wù)流程，對數(shù)據(jù)分析、系統(tǒng)整合、安全性等方面有著極高的要求。

這些用戶的獨特需求不僅體現(xiàn)在產(chǎn)品的基本功能上，更涉及到產(chǎn)品的易用性、可擴展性以及服務(wù)支持等多個層面。

需求分析是產(chǎn)品設(shè)計的核心環(huán)節(jié)，它要求設(shè)計師深入探究用戶的需求、痛點和期望，從而確保產(chǎn)品能夠滿足用戶的實際需求。對于B端用戶而言，需求分析的重要性更為突出。這是因為B端產(chǎn)品往往需要解決企業(yè)運營中的具體問題，其設(shè)計必須緊密圍繞用戶的需求展開，以確保產(chǎn)品的實用性和高效性。

在需求分析的過程中，我們需要關(guān)注以下幾個方面：

首先，

功能性需求

是B端用戶最為關(guān)注的一點。他們需要產(chǎn)品具備強大的數(shù)據(jù)處理能力、靈活的業(yè)務(wù)流程管理功能以及全面的安全防護措施。這些功能性的需求是確保B端產(chǎn)品能夠滿足企業(yè)日常運營需要的基礎(chǔ)。

其次，

易用性需求

同樣不容忽視。盡管B端產(chǎn)品往往面向具備一定專業(yè)素養(yǎng)的用戶，但簡潔直觀的界面設(shè)計、流暢的操作體驗以及可定制的用戶界面仍然是提升用戶滿意度的關(guān)鍵。通過優(yōu)化用戶交互流程、減少冗余信息，我們可以幫助用戶更高效地完成工作任務(wù)。

此外，

整合與擴展性需求

也是B端用戶關(guān)注的重點。企業(yè)需要產(chǎn)品能夠與其他系統(tǒng)無縫對接，實現(xiàn)數(shù)據(jù)共享和業(yè)務(wù)協(xié)同。同時，隨著企業(yè)業(yè)務(wù)的發(fā)展，產(chǎn)品還需要具備良好的擴展性，以支持新功能的快速添加和部署。

最后，

服務(wù)與支持需求

同樣重要。B端用戶期望獲得專業(yè)的客戶支持、完善的培訓機制以及豐富的資源文檔，以確保產(chǎn)品的穩(wěn)定運行和持續(xù)優(yōu)化。

綜上所述，深入理解B端用戶的獨特需求是打造成功B端產(chǎn)品的關(guān)鍵。通過全面的需求分析，我們可以確保產(chǎn)品不僅滿足用戶的基本功能需求，更在易用性、整合擴展性和服務(wù)支持等方面提供卓越的體驗。這將有助于提升企業(yè)的運營效率，進而推動其在激烈的市場競爭中脫穎而出。

二、B端用戶的獨特需求

B端用戶，即企業(yè)級用戶，他們的需求與C端個人用戶有著顯著的差異。

這些差異主要體現(xiàn)在以下幾個方面：

業(yè)務(wù)強驅(qū)動性：

B端產(chǎn)品的主要需求來源于業(yè)務(wù)方，由業(yè)務(wù)驅(qū)動并主導。

這是因為B端產(chǎn)品主要是為了解決組織內(nèi)某個或某一類具體業(yè)務(wù)領(lǐng)域的問題。業(yè)務(wù)方通常離業(yè)務(wù)最近，也最了解使用用戶的需求，因此他們在產(chǎn)品需求上擁有較大的話語權(quán)。

用戶群體差異大：

不同于C端用戶需求的大同小異，B端用戶群體的需求差異巨大。

這些差異主要體現(xiàn)在角色差異、組織差異、管理層級差異、用戶深度差異、客戶規(guī)模差異、客戶行業(yè)差異以及客戶性質(zhì)差異等。這種多樣性要求B端產(chǎn)品在設(shè)計時需要考慮更多的變量和定制化需求。

高效性與便捷性

：

企業(yè)級用戶非常重視工作效率和操作流程的簡化。

他們希望產(chǎn)品能夠提供高效的功能和簡潔的操作界面，以減少工作中的繁瑣步驟和時間成本。因此，B端產(chǎn)品設(shè)計需要注重提升用戶的工作效率，提供便捷的操作體驗。

安全性與穩(wěn)定性：

對于企業(yè)級用戶來說，數(shù)據(jù)安全和系統(tǒng)穩(wěn)定是至關(guān)重要的。

他們需要一個可靠且安全的平臺來處理和存儲敏感的業(yè)務(wù)數(shù)據(jù)。B端產(chǎn)品必須能夠提供強大的安全防護措施和穩(wěn)定的系統(tǒng)性能，以確保企業(yè)業(yè)務(wù)的正常運行和數(shù)據(jù)的安全。

定制化與靈活性：

每個企業(yè)的業(yè)務(wù)流程和需求都是獨特的，因此B端用戶希望產(chǎn)品能夠根據(jù)自身的實際情況進行定制。

他們需要一個靈活可配置的產(chǎn)品解決方案，以滿足企業(yè)特定的業(yè)務(wù)需求和工作流程。

集成性與兼容性：

在企業(yè)級應用中，B端產(chǎn)品往往需要與其他系統(tǒng)或軟件進行集成，以實現(xiàn)數(shù)據(jù)的共享和流程的協(xié)同。

因此，產(chǎn)品的集成性和兼容性是企業(yè)用戶非常關(guān)注的一個方面。B端產(chǎn)品設(shè)計需要考慮到與現(xiàn)有系統(tǒng)的無縫對接和數(shù)據(jù)交換的便捷性。

綜上所述，B端用戶的獨特需求主要體現(xiàn)在業(yè)務(wù)的強驅(qū)動性、用戶群體的大差異性、對高效便捷的追求、對安全穩(wěn)定的重視、對定制化和靈活性的需求以及對集成性和兼容性的關(guān)注等方面。這些需求特點要求B端產(chǎn)品在設(shè)計時必須充分考慮企業(yè)級用戶的實際需求和業(yè)務(wù)場景，以提供符合用戶期望的優(yōu)質(zhì)產(chǎn)品解決方案。

三、

B端產(chǎn)品設(shè)計的核心原則

B端產(chǎn)品設(shè)計需要遵循一系列核心原則，以確保產(chǎn)品能夠滿足企業(yè)級用戶的獨特需求。

3.1 用戶中心設(shè)計

深入理解目標用戶：

在設(shè)計B端產(chǎn)品時，必須首先了解目標用戶，包括他們的工作流程、需求痛點以及行為習慣。這需要通過深入的用戶研究和調(diào)查來實現(xiàn)，以便更好地設(shè)計適合用戶的產(chǎn)品。

符合用戶期望：

產(chǎn)品的設(shè)計應以用戶為中心，確保功能、界面和操作都符合用戶的期望和習慣。這有助于提高用戶滿意度和使用效率。

3.2 簡潔直觀的界面

簡約性：

B端產(chǎn)品的交互界面應該簡潔明了，避免過多的復雜功能和視覺元素。這樣用戶可以更輕松地理解和使用產(chǎn)品。

直觀性：

界面設(shè)計應直觀易懂，減少用戶的學習成本。通過明確的導航和標識，幫助用戶快速找到所需功能。

3.3 強大的功能支持

滿足業(yè)務(wù)需求：

B端產(chǎn)品需要提供豐富的功能，以滿足企業(yè)復雜的業(yè)務(wù)需求。這些功能應涵蓋用戶在工作流程中的各個環(huán)節(jié)，確保用戶能夠順利完成工作任務(wù)。

靈活配置：

產(chǎn)品功能應具備高度的可配置性，以便用戶根據(jù)自身需求進行靈活調(diào)整。這有助于提升產(chǎn)品的適用性和用戶體驗。

3.4 高度可配置性

定制化體驗：

B端產(chǎn)品應允許用戶根據(jù)自身需求靈活配置產(chǎn)品功能和界面。這包括調(diào)整功能模塊、設(shè)置權(quán)限、定制報表等，以滿足不同用戶的個性化需求。

易于管理：

產(chǎn)品應提供便捷的管理工具，使用戶能夠輕松地對產(chǎn)品進行配置和管理。這有助于降低用戶的操作難度和提升工作效率。

3.5 數(shù)據(jù)驅(qū)動決策

數(shù)據(jù)分析：

B端產(chǎn)品應具備強大的數(shù)據(jù)分析功能，幫助用戶深入挖掘業(yè)務(wù)數(shù)據(jù)中的價值。通過對數(shù)據(jù)的分析，用戶可以更好地了解業(yè)務(wù)狀況、發(fā)現(xiàn)問題并制定相應的解決方案。

決策支持：

產(chǎn)品應提供可視化的數(shù)據(jù)報表和分析工具，為用戶提供決策支持。這有助于用戶做出更明智的決策，推動企業(yè)的發(fā)展和創(chuàng)新。

綜上所述，B端產(chǎn)品設(shè)計的核心原則包括用戶中心設(shè)計、簡潔直觀的界面、強大的功能支持、高度可配置性以及數(shù)據(jù)驅(qū)動決策。遵循這些原則有助于設(shè)計出符合企業(yè)級用戶需求的優(yōu)質(zhì)B端產(chǎn)品。

四、B端產(chǎn)品設(shè)計流程

B端產(chǎn)品設(shè)計流程是一個系統(tǒng)性、結(jié)構(gòu)化的過程，旨在確保產(chǎn)品能夠滿足企業(yè)級用戶的實際需求和業(yè)務(wù)場景。

4.1 市場調(diào)研與用戶研究

市場調(diào)研：

了解行業(yè)趨勢、市場規(guī)模、主要競爭對手以及潛在的市場機會，為產(chǎn)品定位和設(shè)計提供市場層面的輸入。

用戶研究：

通過深入訪談、問卷調(diào)查、用戶觀察等方式，收集目標用戶的需求、痛點、工作流程等信息。這些信息對于理解用戶行為和期望至關(guān)重要。

4.2 需求調(diào)研和分析

需求收集：

從用戶、業(yè)務(wù)方、利益相關(guān)者等多渠道收集需求。

需求分析：

對收集到的需求進行深入分析，理解需求的本質(zhì)和背后的業(yè)務(wù)邏輯。

需求篩選與排序：

基于業(yè)務(wù)價值、用戶價值、實現(xiàn)成本等因素，對需求進行篩選和優(yōu)先級排序。

4.3 產(chǎn)品規(guī)劃與設(shè)計

產(chǎn)品規(guī)劃：

根據(jù)市場調(diào)研和用戶研究結(jié)果，制定產(chǎn)品的發(fā)展規(guī)劃和路線圖。

功能設(shè)計：

明確產(chǎn)品的核心功能和特點，確保產(chǎn)品能夠滿足用戶的實際需求。

信息架構(gòu)設(shè)計：

對產(chǎn)品的內(nèi)容和功能進行分類和組織，確定產(chǎn)品的核心功能和信息架構(gòu)，使用戶更容易找到和使用相關(guān)功能。

4.4 原型設(shè)計與UI設(shè)計

原型設(shè)計：

制作產(chǎn)品原型，展示產(chǎn)品的基本結(jié)構(gòu)和交互流程，幫助團隊更好地理解產(chǎn)品設(shè)計。

UI設(shè)計：

根據(jù)產(chǎn)品原型和業(yè)務(wù)需求，進行用戶界面設(shè)計，確保界面簡潔、美觀且易于使用。

4.5 用戶測試與反饋

用戶測試：

邀請目標用戶對產(chǎn)品原型或初步實現(xiàn)的產(chǎn)品進行測試，觀察用戶的使用行為和反饋。

反饋收集與分析：

收集用戶的反饋意見，對反饋進行深入分析，找出產(chǎn)品的問題和改進點。

4.6 產(chǎn)品開發(fā)與迭代

產(chǎn)品開發(fā)：

基于產(chǎn)品設(shè)計文檔和原型，進行產(chǎn)品的實際開發(fā)工作。

測試與修復：

對開發(fā)完成的產(chǎn)品進行詳細的測試，確保產(chǎn)品質(zhì)量和穩(wěn)定性。針對測試中發(fā)現(xiàn)的問題進行及時修復。

產(chǎn)品迭代：

根據(jù)用戶反饋和市場變化，持續(xù)對產(chǎn)品進行迭代和優(yōu)化，以滿足用戶不斷變化的需求。

4.7 上線與運維

產(chǎn)品上線：

經(jīng)過充分的測試和驗證后，將產(chǎn)品正式上線，供用戶使用。

運維與監(jiān)控：

持續(xù)監(jiān)控產(chǎn)品的運行狀況，及時發(fā)現(xiàn)并解決潛在的問題。同時，為用戶提供必要的技術(shù)支持和服務(wù)。

整個B端產(chǎn)品設(shè)計流程需要跨部門的緊密協(xié)作和持續(xù)的用戶參與。通過不斷優(yōu)化和完善設(shè)計流程，可以確保B端產(chǎn)品更加貼近用戶需求，提升用戶體驗和業(yè)務(wù)效率。

五、結(jié)論

B端產(chǎn)品設(shè)計流程是一個復雜而精細的過程，它涉及到從市場調(diào)研、用戶研究到產(chǎn)品開發(fā)、迭代和運維的多個環(huán)節(jié)。在這個過程中，始終以用戶需求為中心，通過深入的市場和用戶研究來確保產(chǎn)品的定位準確性，再通過原型設(shè)計、用戶測試等環(huán)節(jié)不斷優(yōu)化產(chǎn)品設(shè)計，最終開發(fā)出滿足用戶需求、穩(wěn)定且高效的B端產(chǎn)品。

通過遵循這一流程，

企業(yè)能夠更有效地理解目標市場和用戶的真實需求，設(shè)計出更符合用戶使用習慣和業(yè)務(wù)流程的產(chǎn)品。這不僅可以提升用戶的工作效率和滿意度，還可以增強企業(yè)的市場競爭力，實現(xiàn)商業(yè)價值的最大化。

B端產(chǎn)品設(shè)計流程是確保產(chǎn)品質(zhì)量和滿足用戶需求的關(guān)鍵，它需要多部門的協(xié)同合作和持續(xù)的用戶參與，以打造出優(yōu)秀的B端產(chǎn)品。

作者：張陽光Designer
鏈接：https://www.zcool.com.cn/article/ZMTYyMTczNg==.html
來源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。

評論(0) 瀏覽(277)

052024-8

B端數(shù)據(jù)可視化設(shè)計經(jīng)驗分享第三彈：表單設(shè)計（下）

資深UI設(shè)計者

表單作為B端產(chǎn)品重要的信息載體，有著舉足輕重的作用，通過設(shè)計的手段來提高表單的易用性不僅能夠改善用戶體驗，降低錯誤率，提高填寫效率，還能增加用戶參與度和完成率，同時對企業(yè)或組織而言提高效率和減少成本。

評論(0) 瀏覽(691)

052024-8

B端數(shù)據(jù)可視化設(shè)計經(jīng)驗分享第二彈：表單設(shè)計（上）

資深UI設(shè)計者

在電腦不普及的時代，企業(yè)或者機構(gòu)在收集用戶信息時，通常采用紙質(zhì)單據(jù)讓用戶填寫，而這個單據(jù)，就是最原始的表單。我們常說B端產(chǎn)品其實就是把線下已經(jīng)存在的流程搬到線上，有利于擴大市場和提高使用效率和管理效率。而B端表單，其實就是把原先需要線下手工填寫的表單映射到線上，并使其錄入符合線上設(shè)備（如手機、電腦）的使用習慣。

評論(0) 瀏覽(759)

« 1 2 3 4 5 6 7 ... 62 »

日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://bouu.cn

首頁

分類

日歷

鏈接

個人資料

存檔