<optgroup id="igk00"></optgroup>
<code id="igk00"><small id="igk00"></small></code><code id="igk00"><xmp id="igk00">
<optgroup id="igk00"><div id="igk00"></div></optgroup>
<optgroup id="igk00"></optgroup><code id="igk00"><xmp id="igk00">

2022 年 UI/UX 設計趨勢

資訊頻道 - 創意潮 來源:設計在線 作者:dayue 2022-05-17

2021 年比 2020 年變得更好了嗎?是的,如果我們探討的是 UI 和 UX 設計的話。新的令人驚艷的網站和 APP 被開發出來,面向設計師的新軟件得到更新和發布,創造力被進一步激發了出來。

設計師被迫待在家里時,終于能有時間去反思現有的設計并重新創造。無聊是藝術家最大的敵人,他們會盡可能地打破困局。

那么,2022 年的 UI/UX 設計趨勢是什么呢?看看現在的情況,我們已經可以預測未來的設計趨勢,就像我們對 2021 年所做的預測一樣(回頭看非常準確)。

在本文中,我們將發現:

 “

    -3D 視覺設計師的內卷將會越來越嚴重

    -數據可視化的工作將變得越來越重要

    -服務的移動化還需要做出更多努力

    -scrollytelling 技術會越來越流行

滾動已死,滾動敘事興起

舊的滾動是無聊的。如果你想吸引注意力,你就需要實現滾動敘事(scrollytelling)。(這個技術的核心在于邊滾動頁面邊講故事)

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

《紐約時報》是第一批在他們的文章《雪花飄落》中使用滾動敘事手法的機構之一。

它是一種敘事形式,可以在網頁和 APP 上呈現。想象一下,在一個網站中每個插圖、文本和其他元素都開始變得生動起來。自然地,你會想看到這個故事的結局。它就像一個游戲,帶你穿越迷宮。雖然你不能影響它的進程,但卻讓你感覺自己能參與其中。

2022 年,Scrollytelling 將會出現在你看到的每一個流行網站上。

另一方面,scrolllytelling 讓用戶真正去閱讀內容。你可以用動態文本讓他們產生興趣,比如谷歌的網站(https://www.google.com/search/howsearchworks/)。他們的團隊知道如何讓信息看起來更好:

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

Scrollytelling 在用戶向下滾動時被激活,因此得名。沒有點擊,沒有選擇的麻煩,沒有彈出窗口。你似乎停留在一個地方,但通過滾動,把屏幕上的故事慢慢展開。這不僅要求設計師創造出酷炫的視覺效果,還需要認真思考一個你想要講述的故事情節。

所以,最好的網站不可能在 2 天內建成,需要更多的時間去打磨。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

IAmBinadam 令人驚艷的敘述設計

滾動敘事的項目通常需要大量的時間和精力。不過,這樣做的結果是值得的。頁面變成“活的”,每一秒都有新的事情發生,所以在閱讀時很難感到無聊。

那么移動端 APP 呢? Pure 是一款約會應用(彩云注,這個應用在 app store 可以搜到,推薦大家安裝一個體驗一下,非廣告),它創造了一種我稱之為“tappytelling”的故事(當你第一次點擊并打開應用時,它就會被激活):

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

Scrollytelling 是為用戶而創建的,用戶很喜歡它,不需要到其他頁面去閱讀整個故事。相反,網頁設計的整個故事都是事先考慮好的,并盡可能以最有趣的方式設計出來。

用戶喜歡看數據,數據可視化越來越被重視

如何在 2022 年做出一個還不錯的企業網站?你不會想告訴用戶你是“XX 領域公認的領導者,該領域最好的之一”。這種標準的廣告表達并不傳達任何有價值的信息。

最好不要用形容詞,而是用事實來說明:你有多少分支機構,在哪些城市,誰是你的客戶,以及你是如何幫助他們的。抽象信息是不可靠的。但如果你有很多想要分享的數據,你需要讓它不僅簡單,而且有趣。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

數據可視化有助于以一種吸引人的方式傳達正確的信息。它也可以與滾動敘事(Scrollytelling)緊密結合。以下是 IAmBinadam 展示數據的方式:

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

通過去除數據集的復雜性,使信息更容易讓讀者感知。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

不同級別的數據具有不同的大小,這樣用戶知道應該先從哪里查看

讀者可以很快注意到作者試圖通過圖片引出的結論?紤]到如今人們消費的數據量巨大,那些干凈整潔的數字帶來的正面影響更大。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

