2022年网页UI/UX设计趋势：从行为设计到复古UI

时间：2023-10-08 04:06:02 | 来源：网站运营

时间：2023-10-08 04:06:02 来源：网站运营

2022年网页UI/UX设计趋势：从行为设计到复古UI：流行的设计和创新的UX和UI方法很快就会变得疲倦和过度，因此掌握最新的网页设计趋势对于保持领先地位至关重要。涵盖从行为设计到复古 UI 的方方面面，我们将在来年看到的网页设计趋势有望将过去久经考验的设计元素与未来的技术相结合，产生一些真正令人兴奋的新发展。

1. 行为设计

行为设计就是使用视觉线索来塑造用户行为。将创意设计与科学数据相结合，它使设计师能够更好地了解用户的想法，从而更有效地影响他们的行为方式。

这种方法通常用于创建产品和应用程序，帮助用户完成一些事情，例如达到健身目标、培养技能或保持日常习惯。行为设计采用诸如稀缺性之类的技术——比如在酒店预订网站上“只剩下一间房间”——以及 CAR 模型——一种基于提示、行动和奖励的策略。

许多产品都采用了行为设计思维，包括流行的冥想应用Headspace。该平台的成功在很大程度上取决于它通过鼓励订阅者每天冥想来保持订阅者活跃的能力。技术包括个性化的每日播放列表、统计数据和冥想历史，甚至允许用户与“好友”同步时间表。Headspace 是数字产品的一个很好的例子，它了解用户的行为以及如何激励他们参与。

“从知道何时给植物浇水到确保洗手至少 20 秒，到 2022 年，我们可以预期数字产品和人工智能对行为设计的持续需求，以加强行为并帮助人们养成习惯，”解释说Envato 的高级产品设计师 Viv Wu。“人们只依赖日历提醒和书面笔记的日子已经一去不复返了。在这个竞争日益激烈的市场中，企业不断收集人们的数据并监控用户行为，为用户创造价值并提高产品参与度，但我们该在哪里划清界限呢？”


因为行为科学可以成为塑造人们选择和行为的强大工具。这种方法存在一些伦理问题，但随着行为设计的流行，希望设计行业继续将其用作积极的影响，而不是操纵用户。

要在您自己的 UX 或 UI 中使用行为设计，请查看Elements 上的 usedesignspace 的行为说明或CodeCanyon 上的WoWonder Android Messenger – WoWonder Social Script 移动应用程序。

2. 复杂的渐变

虽然渐变可能不是一个新趋势，但随着时间的推移，它们肯定已经走了很长一段路。复杂渐变是视频和网页设计中出现的最新发展之一，通常用于增加平面图像的深度。

您可以在这个平面设计组合中看到复杂渐变的使用，它使用橙色、粉红色、紫色和蓝色色调的空灵混合来增加温暖和深度。创意机构Zeus Jones在其网站上使用了类似的效果，设计从单色渐变为彩色。

Envato UX 设计师 Sean Feehan 说：“渐变在可能的技术执行方面取得了长足的进步。” “这导致了创意社区通过运动、不规则和多色混合进行了令人兴奋的探索和发展。”

要为自己尝试复杂的渐变，请使用melantic 的 Gradient Tumblr Theme 之类的东西。它是完全可定制的——你需要做的就是上传你自己的背景图片，选择你的颜色组合并开始将它们变成渐变。在渐变背景和纹理方面，试试Sko4 的十个超级生动的可调渐变集合。

3. 大字体和现代衬线

排版是UI 设计中一个非常重要的元素，我们看到了一些排版趋势的发展。

大字体

首先，大字体回来了，而且比以往任何时候都好。

具有旨在产生影响的大而粗体的字母，大字体可以在网页设计中做出令人印象深刻的视觉陈述——尤其是与更简约的设计或布局相结合时。选择更大尺寸的文本可以很好地创造引人注目的第一印象，也可以将其他设计元素联系在一起。

“随着设计倾向于更小的离网布局，大排版有助于将它们联系在一起并提供简单的品牌影响，”Envato 内容专家 Vail Joy 解释道。

