2020年移动和Web设计趋势的回顾

用户头像
北京/UI设计师/6年前/942浏览
2020年移动和Web设计趋势的回顾

新的一年是分析、观察和制定计划的好机会。从新的设计年开始,我们将回顾一些流行的设计趋势...



新的一年是分析、观察和制定计划的好机会。从新的设计年开始,我们将回顾一些流行的设计趋势,并按照惯例邀请您加入。在回顾了插图和图形设计趋势之后,让我们看看哪些趋势确立或加强了它们在网站和移动应用程序的用户界面设计中的地位。与往常一样,它包含UI设计示例。


野蛮主义


用户界面设计中的野蛮主义趋势在今年迅速发展,网站和应用程序的表达方式越来越多样化。通常将其描述为指在突破标准和可预测的设计技术的样式。以这种方式创建的网站和应用程序是对具有深思熟虑的对称性和和谐性,复杂的布局和美学视觉效果的一种反叛。相反,野蛮主义是基于简单原始的外观,在大多数情况下,它们没有加载许多视觉细节,有时甚至接近纯HTML页面。为适当的目标和受众精心考虑使用,它具有很高的独创性,激发了兴趣并为界面赋予了独特的外观。您可能会喜欢或不喜欢它,但是您永远不会忽略它。



黑暗主题


近年来,深色配色方案有了新的普及。正如我们在致力于该问题的设计文章提到的那样,在用户界面中应用深色背景可以带来一些基本好处,例如:


  • 风格和优雅

  • 神秘感

  • 奢华尊贵的外观

  • 使用对比的广阔领域

  • 视觉层次

  • 呈现内容的深度

  • 视觉吸引力


深色背景对于专注于各种图像(例如照片,插图,3D艺术甚至视频)的界面特别有效。


极简主义


另一个值得一提的趋势是通过极简主义原理设计的大量应用程序和网站。它们通过提供清晰,简单的界面(充满空间和透气感),专注于内容以及仅具有高度直观性的核心导航来支持的用户体验。极简主义的界面表现出对视觉元素的充分关注,虽然数量不多,但总是传递特定的信息。此外,它们还显示了具有排版和视觉层次结构的复杂工作,支持即时扫描和浏览页面或屏幕的内容。但是,使用最低限度的界面的陷阱是对信息层次结构和导航的三思而后行,以免向用户隐瞒一些重要信息,也不会降低可用性。



基于排版的用户界面



醒目但可扫描的字体作为任何设计概念的关键部分,继续在Web和移动布局中保持较高的知名度。很难将其称为趋势,因为它应该被视为UI设计过程中的默认和关键部分。设计师非常注重保持美观和可读性具有印刷层次结构和适当字体的选择。然而,越来越明显的趋势是围绕印刷术设计的界面越来越多,这是用户体验设计和吸引力的核心,根本没有图像。在这种情况下,视觉和情感上的吸引力不仅可以通过搜索有趣和原始字体来实现,还可以通过动画,颜色对比,填充和轮廓字母在一个文本中以及其他技巧来实现。此外,设计方法现在显示出对文本内容本身及其与布局的集成更深入的关注。
例如:内容丰富且引人注目的标语作为Web界面的一部分,尤其是在目标网页中,已经显示出越来越高的存在。

undefined


透明导航


这篇文章中的许多示例都具有另一种趋势,导航元素的透明背景。现在,设计人员找到了一个很好的对比层次,使导航可见且清晰,而不是用其他背景来标记特殊区域。这种方法支持所有布局的完整性。应用这种技巧的最流行区域是网站标题,该标题通常在滚动页面的过程中很粘滞,但由于这种简洁的呈现方式,对用户而言不会造成干扰。



多种文字方向


近几个月来,人们对文本线和块的不同方向的实验表现出越来越浓厚的兴趣,不仅使用了传统的水平线,而且还使用了垂直甚至是圆形,正方形或其他图形的形状。