有些圖表乍一看甚至不像圖表,這使得它們更加能被注意到

還有一種現象叫做“新冠后遺癥”。這是 Covid 對公司及其員工的長期影響。根據英國國家統計局的數據,2018 年,壓力和焦慮的平均得分約為 2.7/10。自新冠疫情發生以來,得分已升至 4.0/10,很少低于這一水平。同樣因為大流行,在過去兩年里工作量增加了 4 個小時。

人們壓力太大,卷的太辛苦,以至于不愿去看復雜的數據。

設計師做好數據可視化,以保持人們的注意力。記住,復雜的信息通常被忽略,因為讀者試圖節省他們的時間,更有可能使用滾動按鈕。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

Illustration by Mona Chalabi

以下是我們推薦的一些表示數據的方式

 “

    圖表和曲線圖

    插圖

    靜態信息圖

    互動信息圖

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

Illustration by Ink Factory

如何讓信息圖表看起來更好?

一個好的圖表,或者任何其他形式的數據可視化,都應該具有在 Edward Tufte 的“定量信息的可視化顯示”中描述的特征。在他的書中,Tufte 通過圖表解釋了好圖表的 3 個原則:

1)展示數據的圖形元素與數值總數的比值應趨向于 1。簡單地說,應該刪除一切不必要的元素,保持整潔。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

Graph by Hootsuite

2)充分利用好畫面空間。也就是說,需要將數據編排的更緊密。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

Graph by Hootsuite

3)客觀地描述數據。不要使用夸張的圖表,可視化數據可以看起來很酷,但真實永遠是更重要的。

2022 年還有必要做 APP 嗎?

根據 We Are Social 的數據,2021 年有 52.2 億人使用手機,約占世界人口的 66%。自 2020 年 1 月以來,手機用戶數量增長了 1.8%(9300 萬),而手機聯網總數量增長了 7200 萬(0.9%),到 2021 年初達到 80.2 億。

過去一年,社交媒體用戶的數量增長了 13%以上。到 2021 年初,社交網絡上已有近 5 億新用戶注冊。根據 App Annie 的數據,Android 用戶每天花在手機上的時間超過 4 小時。2020 年,安卓用戶上網時長超過 3.5 萬億小時。

令人印象深刻的數字,是嗎?似乎到 2022 年,為產品做一個 APP 將成為必須擁有的東西。如何知道你的公司是否真的需要一款應用?有以下幾點可供評估:

1)用戶主要通過移動設備訪問你的網站

這是你應該了解的重要數據?蛻艉湍阍谝黄鸬臅r間越長,你就有越多的機會去吸引他們,了解他們的習慣,并給他們想要的東西。(彩云注:這就是為什么各大廠之間都在拼命搶占用戶的在線時長。)

2)幫助內部業務流程更加有效

如果你想要提高員工的工作效率、改進工作流程或增加利潤,那么就制作一個可以幫助管理業務流程的移動應用。

如今,像這樣的手機應用使企業能夠執行越來越復雜和多樣化的任務,加快日常重復操作和文檔管理。

3)實現一些網站上沒有的新功能

如果你認為 APP 能為用戶打開新的觸點,并讓用戶體驗更加友好,那么它就值得考慮開發。問問自己的 APP 能提供什么新的商業機會?例如,隨著疫情的蔓延,許多人開始用上健身 APP 在家里鍛煉。