法国老佛爷百货公司的导航菜单采用中性、大胆的字体——让品牌的大标志在主页的中央脱颖而出。这与竖切出的图像，配对的说明图标，和单色的调色板，创建了一个狡猾的，拼贴的感觉。

使用这个Tobel – Elated-Themes 的现代家具店– Elementor 的电子商务主题，将大而大胆的排版融入您的网站。专为室内设计或家具店而设计，是一种现代而别致的大型类型。

当代衬线

在字体范围的另一端，当代衬线字体也有一段时间。

融合了传统衬线的精致装饰元素和优雅的华丽，现代衬线还搭配有趣、复杂的渐变，打造时尚现代的外观。例如，品牌战略家查理·奥斯本 (Charlie Osborne) 的这个网站采用微妙的衬线样式，这是页面的英雄字体，同时也优雅地低调。

为了在您的作品中加入现代衬线字体，这款Black Delights – Elegant Serif by mokatype使用环状连字并散发出精致的风格。非常适合引用或徽标，它是一种引人注目的类型，可以让您的设计与众不同。

4. UI 中的复古设计

继续我们对所有复古事物的痴迷，复古 UI 现在正在网页设计中起飞。

70 年代灵感的椭圆形和拱形边框半径

我们看到的第一个复古趋势是“椭圆形和拱形边框半径”。这种风格涉及将图像裁剪成椭圆形和拱形，具有与图像稍微分开的细边框，反映拱门或椭圆形。

“这种趋势在时尚和作品集展示中很流行，是对 70 年代复古杂志布局的一种致敬，”Vail Joy 说。“它通常与大地色调相结合。”

您可以在Farhan Fauzan 的 Photo Studio 网站上看到这种趋势。拱门让人联想到独立的镜子，以微妙而经典的方式展示摄影作品。

要在您自己的时尚或生活方式网站上获得 70 年代的优雅外观，请尝试这款JewellryWear – Jewellery Store 由energythemes Elementor Template Kit 设计，具有适合电子商务商店的复古布局。

90 年代垃圾用户界面

下一个在 UI 中卷土重来的复古趋势是90 年代怀旧。90 年代的审美有很多值得喜爱的地方——包括视频游戏、VHS 和故障效果、闪闪发光的泡泡字体，以及朋克和锐舞文化。最近，随着许多90 年代趋势重新浮出水面，我们看到垃圾美学在 UI 设计中重新出现。

一个很好的例子是时尚圣经网站Nylon。数字出版物以女性化和低调的方式处理垃圾摇滚，纹理背景让人联想到乐队海报以及宝丽来风格的图像布局、拼贴画和手绘细节。

要在您的网页设计中变得垃圾，请尝试使用 Digital_infusion 的这些Vector Grunge 纹理。这个包含 29 种重垃圾纹理的集合承诺即使是最干净的网站也会变得粗糙，以获得真实的 90 年代外观和感觉。

5. 本地桌面应用卷土重来

明年，我们期待原生桌面应用程序继续大放异彩。这些应用程序安装在您的桌面上并在本地访问 - 想想 Microsoft Office 套件而不是在线 Office 365 - 许多软件公司现在选择创建本地桌面应用程序，其用户体验与其流行的 Web 版本相当。

但在日益在线的世界中，为什么公司要离线使用他们的应用程序？根据 Envato 产品设计师 Raouf Araji 的说法，桌面用户体验实际上有很多好处。

“一些公司选择创建原生桌面应用程序，其用户体验与其流行的网络浏览器版本相当，”Raouf 解释说。“用户体验的好处包括性能的提升、与操作系统的通知系统集成的能力，以及在从浏览器中其他选项卡式窗口的干扰中移除时提高焦点。”

一个很好的例子是基于 Web 的图形编辑器和原型设计工具——Figma。该软件的原生桌面版本包括一项名为 Figma Mirror 的功能，它允许您在所有 iOS 设备上从 Figma 桌面应用程序实时查看您的设计。

6. 更无缝的应用内通信

