<em id="09ttv"></em>
    <sup id="09ttv"><pre id="09ttv"></pre></sup>
    <dd id="09ttv"></dd>

        • 首頁

          2025 B端設計趨勢之動效

          杰睿

          在數字化時代,B端產品的用戶體驗設計正變得愈發重要。動效設計作為提升交互體驗和效率的關鍵手段,正在成為B端設計中不可或缺的一部分。本文將深入探討2025年B端設計中動效的趨勢,從動效的歷史演變、物理世界中的靈感汲取,到釘釘設計系統中的實踐應用,幫助我們理解動效如何從簡單的視覺裝飾轉變為提升產品效率和用戶體驗的核心工具。

          回溯互聯網的發展進程,從桌面端的撥號上網,到5G移動互聯網,再至人工智能的助力,科技領域正在經歷著翻天覆地的變革。

          未來的數字世界,在沉浸感、參與度、個性化等維度對體驗會提出更進階的要求;與此同時,B端企業對于高效、簡便、用戶友好的界面需求與日俱增。

          在2025年的當下,B端設計師唯有持續學習,適應新技術與新趨勢,緊密圍繞客戶的業務價值展開設計,進一步注重實用性、包容性以及可定制化,方可為企業客戶塑造出卓越的產品與服務。

          因此,我們結合釘釘近10年的B端產品設計經驗,鑒于未來B端設計趨勢將展現出多元化、智能化和人性化的特質,從B端產品個性化、風格與質感、界面版式、品牌物料、圖標、動態交互等多維度設計展開深度研究,與大家一道探討B端設計的本質和趨勢,期望在真正駕馭B端產品設計的這條道路上,帶來些許有益的啟迪。對交互等多維度設計展開深度研究,與大家一道探討B端設計的本質和趨勢,期望在真正駕馭B端產品設計的這條道路上,帶來些許有益的啟迪。

          今天要和大家聊聊 B 端產品的動效設計趨勢。我們將回顧動效的發展軌跡,從歷史演變到設計哲學,探索如何從物理世界汲取靈感,并分享釘釘在動效設計中的思考與實踐。

          一、回顧動效設計的演變歷程

          動效設計在互聯網的發展歷程中經歷了多次變革。從最初簡單的過渡動畫,到如今復雜而精細的交互體驗,動效的演進不僅是技術發展的產物,也映射了用戶體驗設計理念的不斷深化。

          1990s-2000s:簡單的進度展示

          在互聯網的早期,受限于帶寬和硬件性能,動效的應用較為基礎,主要用于加載進度條和頁面過渡,核心目的是向用戶提供反饋,減少操作過程中的不確定性。典型案例是 Windows 98 時代的加載進度條和網頁上的緩沖動畫。這些動效雖然簡單,卻在當時發揮了重要作用——幫助用戶理解系統狀態,降低等待焦慮。

          2005-2012:Flash 技術引領網頁動畫

          進入 2000 年代中期,Flash 技術的普及讓網頁動畫迎來了黃金時代。Flash 賦予了設計師更大的自由度,使得網頁可以呈現更豐富的動態效果,動效不再局限于狀態反饋,而開始深度參與交互體驗。這一時期,動效的作用從提示系統狀態進化為增強用戶沉浸感,例如按鈕懸停時的動態反饋,炫酷的頁面切換過渡,以及交互式動畫(如鼠標跟隨效果、小游戲動畫等)。

          不過,Flash 的動效過度依賴插件,影響性能,并且在移動端難以兼容。2010 年代,隨著 HTML5 和 CSS3 的發展,Flash 逐漸被取代,動效設計進入新階段。

          2012-至今:物理規律的引入與美學平衡

          隨著移動互聯網興起,尤其是 Material Design,iOS,以及 Fluent Design 等動效規范的推出,動效設計進入了全新的階段。這個階段的核心理念是基于物理規律的自然動效,強調動效不僅僅是裝飾,而是信息層級傳遞、引導用戶操作的重要工具。

          Material Design:強調物理隱喻與流暢性

          • 點擊按鈕時的波紋擴散,讓操作反饋更自然
          • 元素的加速、減速運動,使界面更富有生命感
          • 卡片式界面層級動畫,通過漸變、位移等方式構建層級感,使導航更加清晰

          Fluent Design:深度融合光影與層次感

          • 通過陰影和模糊等方式,增強界面的深度和透視層次
          • 交互時光效隨用戶操作產生微妙變化,提升體驗的直覺性
          • 內容隨焦點流動,利用動效引導用戶注意力,使信息呈現更具邏輯性

          由此可見,動效不再只是視覺上的炫技,而是成為提升可用性、降低認知負荷的重要工具。合理的動效可以提升用戶的操作流暢度,讓界面變得更自然、更具生命力。

          二、從物理世界中捕捉動效的美感

          在自然界里,每一次風吹樹葉的擺動、每一滴水滴入湖面的擴散,都遵循著物理規律,展現出流暢且和諧的運動軌跡。這些自然現象不僅帶來視覺上的愉悅,也蘊含著深層次的運動邏輯,為數字動效設計提供了源源不斷的靈感。動效的流暢性、節奏感、反饋感,本質上都是對物理世界美學的映射。

          例如,波紋擴散是我們常見的自然現象。當一顆石子落入湖面,波紋自中心向外擴散,起初迅速,隨后逐漸放緩,最終消失。這個過程中的漸進減速特性為數字動效設計提供了極佳的靈感。在數字界面中,我們可以通過緩慢擴散的動畫來模擬水面波紋的效果,形成一種溫和的反饋感。

          再比如,現實世界中的物體在運動時通常會表現出加速與減速的特性。以地球上的自由落體為例,物體從高空下落時,初始速度較慢,但隨著重力作用,它不斷加速。這種非勻速運動,在動效設計中被轉化為緩動曲線(Easing Curves),使得用戶在界面交互時感受到更加自然的動態變化。

          而彈跳和反彈又是另一個物理世界中常見的運動方式。想象一顆籃球從地面反彈起來,起初速度快,隨后逐漸放緩,最終停止。這種逐漸衰減的回彈,正是彈性動效的靈感來源。在界面交互中,彈性動效可以模擬物體的重量和材質,提升操作的真實感。

          三、釘釘設計系統里的動效哲學

          當牛頓凝視落下的蘋果,他發現了萬有引力的奧秘;而當釘釘的設計團隊觀察一張任務卡片的拖拽軌跡時,我們探尋的是數字世界的運動法則。在物理規律與交互邏輯的交匯處,釘釘的動效設計體系逐漸凝練出一套方法論——讓每個像素的運動既符合自然規律,又服務于生產效率。

          在 B 端產品中,動效遠不止是視覺與交互的簡單結合,更是提升可用性和降低認知成本的關鍵手段。它不僅承擔著引導用戶操作、傳遞信息層級、降低認知負荷的功能,還通過增強操作確定性,幫助用戶更高效地完成任務。換句話說,我們正以理性與直覺,重塑效率美學。

          原則:平衡的藝術

          釘釘的設計框架始終圍繞視覺感官和用戶體驗兩個核心維度展開,追崇理性與感性的精密協作:

          1. 視覺感官:流暢

          • 連貫性:組件狀態的切換應如同翻動書頁般自然,確保界面過渡流暢、節奏統一,讓數字世界保持有序
          • 自然性:模仿現實世界的運動方式,使動效遵循慣性、彈性、摩擦等物理規律,減少割裂感,讓用戶的感知更直覺
          • 不碰撞:就像城市道路的規劃,動效的路徑需經過精心設計,避免界面元素相撞或相互干擾,確保用戶注意力不被分散

          2. 用戶體驗:高效

          • 助交互:在復雜的信息架構中,動效可以作為層級引導,幫助用戶理解界面之間的主次關系
          • 不干擾:平衡產品界面中的動效存在感,避免過度裝飾或喧賓奪主。最理想的動效,是讓用戶幾乎察覺不到它的存在,卻能享受它帶來的流暢體驗
          • 明確性:每一個動效都有其清晰的目的,或是為了引導用戶操作,或是為了強化任務的完成感

          時間梯度:數字節拍器

          企業級應用中,物體的運動時間需要把控得恰到好處。研究表明,人類對 100ms 以下的變化幾乎無感,而超過 1s 的等待則會讓用戶產生不耐煩的情緒。因此,釘釘的動效體系嚴格遵循以下節奏,通過順應人類大腦的認知規律,確保每一次動效都恰到好處,帶來舒適的體驗:

          • 最短動效時長設定為 100ms,并以 100ms 遞增,確保節奏穩定
          • 不同動效的時間設定,取決于物體的大小、路徑長短以及動畫復雜度

          速度:像素的重力場

          現實世界中的物體運動受到重力、摩擦力等因素影響,呈現加速與減速的動態變化。釘釘的動效體系也采用緩動曲線(Easing),以模擬真實世界的運動節奏。當數字界面掙脫線性勻速的機械感,便擁有了令人愉悅的「生命感」。

          空間:界面的立體語法

          在二維屏幕上構建三維認知,需要更精密的「空間修辭學」。釘釘的動效體系確保每一次位移都符合用戶的直覺,并運用空間層次感,讓信息更易理解。

          1. 同級物體

          • 整體運動方向和遞進順序需符合用戶預期
          • 確保物體運動順序符合「左到右、上到下、順時針」的視覺流

          2. 從屬物體

          • 核心物體的動效應更突出,而叢屬元素的動效需弱化或捆綁運動
          • 確保物體的運動軌跡不發生碰撞

          3. 三維空間

          • 物體在 Z 軸上有位移變化時,尺寸應相應調整,以模擬透視效果
          • 近大遠小的視差效果,可增強層次感,提升信息的空間可讀性

          四、無障礙設計思考

          在動效設計中,無障礙性不僅關乎技術標準,更關乎用戶的體驗公平性。一個包容的設計體系,應該讓所有用戶——無論其身體或認知能力如何——都能平等地理解和使用產品。無障礙動效的核心,在于減少干擾、提供替代方案,并賦予用戶選擇權,確保每一次交互都是安全、友好的。

          避免誘發健康問題:高頻閃爍或快速變化的動畫可能誘發光敏性癲癇等健康問題。因此,在設計時,我們應避免超過3次/秒的快速閃爍,并盡可能減少過度刺激性的動效

          提供替代方案:對于依賴屏幕閱讀器的用戶,純視覺動效可能難以感知。我們可以為動效添加文本描述或提供靜態替代方案,確保所有用戶都能理解動效傳達的信息。例如,在釘釘 AI 助理中的加載場景,我們提供「正在為你生成…」的文本標簽,方便屏幕閱讀器用戶理解當前狀態

          五、總結

          動效設計已成為現代數字產品中不可或缺的組成部分。從簡單的過渡動畫到如今富有交互感和情感觸動的設計,動效已經不再是單純的視覺裝飾,而是推動產品發展、提升用戶體驗的關鍵力量。

          真正的好動效,是那種用戶幾乎察覺不到的流暢交互,它能夠讓信息傳遞變得高效、讓操作更加順暢,同時也讓數字產品展現出溫暖的人文氣息。動效,作為產品與用戶之間的一座橋梁,它不僅是界面的點綴,更是效率與體驗的催化劑。

          未來,釘釘將繼續探索動效設計的創新與實踐,通過優化交互體驗、提升產品效率,不斷賦能用戶、創造更美好的數字世界。

          蘭亭妙微(m.sdgs6788.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計,以及相關的軟件開發服務,咨詢電話:01063334945。我們建立了一個微信群,每天分享國內外優秀的設計,有興趣請加入一起學習成長,咨詢及進群請加藍小助微信ben_lanlan

          2025年網頁設計最新趨勢來襲,你準備好了嗎?

          鶴鶴

          你知道嗎?據權威機構統計,如今每秒鐘就有數十個網頁誕生。如何讓自己的網站脫穎而出?了解最新的網頁設計趨勢至關重要。接下來,就讓我們一起盤點2025年網頁設計最新趨勢,相信一定能對你的網站設計有所啟發!
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
           
          一、人工智能輔助設計
          如今數字化飛速發展,網頁數量呈爆炸式增長,用戶對于網頁的審美和功能要求也日益提高,這使得網頁設計的工作量和復雜度不斷攀升。而人工智能的蓬勃發展,為網頁設計帶來了新的變革,逐漸成為設計師們提升效率和創意的得力助手。
          目前,人工智能在網頁設計中的應用已經涵蓋了多個方面,從最初簡單的模板推薦,到如今能夠參與到頁面布局規劃、色彩搭配、元素生成等核心設計環節,并且隨著技術的持續進步,其輔助設計的能力正變得越來越強大、精準和智能。2025 年,人工智能輔助設計將成為網頁設計的一個重要趨勢,設計師將更加依賴人工智能技術來完成網頁設計的各個環節。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
          比如AI原型設計工具小摹AI(
          https://www.mockplus.cn/ai
          ),可以根據用戶描述自動生成可編輯的線框原型,還可以生成圖片、文本、翻譯等內容,大大提升了網頁設計效率!
           
          二、數據可視化設計
          數據可視化網頁設計是指在網頁環境中,運用圖形、圖表、地圖、信息圖等直觀的視覺元素,將復雜的數據信息以一種清晰、易懂且具有吸引力的方式呈現出來,幫助用戶快速理解數據背后的含義、發現規律以及做出決策。
          現在,各行各業都在積累海量的數據,然而單純的數據表格和文本形式往往難以讓人們直觀地把握其核心內容。通過數據可視化網頁設計,能夠把抽象的數據轉化為可視化的圖形語言,跨越不同專業背景和知識層次,讓更廣泛的用戶群體都能輕松解讀數據,這對于企業展示業務成果、分析運營情況、輔助決策制定,以及科研機構分享研究成果等方面都有著極為重要的意義。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
          像網頁設計工具摹客RP(
          https://www.mockplus.cn/rp
          )中,就自帶有大量可擴展的圖表組件,設計師可以使用它快速創建出各種類型的可視化圖表、圖形。同時,摹客RP還支持數據的動態更新和交互操作,讓用戶能夠實時地查看和分析數據。
           
          三、微交互設計
          微交互設計指的是在網頁或應用程序中那些細微卻極具影響力的交互細節,它聚焦于用戶與界面元素之間的小規模互動,比如按鈕的按下效果、頁面滾動時的動畫反饋、表單輸入時的實時提示、菜單展開與收起的動態呈現等。盡管這些交互動作看似微不足道,但它們在提升用戶體驗方面卻起著至關重要的作用。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
          設計師可以使用合適的工具輕松地為網頁中的各種元素添加微交互效果。例如,在摹客RP中可以設置各個畫板的交互方式、按鈕的點擊動畫、頁面的滾動觸發效果等。通過這些微交互設計,能夠讓網頁更加生動和有趣。
           
          四、動態插畫與動畫
          動態插畫和動畫在網頁設計中的應用越來越廣泛,它們不僅可以為網頁增添趣味性和活力,還可以更好地傳達信息和引導用戶。區別于傳統靜態網頁元素,動態插畫與動畫能夠瞬間抓住用戶的注意力,在眾多網頁中脫穎而出。它們以生動鮮活的形象和流暢的動態效果,使用戶在瀏覽網頁時更容易被吸引并停留下來,進而深入了解網頁內容。并且富有創意和情感表達的動態插畫與動畫往往能喚起用戶的情感反應,拉近與用戶之間的距離。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
           
           
          五、響應式設計的新高度
          響應式網頁設計是一種網頁設計理念和技術手段,旨在讓網頁能夠根據不同的設備屏幕尺寸、分辨率、瀏覽器類型以及用戶的操作行為等因素,自動調整和優化網頁的布局、內容展示以及交互功能,從而為用戶提供始終如一的、良好的瀏覽體驗。
          在如今這個多設備并存的時代,用戶可能會通過臺式電腦、筆記本電腦、平板電腦、智能手機甚至智能手表等各種不同尺寸和特性的設備來訪問網頁。如果網頁沒有采用響應式設計,就很容易出現頁面顯示錯亂、元素排版不合理、文字過小或過大難以閱讀、功能無法正常使用等諸多問題。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
           
          六、暗黑模式
          當今人們使用電子設備的時長日益增加,無論是電腦、手機還是平板電腦,長時間面對明亮的屏幕容易導致眼睛疲勞,尤其是在夜間或低光環境下,這種不適感更為明顯。同時,隨著用戶對個性化體驗以及設備續航能力關注度的提升,暗黑模式應運而生,并迅速在網頁設計領域流行起來。
          除此之外,暗黑模式往往給人一種時尚、高端且神秘的感覺,能夠契合不同的網站主題和品牌形象,為網頁營造出獨特的氛圍。例如,科技類、影視類、游戲類網站采用暗黑模式,可以增強其酷炫、專業的氣質,提升整體的品質感。2025年,暗黑模式也成為網頁設計的一種重要趨勢,越來越多的網頁將提供暗黑模式的切換選項,甚至是很多網站的默認設置。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
           
          七、不對稱布局
          傳統的網頁設計往往采用對稱布局,以追求平衡和穩定的視覺效果。不對稱布局是一種打破傳統網頁設計中對稱平衡原則的布局方式。它摒棄了左右或上下完全對等的元素排列,通過將不同大小、形狀、色彩的元素進行錯落有致的擺放,營造出獨特、富有動感和創意的視覺效果。
          相較于對稱布局給人的穩定、常規感,不對稱布局憑借其獨特的元素組合能迅速抓住用戶的注意力,讓網頁在眾多千篇一律的頁面中脫穎而出,激發用戶進一步探索的欲望。并且可以利用元素的大小、位置等差異,巧妙地將重要信息或關鍵操作按鈕放置在更顯眼的非對稱位置上,引導用戶優先看到這些重點內容。比如,把 “立即購買” 按鈕放在頁面右側較大的空白區域中,通過與周邊元素的對比,強化它的視覺效果,提高用戶的點擊率。
          利用不對稱設計還能體現設計師獨特的審美和創新思維,能夠賦予網頁更高的藝術價值,適合那些希望展現獨特品牌形象、追求與眾不同風格的網站,像一些創意工作室、藝術展覽類網站常常采用不對稱布局來彰顯自身的藝術氣息和個性。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
           
          八、語音交互設計
          隨著語音助手的普及,語音交互設計在網頁設計中的應用也越來越受到關注。語音交互可以提供更加便捷和自然的交互方式,特別是對于那些不擅長使用鍵盤和鼠標的用戶來說。還能適應不同的使用場景,例如在開車、做家務等情況下,用戶可以通過語音交互來使用網頁。
          在 2025 年,我們可以看到更多的網頁將支持語音交互功能,讓用戶可以通過語音指令來瀏覽網頁、搜索信息、完成操作等。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
           
          九、沉浸式 3D 交互體驗
          用戶對于網頁的體驗需求已不再局限于傳統的二維平面展示和簡單交互。沉浸式 3D 交互體驗網頁設計應運而生,它借助先進的 3D 建模、虛擬現實(VR)、增強現實(AR)以及相關的交互技術,將網頁打造成一個逼真的三維空間,讓用戶能夠身臨其境地瀏覽內容、進行操作,仿佛置身于一個真實的虛擬世界中。
          隨著硬件設備性能的不斷提升,如電腦圖形處理能力增強、VR/AR 設備逐漸普及,還有用戶對于更具創新性、趣味性瀏覽體驗的追求,網頁設計開始越來越多地融入 3D 交互元素,以突破傳統網頁的限制,為各行業的網頁應用(如電商展示、虛擬展廳、在線教育、游戲宣傳等)帶來全新的呈現形式和互動方式。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
           
           
          十、可持續設計
          可持續性網頁設計是指在網頁的整個生命周期中,從規劃、設計、開發、部署到運營和維護,都遵循環保、社會和經濟可持續發展的原則,以最小化對環境的負面影響,并為用戶和社會創造長期價值。
          隨著全球對環境保護意識的不斷提高以及資源日益稀缺的現狀,可持續性網頁設計也成為如今的一個重要趨勢。它不僅有助于減少能源消耗和碳排放,降低對環境的壓力,還能提升企業或組織的社會形象,滿足用戶對綠色、環保產品和服務的期望,同時從長期來看,通過優化資源利用和降低運營成本,也能為企業帶來經濟效益。
          2025年網頁設計最新趨勢來襲,你準備好了嗎?
           
          2025 年的網頁設計趨勢呈現出多元化和創新性的特點。從沉浸式 3D 交互體驗到人工智能輔助設計,從動態插畫與動畫到可持續設計,每一種趨勢都代表著網頁設計領域的新方向和新機遇。在這個快速發展的時代,網頁設計師需要不斷學習和掌握新的技術和理念,以適應市場的需求和用戶的期望。


          作者:摹客設計云
          鏈接:https://www.zcool.com.cn/article/ZMTY0OTIzNg==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

          解鎖UI設計新趨勢:打造未來感界面的5大技巧(下)

          濤濤

          ? 隨著科技的迅猛發展,用戶界面(UI)設計作為連接用戶與數字世界的橋梁,其重要性和影響力日益凸顯。一個優秀的UI設計不僅能夠提升用戶體驗,保持用戶的持續參與度,還能助力品牌在激烈的市場競爭中脫穎而出。

          解鎖UI設計新趨勢:打造未來感界面的5大技巧(上)

          濤濤

          ? 隨著科技的迅猛發展,用戶界面(UI)設計作為連接用戶與數字世界的橋梁,其重要性和影響力日益凸顯。一個優秀的UI設計不僅能夠提升用戶體驗,保持用戶的持續參與度,還能助力品牌在激烈的市場競爭中脫穎而出。

          解鎖UI設計新趨勢:打造未來感界面的5大技巧

          鶴鶴

          引言
            隨著科技的迅猛發展,用戶界面(UI)設計作為連接用戶與數字世界的橋梁,其重要性和影響力日益凸顯。一個優秀的UI設計不僅能夠提升用戶體驗,保持用戶的持續參與度,還能助力品牌在激烈的市場競爭中脫穎而出。如今,設計師們面臨的挑戰是如何
          捕捉并應用新興趨勢,打造出具有未來感的界面設計,以滿足用戶對新鮮感和創新體驗的渴望
            在未來感的設計中,每一個小小的細節都可能成為引領潮流的風向標。從
          視覺元素的創新運用
          智能動效與微交互
          的精妙結合,再到
          材料設計與空間概念
          的深度探索,以及
          色彩與字體的新潮流
          ,都是構建引人入勝的用戶界面不可或缺的部分。更進一步,隨著
          增強現實(AR)和虛擬現實(VR)技術
          的融入,UI設計的邊界被進一步拓展,為用戶帶來前所未有的沉浸式體驗。
            本文將深入探討打造未來感界面的5大技巧,并通過實際案例的分析,揭示這些技巧如何在實際設計過程中得以應用,并最終形成具有影響力的產品。無論是剛踏入UI設計領域的新手,還是經驗豐富的資深設計師,本文都將提供有價值的見解和靈感,幫助大家解鎖新趨勢,打造具備未來感的用戶界面,共同邁向更加美好的數字生活。
          (如果文中存在任何不準確或遺漏之處,期待各位專家的指正和建議)
          本文目錄
          本文目錄
           
          解鎖UI設計新趨勢:打造未來感界面的5大技巧
           
           
          一、新趨勢概覽
          1.當前UI設計的流行趨勢
            在數字設計的世界中,UI設計的趨勢如同時尚圈的變遷一樣迅速。每一個新趨勢都在告訴我們,技術正以前所未有的速度影響著我們的日常生活。作為設計師,理解并把握這些趨勢不僅意味著能夠創造出引人入勝的作品,更代表著能夠預見并塑造未來用戶與界面交互的方式。
            當前流行的UI設計趨勢包括了
          極簡主義、扁平化、暗色模式、玻璃模糊效果(Glassmorphism)、以及動態的視覺效果
          等。這些趨勢往往反映了用戶對清晰性、可讀性、以及視覺舒適度的需求。例如,暗色模式不僅減少了屏幕發出的光線,減輕了用戶眼睛的疲勞,同時也賦予了界面一種時尚和專業的氣息。(可閱讀我之前的文章《「大廠設計師」教你一文讀懂暗色模式》,非常詳細)
          當前流行的UI設計趨勢
          當前流行的UI設計趨勢
           
          2.科技發展如何影響UI設計
            同時,隨著人工智能和物聯網的普及,UI設計也正在變得更加
          智能化和互聯
          。設備間的無縫連接帶來了
          統一的用戶體驗
          ,而人工智能的引入則讓界面能夠根據用戶的行為和習慣提供個性化的反饋和建議,極大地
          提升了用戶的粘性
          小米已經建立起了涉及12大領域、98項細分領域的技術圖譜,涵蓋了智能手機、智能汽車、機器人、軟件和算法、電商、智能制造、金融等各類小米研發和應用的技術
          小米已經建立起了涉及12大領域、98項細分領域的技術圖譜,涵蓋了智能手機、智能汽車、機器人、軟件和算法、電商、智能制造、金融等各類小米研發和應用的技術
           
          3.優秀案例解讀
            為了具體展示這些趨勢在實際中的應用,我們不妨來看一看
          蘋果公司的UI設計
          。蘋果一直以來都是工業設計的先驅者,它的UI設計同樣引領著潮流。在最新的iOS系統中,我們可以看到
          玻璃模糊效果被運用到了極致
          ,它不僅使界面看起來更加現代和清新,也為用戶體驗增加了層次感和深度。此外,蘋果的
          Animoji和Memoji功能
          將個性化的動態表情帶入了消息交流中,這種結合了
          個性化和技術趨勢
          的設計細節,
          增強了用戶的互動樂趣,并提高了平臺的參與度
          蘋果公司的玻璃模糊效果及emoji應用
          蘋果公司的玻璃模糊效果及emoji應用
           
            接下來,我們還可以看到
          特斯拉
          在其車載用戶界面中采用了
          極簡主義
          的設計理念。通過簡化界面元素,去除多余的裝飾,特斯拉成功地提供了一個
          既美觀又功能性極強
          的控制面板,完美地展示了如何
          將復雜信息簡潔呈現給用戶
          特斯拉的極簡化HMI設計
          特斯拉的極簡化HMI設計
           
            總之,
          了解并應用這些UI設計的新趨勢
          對于設計師來說是至關重要的。它們不僅能夠幫助設計師創作出符合當下審美的作品,更能讓他們預見未來,
          打造出具有前瞻性和創新精神的用戶界面
          。在接下來的章節中,我們將深入探討如何將這些趨勢轉化為實際的設計技巧,并通過案例分析來揭示這些技巧的應用方法。
          解鎖UI設計新趨勢:打造未來感界面的5大技巧
           
           
          二、5大設計技巧及應用
          1.創新的視覺元素運用
            在UI設計中,視覺元素的運用是
          建立品牌形象和提升用戶體驗
          的關鍵。近年來,隨著技術的不斷進步和設計理念的更新迭代,設計師們已經開始嘗試更為創新的視覺元素,以打造具有未來感的用戶界面。這些創新元素不僅能夠
          吸引用戶的目光
          ,還能
          提供新穎的交互體驗
          ,從而
          增強用戶的參與度
          (1).抽象圖形和動態背景
            首先,
          抽象圖形和動態背景
          成為了流行趨勢之一。這些元素通常結合了
          復雜的幾何形狀、微妙的色彩漸變以及動態效果
          ,用以營造出一種科技感或夢幻般的氛圍。例如,一個登錄頁面可能采用動態的背景,其中包含緩慢旋轉的三維幾何形體,這不僅給用戶帶來了
          視覺上的享受
          ,也傳達了
          品牌對未來科技的追求
          圖源:https://dribbble.com
          圖源:https://dribbble.com
           
          (2).3D元素
            其次,
          3D元素的融合
          也是創新視覺元素運用的一個方向。隨著3D建模技術的發展,將三維元素集成到二維界面中變得越來越流行。這樣的設計不僅
          增添了界面的深度和立體感
          ,還為用戶
          提供了更為豐富的互動方式
          。例如,懂車帝使用了
          3D產品預覽
          ,讓用戶能夠從不同角度觀察車輛,增加了購物的體驗感。
          懂車帝的3D看車
          懂車帝的3D看車
           
          (3).優秀案例解讀
            接下來,我們將通過一個具體的案例來進一步理解這一技巧的應用。
          AirPano Travel Book
          是一款旅游類應用,運用了
          視差滾動效果
          來模擬用戶在旅途中的景深變化,當用戶在應用中上下滾動時,不同層次的圖像將以不同的速度移動,
          營造出一種真實的旅行體驗
          。同時,在UI中加入
          定制化的動態抽象圖形
          ,比如根據用戶的目的地展示出具有當地特色的圖樣,這樣既美化了界面,也
          提供了個性化的信息
          視差滾動效果
          視差滾動效果
           
          定制化抽象圖形
          定制化抽象圖形
           
            此外,為了更好地展示創新視覺元素的運用,設計師可以利用現代設計工具,如
          Adobe XD或Sketch
          等,這些工具支持導入和創建復雜的矢量圖形,并能夠模擬各種動態效果。通過在這些工具中進行快速原型設計和迭代,設計師可以方便地測試和調整視覺元素,直到找到最適合用戶和品牌的設計解決方案。
            總之,通過引入創新的視覺元素,設計師不僅可以
          打破傳統的界面設計局限
          ,還可以
          推動用戶體驗向更加動態和互動的方向發展
          。這種設計技巧要求設計師具備前瞻性的洞察力和扎實的設計技能,以便創造出既美觀又實用的用戶界面。在接下來的章節中,我們將探討如何將這些創新的視覺元素與智能動效和微交互結合起來,進一步提升UI設計的吸引力。
          2.智能動效與微交互
            在當今的UI設計中,智能動效(Smart Animations)和微交互(Microinteractions)已經成為提升用戶體驗不可或缺的元素。這些細微但至關重要的設計細節,不僅
          使界面更加生動活潑,而且有效引導用戶行為,增強應用程序的直觀性和易用性
          (1).智能動效
            智能動效
          是指
          根據用戶的互動而觸發的動畫效果
          ,它能夠提供視覺反饋,幫助用戶理解他們的行為和應用程序的響應。例如,當用戶點擊一個按鈕時,按鈕可能會有顏色漸變或者擴大縮小的動畫,這種動效
          向用戶確認了他們的操作已被系統識別和處理
          。此外,智能動效也可以用來
          引導用戶的注意力
          ,如通過動畫展示來突出重要的信息或者引導用戶完成特定的任務流程。
          blibili的三連動效
          blibili的三連動效
           
          (2).微交互
           
            微交互
          則是一種細節層面的設計,它關注的是
          用戶在使用產品過程中的微小時刻
          ,例如TabBar底部導航欄的選中效果、滑動刪除應用通知時的"嗖"的一聲提示,或是設置定時器時旋轉的撥輪聲。這些看似不經心的設計實際上極大地
          豐富了用戶的體驗
          ,讓用戶在使用過程中的每一個小步驟都
          獲得滿足感和愉悅感
          tabbar動效設計,可通過AE制作
          tabbar動效設計,可通過AE制作
           
           (3).優秀案例解讀
            為了更好地演示智能動效和微交互的實際應用,我們來看一個具體的案例分析。網易云音樂是一款音樂流媒體應用,我們可以在用戶播放一首歌曲時加入一個
          從封面圖片過渡到播放器界面
          的流暢動效,這不僅美觀現代,還強化了用戶的操作反饋。當用戶進行歌曲切換時,唱片機上的
          唱針通過拿起放下的動效表示切換唱片
          ,同時伴隨著節奏的跳動,增強了聽覺與視覺的聯動。
          網易云音樂的播放歌曲
          網易云音樂的播放歌曲
           
            在微交互方面,如果用戶將歌曲添加到收藏列表,有許多類似
          心跳般的跳動動畫
          作為反饋,讓用戶感受到自己的選擇得到了
          系統的即時回應
          ,同時這個動效也可以根據用戶的個人喜好進行選擇,滿足了用戶的個性化需求。
          網易云音樂的個性化收藏
          網易云音樂的個性化收藏
           
            為了實現這些智能動效和微交互,設計師們通常需要掌握一定的動畫制作技能,并熟悉如
          After Effects、Principle
          等動畫制作工具。通過這些工具,設計師不僅可以創造復雜的動效,還能將這些動效導入到原型設計中,確保它們在實際應用場景中的可行性和效果。
            總結來說,
          智能動效和微交互是提升UI設計吸引力的重要技巧
          。它們不僅美化了界面,增加了樂趣,更重要的是提升了用戶的實際使用體驗。在接下來的章節中,我們將探討如何利用材料設計和空間概念來進一步增強界面的層次感和深度感。
          3.材料設計與空間概念
            在UI設計的世界中,材料設計(Material Design)是由
          谷歌
          推出的一套設計語言,
          旨在通過使用陰影、動畫和深度效果來模擬真實世界的材料和質感
          。這種設計理念不僅使界面看起來更加直觀和一致,而且通過引入空間概念,增強了用戶的沉浸感和操作直覺性。
          (1).材料設計
            首先,
          材料設計
          的核心在于其能夠
          創建一個具有層次感的界面
          。設計師利用紙張隱喻來構建出一個可以觸摸的虛擬世界,在這個世界中,
          每一個元素都像是一張放置在桌面上的紙片
          。通過使用
          陰影和厚度
          ,這些紙張般的元素之間建立了明顯的
          層級關系
          ,讓用戶能夠清晰地感知到哪些是可以互動的按鈕或卡片,哪些是背景信息或次要元素。
          將手機屏幕看作紙張,而UI設計師就是在二維平面上創造三維畫作
          將手機屏幕看作紙張,而UI設計師就是在二維平面上創造三維畫作
           
          (2).空間概念
            其次,
          空間概念
          在材料設計中同樣至關重要。通過對
          Z軸
          的利用,設計師可以創造出
          元素之間的前后關系
          ,使得一些元素看起來像是浮動在其他元素的上方或下方。例如,彈出菜單或抽屜式導航會出現在主界面之上,而幻燈片則可能在下方滑動進入視野。這樣的設計不僅
          增添了視覺上的趣味性
          ,也
          使得用戶更容易理解多維的導航結構
          不同的界面元素對應不同的視覺層級
          不同的界面元素對應不同的視覺層級
           
          (3).優秀案例解讀
            為了更好地演示材料設計和空間概念的應用,讓我們來看一個案例。在
          Airbnb愛彼迎
          的搜索結果頁面中,房源都
          以卡片形式展現
          ,并且有
          懸浮效果
          ,用戶可以感受到元素之間的堆疊效果。而房東名片以書本形式展示在界面最上層,點擊之后給用戶帶來
          拿起展開信息的體驗
          。此外,房源圖片的高質量和大尺寸也使得用戶仿佛能觸摸到實際空間,增強了
          沉浸感
          愛彼迎的搜索界面
          愛彼迎的搜索界面
           
            實現這些效果,設計師通常需要掌握如
          Sketch、Figma、Adobe XD
          等現代UI設計工具,這些工具提供了必要的
          組件和動效
          支持來實現材料設計的規范。此外,它們也支持跨平臺協作,確保設計在不同設備和操作系統中保持一致性和功能性。
            總的來說,材料設計和空間概念賦予了UI設計更多的
          立體感和現實感
          。通過恰當地運用這些技巧,設計師可以創造出既
          美觀又富有邏輯性
          的用戶界面,從而提升用戶體驗和滿意度。在接下來的章節中,我們將深入探討色彩與字體的新潮流以及它們如何影響用戶的情感和行為。
          3.色彩與字體的新潮流
            UI設計中,色彩和字體是
          塑造品牌形象和傳遞信息
          的關鍵要素。隨著設計風格的不斷演變,新的色彩配搭和字體設計趨勢也在持續涌現,為設計師提供了更多的選擇和創意空間。掌握這些新潮流不僅能夠
          使設計作品更具時代感
          ,而且可以深刻
          影響用戶的情感反應和行為模式
          (1).色彩趨勢
            新興的
          色彩趨勢通
          常反映在
          年度流行的顏色
          上,如
          Pantone每年發布的年度色
          等。這些流行色往往與文化趨勢、社會情緒以及科技發展緊密相連。例如,一種溫暖而包容的色彩可能反映了人們對和諧社區的向往,而一種鮮亮且活潑的色彩則可能是對日益增長的數字化生活的回應。在UI設計中運用這些流行色,可以
          增強產品的時尚感和相關性
          Pantone近四年的流行色
          Pantone近四年的流行色
           
          (2).字體設計
           
          字體設計
          同樣重要,因為不同的
          字體風格和排版
          可以直接影響
          信息的傳達效果和用戶的閱讀體驗
          。最新的字體趨勢可能包括
          無襯線字體
          的進一步簡化、
          手寫字體
          的個性化使用,或者是
          動態字體
          的出現,后者在不同的屏幕和設備上能夠提供最佳可讀性。此外,
          響應式排版
          也越來越受到重視,它允許字體大小和行距隨屏幕尺寸的改變而調整,從而優化移動端和桌面端的閱讀體驗。
          近年流行的字體風格和排版
          近年流行的字體風格和排版
           
          (3).優秀案例解讀
            為了具體展示這些趨勢的應用,我們來看一個案例。
          QQ
          是一款國內的主流社交媒體應用,它的消息界面選擇了一種
          明亮且具有活力的藍色作為主題色
          ,這種顏色既能吸引
          年輕用戶
          群體,又能與應用的
          清新現代感
          相契合。對于
          字體
          ,用戶可以
          根據自己的喜好選擇
          一種簡潔的無襯線字體來增強消息的清晰度,同時在用戶發送的
          個性化簽名
          中用戶也可以選擇一款有趣的手寫風格字體,以
          鼓勵用戶自我表達和個性化分享
          QQ中字體、顏色、主題的應用
          QQ中字體、顏色、主題的應用
           
            在實現這些設計時,設計師可以利用多種工具和技術,如
          CSS變量和HTML5的@font-face
          規則,以確保
          色彩和字體的準確展現
          和良好性能。此外,設計師還應該考慮到
          多語言環境下字體的兼容性
          ,確保所有用戶都能獲得一致的體驗。
            綜上所述,色彩和字體在UI設計中的新潮流不僅
          反映了文化的變遷和技術的發展
          ,而且對于提
          升用戶體驗和滿足審美需求
          起到了關鍵作用。通過在設計中融入這些新趨勢,設計師能夠創造出既
          富有表現力又易于使用的界面
          。在接下來的章節中,我們將深入探討如何將增強現實(AR)和虛擬現實(VR)技術融入UI設計中,為用戶帶來前所未有的交互體驗。
          5.增強現實(AR)與虛擬現實(VR)的融合
            隨著技術的不斷進步,
          增強現實(AR)和虛擬現實(VR)
          已經成為UI設計領域的新趨勢,它們為用戶提供了
          沉浸式和互動式的體驗
          。這些技術
          將現實世界和虛擬世界融合在一起
          ,創造出
          全新的用戶界面和交互方式
          。在這篇文章的最后部分,我們將探討如何將AR和VR技術融入UI設計中,以提供獨特而前沿的用戶體驗。
          AR與VR的區別
          AR與VR的區別
           
          (1).增強現實(AR)
            增強現實技術允許用戶
          在現實世界的環境中看到由計算機生成的圖像
          。在UI設計中,這意味著設計師可以
          創建能夠與現實世界相互作用的界面元素
          。例如,得物利用了AR技術讓用戶在自己的家中就能試
          穿衣服或鞋子
          ,從而
          消除了線上購物與實體店購物之間的界限
          。設計師需要確保這些虛擬對象與現實世界的環境相協調,同時提供直觀的用戶操作指南和提示。
          得物的AR試穿功能
          得物的AR試穿功能
           
          (2).虛擬現實(VR)
            虛擬現實則創造了一個
          完全由計算機生成的環境
          ,用戶可以在其中進行沉浸式的體驗。在UI設計中,這通常涉及到
          創造一個360度的界面
          ,用戶可以在其中環顧四周,并與之互動。例如,
          網易瑤臺
          可以允許用戶在家中就能
          探索遙遠的目的地
          ,或是通過虛擬現實體驗提前
          參觀即將舉辦的活動場地
          。其業務范圍包括
          私域元宇宙、數字文旅、營銷活動、展覽展廳、企業空間
          等多種場景。設計師在這個領域面臨的挑戰是如何在不引起暈動癥的前提下,提供流暢而引人入勝的體驗。
          網易瑤臺的VR服務場景
          網易瑤臺的VR服務場景
           
          (3).優秀案例解讀
            為了具體展示AR和VR在UI設計中的應用,我們來看一個案例分析。
          如視
          是國內一家提供
          AR/VR看房
          技術的服務公司,其合作對象包括自如、貝殼、華住會、萬科等。房地產應用的
          目標用戶是潛在的房屋買家
          ,加入AR技術來讓用戶
          在自己的手機上查看房屋的內部布局和外觀設計
          。當用戶指向特定的房屋模型時,屏幕上會顯示房屋的實際外觀,并允許用戶通過手機攝像頭在現實世界的背景下查看它。此外,用戶還可以通過VR技術進行一次
          虛擬參觀
          ,就像親自走在房屋內一樣,從每個角度觀察房間的布局和設計。
          如視的AR看房功能
          如視的AR看房功能
           
            實現這樣的設計不僅需要對UI設計有深刻的理解,還需要掌握如
          Unity3D、Unreal Engine
          等高級開發工具,以及對于AR和VR硬件如
          Oculus Rift
          Microsoft HoloLens
          的熟悉。設計師必須考慮到用戶的物理運動和視線變化,以確保界面元素在不同的視角和情境下都能正確顯示并提供反饋。
            總結來說,將AR和VR技術融入UI設計是一個
          充滿挑戰但同樣充滿機遇的領域
          。它要求設計師不僅要關注傳統的設計原則,還要
          對新技術有深入的了解和實驗精神
          。通過結合這些技術,設計師可以創造出前所未有的體驗,將用戶帶入一個全新的互動維度。
          寫在最后
            在探索未來感UI設計的旅程中,我們共同穿越了五個關鍵技巧的門檻,它們分別是
          創新的視覺元素運用、智能動效與微交互的精妙結合、材料設計與空間概念的深度利用、色彩與字體的新潮流引領,以及對增強現實(AR)與虛擬現實(VR)技術
          的前沿融合。通過這些技巧,設計師們能夠打造出不僅具有功能性,而且具有強烈吸引力和未來感的用戶界面。
            隨著技術的不斷進步和用戶需求的持續演變,UI設計的未來將繼續展開新的可能性。設計師們需要
          不斷地學習、適應并實驗最新的設計技巧和技術
          ,以確保他們的作品不僅與時俱進,更能引領潮流。在此過程中,設計師們將拓寬自己的創意視野,提高解決問題的能力,并最終為用戶帶來更加豐富、直觀且愉悅的體驗。
            這篇文章不僅是對現代UI設計技巧的全面概述,也是一個對未來設計趨勢的期待和準備。讓我們一起攜手進入這個充滿創造力和無限可能的設計新時代。
           


          作者:阿琳01
          鏈接:https://www.zcool.com.cn/article/ZMTYyNDYyMA==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

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

          WechatIMG27.jpg

          關鍵詞:UI咨詢UI設計服務公司軟件界面設計公司、界面設計公司、UI設計公司UI交互設計公司數據可視化設計公司用戶體驗公司高端網站設計公司銀行金融軟件UI界面設計能源及監控軟件UI界面設計氣象行業UI界面設計軌道交通界面設計地理信息系統GIS UI界面設計航天軍工軟件UI界面設計醫療行業軟件UI界面設計教育行業軟件UI界面設計企業信息化UI界面設計、軟件qt開發軟件wpf開發軟件vue開發

           

          2024 年 十大UX/UI設計 趨勢

          鶴鶴

          在外網看到的一篇關于2024設計趨勢的文章,翻譯歸納分享給大家。
          一.3D圖像
          3D插畫的優勢:
          1.開發成本低
          2.受設計師的個人風格影響小
          3.質感、材質更顯風格化抽象化,易吸引用戶的注意力
          3D插畫
          3D插畫
           
          動態3D插畫
          動態3D插畫
           
          3D插畫在金融類網站的應用
          3D插畫在金融類網站的應用
           
          3D插畫在設計師個人網站的應用
          3D插畫在設計師個人網站的應用
           
          3D插畫在設計工作室網站的應用
          3D插畫在設計工作室網站的應用
           
          二.復雜漸變
          復雜漸變的優勢:
          體現未來感,與高科技產品建立認知聯系
          品牌代理機構
          品牌代理機構
           
          創意機構
          創意機構
           
          創意工作室
          創意工作室
           
          三.玻璃態和新晶態
          玻璃態和新晶態的優勢:
          真實感,用戶感覺自己在近距離觀察物體
           
          玻璃形態主義
          是指在界面中模仿玻璃的質感
          新形態主義
          是從從擬物主義衍生而來的一種適應性趨勢,適合現代審美。它強調在物體、體積和漸變上進行高質量的陰影渲染
           
          2024 年 十大UX/UI設計 趨勢
           
           
          2024 年 十大UX/UI設計 趨勢
           
           
          四.低多邊形插圖
          低多邊形插圖優勢
          1.簡潔明了,有效傳達信
          2.游戲質感、懷舊感,喚起愉快的回憶和童年的輕松感
          2024 年 十大UX/UI設計 趨勢
           
           
          五.2D插畫
          2D插圖優勢:
          風格化強烈,更能突出品牌風格。Google、Yandex、Dropbox、Mailchimp 和 Wetransfer都傾向于這種2D風格插畫。
          2024 年 十大UX/UI設計 趨勢
           
           
          2024 年 十大UX/UI設計 趨勢
           
           
          六.極簡主義
          廣泛應用于提供室內設計服務、法律服務和電子商務的項目,人們傾向于不沉迷于明亮的細節,因為用戶需要專注于基本要素,而不是被過多的裝飾元素分散注意力。
          2024 年 十大UX/UI設計 趨勢
           
           
          2024 年 十大UX/UI設計 趨勢
           
           
          2024 年 十大UX/UI設計 趨勢
           
           
          2024 年 十大UX/UI設計 趨勢
           
           
          2024 年 十大UX/UI設計 趨勢
           
           
          七.暗黑主義
          這樣的風格營造出一種特殊的宇宙氛圍,增添了一絲奢華感。因此,高級銀行產品、信息行業的封閉社區、VIP 服務和商品中經常出現暗黑主題。它有效地強調了高地位和所用技術的進步性。
          基于區塊鏈的數字生態系統 Glec 項目
          基于區塊鏈的數字生態系統 Glec 項目
           
          區塊鏈項目
          區塊鏈項目
           
          2024 年 十大UX/UI設計 趨勢
           
           
          八.動效
          2024 年 十大UX/UI設計 趨勢
           
           
          2024 年 十大UX/UI設計 趨勢
           
           
          動效示例網站鏈接:
          https://youtu.be/suC3o141tB0
           
          九.人物
          為了進一步吸引用戶,可以考慮使用獨特的吉祥物角色。它們會在用戶使用數字產品時陪伴用戶并讓他們參與互動。這種方法有助于在競爭對手中脫穎而出,確保溝通的一致性(如果用戶在品牌或公司的每個平臺上都遇到熟悉的角色,他們會更容易適應)
          營銷平臺
          營銷平臺
           
          推廣 Web3 項目
          推廣 Web3 項目
           
          界面中的字符有多種用途:
          •  
            角色充當向導,為用戶提供幫助、提示和鼓勵。它們幫助用戶瀏覽界面并了解產品的功能。
          •  
            角色有助于與觀眾建立情感聯系。它們傳達產品的價值,并通過添加個人風格使互動更具吸引力。
          •  
            用戶可以通過角色獲得獎金、折扣或其他獎勵。這與游戲化的大趨勢相吻合,用戶可以通過完成任務獲得成就。
           
          十.美好回憶
          復古和懷舊設計元素是激發用戶懷舊情緒的絕佳觸發器。它們讓用戶與產品進行情感互動,提供身臨其境的體驗。在潛意識中,它們增強了訪客的信任,傳達出這樣的信息:“我們有著共同的過去,共同的回憶。我們一起長大。”
          防曬霜產品網站
          防曬霜產品網站
           
          Spotify 促銷
          Spotify 促銷
           
          幫助音樂家創作歌曲的服務
          幫助音樂家創作歌曲的服務
           
          開發設計工作室
          開發設計工作室
           
          十一.大膽的實驗設計
          飽和的字體、酸性色彩、GIF 動畫、滾動文本以及明亮但平面的拼貼畫、來自 Mac OS 9、Windows 2000 和 Windows ME 的元素——當您想要創建真正“狂野”且令人難忘的視覺效果時,可以使用所有這些元素。
          秘密社團與全球陰謀
          秘密社團與全球陰謀
           
          興趣工作室
          興趣工作室
           
          設計師個人界面
          設計師個人界面
           
          樂高的歷史
          樂高的歷史
           
           


          作者:油燜小蝦米
          鏈接:https://www.zcool.com.cn/article/ZMTYyMjAxMg==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。
           

           

           

          2024 年的 UX/UI 設計趨勢,關于未來科技體驗的可能性

          博博

          一、從便當盒而來的 Bento UI

          便當盒是日本午餐和午餐盒文化的重要組成部分。他們以井然有序的方式儲存食物,并保持著食物清潔。

          圖片來源 — Freepik

          從便當盒演變而來的 Bento UI 設計風格,是便當盒在屏幕上的數字化效果,基于卡片的設計或網格布局,其中信息以不同的部分或容器呈現,以提高清晰度和易用性。它慢慢開始在 Dribbble 和 Behance 等平臺上掀起波瀾,吸引數百萬設計師關注。

          后續這種“模塊化”設計概念開始出現在網站的儀表板,包括 PayPal 的銷售和財務儀表板、Google Ads 的分析工具等。Windows Phone 和 Lumia 使用的 UI 本質上是 Bento 設計風格的早期迭代。后來,微軟也將這一概念應用到了 Windows 8 的 Windows 桌面開始菜單中。

          Windows 8 開始菜單當蘋果公司在 iPhone 登陸頁面上開始使用 Bento 網格時,Bento 設計被徹底引爆,很快擴展到蘋果的發布會演示中。

          另一張蘋果海報

          眾所周知,蘋果公司總能引領市場設計趨勢,而 Bento 設計風格只是其中之一。從那以后,每個設計師都使用 Bento 進行產品設計、產品發布等。

          日式便當的設計與 Bento 設計趨勢之間的最大區別在于, Bento 網格的每個部分都代表一個獨特的空間,而不是一個組的一部分。它現在已經發展到包括產品演示,與其他一些獨特的布局混合,甚至采用新的視覺設計概念進行風格化。比如下面這個:

          Bento 設計互動現場演示

          上面的例子來自 diagram.com,它使用便當網格來展示其工具通過交互式體驗可以做什么的現實生活示例,讓這個工具更具吸引力,并告訴用戶他們應該期待什么。

          同時,為了幫助全球設計師開拓思路,出現了一些 Bento 設計靈感的收集網站,如 Bentogrids.com ,其中有大量用于 UI 和圖形設計的 Bento 網格。感興趣的設計師朋友可以前往體驗。

          Bentogrids官網

          Bento UI 設計風格擴展性較強,可以快速的創建響應式動態分布,同時可以輕松地創建明確的視覺層次結構和布局,提高信息可讀性和可理解性。這些優勢讓 Bento UI 在移動設備上的發揮非常出色,但如果是層級結構較為復雜的頁面,Bento UI可能并不適合。

          二、AR / VR設計與更交互式的空間體驗

          想象一下,你剛剛醒來,拿起手機查看“重要電子郵件”。畫面切換,你帶著蘋果的 Vision Pro,整個信息流都來源于這里。這是 2023 年 6 月 5 日全世界每一位科技和設計愛好者的早晨。

          圖片來源 — Apple.com

          在接下來的幾周里,這是科技界談論的主要話題,每個設計師都在努力學習空間設計技能。除了設計趨勢之外,各種 AR / VR 初創公司也走到了最前沿,他們的技術終于被人們談論。Vision Pro 真正推動了 AR 和 VR 的發展。

          偉大的技術帶來巨大的設計潛力。從智能手表到折疊手機,設計師們總是挺身而出,展示他們的適應性。空間設計也不例外。

          一睹即將發生的事情

          一款名為“Bezi”的流行設計師工具隨之推出,它非常接近 Figma 和 Spline 等設計工具,但增加了第三維空間。設計師可以進行空間設計,連接可用的 AR / VR 耳機,并創建交互式空間體驗。

          更好的 UX 是更好的 AR / VR 體驗的一個重要貢獻者。深入了解前沿設計背后的技術、使用實際的 VR 耳機、在空間環境中進行測試,這些都是工作的一部分。隨著我們的發展,我們目前對用戶體驗的理解肯定會有很多新的變化。這是需要持續積累并會在將來使用的技能之一。

          除了蘋果公司豐富的想象力和雄厚的財力之外,還有一些不太懂技術的公司也為佩戴眼鏡帶來了全新的體驗。比如太陽鏡公司 RayBan ,已經憑借其新款 Meta Wayfarer 進入了智能可穿戴設備競賽。它的內置攝像頭和智能功能允許用戶存儲視頻/圖像并直播到社交媒體,這為用戶體驗和客戶體驗帶來了新的維度。

          圖片來源 — RayBan

          三、動畫與 3D 設計成為新趨勢

          當更多人掌握一項新技能時,新趨勢往往就會誕生。LottieFiles 可以便捷的將 UI 生成簡單的動畫,他們甚至推出了 Figma 插件,允許用戶將 Figma 動畫轉換為可導出的 Lottie JSON 文件。這解決了 After Effects 和類似軟件的漫長學習曲線問題,讓更多的設計師可以自己快速制作動畫。

          同時我們注意到,如今每個公司的登陸頁面上都有誘人的互動。這源于網站訪問者對差異化體驗的需求不斷增長,以及在銷售產品/服務的過程中講好故事的更大需求。

          以 Apple Watch Series 9 的登陸頁面交互為例:

          有了滾動動畫,訪問者就會全神貫注于你要向他們展示的內容。Webflow 和 Framer 等無代碼工具不斷創新,為設計人員帶來此類動畫功能,而無需編寫長行代碼。

          人們可能會認為,動畫至此已經達到頂峰,沒有什么值得期待的了。但幸運的是,科技界的人總是在尋找下一件大事,并且提供無窮無盡的強大工具,讓想象的一切都變得可能。其中一種可能性就是新的“動畫按鈕趨勢”。一種新的 UI 風格,引入了動畫技術,使簡單的按鈕變得生動起來。這些變化的范圍從按鈕周圍的簡單筆劃動畫,到鼠標懸停時在按鈕內移動的文字星星。

          來源于 X的“@learnframer”的 GIF

          除了動畫的趨勢之外,最近,許多設計師都在談論設計世界如何從扁平化設計轉向更偽現實的視覺風格。其中包括 3D 圖形、深度效果、擬物化、擬物化等。我們也看到很多公司都將 3D 作為核心風格。盡管它現在可能不會出現在網頁和應用程序設計中,但徽標正在隨著這一新趨勢而更新。

          新 3D 浪潮的幾個很好的例子(來源于 Chan Karunaratne)

          與動畫設計趨勢非常相似,人們實現這些樣式的一個重要原因是出現了易于使用的基于 Web 的 3D 工具,例如 Spline 和 Vectary ,這些工具使得在 Web 和應用程序上包含 3D 資源變得非常容易。他們還使用動畫將 3D 資產帶入生活,這是很多設計師所經歷過的最短的學習曲線。設計師很快就能使用基本的線性漸變和一些陰影為企業的品牌資產添加第三維度。另一家始終推動設計和趨勢的公司是 Airbnb。他們因其簡單而有效的應用程序設計和交互而廣為人知。2023 年,他們宣布了一次應用程序更新,融入了十多個 3D 視覺元素,甚至公告視頻幾乎都是關于3D的。

          Airbnb 發布視頻

          等距視覺效果、3D 角色和動畫以及大量應用程序交互足夠吸引眼球,讓用戶想要重復觀看。從平面到動畫或 3D 的轉變在緩慢而穩定的發生著。這種趨勢通常是由多米諾骨牌效應造成的。只要一位設計師的社交帖子受到歡迎,其他著名設計師也會效仿。

          四、人工智能對于 UX / UI的影響

          1. AI 設計工具是否可以成為設計師的好助手

          雖然一些設計師認為 AI 未來會對他們的職業構成威脅,但我們大多數人都在使用這項技術更快地創造出最好的設計。

          Adobe Firefly 用于視頻處理

          不過大多數聲稱自己為“人工智能驅動”的設計工具,雖然開放了生成式 AI 的 API,也在開發自己的人工智能模型,但大多數 AI 功能都還只是噱頭,只能完成隨機設計 UI、重組資產等不穩定功能。

          但市場上也仍然存在一些設計領域的英雄產品,比如 Relume 。這家專注于 Webflow 的公司推出了名為 Relume AI 的產品,這是一款功能強大的線框和交互工具。在該網站中輸入你的網站描述,它會生成完整且詳細的交互稿和視覺圖,界面的布局和數據完整,可以快速復制到 Figma 和 Webflow。

          前段時間我們也分享過 Durable 這個建站產品AI + 建站|Durable,融資 1400 萬美金,30秒創建一個網站并成為自己的老板,它提供了創建網站所需要的一打子工具,包括網站構建器、CRM、發票軟件、人工智能助手等。用戶只需要提供品牌名稱、所屬行業、開展業務的地點和網站語言,Durable 就會基于用戶提供的信息快速創建一個網站首頁。

          用 Durable 創建網站

          2. AI 時代的用戶體驗設計

          在 ChatGPT 還沒有風靡的時候,數字產品的用戶體驗風格普遍為以 GUI (圖形用戶界面)為主,通過圖形、按鈕、菜單等標準化元素,使用戶可以通過鍵盤、觸摸等方式與終端設備交互。Windows 操作系統、MacOS 、Photoshop等軟件都已 GUI 的用戶界面為主。

          GUI 的界面設計在近 20 多年的發展過程中,由于功能場景的不斷增加, GUI 界面需要兼容復雜的、多樣化的用戶需求。功能強大的同時,設計成本變得很高,用戶的學習成本也隨之提升。尤其是在 TOB 領域的設計中,功能的龐大讓整個頁面擁有多重窗口、四五級以上的導航,即使設計師努力提供簡單易用的頁面,也很難降低用戶的學習難度。

          隨著 GPT4 的推出,CUI (對話式用戶界面)的界面體驗正在逐漸應用廣泛。CUI 采用了更加直觀和自然的語言交互的方式,通過自然語言、語音等方式進行對話,可以有上下文記憶和智能化的回應,典型如 Siri 、Amazon Alexa 、 Google Assistant。

          CUI 的出現,用自然語言的對話方式,可以讓用戶更直觀的與數字產品進行交互,避免用戶記憶繁瑣的操作路徑,讓 AI 為自己找到最快的解決方案。

          但是否所有應用都需要用 CUI 重構一遍?我們認為不會,不同的應用特性會導致不同的設計方向,這給了設計師進一步延展的空間。

          • 對于 TOC 的產品:針對用戶目的明確、功能較為簡單的產品, CUI 會對其的交互體驗有著革命性的影響,比如攜程、美團這種需求明確的產品,用戶的目標是為了找到最合適的商品完成購買,這個過程可以通過 CUI × AIGC 的方式進行進一步重構;但針對用戶目的不明確,且產品體驗過程較為舒適、不需思考的產品,如抖音、快手,CUI 不一定是最讓用戶喜愛的交互界面,或許需要探索二者結合的最佳方式
          • 對于 TOB 的產品:用戶目的明確,功能多樣且復雜,我們認為 GUI 的設計界面很難被摒棄,導航式的地圖仍然需要提供給用戶完成有目的查找。同時對話式的命令也可以滿足用戶無目的的詢問,或許 CUI 可以基于現有層級分明的界面,進行關鍵流程的解答和提效。

          五、不忘初心,回歸用戶

          用戶體驗的研究已經不斷發展和完善,使設計變得易于理解和包容。相比于視覺設計的精美程度,許多設計師更重視可用性,這帶來了更簡單且可行的設計風格。盡管過去幾年行業發生了變化,該設計原則仍然被踐行。

          2019 年至 2023 年“用戶體驗可訪問性”的 Google 趨勢圖

          上面的谷歌趨勢圖顯示了無障礙設計漸漸成為了真正的工業需求。可訪問性技術的范圍從顏色對比、可讀字體、可識別的動作元素,一直到追蹤不同用戶的反饋,應用到產品功能中去。

          1. 無障礙設計

          由于當前需要為所有年齡段的人甚至身體有障礙的用戶進行設計,因此無障礙性也受到了大力推動。公司希望從所有不同的人群中獲利,并且也在各個方面推動包容性。隨著越來越多的人走向數字化,設計師幾乎必須專注于無障礙設計,更多針對無障礙設計的課程和訓練營也面向設計師開放。

          2. 個性化

          除了可訪問性之外,個性化才是真正讓人們鎖定應用程序或網站的原因。或許你以前在 YouTube 上看過這條小信息 :

          YouTube 評估你喜歡哪種內容以便提供更好的推薦

          即使是一個已發布功能,如果用戶反饋不佳,也很容易面臨撤回的情況,這直接體現了用戶體驗設計師在未來產品和服務方面的領先地位。

          Perplexity AI CEO Aravind 曾分享過對于用戶體驗的理解,基本原則是“用戶永遠不會錯”。Perplexity 發現只有極少數人知道將好奇心轉化為清晰、準確的問題,從而導致結果不準確,甚至幻覺的出現。(歡迎閱讀我們研究 Perplexity 的深度文章:AI+搜索|關于搜索的想象,和目前估值最高的生成式搜索引擎 Perplexity。)

          一種解決思路是總結 prompt 的提問方法,讓用戶能主動學習;另一種解決思路是所以在對話式交互界面上,幫助用戶提一個好的問題。Perplexity 選擇了第二種,增加了提出問題之后的更多問題衍生。——平臺永遠要為用戶多想一步、多做一步。

          Perplexity 界面

          總得來說,設計趨勢會隨著工業化進程的推進,而演進為更前沿的風格,也會有更多工具幫助設計師開放腦洞,快速得到心中所想。但無論社會如何進步,以用戶體驗為中心的話題永遠不會終結。

           

           

           

          藍藍設計(m.sdgs6788.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的大數據可視化界面設計B端界面設計桌面端界面設計APP界面設計圖標定制用戶體驗設計交互設計UI咨詢高端網站設計平面設計,以及相關的軟件開發服務,咨詢電話:01063334945。

          關鍵詞:UI咨詢UI設計服務公司軟件界面設計公司、界面設計公司、UI設計公司UI交互設計公司數據可視化設計公司用戶體驗公司高端網站設計公司

          銀行金融軟件UI界面設計能源及監控軟件UI界面設計氣象行業UI界面設計軌道交通界面設計地理信息系統GIS UI界面設計航天軍工軟件UI界面設計醫療行業軟件UI界面設計教育行業軟件UI界面設計企業信息化UI界面設計、軟件qt開發軟件wpf開發軟件vue開發

           

          超全面的設計底層理論,優秀設計背后離不開這些

          鶴鶴

          設計趨勢年年在變,設計技能也在不斷更新,但回到本源,底層的理論知識是不會變的。我自己幾乎每年還會翻看一些講設計基礎的書,比如《寫給大家看的設計書》之類的,會發現這些原理每次看都會有新的收獲。

          隨著工作年數增加,對底層知識的價值認識也越來越深刻,不知道你會不會有這種感覺?

          探索“B+C”,為B端體驗加Buff

          鶴鶴

          在如今用戶為王的時代,用戶體驗成為一種新的品牌競爭力。隨著技術進步和體驗意識的普及,習慣了C端產品流暢愉悅的體驗,用戶對B端產品體驗的期望也越來越高。

          B端C化的概念也由此產生,但B、C端有著本質區別,C端的設計思維無法完全復用到B端,那是否可以基于B端產品特征,融合C端體驗設計思維,即“B+C”來幫助提升B端產品體驗呢?本文聚焦在探索如何通過“B+C”的設計思維,提升B端產品體驗。

          一、B、C端產品定義與差異

          我們先簡單了解下B、C端產品各自的定義。B、C端其實是以使用對象的類型,來代指的產品類型,C指個人消費者 (Customer) ,B指組織 (Business) ,這個組織可以是個人、公司、政府或機構,因此B端模式也是多樣的,除了B2B,還有B2C、B2G等。
          C端產品幫助個人解決生活場景中的需求痛點,提供人們消費的物質、信息和情感。常見產品類型有工具類、內容類、社交類、游戲類等,如滴滴、知乎、微信、王者榮耀等。
          B端產品幫助組織實現其商業目的,提供商業的工具、方法和服務。常見的產品類型有:CRM 客戶關系管理、ERP 企業資源計劃、OA辦公等,如企業微信、金蝶、釘釘等。
          下面我將從產品設計的角度,分析B、C端的差異化。

          1、設計原則的差異

          C端產品主要通過流量轉化獲得收益,因此人的注意力和使用頻率是關鍵,所以設計原則為“UCD”(User Center Design)以用戶為中心的設計。
          B端產品主要是為了能高效解決行業業務問題而存在的,所以其設計原則是以效率為中心。

          2、功能流程的差異

          C端產品主打一個滿足用戶核心痛點的功能,通過這個核心功能明確產品的特性和定位,附加N個增值功能,提高用戶粘性,加之創新和趣味性,保持與競品之間的差異化。
          B端產品功能重全面,為的是能滿足組織的各種業務需求,組織的業務邏輯通常就是產品邏輯,功能流程也由業務場景轉化而來。

          3、交互邏輯的差異

          C端產品是單線程操作,完成一項任務后才能進行另一項。碎片化的使用場景和廣泛的用戶群體,使得C端產品必須信息簡潔、容易上手、操作路徑短,否則將會導致用戶流失影響收益。

          B端產品是多線程操作,支持多個任務并行。交互以優化業務流程,提升用戶操作效率為主,關注信息架構,清晰的信息架構能幫助用戶在呈網狀的功能和交織的流程中,定位到自己所在功能頁面,找到所需的有效信息。

          4、視覺表現的差異

          C端產品視覺設計風格多樣,如賽博朋克、孟菲斯、3D、酸性設計等,注重情感化表達和氛圍的渲染,加上短視頻和直播,讓用戶沉浸其中。
          B端產品視覺服務于功能和信息的傳遞,視覺元素較為簡潔,常用色彩對比的形式,建立內容邊界和視覺層次。

          二、如何用“B+C”思維提升B端產品體驗

          無論是在設計原則、功能流程、交互和視覺方面,B端產品與C端產品都有比較明顯的差異。基于以上差異,結合B端產品特征和C端體驗設計思維,我們可以從以下三個方面提升B端體驗:

          視覺—降低認知負荷

          B端產品講究屏效,看得多通常比看的美重要,信息密度高,則屏效高,卻也相應的會增加用戶的認知負荷,因此我們需要為用戶認知減負。
          交互—以用戶效率為中心

          從用戶的行為和感知出發,本著以用戶為中心的原則提升操作效率。

          情感—關注情緒感受

          關注體驗過程的“峰”與“終”,提升用戶整體的體驗感受。
          下面我將結合實際工作案例,講述如何用“B+C”的設計思維,提升B端產品體驗。

          【案例分享】

          Speedshop Omnichannel(下面簡稱為Omnichannel)是款針對國內及東南亞中小商家,統一管理多渠道商品、訂單、交易、會員的ERP系統。
          目前共支持Lazada、Shopee、Tokopedia、抖音等7個渠道,最多可管理100個線上店,集訂單管理、產品管理、會員管理、聊天、導入導出等功能為一體,服務超40,000商家。

          視覺 — 降低認知負荷

          對信息的識別和處理是認知負荷的主要來源,在視覺層,我們主要解決的是信息識別帶來的負荷,信息識別就是用戶看到內容并選擇的過程,B端產品有信息量大,選擇多的特點,降低認知負荷也將圍繞這兩點進行。

          1、優化信息展示

          / 符合用戶訴求

          B端產品根據用戶規模的大小,可以分為大B (一定規模的中大型企業) 和小B (小微企業、個人創業),兩者對信息的關注點和訴求不同。

          表格是B端產品最常用的信息展現形式,且能將信息有序、高效、直觀的傳達給用戶,避免信息堆砌帶來的認知負荷。

          比如同樣是訂單頁,大B用戶的訂單數據量龐大,且訂單通常是自動流轉的,無需手工操作,所以針對大B用戶,表格信息展示有兩個側重點,一是增加信息密度,二是幫助用戶能夠快速精準過濾信息。

          小B用戶的訂單數據量相對較小,且以手工處理為主,所以在展示訂單時,可以將關鍵信息整合,通過將信息進行分層、分組的展示形式,降低單頁面信息的復雜度,還可以通過各模塊之間字體大小、顏色、圖標、間距等手段將信息層次區分開。

          / 豐富信息展示維度

          還可以通過圖形化、可視化和視頻的形式,豐富信息的內容維度,化抽象為具象,讓信息能更高效的傳達。

          在Omnichannel中,用戶需要完成新手配置后才能使用產品,進入首頁看到的是任務型的引導,通過圖形輔助任務說明,豐富畫面的同時還能增加產品的親和力。

          B端產品由于業務的復雜性和技術的局限性,通常操作沒有那么靈活,需要遵守一定的使用規則,傳統的做法會通過文字說明的方式傳達給用戶,面對一長段的規則說明,讀幾遍還不一定能理解。

          比如在導入產品時,規則內容多且邏輯復雜,可以將內容可視化,使其易于傳達和理解。

          視頻比文字的畫面感更豐富,傳播的內容也更加具體,在幫助中心,圖文的基礎上增加視頻,幫助用戶更高效的獲取幫助信息。

          2、提供個性化配置

          B端產品通常包含多種用戶角色,每個角色的需求關注點不同,為了滿足各角色的需求,單頁面信息往往會出現超負荷的情況。
          我們可以借鑒C端的個性化,對于非業務性的功能,允許用戶根據自己的需求和工作習慣進行自定義。
          比如下圖,在列表頁,我們為用戶提供了自定義篩選條件和表格字段的設置。

          3、提供有效決策信息

          由于業務復雜,保障功能的全面,帶來的結果通常是操作和選項較多,如果沒有任何指引,B端產品的用戶通常無法做出合適的選擇。
          比如下圖的添加商品,根據不同的使用場景,產品為用戶提供了三種添加商品的方式:

          只有三個選擇,看似沒有任何操作難度,但用戶面對未知功能時,通常會根據自己過往的工作經驗,選擇熟悉的功能,這樣一來,可能會誤增了工作量,因此在設計上,要提供輔助介紹說明,幫助用戶決策。

          我們在此基礎上,為第一次使用該功能的用戶又做了優化,除了消息提示框,還通過標簽強化視覺重點,推薦最適合新用戶的選擇,添加商品的文案也改的更通俗易懂。

          交互 — 以用戶效率為中心

          1、  提升用戶行為效率

          無論B端還是C端產品,都有一個共同的體驗目標:提升操作效率,高效率意味著用戶通過更少的操作,更少的時間完成任務,實現降低成本的目標。在C端產品中,常見的提升效率的方式有:1、根據用戶行為的流程分析,推薦相應功能;2、聚合用戶行為,縮短操作路徑;3、轉移用戶操作成本,讓產品承擔更多的用戶引導、行為判斷和行為記憶,我們可以從以上幾點切入優化B端操作效率。

          引導用戶操作

          在C端產品中,經常會有根據用戶的操作行為,產品給出相應的推薦操作,如截屏后,在用微信發信息時,系統會提示是否要發送截圖,這種在操作過程中增加相關功能的曝光或引導,提高用戶操作效率的同時也不影響流程的順暢進行。
          下圖是商品管理頁,用戶首次進入時,可以根據用戶觸發的操作推薦相關的幫助引導。

          手動創建商品時,需要完善很多商品信息,可以為經常出錯的內容預設提示,先發的避免用戶出現錯誤。

          在收起/展開菜單欄時,提示快捷鍵功能。

          / 優化任務路徑

          B端產品中通常會有一個任務關聯一些子任務,如果用戶在子任務中遇到困難,往往會造成整個任務效率的降低甚至任務中斷。

          比如在手動創建商品的流程中,需要將商品信息推送到渠道線上店才算創建成功,所以在創建商品前,需要完成渠道線上店的創建。針對這種關鍵子任務,我們可以嘗試并行任務,在選擇線上店時,增加創建線上店的入口,將任務連貫起來。還可以通過操作的合并,比如保存和添加同步進行,提升整體的任務效率。

          2、弱化低效感知

          好的產品體驗,不止強調功能,還會在意體驗中的感受,設計也可以左右用戶感知產品效率的快與慢。

          / 等待時間可感知

          用戶對等待的耐受度是有限的,等待時間在2s內是相對愉悅的,在時間不可控或時間較長的情況下,我們應盡可能縮短用戶的感知時間。

          比如在下圖中,用戶完成新手配置后,產品有個加載的過程,通過加載動畫和加載步驟的分解,告知用戶系統在運行中,縮短感知時間的同時消除用戶的負面情緒。

          / 容錯性設計

          在產品使用過程中,經常會出現因用戶“犯錯”而導致的任務中斷或失敗,這里的“犯錯”,通常是因為用戶操作偏離產品的使用要求,但這并不是用戶的錯,人不是精密的儀器,好的體驗應該包含這部分“錯誤”。

          比如錄入數據時,應給予實時的提醒,讓用戶可以及時更正,而不是等到提交時才拋出錯誤提示,還有比如在數字輸入框中誤輸入其他字符時,自動幫用戶清除等。

          在涉及對用戶影響較大、重要且不可挽回的操作時,給出提示。

          情感 — 關注情緒感受

          在整段體驗感受中,情緒最強烈和結束時的感受影響著用戶對整個體驗好與壞的判斷,這個現象就是峰終定律,因此我們可以通過關注這些關鍵時刻,來確保用戶對整段體驗是感到愉悅的。


          1、減少負峰

          消極的情緒,不僅影響用戶對產品的體驗感受,最終還會落到降低效率上,因此在設計時,我們要考慮減少用戶的消極情緒。

          / 提供明確反饋

          用戶使用產品的過程就像是與產品進行“對話”,良好明確的反饋能幫助用戶理解和使用產品,在工作完成時,應告知用戶已完成,出錯時,告知用戶哪個環節錯了,如何改進或提供幫助,不要讓用戶去猜,而是主動為用戶提供解決方案,提供確定感。

          比如在創建商品的流程中,商品創建完成后要推送到渠道線上店,中間有一段較長時間的等待,在設計時,根據推送中、推送完成、推送失敗,分別提供了3種對應場景的提示,讓用戶知道當前任務進展,以及展示相關對應的操作,即使任務失敗,用戶也知該如何處理,增加用戶的控制感。

          / 任務中斷可回溯

          在B端產品中,經常會出現決策信息多,處理鏈路長,需反復多次進入任務流程的情況,當任務被迫中斷時,用戶情緒會受到影響,且用戶對未完成或中斷的任務往往比已完成的記憶更深刻,針對這類情況,我們需提供可回溯的設計,幫助用戶順利完成任務。

          比如在將商品推送到渠道線上店時,同步過程中,用戶可以離開當前頁面進行其他操作,系統會將推送結果展示在列表頁,用戶可以通過列表頁,重新推送或者編輯修改后再推送,直至完成任務。

          2、結束于正峰

          在完成任務后,可以觸發氛圍動效反饋成就,給用戶積極的結尾。

          寫在最后

          以上就是我基于B端產品特征,和C端產品的體驗思維,用“B+C”的設計思維嘗試探索優化B端產品體驗的一些方案嘗試。“B+C”的設計思維,其本質是想找到業務與體驗的平衡,作為B端設計師,好的用戶體驗一定是與業務緊密結合的,與業務匹配的體驗優化才有其意義和價值。


          作者:Cila
          鏈接:https://www.zcool.com.cn/article/ZMTUyNDc0MA==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加微信ban_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~
          希望得到建議咨詢、商務合作,也請與我們聯系01063334945。 

          分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。 

          藍藍設計m.sdgs6788.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

          淺析:設計趨勢之開源設計

          鶴鶴

          什么是開源設計(Open Source Design)

          在講開源設計前,我們或許可以先講講開源一詞是指什么。

          開源全稱開放源代碼,開源軟件最大的特點是開放,也就是任何人都可以得到軟件的源代碼,加以修改學習,甚至重新發放,當然是在版權限制范圍之內。雖然開源一詞最初是為軟件開發而創造的,但現如今開源所涉及的領域也極其廣闊,并不只是包括軟件領域,如醫藥領域的藥物開發開源、文化領域的書籍到期開源等等所以開源設計已包含了更廣泛的含義,它包括了由任何人或者團隊自由共享、協作的設計方案、項目、產品。

          我們來看幾個大型開源的設計了解一下~

          開源設計資源舉例

          Ant Design

          阿里的開源系統后臺組件庫

          https://ant.design

          ECharts

          百度推出的開源圖表

          https://echarts.apache.org/

          Unsplash 

          全球知名圖片開源平臺 

          https://unsplash.com

          所以我們不難發現開源設計都有以下特點: 

          免費(大部分是):開源設計的一個關鍵要素是它們通常(但不總是!)免費。這是一個重要因素,因為閉源設計通常需要花費不菲的價格或者冒著侵犯版權的風險去使用。 

          思想碰撞:更多的設計師或者創意愛好者共同為一個創意提出自己的見解和再設計。


          設計開源領域廣闊:設計開源領域也幾乎涵蓋了所有的設計和創意領域如平面設計、三維設計、用戶體驗設計、環境設計、建筑設計、服裝設計、插畫、動畫設計等等 

          但是許多人可能會有一個疑問,開源設計和以往的素材網站或者源文件售賣網站有什么區別呢? 

          在我看來,開源網站與傳統售賣設計資源的網站最大的區別是開放與共建,以figma的社區為例,作者發布作品后,任何人都可以對其作品進行redesign甚至remix,這極大的提高了設計師的興趣,每個人都希望自己的作品能被他人看到,也希望自己的創意能與他人的創意進行更好的結合,這是一個多么美好的場景。而傳統網站只是冷冰冰的展示文件售賣資源,缺少了設計中的靈魂。 

          那說了這么多,開源設計到底有哪些優勢呢?

          開源設計的優勢 

          提升設計效率:設計師不應花費時間去解決別人已經解決的問題,比如當我設計一個新項目時,無需從零開始設計系統組件,可以直接使用Ant Design、Ant Mobile Design等現有組件庫。


          增加學習機會:通過開源社區,設計人員可以從其他人所做的項目中學習,并與專業人員交流經驗。 

          提高設計質量:設計師自己看本人作品時,往往是身在其中不知如何下手,而將作品發布到更廣泛的社區有助于設計師獲得有價值的反饋以改進他們的作品。 

          提升品牌價值:對設計開源后,公司品牌能在某些領域內獲得傳播,提升品牌價值。并且在招募人才時也能成為有吸引力的一項條件。 

          提升個人價值:一個設計師想要提升個人價值和影響力,可以用開源作品來在行業內獲得一定口碑,甚至直接將用戶流量轉化為訂單,或許是更簡單且容易的事情。 

          從這些優勢中不難發現,在開源生態中,我們的作品不再是一座孤島,通過互聯網,我們的作品可以和任何人進行鏈接并且產生共鳴,提升品牌和個人的價值,所以每個人都值得感受開源的美好。 

          但開源的同時不可避免的會帶來許多新的問題和挑戰,讓我們一起來看一下。

          開源設計帶來了哪些挑戰 

          知識產權問題:在開源社區中,設計師可能不清楚其創作的知識產權。因此,他們可能會不自知地侵犯其他設計師的知識產權。 

          設計門檻問題:設計開源意味著設計師的門檻變低,任何人都可以隨意使用開源的設計項目,導致設計師不再愿意花心血創作。 

          設計師競爭力下降:開源設計意味著普通的設計內容已不需要單獨的設計師來完成,頂尖設計師的機會會更多,而普通設計師的競爭力會明顯下降。 

          隨著這些挑戰的來臨,如何更好的面對設計領域的開源是值得深思的問題,既要保護設計師的自身利益,也要讓設計行業在開放、共享的環境下擁抱變革,所以在未來的道路上,我們每個人都可以嘗試用自身的方法去探索未來,讓每個人都能成為時代浪潮中的一朵浪花。


          作者:芝麻侃設計
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

          作者:芝麻侃設計     來源:站酷

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加微信ban_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~
          希望得到建議咨詢、商務合作,也請與我們聯系01063334945。 

          分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。 

          藍藍設計m.sdgs6788.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司

          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://m.sdgs6788.com

          存檔

          99久久精品国产毛片| 国产精品对白刺激久久久| 精品久久人妻av中文字幕| 国内精品久久人妻互换| 久久激情亚洲精品无码?V| 久久一区二区三区免费| 日本欧美久久久久免费播放网| 久久精品国产亚洲77777| 伊人情人综合成人久久网小说| 2021精品国产综合久久| 亚洲AⅤ优女AV综合久久久| 国产精品久久久久jk制服| 日韩十八禁一区二区久久| www性久久久com| 伊人情人综合成人久久网小说| 久久久青草久久久青草| 99久久综合国产精品二区| 亚洲国产二区三区久久| 亚洲天堂久久久| 日本久久久精品中文字幕| 亚洲中文精品久久久久久不卡| 久久人人爽人人澡人人高潮AV| 久久久久亚洲AV无码专区体验| 久久久久99精品成人片| 欧美伊香蕉久久综合类网站| 亚洲精品国精品久久99热一| 久久人人爽人人爽人人片AV麻烦| 欧美亚洲国产精品久久高清| 亚洲日韩欧美一区久久久久我| 久久久久无码国产精品不卡| 久久精品成人免费网站| 久久天天躁狠狠躁夜夜2020| 国产精品久久网| 久久久久久综合一区中文字幕| 亚洲中文久久精品无码| 亚洲成色WWW久久网站| 国产精品久久久久久久久软件| 欧美大战日韩91综合一区婷婷久久青草| 久久国产精品久久国产精品| 久久亚洲国产精品一区二区| 久久精品国产91久久综合麻豆自制|