4)競爭對手的情況

要了解競爭對手在做什么,他們是否有 APP,能做什么,以及他們是否真的對用戶有用。

查看 App Store 和谷歌 Play 的統計數據。下載和評論的數量可以告訴你用戶是如何使用競爭對手的應用的。如果他們的服務真的很方便而且很有必要,那么你就容易被甩在后面。

5)復購率

一個應用可以幫助你留住那些習慣從你那里購買的人。如果想為老客戶開展促銷活動了,給他們發送一個通知就能完成,成本更低。

在正確的時間提供的報價越有吸引力,人們購買的可能性就越大。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

出租車服務公司有回頭客,他們肯定需要一個應用

6)促銷工具

有了應用,你就不需要花錢設計和制作實體卡,客戶也不需要隨身帶卡。將促銷計劃整合到 APP,并分享有用的促銷信息。

做原生 APP 還是移動端網站?

開發手機網站比開發手機應用需要更少的工作量,這反過來可以降低整體推廣成本。

這部分是由于響應式設計的出現,它允許你根據打開網站的設備屏幕來調整網站。至于 APP,它們必須為許多移動平臺單獨編寫:Android、iOS、Windows 等。

一些設計師認為“前端驅動的網絡體驗”會是 2022 年的一個好機會,我非常同意!
(彩云注:在國內,現在開發小程序的肯定越來越多了。)

3D 設計具備更強競爭力

我們一開始并沒有將其放在首位,因為這并不是一個新的趨勢,在很久以前設計師們就已經設計了很多 3D 圖像和動畫了。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

Cardi B rhymes with 3D

3D 技術已經在過去流行了很多年,但它不會很快消失。此外,我們預測 3D 圖形將變得更加多樣化和包容。

在過去的幾年里,3D 藝術和動畫已經出現在各種 UI 設計趨勢評論中。這意味著越來越多的設計師將它們整合到頁面中。

3D 當然應該成為 2022 年最熱門的趨勢和預測之一,因為與經典動畫相比,逼真的 3D 形狀結合動畫總是引人注目的。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

“從技術上講,通過 3D 更容易傳達更多內容,因為它比平面圖片更接近我們的感知。3D 插圖更有深度,信息量更大,也更具互動性!

許多設計師將 3D 對象無縫地“安置”在 2D 空間中。它允許創建更有趣的組合,也作為一個優秀的工作方法蘊藏著巨大的潛力。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

烏克蘭政府網站用 3D 手模擬了黑客帝國

注意一點:在整合 3D 圖形等重量級內容之前,確保你的應用性能是 OK 的,能夠快速加載所有元素。

元宇宙風潮

Meta 的 logo 既不是 2D 也不是 3D;蛘邇烧呒娑兄?這就是即將到來的 2022 年的莫比烏斯帶和薛定諤的貓。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

Meta logo 的變化

(這個概念在去年簡直不要太火,未來幾年肯定還會是一個大的趨勢,設計師也需要保持關注。跟著趨勢走,易于放大自身價值。)

混合動畫

越來越多的公司在網站和移動應用中使用動畫,以提高用戶的沉浸感和體驗,使內容更有趣。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

動畫是 2022 年重要的網頁設計趨勢。2022 年,如果沒有它,你的產品很可能會看起來就像個半成品;旌巷L格的動畫越來越受歡迎:定格動畫和 3D 動畫的結合,2D 動畫和 3D 動畫的結合。設計師這樣做是為了獲得不同尋常的風格解決方案,以及提高最終產品的質量。

2022 年,動畫設計將是品牌市場定位的重要組成部分,想想一個公司新的視覺形象——動畫形象。隨著這個領域的專業設計師數量的增長,實現新想法的機會也在增加。

2022 年如何使用網頁動畫?

1)講故事

動畫可以通過在界面和用戶之間建立情感聯系來傳達信息。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