随着我们中的许多人继续在家工作，远程和面对面协作的混合方法变得越来越必要。因此，应用内通信需要更加无缝和引人入胜。

产品设计师正在迎接改善应用内通信的挑战——尤其是在 SaaS 和技术领域，在这些领域，明显努力使应用内协作更加连贯和更加“人性化”。

再次以 Figma 为例，该公司现在为其在线白板 FigJam引入了“High Five”功能。这使团队合作的用户可以在处理文件时一起庆祝成就、问候其他队友或引起同事的注意。它最终会消失，类似于在视频通话软件中举手。

7.3D设计

虽然不一定是新趋势，但3D 设计在网页设计领域继续蓬勃发展。3D 图形越来越多地用于 UI 以增强 Web 界面并为网站添加引人注目的元素。

3D 设计使用计算机建模软件创建具有 3D 外观的对象，也是平面设计、排版和数字艺术的流行趋势。从专业网站到个人投资组合，它随处可见。

“虽然 3D 已经存在一段时间了，但现在它可以更无缝地集成到设计中，”Envato 高级设计师 John Kappa 解释说。“从充满活力的明亮多彩元素到超逼真的抽象设计，3D 就在这里，它让一切变得流行起来！”

查看 John 作品集中的一些作品——从这盒伊索酒瓶到这个爆炸性的闪光信息——看看 3D 设计如何真正提升您的网页设计游戏。

Envato 作者PixelSquid360是创建可塑 3D 对象的大师。从像这部卡通渲染的复古电视这样的回归，到这个镀铬的Gold Skul l，有很多 3D 对象可以在Envato Elements上玩。

可在

复古电视
通过PixelSquid360在Pixelsquid
得到

英国电话亭
通过PixelSquid360在Pixelsquid
得到

金头骨
通过PixelSquid360在Pixelsquid
得到

8. DIY 网站建设者

最后但并非最不重要的一点是，DIY 网站构建器和页面构建工具在网页设计领域越来越受欢迎，可帮助那些没有经验或经验有限的人建立并运行网站。Tuts+ 网页设计编辑 Ian Yates 表示，这些平台正在变得更易于访问和用户友好，转向无代码方法。

“在 2022 年，我将看到网页设计作为一门手艺不断变化的格局；尤其是用于构建网站、使其在线并在此过程中赚取收入的首选工具，”伊恩解释说。“最近，客户友好的平台已经淹没了专业的网页设计场景；自由职业者和内部部门都越来越倾向于他们的方向。

可在

Kaleo - 创意组合模板套件
通过deTheme在模板套件
得到

Encore - 多用途业务模板套件
通过deTheme在模板套件
得到

Faber - 科技公司 Elementor 模板套件
通过deTheme在模板套件
得到

为什么会这样？随着对新网站的期望变得越来越复杂，易用性是一个显而易见的原因。客户与设计师的合作是另一种，加上围绕工具本身的支持、增长和社区。快速浏览 TikTok 上的#webdesign，就会发现年轻设计师在各个地方都在寻求无需代码的方法。

无论哪种方式，他们的成功都已经酝酿了一段时间。网站建设者在各地都享有广泛报道的融资轮次和 IPO，预计从现在到 2027 年，该行业的复合年增长率将达到 8%。因此，至少这是一个值得关注的领域。”

Elementor 是网页设计师和非专业人士最喜欢的页面构建器。您可以通过访问ThemeForest上的各种 Elementor 模板套件来开始使用 Elementor ，例如BimberOnline 的这个Influence Marketing 模板套件，它具有直观的布局、鲜艳的色彩和高影响力。

Faber - 科技公司 Elementor 模板套件
由deTheme
得到

内部 – 室内设计和建筑模板套件
由jegtheme
得到

影响营销 - SEO 和数字代理 Elementor 模板套件
通过BimberOnline
得到




这是我们精选的2022 年您可以期待看到更多的顶级网页设计趋势。从完美的粗体字体到 UX 和 UI 套件、网站模板和主题，Envato Elements拥有您创建无缝、流畅和美观的用户体验。当您在这里时，请不要忘记查看我们的 2022 年平面设计趋势和营销趋势！