2022年網頁設計趨勢

如果我們在過去兩年中學到了什麼，那就是我們必須不斷適應新事物。 在生活和設計中都是如此，隨著我們進入 2022 年，設計師開始擁抱生活的混亂並通過他們的設計來表達它。

2022 年的趨勢正在朝著更大膽、更有創意、更具互動性的設計發展。 創作者傾向於更多的破壞，並推動被認為是“好的”網頁設計的界限。

通過實施我們預計在 2022 年會看到更多的一些趨勢，在新的一年裡激發你的創造力：

• 互動迷你網站
• 復古風格的設計
• 開放式概念設計
• 更多定制
• 3D 對象，2D 滾動
• 粗野主義
• 玻璃態
• 創意滾動效果
• 超大字體
• 可見邊界
• 具有抽象視覺效果的拼貼組件

互動迷你網站

你很擅長你的工作——炫耀一下！ 展示你的技能是一個更小、更可控的環境，具有高度專業化的內容和交互是設計師吸引新客戶的一種方式。 向潛在客戶展示你可以通過僅僅為了創造而創造一些東西來創造真正獨一無二的體驗。

韓國開發商 Jungik Lee 創建了這個迷你網站，讓用戶可以完成三個簡單任務之一。 它使用大量顏色和簡單的方向來創建或移動不同的對象，並且用彩色圓圈填充頁面實際上非常有趣。

阿姆斯特丹的網頁設計師 Victoire Douy 在她的小型作品集網站上使用交互性來吸引您的注意力。 只需移動光標，您就可以打亂顏色、拖拽字符串、移動對像等等。

復古風格的設計

美國網頁設計師的平均年齡為 37 歲，穩居千禧一代。 因為千禧一代是真正將互聯網作為日常用戶的第一代人，所以許多設計師受到網絡早期流行的藝術、排版和顏色的啟發也就不足為奇了。

Wild Souls 有一個電子商務網站，它將五顏六色的形狀與重疊的風格配對，創造出適合食品公司的有趣、充滿活力的美學。 他們是一家專注於堅果、堅果醬、蜂蜜和果醬的零售商，他們的產品上的懸停效果添加了新的紋理和形狀，這些新的紋理和形狀在整個 90 年代靈感的視覺主題基礎上進行了高雅的構建。

Cartoon Network 本身就是 Y 世代和 Z 世代所鍾愛的品牌。該工作室的網站使用黑白底色，搭配大膽的色彩和令人愉悅的動畫，使網站既復古又非常流行。

開放式概念設計

也許大流行正在影響我們的設計偏好以及我們的親身行為，因為在設計中留下大量開放空間的新興趨勢。 它可能不是六英尺，但設計師在部分之間留下了越來越多的空間，專注於頭條新聞，有時完全廢棄英雄形象，給用戶足夠的呼吸空間。

任何種類的烈酒都清脆爽口，位於科羅拉多州丹佛市的 Bear Creek Distillery 網站也不含額外的添加劑。 他們網站的設計理念與他們精製的伏特加、波旁威士忌、朗姆酒和威士忌一樣乾淨。

Atalson 是一家位於紐約市的產品和包裝設計、材料採購和製造公司。 可持續性是他們流程的核心，通過使用空白空間，清潔製造的理念在他們的網站上得到了視覺反映。 這個開放空間允許他們設計的產品成為焦點，而圖像上的懸停效果表達了產品的概述或對其公司價值的解釋。

更多定制

隨著用戶在網上花費更多的時間和金錢，提供商正在尋找新的方法來吸引更廣泛的受眾群體。 為此，許多人正在提高其網站和應用程序上可用的個性化水平，包括對包含功能的巨大改進，這些改進超出了所有網站應遵循的標準可訪問性最佳實踐。

Pinterest 的“美容”類別是該網站上搜索次數最多的類別之一，該公司認識到需要對其所有用戶更具包容性。 Pinterest 現在通過提供“膚色範圍”功能在該類別中創建更快、更個性化的體驗。 對於許多用戶來說，這是對應用程序上較淺膚色過度飽和的解決方案，因此所有 Pinterest 用戶都可以更快、更輕鬆地找到適合他們的外觀。

萬事達卡已經找到了一種方法，通過創建“真實姓名”系統，讓更多持卡人在交易過程中表達自己的真實身份。 這允許跨性別和非二進制萬事達卡持有人在他們的卡上列出他們的真實姓名而不是他們的死名，無論他們的名字是否已合法更改。

3D 對象，2D 滾動

帶有 3D 模型和平面 2D 內容演示的設計看起來引人注目且完全具有凝聚力。 當您幫助用戶更好地理解物理概念時，以可預測的方式在背景中使用交互式 3D 元素呈現易於理解的內容尤其有用。

宣傳這個位於俄羅斯莫斯科市中心附近的新商業區的網站是一個很好的例子，它專注於 3D 核心，伴隨著簡單、扁平的內容。 主頁顯示了斯科爾科沃公園的可移動模型，但並沒有掩蓋顯眼的內容。

One Ocean Science 是一個知識共享峰會，旨在從多學科的角度聯繫全球海洋保護和研究領域的領導者。 他們的網站主頁以 2D 滾動顯示地球的 3D 模型歡迎您，當您滾動時，它會移動，突出顯示不同的區域和在那裡進行的研究。

粗野主義

粗野主義是指一種非常塊狀、幾何、粗糙的藝術和建築風格。 在網頁設計中，這種粗魯而簡單的風格脫穎而出，因為它傾向於避​​開網站遵循的一些傳統規則，而傾向於極簡主義。 這種風格的網站通常以黑白方式完成，幾乎沒有多餘的裝飾和粗體文本，以達到鮮明的效果。