通过这种方式,屏幕上的某些元素既具有装饰性又能提供丰富的信息,以不寻常的外观吸引用户的注意力。另外,垂直放置有时可以帮助节省屏幕空间。




界面插图和自定义图形


将各种自定义图形集成到用户界面中的趋势正在变得越来越强大和多样化。从既吸引用户注意某些区域,功能或信息的小型图形元素,到令人难忘的吉祥物,杰出的英雄插图。

和产品图像,3D图形和动画故事,似乎设计师现在已经为任何目标做好了充分准备。自定义图形以各种样式制作,有效地支持了对页面或屏幕上信息的快速感知。它们还为视觉创意奠定了坚实的基础,并为目标网页,博客和网站增添了美感。

undefined

实验互动


在竞争日益激烈以及数字产品面临新挑战的情况下,用户体验设计师始终在寻找新方法,以向用户提供更多,更快地解决他们的问题,并以易于消化和令人愉悦的方式呈现信息。因此,具有交互性,控件和导航功能的实验提高到了一个新的水平。

undefined



Nuance动画

毫无疑问,现在动作已经是UI设计不可或缺的一部分。但是,现在将动画集成到网页和移动屏幕中也显示出多样性的增长。设计师对运动的细微差别和微小细节表现出了更多的兴趣,通过这种方式吸引用户,美化界面,加强与物理交互的关联以及扩大审美满意度。  
  

undefined

互动增添乐趣


呈现度越来越高的另一个趋势是,不断增长的交互性旨在为交互添加乐趣和令人赞叹的效果,并吸引用户在页面上停留更长的时间。Web开发技巧和技术的进步刺激了这一过程,因此越来越多的此类界面出现在舞台上。



装饰字体


近年来,对字体的实验引起了新的兴趣。它与早期的超简单San-serif字体趋势形成了鲜明对比,后者是出于可读性的考虑而选择的,但随着时间的流逝,许多网站和应用看起来像是同卵双胞胎。


因此现在,网络和应用程序设计师经常使用吸引人的装饰字体,这些字体所覆盖的对象(例如标题,字幕,标语等)通常具有足够大的尺寸,因此不会影响可读性。



视频整合

随着Web开发领域的技术进步不断发展,视频背景和其他任何类型的Web页面视频内容集成都不再是一个巨大的挑战。因此,网页设计师经常转向全屏视频,以此来吸引人们的注意力,营造所需的氛围并即时查看所提供的产品或服务。

undefined


全屏背景视觉


前面的示例还具有现在已在用户界面中牢固确立的另一种趋势:使用的各种全屏视觉效果代替自然背景。这些可以是照片、插图、抽象作品,特制的可视化效果,甚至是视频,如您在上面看到的,该方法使屏幕在视觉和情感上都具有吸引力和信息量,因为图像以这种方式立即更快地吸引了用户的注意。


此外,它还支持所有布局元素的完整性。但是,要找到正确的元素对比和层次结构以及正确地集成导航和文本内容,需要很多技巧和精力,以使页面不会变成难以理解的混乱。



3D图形和动画



将各种3D图形集成到移动和Web界面中,使其在样式的多样性方面持续稳定增长。现在,设计师可以更加灵活地从静态图像转换为3D动画,从而使网页或应用程序屏幕更具动态性和吸引力。创建此类图形需要特定的技能和艺术眼光,这可能是非常具有挑战性和耗时的。


但是,这值得付出努力:3D图形始终引人注目并呈现出一种灵活的  视觉内容。根据您的需要,它们看起来像照片一样逼真,这对于用户界面设计来说是一个很大的优势,因为当无法获得合适的照片内容或价格太高时,此类图形可以节省游戏。同样,设计师还有进行创意实验的空间,并且可能会创建不真实的图像,从而增加UI的创意。



分割版面


网站和手机屏幕似乎倾向于保持近年来的另一趋势-分屏和页面。这种设计实践并不是什么新鲜事物,并回到了各个设计领域,但是现在它还活着。从响应式设计的角度来看,该方法是有效的,它可以处理内容变体而不丢失一致性。此外,它为颜色组合和实验打开了无限的区域。



