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 年的一些网页设计趋势是去年趋势的延伸或排列。

看到一些你喜欢的吗？ 我们遗漏了什么？ 请在下面的评论中告诉我们并记住：留存下来的款式和正在流行的款式都取决于像您这样的设计师今年决定与您的客户一起创作的款式！