數據分析與趨勢圖?編輯導語：受大環境影響，生活方式也随之改變，很多需求場景也從線下轉到線上本文作者分析了B端視覺趨勢的相關内容，從3D、數據可視化、極光漸變、情感化設計、微動效等方面的内容展開分析，感興趣的一起來看一下，希望對你有幫助，下面我們就來聊聊關于數據分析與趨勢圖?接下來我們就一起去了解一下吧!

數據分析與趨勢圖

編輯導語：受大環境影響，生活方式也随之改變，很多需求場景也從線下轉到線上。本文作者分析了B端視覺趨勢的相關内容，從3D、數據可視化、極光漸變、情感化設計、微動效等方面的内容展開分析，感興趣的一起來看一下，希望對你有幫助。

近年來疫情肆虐全球，出行不便及“無接觸”生活方式一定程度上影響了我們的習慣，劉畊宏引發的線上“全民健身”潮爆紅可見一斑，B端企業的很多需求場景也逐步從線下轉到線上，封鎖與隔離使得我們在數字世界的時間變得更長了。

基于過去一年團隊小夥伴日常工作的經驗，我們對B端産品設計風格做了探索與分析，本文是我們總結的關于B端産品的設計風格走勢。

希望通過這次總結能更好地和設計師朋友們一起學習成長，同時希望能讓B端的項目組成員更好地認知到B端産品的趨勢，在方向和目标上達成一緻共識。

傳統單一的2D設計是否已經給你造成審美疲勞了？

3D化的視覺風格雖早已到來，但在B端市場上的表現依舊十分克制。

近年來，硬件設備的升級為3D設計提供了堅實的後盾，5G的普及也讓3D設計效果更輕而易舉地融入生活。

特點：

立體真實：與2D 相比，3D化圖形能夠表現更為逼真的立體效果。

形态豐富：3D可以表現更豐富、更複雜的形态，展示更多細節，也可以實現一定互動性。

從以上兩點來說，3D的表現更接近我們的感知，更具有視覺沖擊力。

在B端金融産品設計中，3D元素可用于Web端首頁、App端引導頁等需要體現較強視覺沖擊力的地方，以提升頁面的高級感。

3D化的圖标在工作台、運營工具箱等頁面中也大放異彩。另外，可視化大屏的設計也在往3D方向延展。

在項目中，我們把3D動畫應用在App引導頁中，突破了傳統金融B端産品的視覺風格，給用戶帶來視覺沖擊，同時讓用戶更加聚焦産品的賣點。

未來，運營落地頁、運營彈窗等場景也會廣泛地應用3D元素。從協同工作、提高效率及統一設計步伐的角度出發，建立3D組件庫也是我們必須且重要的任務之一。

處理數據一直以來都是B端産品的核心任務，在這個内卷越來越嚴重的年代，數據可視化的任務變得愈發艱巨。

原始數據是抽象的、複雜的、枯燥的、專業的、不直觀的，那怎麼樣能夠讓用戶快速獲取關鍵數據以做下一步決策呢？

數據的可視化的設計可以讓用戶聚焦于關鍵信息，改善用戶的工作效率，從而改變企業的運作效率。

基于數據可視化的需求來看，其優勢是顯而易見的，可降低用戶在産品使用中的三大成本：

降低識别成本：圖形圖像化的視覺語言可以使人本能地放下對數據的心理壓力，讓用戶更為輕松的理解。

降低分析成本：數據與數據之間的關聯通過直觀的圖形表達，可降低分析其潛在關系的難度。

降低溝通成本：圖解方式所承載的信息更為豐富，形式更深入人心，在人與人之間溝通中的認同感也更高。

(素材來自網絡)

在B端金融産品設計中，數據可視化多見于PC 後台的數據概覽、數據可視化大屏、後台實時監控、移動端後台統計等。

未來在項目中，我們也計劃在理财産品介紹、資産視圖等場景中進行數據可視化探索與運用。

在滿足了B端産品設計底層需求的前提下，作為用戶你是否希望在使用産品時的感官體驗進一步提升呢？

無論對于設計師還是用戶而言，我們都希望産品既能保持功能層級的有序性，也能在視覺層面上加強通透性和質感。

因此，過于強烈的漸變不再是趨勢，低調溫和、清新愉悅的視覺風格逐漸流行。考慮到B端用戶恰巧也需要這樣輕松、溫和的視覺環境，“極光漸變”就再适合不過了。

特點：

通透清新：輕量漸變多會選擇明度高、飽和度低的鄰近色，因此能很好地表達“呼吸感”。

輕量柔和：極光漸變與微漸變是同根同源的，其特點為漸變色彩鄰近，幅度輕柔，融合感和細膩感較強。

