2020 年值得关注的 10 个UI 设计趋势 - 蓝蓝设计_UI设计公司

帝皇彩票官网

追求卓越一诺千金

蓝蓝设计,2011年成立,主创清华团队,专注软件和互联网ui设计开发。擅长企业信息化管理、监控、大数据软件UIUE咨询和设计开发服务。立足UI,好好学习,天天进步!


2020 年值得关注的 10 个UI 设计趋势

2019-7-31 泥人张 行业趋势


如果您想订阅本博客内容,每天自动发到您的邮箱中,

创意动画

1. 品牌加载

公众喜欢有趣,可塑的动画。Airbnb 和 Netfilx 将品牌 logo 动画应用到了启动页和加载页面。结合品牌特点、风格和符号,融合到产品设计中,从而提升视觉的一致性,创造富有特有性格的产品界面。

△ Netflix & Airbnb

2. 图标动画

微交互是建立在移动端上微妙视觉效果的小动画,而图标动画是微交互其中的一种。它的目的是吸引用户,让用户感觉顺畅、愉悦。

最近,让我印象深刻的一个图标动画是 Facebook 的新消息提醒界面,这些由产品所包含的一个个小细节,创造出了新颖而有趣的设计。

△ Facebook Website

留白分隔

在 UI 界面中,最常见的分隔方式是用细线对模块进行划分,但随着设计重心趋向简约,注重内容本身,传统的分隔线方式就略显多余。

根据格式塔亲密原则,通过留白控制间距大小,可以清晰地划分模块层级,同时界面看起来也更加透气、富有张力。可以看到 QQ、飞聊、Gmail、Messenger 等应用都采用了留白分隔。

帝皇彩票官网 △ Gmail & Messenger

融入插图

1. 品牌形象插画

一个好的插画作品可以为产品带来极佳的辨识度。Snapchat 的页面用了很多情感化设计和品牌形象,包括开启通知引导动画、查找好友 landing page、下拉刷新页、照片回忆等等。

从品牌的个性化设计,寻找一种基于插画的设计语言,把产品塑造成一个高辨识度的 ID。

△ Snapchat

2. 3D插画

随着软件技术的提升,3D 插画在这几年中大受欢迎,很多应用都使用 3D 渲染产品,如:星巴克、Keep、毒App 等等,因为它真实立体,有着更高的转化率。

△ Starbucks by Wojciech

△ Keep & 毒

圆角卡片

圆角代表友好、亲和力,而卡片模块化的布局更为清晰、有效、整洁。

在上周的微信改版的文章中,我讲到了订阅号的推送文章去掉了标题栏的背景,卡片变得更加简洁。另外,公众号详情页由原先的列表式,改成了圆角卡片式,弹窗也由直角改成圆角。

△ Broadcasting & 微信

视频背景

帝皇彩票官网 长期以来,图像在视觉设计中起着至关重要的作用,而视频能够更直观的吸引用户,传达主要的思想。

在移动端中,视频主要用于登录页背景,一般可以是几秒钟的循环剪辑视频,它可以带来一种身临其境的体验感受。

△ Lyft & Nike

轻提示

Toast 是一种轻量级的提示,作为用户操作后的反馈。UI 形态上从居中浮层,慢慢趋向于底部通栏样式。这样设计的好处是不会挡住当前界面的内容。

举一个反例,iOS 的调整音量提示,大范围的遮住了界面,特别是对正在玩游戏的用户非常不友好,直到 iOS 13 这个设计才被修改。

△ Google Earth & Spotify

色彩平铺

随着扁平化设计和 Material Design 进一步占据主流趋势,简约的界面,明亮,大胆的色彩一直都处于增长趋势。色彩平铺已经成为清新、酷炫、数字时代的代名词。

△ Snapchat & Spotify

注重内容

重内容、轻 UI,把注意力引导在重要内容和功能上。像 Facebook、Instagram 这种以图片社交为主的 App 都有一个特点,就是文字都是黑白灰,将彩色交给图片去传达,让用户关注内容即可。

△ Facebook for Android

AR

增强现实的技术,已经出现在很多 Web、App 等领域中。许多平台开发者也将增强现实技术纳入其开发工具里面,可预期到这种类型的 App 将会越来越多。

1. 地图导视界面

地图+AR,让你不再盯着二维平面上那个蓝色的点,而是现实世界中的箭头告诉你在哪个路口转向。

△ Google Map

2. 表情贴纸

Instagram、Snapchat、Messenger 等平台可用 AR 滤镜来创作,表情贴纸可以帮助用户更直白有效地自我表达、获取注意力。

△ Spark AR

车载系统界面

随着 5G、车联网、人工智能、自动驾驶的发展,车载界面也越来越受重视了。

