在UI行业,设计趋势更新非常快,UI设计趋势可以更好地指导我们的设计方向。作为一名UI设计师,需要更多地了解UI设计趋势。在本文中,Pixso将探讨2022年的UI趋势,希望能给大大家的创作增加点新鲜感。

黑暗模式

即使在2022年,黑暗模式也可能会延续。优雅、时尚、现代的外观,是黑暗模式的特点。随着我们花更多时间在智能手机和笔记本电脑上,黑暗模式在用户体验中起着至关重要的作用。但黑暗模式不仅仅是深色背景上的白色文本。它还有几个优点:

  • 当手机屏幕配备AMOLED并激活黑暗模式时,它也将比正常模式节省63%的电量。

  • 打开黑暗模式后,可以在弱光环境中获得最佳观看体验,减轻眼睛负担,帮助专注于工作

  • 黑暗模式还可以有效降低OLED屏幕的亮度波动,减少频闪问题。

如Pixso社区中的这款暗黑风日历模板UI组件所示,背景使用了#17151C,避免了纯黑,可减少眼睛疲劳,因为深灰色表面上的浅色文字比黑色表面上的浅色文字具有更低的对比度。此外,避免大面积高饱和度的颜色,它可以帮助用户保持适当的对比度,而不会造成阅读困难。

暗黑风日历模板UI组件暗黑风日历模板UI组件

新拟态风格

新拟态风格结合了平面设计和拟物化的特点是一种结合背景色、形状、渐变和阴影的视觉风格,以确保UI元素的图形强度。所有这些都可以实现柔软挤压塑料外观和轻态3D视觉。新拟态风格的界面非常优雅,它的柔软界面元素让人感觉非常舒适。就设计而言,它既美丽又具有未来感。

如下图Pixso的工作台所示,新拟态的按钮颜色和背景基本一致,依靠浮雕效果来实现与背景的区分。此外,背景和按钮的明度都不高,以展现上方的高光。

轻拟物视觉设计轻拟物视觉设计

粗体字

你注意到页面布局越来越大了吗?尤其是登录页面和微网站。

粗体字体是吸引用户注意力的最简单方式之一。粗体字从周围环境中脱颖而出,整体美学不可分割的一部分。流行网站正在采用这种设计手法,粗体排版似乎将保持直接和积极的方式,并在2022年继续增长。

吸引读者注意力的最简单、最直接的方法就是放大字体大小。如Pixso社区中的Ola Electric网站所示,粗体字可以使原本的普通文字成为一个非常突出的设计元素,提高信息传递的效率。

这种简单的大写字体布局清晰、简洁,可以给出更直接、更大胆的诠释,彰显独特的个性。

Ola Electric网站重新设计与动画Ola Electric网站重新设计与动画

平滑渐变

平滑的渐变设计正如火如荼地进行着。渐变可以帮助用户更好地感知和理解设计。当眼睛感知到屏幕上色调和亮度的变化时,它会有意识地注意到特定的颜色和视觉焦点。

正如pixso社区中的渐变图标所示,颜色对比鲜明,充满青春活力。与单色图标相比,渐变图标更适合一些年轻的主流产品。因此,设计师也可以通过设计颜色来打动用户,提高产品的竞争力。这种渐变图标也可用于工具类产品,但颜色的使用必须小心谨慎。因此,如果想让你的设计界面脱颖而出,可以大胆地使用平滑渐变。

渐变色icon练习渐变色icon练习

动画

UI动画一直非常流行。与静态图形相比,设计师可以通过UI动画更好地指导流程,从而增强用户体验。2022年将会有越来越多的动画,包括用户界面和产品推广。这是一种让用户身临其境的方式,移动应用程序可以在不使用模态弹窗和通知的情况下向用户传递消息。

Pixso内置丰富的转场动画,支持即时、溶解、智能动画、推动、滑入、滑出等多种渐入渐出动效,轻松构建出色用户体验交互,体验最终产品形态。

此外,还支持自定义曲线运动时间,支持线性动画、缓出动画、缓入动画、缓入缓出动画等设置,满足UX设计师的多方面动画需求。

UI动画

高级微交互

每个应用程序中都存在微交互,手势和非接触式控制等高级微交互为打造更直观的体验带来了新的机会。 微交互的8种类型包括:点击效果、长按效果、下拉刷新、滚动查看、滑动效果、系统加载、错误反馈、鼠标悬停效果。

高级微交互

Pixso可以选择鼠标或触摸交互,通过单击、拖拽、悬停、鼠标移入离开等出发原型交互事件,可以在预览窗口中预览原型交互事件,动态播放高保真原型,随时排除障碍,提升用户体验。

无摩擦认证

我们都讨厌输入密码,因为这很复杂,很难记住,也不太安全。到2022年,我们将看到对无摩擦身份验证(如社交登录和生物特征登录)的持续需求。如Pixso社区中的移动端社交软件就提供了谷歌和Facebook这两种社交登录的方式。

注册页面注册页面

语音用户界面(VUI)和非接触式交互

大流行后开始的另一个UI/UX趋势是非接触式交互。与设备交互的各种方法,如语音控制和空中手势控制,正变得越来越流行。去年我们看到了很多语音激活服务。VUI也将在2022年成为一个新的热点。

Pixso社区中的语音交互类APP通过语音的方式可以降低用户学习成本,能够准确完成用户想做的事情。随着5G和物联网的普及,语音交互会有更大的应用场景。

语音交互类App

语音交互类App

3D无处不在

近年来,3D设计吸引了无数用户。尽管在内存消耗方面存在一些缺点,但3D在移动和Web应用程序中都是一种趋势。2022年,3D将继续蓬勃发展,尤其是VR和AR技术的日益普及Pixso内置腾讯、阿里、字节、今日头条、蚂蚁设计等优秀设计规范,提供海量设计模板和3D素材,可以下载并使用。

BAM 3D插图套件BAM 3D插图套件

设计系统

这一趋势与设计行业的学科有关,并不新鲜。越来越多的公司开始重视统一设计经验,并建立自己的设计系统。Material Design、Ant Design和Element Design等设计系统是最流行的开源设计系统。此外,还有大量其他自由设计系统。

Pixso的开源社区是独特的,与传统的设计社区有很大区别。通过最简单的一键分享和复制,降低了资源共享的成本,让每一位设计师都可以更容易地向所有人展示自己的知识成果,也可以更直接地享受到他人知识成果带来的便利。

Pixso社区

除了掌握设计风格趋势外,强大的工具可以帮助你更有效、更准确地完成工作。Pixso可以实现视觉效果、交互效果、体验效果一站成型,为你的目标用户创造流畅体验,相信你应该迫不及待想上手体验了!