加載動畫 Yoichi Kobayashi

2)更有趣的加載

用戶不愿意等待,除非載入畫面很有趣。帶有百分比的動畫不僅可以分散用戶的注意力,還可以告知他們加載頁面需要多少時間。使用進度條或者任何你能想到的可以顯示時間流逝的東西。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

3)光標效果

用戶可以精確地觀察光標所在的位置。通過添加智能互動動畫,對這個光標作出反應來探索網站。這種效果在 21 世紀初非常流行。如你所知,流行趨勢往往每 20 年就會重演一次。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

4)動態排版

你有沒有想過讓字母跳舞?

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

添加角色的動畫插圖

據 Statista 統計,2020 年全球動畫市場達到了 2700 億美元。趨勢是視頻,而不是靜態信息。全球品牌在社交網絡上使用動畫制作廣告。毫無疑問,動畫插圖的優勢是它們非常靈活和多樣化。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

寶馬歷史動畫

這樣的作品通常用于兩種情況:

1)用于解釋視頻

2)電商廣告

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

動畫解說的趨勢出現在幾年前,解說視頻清楚地顯示點擊的位置或公司的項目是關于什么的。

在招聘或商業視頻中,用戶更喜歡看畫出來的人物,而不是抽象的形狀或物品。畫出來的人物可以喚起情感共鳴,就像活著的人一樣。

微交互,大影響

微交互是幫助用戶瀏覽網站或應用的小界面變化。通常這些是作為提示用戶的視覺或聲音效果:它們顯示發生了什么,將導致什么操作,下一步需要做什么。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

圖片來源 awwards

動畫交互將為你的設計注入活力,并有助于保持用戶粘性。關注每一個細節是設計師工作的關鍵,因為設計中的所有元素都可以帶來積極的用戶體驗。

重要的是要達到元素的和諧,而不是把注意力分散到界面的各個方面。微交互作用的一個重要部分是顏色,它們為界面元素增強價值。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

CTA animated

微交互有助于頁面導航,解釋它們的功能。最重要的方面之一是加快和簡化以前冗長的功能,以實現特定的行為。

動態 logo,加深品牌印記

2022 年,在線品牌面臨著新的挑戰,需尋求新的解決方案,其中之一就是動畫 logo 設計。

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

圖片來源 Toridori

動畫 logo 主要有以下幾點營銷優勢:

    吸引注意力。這意味著它們有助于提高品牌知名度。

    有助于提高 SEO。谷歌更傾向于動態內容,帶有動態圖形的頁面更容易吸引用戶。

    在移動端看起來更好。絲滑的動畫看起來比靜態的 logo 更有趣。

最重要的是展示了歷史。靜態 logo 背后的想法正在動畫中發展。由于這一點,在幾秒鐘內,你可以展示品牌的使命,甚至它的價值!

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

一家洗衣機[公司]的標志

現在有很多設計模板,可以很容易地用字體制作一個動畫 logo:

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

國外專業機構出品!2022年你需要抓住的 8 個UI/UX<a href=http://www.coghlaninstitute.com/ target=_blank class=infotextkey>設計</a>趨勢

來源 Shabello, Bobby Voeten

最后的話

記住,設計趨勢總是在變化的,但是設計的意義不會變。如果你不能深刻理解這一點,那么任何設計趨勢的文章不能幫你做好設計。

聲明:站內網友所發表的所有內容及言論僅代表其本人,并不反映任何網站意見及觀點。

全部評論

暫無相關推薦
美女少妇乱人伦,国产午夜无码片在线观看,1000部免费无遮挡拍拍拍
<optgroup id="igk00"></optgroup>
<code id="igk00"><small id="igk00"></small></code><code id="igk00"><xmp id="igk00">
<optgroup id="igk00"><div id="igk00"></div></optgroup>
<optgroup id="igk00"></optgroup><code id="igk00"><xmp id="igk00">