原始和限量色板


随着色彩是视觉感知的关键因素之一,设计师非常注重色彩的选择,倾向于尝试新的罕见组合。从这个角度来看,另一个趋势是使用非常有限甚至是单色的调色板,而不会以各种颜色分散用户的注意力。在最近的一年中,它突然出现了许多优雅和超时尚的设计。



色差分离内容

为了使色彩越来越实用,现在趋势设计人员倾向于广泛应用的另一种趋势是应用色彩对比来区分一个应用程序或网站中的屏幕或内容。这样,设计人员不仅可以在产品中添加多种多样性,还可以为不同种类的内容或各种目的提供有效的视觉分离。

配色方案的选择


颜色有助于提供的另一件事是个性化。UI设计人员和开发人员努力提供更多功能,以便用户可以根据其个人需求自定义功能。在最流行的选项中,您会发现用户针对特定Web或移动界面选择的配色方案。当然,在设计和开发过程中需要花费更多的时间和精力。


网格实验


网格的创造性实验在最近几年似乎从未停止过,现在正越来越新。定制网格有效地帮助您节省了布局和元素放置的感觉,并具有高度的灵活性和独创性。在很多情况下,这也是重新思考视觉层次结构并将访客的注意力吸引到所需区域或布局元素的方式。或者,它有助于更轻松地消耗大量同质内容。从这个角度来看,不对称,网格破裂和其他实验被认为有助于实现该目标。


但是,这种创造性方法需要细心的研究和测试。因此,通常通过对可用性和视觉感知进行多次测试和分析来达到有效的结果。



突出的照片内容


在最近几年中,我们可以看到自定义图形(例如插图或3D图像)倾向于过多地保留传统和保守的照片内容。这样一来,设计师就可以灵活的创作,因为一波负面反馈反映出库存照片缺乏原创性,而制作定制照片内容可能比获取定制图形更加昂贵且难以组织完成。现在看来,照片内容又回到了现场。随着越来越复杂的构图和对细节的关注,有时甚至连照片都显得超酷,更不用说定制照片内容的生产也变得多样化,并且在许多情况下都变得负担得起。因此,现在我们正在观察越来越多的设计,并把照片放在了关注的中心。



信息图样式的数字


正如我们在有关Web可扫描性的文章中提到的那样,读者在潜意识中将数字与事实,统计数据,大小和距离相关联。因此,副本中包含的数字会引起读者的注意,而表示数字的可能会在大部分副本中遗漏。而且,数字比文本数字更紧凑,因此内容更加简洁,节省了时间。流行的设计功能之一甚至更进一步,它使数字比文字更显眼并且更引人注目,这在信息图表中是很常见的。


undefined


赵小马的话:


因此,我们相信2020年的设计年将为我们带来更多的多样性、美观、优雅和用户界面效率。以及具有互动性和视觉内容的创造性实验,这些互动性和视觉内容必须与用户一起不断发展。


10
举报
|
22
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
高级表盘系列UI源文件
【新年UI图标】旅行icon
Security Camera UI kit
【新年UI图标】钱包icon
3D渐变流体抽象矢量UI背景图
UI通用设计素材1
UI界面 组件
【新年UI图标】会员icon
【新年UI图标】秒杀icon
拟物风质感写实UI卡片合集源文件
新能源APP应用UIKit
户外旅行飞机情侣假日出行
智能家居中心 简约 UI设计组件库
钱包ui模板
我的钱包-UI界面设计-app
高级感金属拟物 UI设计组件库
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
3D卡通UI界面图标可爱插画免扣素
【新年UI图标】礼物/活动icon
科技医疗透明柜UI界面设计
APP/小程序商业项目UI模板|99个高保真UI+79个原型
【新年UI图标】30个图标
UI 登录界面设计模板包
你可能喜欢
相关收藏夹
大家都在看
登录注册