在今年的 Google I/O 开发者大会上,针对车载系统 Android Auto,推出了新的设计语言,它有着更好的可拓展性。在 UI 上,完全重新设计了导航栏,能够更轻松地访问应用、通知,和你的 Google 智能助理,最大限度的帮助驾驶者减少分心,将注意力集中在道路上。

帝皇彩票官网 △ Android Auto UI

此外,还开发了新的系统小部件,在使用地图进行导航时,仍然可以一键控制音乐应用,或者正在进行的电话,同时在屏幕上保持地图的完整视图。

总结

UI 设计的趋势除了侧重内容和情感之外,还会根据不同设备载体、新的技术(3D、AR)而变化。但归根结底还是以人为本,借用 Adobe 设计副总裁 Jamie Myrold 的一句话:如今设计师要思考的,绝不仅仅是设计一款 App、网站或设计工具。我们要思考的是人类的需求,用户的需求,打造真正人性化,多元化与包容性的设计。

蓝蓝设计www.bjhbys.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计  cs界面设计  ipad界面设计  包装设计  图标定制  用户体验 、交互设计、 网站建设 平面设计服务。


标签: 设计趋势 « XJ项目关于新增保险时输入各类保险金额后计算总和插入到总费用后查询显示 | 产品设计之「取消按钮」的使用详解 | 细节分析»


蓝蓝 http://www.bjhbys.com

  1. 2019年12月(10)
  2. 2019年11月(61)
  3. 2019年10月(49)
  4. 2019年9月(48)
  5. 2019年8月(58)
  6. 2019年7月(58)
  7. 2019年6月(58)
  8. 2019年5月(31)
  9. 2019年4月(37)
  10. 2019年3月(43)
  11. 2019年2月(25)
  12. 2019年1月(45)
  13. 2018年12月(41)
  14. 2018年11月(40)
  15. 2018年10月(29)
  16. 2018年9月(40)
  17. 2018年8月(87)
  18. 2018年7月(107)
  19. 帝皇彩票官网2018年6月(86)
  20. 2018年5月(110)
  21. 2018年4月(40)
  22. 2018年3月(35)
  23. 2017年8月(35)
  24. 2017年7月(45)
  25. 2017年6月(7)
  26. 2017年5月(27)
  27. 2017年4月(51)
  28. 2017年3月(70)
  29. 2017年2月(65)
  30. 2017年1月(69)
  31. 2016年12月(55)
  32. 2016年11月(111)
  33. 2016年10月(92)
  34. 2016年9月(53)
  35. 2016年8月(9)
  36. 2016年7月(4)
  37. 2016年6月(9)
  38. 帝皇彩票官网2016年3月(19)
  39. 2016年2月(26)
  40. 帝皇彩票官网2016年1月(30)
  41. 2015年12月(33)
  42. 2015年11月(35)
  43. 2015年10月(46)
  44. 2015年9月(43)
  45. 2015年8月(40)
  46. 2015年7月(33)
  47. 帝皇彩票官网2015年6月(46)
  48. 2015年5月(58)
  49. 2015年4月(70)
  50. 2015年3月(55)
  51. 2015年2月(17)
  52. 帝皇彩票官网2015年1月(33)
  53. 2014年12月(21)
  54. 2014年11月(84)
  55. 2014年10月(94)
  56. 2014年9月(6)
  57. 2014年8月(1)
  58. 2014年7月(13)
  59. 2014年6月(66)
  60. 2014年5月(99)
  61. 2014年4月(88)
  62. 帝皇彩票官网2014年3月(102)
  63. 2014年2月(68)
  64. 帝皇彩票官网2014年1月(83)
  65. 帝皇彩票官网2013年12月(106)
  66. 2013年11月(112)
  67. 2013年10月(61)
  68. 帝皇彩票官网2013年9月(20)
  69. 2013年7月(13)
  70. 2013年6月(27)
  71. 2013年5月(48)
  72. 帝皇彩票官网2013年4月(39)
  73. 2013年3月(8)
  74. 2013年2月(20)
  75. 2013年1月(31)
  76. 2012年12月(33)
  77. 2012年11月(31)
  78. 2012年10月(23)
  79. 2012年9月(8)
  80. 2012年7月(14)
  81. 2012年6月(15)
  82. 2012年5月(31)
  83. 2012年4月(24)
  84. 2012年2月(4)
  85. 2012年1月(8)
  86. 2011年12月(35)
  87. 2011年11月(32)
  88. 2011年10月(13)
  89. 2011年8月(1)
  90. 2011年6月(1)
订阅Rss
桔子彩票平台 爱投彩票开户 博发彩票APP下载 桔子彩票官网 吉利彩票开户 盛通彩票网 博发彩票开奖 桔子彩票开奖 湖南快乐十分 状元彩票计划