意大利創意機構 Carosell 的品牌形象就是誠實和坦率。 他們相信設定切合實際的期望，考慮其戰略的後果，並尊重客戶的時間和預算限制。 Brutalistic 網站幫助他們說明他們作為一個簡潔、簡潔的代理合作夥伴的故事。

出生於巴黎、出生於加利福尼亞的設計師 Rick Owens 曾將他的家具設計理念描述為“野獸派岩石上的野獸派皮毛，旁邊是野獸派洞穴中的野獸派火焰”。 在他的服裝和配飾系列網站上，你不會找到任何家具——但你會在圖像和佈局中找到明顯的野獸派靈感。

玻璃態

顧名思義，Glassmorphism 是一種使屏幕看起來像是由玻璃製成或被玻璃覆蓋的藝術，通常用於模糊用戶界面上的背景。 到 2022 年，隨著設計師通過創建類似玻璃的動畫對象和文本來推動前端邊界，這種趨勢應該會繼續流行。

數字產品機構 Dovetail Studios 為這套以不同角度旋轉的 Glassmorphic 嵌套環製作了動畫。 它吸引眼球並展示了他們團隊的 3D 建模能力。 網站上的其他圖標也反映了這種效果。

另一家數字創意機構 Lo and Behold Studios 也在其主頁上使用動畫 Glassmorphic 對象。 然而，較輕的整體主題給他們的網站帶來了與用戶在查看 Dovetail 時完全不同的效果。

創意滾動效果

許多設計師正在擴展去年的水平滾動趨勢，並進一步嘗試滾動效果。 無論是水平的、並排的還是多向的，改變用戶瀏覽網站的方向都是一種簡單的方法，可以為他們提供更動態的整體體驗。

荷蘭家具公司 Moooi 讓用戶在滾動時越來越深入地了解他們的收藏。 他們的網站提供三種體驗：Beauty Blooms、Defy Gravity 和 Paper Play。 在每一個中，屏幕都會打開以顯示一個接一個的集合，當您滾動時，您將深入了解新的模式和小插曲。

Kayla Fisher，一位我們之前討論過他的網站的攝影師，使用並排滾動，將菜單保持在屏幕左側。 這使您可以以視覺上引人入勝的方式查看她的作品，而不會忘記迫使用戶深入研究的大按鈕。

超大字體

您的網站應該對您作為一家公司的身份做出大膽的聲明。 許多公司通過使用超大字體作為標題，甚至代替英雄形象來認真對待這個想法。

技術研究集體 HUMAIN 正在努力彌合人類經驗與技術創新之間的差距。 在 Cronos Group 的支持下，他們的目標是尋找新方法來使用新興技術來增強在線和生活中的人類體驗。 通過使用文字代替英雄形象，這家故事複雜的公司從您進入他們的網站的那一刻起就大聲疾呼他們的使命。

當您想到耳機時，腦海中浮現的想法既是視覺上的，也是聽覺上的。 耳機公司 AIAIAI 的名字既是一個名字，也是一個感嘆號，它向訪問其網站的用戶發出了大膽的聲明。 大文本介紹了公司，然後是一個較小的、與英雄相鄰的視頻，就在首屏下方，打破了英雄形象然後是文本的傳統模式。

可見邊界

可見邊框為您的設計提供結構，並通過您的內容吸引用戶的注意力。 只需使用簡單的線條，邊框就可以在為需要整潔網站的客戶進行設計時為您提供幫助。 另一方面，有趣、時髦的交互式邊框可以通過使用大膽的顏色或交互式效果為您的在線訪問者創造額外的視覺興趣。

獨立機構 Bonjour Paris 將可見邊界與水平滾動條相結合，因此該網站極簡主義，但仍然具有很多吸引力。 線條邊界繼續穿過場地到他們的項目部分，在那裡它們呈現出新的形狀，而不會顯得模棱兩可或忙碌。

澳大利亞餐廳 Curry Cafe 有兩個地點，他們網站的滾動邊框提​​供了一個堅實的框架，用戶可以通過該框架消費其餘的豐富多彩且引人入勝的內容。

具有抽象視覺效果的拼貼組件

自網絡誕生以來，我們已經取得了長足的進步。 一些設計師正在接受結構化美學，而另一些則朝著相反的方向發展。 當每個元素都經過精心設計時，大膽的顏色、重疊的圖像和多種紋理都可以無縫地融合在一起。

Illuminating Radioactivity 是一個教育網站，由 Stimson Center、Reinventing Civil Defense 項目和 Bombshel​​ltoe Policy x Arts Collective 合作創建。 它講述了“放射性”這個詞的歷史和意義，以及我們與它的聯繫，以及它在科學、娛樂、醫學等領域發揮作用的方式。 當您滾動時，您會被舊照片所淹沒，這些照片有助於講述與明亮抽象的形狀搭配的歷史。

澳大利亞公司 The Loved Up Co 使用方便的工具包為約會之夜增添情趣，這些工具包提供您與伴侶過夜所需的一切。 他們的主頁以拼貼風格的人物為特色，其中的身體是從黑白照片中拍攝的，而頭部則疊加著微笑的嘴巴、鮮花和雞尾酒！ 抽象的形狀、圓圈和曲線出現在整個設計中，以繼續通過它們的內容移動眼睛。

設計網絡的未來

密切關注這些趨勢，並嘗試一些引起您注意的概念。 如果你的趨勢追踪眼光敏銳，你甚至可能已經註意到 2022 年的一些網頁設計趨勢是去年趨勢的延伸或排列。

看到一些你喜歡的嗎？ 我們遺漏了什麼？ 請在下面的評論中告訴我們並記住：留存下來的款式和正在流行的款式都取決於像您這樣的設計師今年決定與您的客戶一起創作的款式！