豐富層次：相比純色，極光風格的柔和漸變背景在層次塑造上更有優勢。

(素材來自網絡)

在B端金融産品設計中，主要應用于移動端的頁面或卡片背景強化，如導航欄、個人中心、彈窗、搜索框、标簽等；也可以運用在部分按鈕和質感類圖标設計中，豐富頁面元素的色彩、強化光影變化。

在你的印象中，傳統 B 端産品是不是比較枯燥、呆闆呢？

原研哉曾提過一個理念：讓感官被重新發現。“設計師先不要急着畫草圖，而是先想想使用者的感受”。

其實，B端産品也在慢慢改變，使用B端産品的你也是一個富有感情的“人”，因此B端産品的設計不僅要理解用戶的使用習慣，更要考慮用戶的情緒感受和體驗。

有效的情感化設計有以下特點：

正向激勵：維持用戶的期待感、強化信任和愉悅感、提升驚喜和自豪感。

緩解負面：減少疑惑和焦慮、緩和用戶在使用過程中的受挫感。

有效引導：好的情感化設計，可以有效引導用戶的行為，讓用戶少走彎路。

在B端金融産品設計中，情感化設計可以體現在IP吉祥物在頁面中的應用，如報錯、缺省頁中的輕松趣味性插圖，并結合富有人情味的文案增添溫度調節氛圍；平安數字口袋App已廣泛使用IP形象數小寶以強化産品的親和力，在缺省頁、流程引導中加入更多的情感化設計。

另外，輕量的社交如為團隊成員送上生日祝福、感謝信、互相添加成員印象等也是情感化設計的表達方式。

在用戶體驗設計中微交互變得日益重要，而絲滑的動效設計正是微交互的靈魂所在，即使隻是微小的視覺提示或反饋，都是讓産品易于使用的關鍵。

在枯燥繁雜的B端頁面中，微動效已成為“頁面氛圍組”的實力擔當。

在頁面中，微動效從三個層面發揮影響力：

提高連貫性：讓界面元素在業務流程中順暢地轉變與過渡，将用戶操作導向期望的任務結果，指導其進行複雜的操作。

連接場景：在轉換場景的過程中扮演潤滑劑的角色，闡明場景之間的位置、層級與空間的關系。

視覺吸引：聚焦用戶視線，将其注意力放在重要的事情上，從而起到信息傳達、提升識别度的作用，也帶給使用者感觀的享受。

在B端金融産品設計中，微動效适用于點擊反饋、加載等待、導航欄交互、重要功能入口、頁面背景氛圍營造等等。

當前在實際項目中微動效主要運用于頁面或組件加載等待、第三方過渡跳轉等場景，而頁面轉場等細節處則運用較少，後期會從這些細節方面入手使産品整體流暢度更高。

伴随着5G技術的全面普及、短視頻快速興起，用戶内容消費呈碎片化、多元化，因此視頻化的内容逐漸被用戶所喜愛。

特點：

感受直觀：與圖文形式相比，視頻化類容感受會更直觀、更易于理解。

易于閱讀：從展現形式來說，視頻比起文字和圖片更具先天優勢，視頻化的内容會更易于用戶閱讀和記憶。

在B端金融産品設計中，除了幫助用戶的操作手冊可以做成視頻，一些功能指引或介紹也可以做成短視頻形式，首次進入App端的引導頁可做成炫酷的視頻自動播放以代替靜态頁面，另外營銷類的H5也可以穿插一些視頻。

當前在Web端項目中新手指南已實現全部視頻化展示，App端也都已經通過視頻的展示方式來介紹貸款、理财、票據産品，未來将會應用到更多場景中。

每年的設計趨勢似乎總有相似的地方，2022年則是在滿足B端用戶的美學需求的前提，更側重内容和情感表達，并随不同設備載體、新的技術而變化，為用戶提供最大程度的豐富體驗。

B端産品在使用體驗和視覺感受這兩個方面和C端産品接近，也就是我們最近經常提到的“B端C化”的概念。

不過從設計師視角來看，不管是B端還是C端的設計趨勢，最終目的都是為了解決業務場景中遇到的問題，使用對象都是人，都應該站在“人性”的角度考慮問題。

同時設計趨勢一直處于快速變化中，随着時間的推移，未來還将迎來更多新技術。

作為設計師的我們，不管哪種趨勢受歡迎，最重要的是要找準自己熱衷和擅長的方向，學習并合理地運用到工作中，以産生最大的設計價值。

作者：WOWdesign，研究設計價值最大化，涉及用戶體驗、品牌體驗、空間體驗。

本文由 @WOWdesign 原創發布于人人都是産品經理。未經許可，禁止轉載。

題圖來自Unsplash，基于 CC0 協議。

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!