涨姿势!扁平化设计和Material Design有什么不一样? -
亚洲城ca88,ca88唯一官网,ca888亚洲城唯一入口

亚洲城ca88,ca88唯一官网,ca888亚洲城唯一入口

优秀设计联盟-SDC-网-设计师交流学习平台-听讲座,聊设计,找素材,尽在网

菜单

涨姿势!扁平化设计和Material Design有什么不一样?

2015/04/17in 阅读 27653评论区

flat-vs-material-design-1

编者按:今天分享一篇小小的科普文,说说扁平化设计和Material Design有哪些不同的地方,持赞成/反对观点的人都有什么理由,不多说,直接戳 >>>

三月指南类好文:

两种相似的设计风格,一个基于另一个。一个是新热事物,另一个,有人猜测,已经以自己的方式成为一种时尚。一个是自发的——适应设计的趋势,另一个却是有目标——专用的设计指导规范。

你可能明白了扁平化与Material Design之间的冲突了。

但是,他们之间不同是什么呢,本质上是一个比另一个更好?在某些用途上更好?实际上,一些人想知道它们之间的差别有多大,让我们从最基本的开始:拟物化设计的身影出现在每一个身上。

拟物化设计

Skeuomorphism

拟物化设计, 在这个背景下,设计是为了模拟真实的物理世界。通常,这需要设计的在线应用的形式看起来像他们的真实世界的变体,比如像电子合成器软件,做的像键盘。这种界面的设计方式,在大部分的时间里占据了主导的地位。

问题是,这不是基于数字设备可用性设计的,或者所有的旋钮和按钮可以用鼠标或触屏操作,它看着只是模仿真实事物的外观。

实际上,设计圈得到的结论是,需要其他东西,这将去掉所有的复古的装饰元素,然后给他们留下的东西是,可用性放在第一位。所以他们从界面设计移除所有痕迹的拟物化设计,创建了扁平化设计。

扁平化设计

Flat Design

扁平化设计,在许多方面,基于最基本的元素进行设计。它选择删除任何样式,那些令人捧腹的三维表现方式,像投影,渐变与纹理。它只关注与图标之间的联系,字体和颜色。

这是第一个在数字媒体设计上连贯的风格,一个利用互联网的独特的属性和用户的需求,快速发现的简单按钮,直接配色方案为了快速识别的元素,和简洁的图标。

外观在扁平化设计里面是次要的:重点是原始的功能。简单的图标隐喻甚至可以省略一些网站的内容, 引导用户进行操作,仅仅基于它的颜色和图片。此外,它加速加载时间和高或低分辨率屏幕上看起来显示一样好,提供更加可靠的用户体验。正因为如此,对设计者和用户来说它会让事情更容易。

赞成的意见

  • 它拥抱了屏幕的限制基于这些去工作,而不是尝试去做别的事情。
  • 流线型的设计,摆脱不必要的图形和动画元素,减少加载时间。
  • 没有拟物化元素,你的读者能很快速度发现内容。
  • 删除所有不必要的设计选择,使网站设计速度更多
  • 扁平化设计的简化网站不断地适应浏览器,可以非常容易做出响应。

反对的观点

  • 扁平化设计可能限制、约束你去使用简单的颜色,形状和图标。
  • 如果走得太远,很容易不小心创建一个毫无特色的和看起来一般的网站
  • 一些网站,或应用程序,需要复杂的视觉线索来指导用户来进行如何使用,这是扁平设计的一个主要的失败点。一个常见的抱怨是,静态的矢量图形,它缺乏阴影,边缘很难分辨是否可点击按钮
  • 它的普遍性很难创建一个看起来很独特的网站或应用程序。
  • 有一点需要注意,这是一个2010年代中期独特的审美,你的网站很快会过时,如何你不计划去重新设计你的网站,时间相对会很快。

Material Design

Material Design

扁平化设计的评论家,认为这走的太远了,消除所有的拟物化比较激进,即使是有用的。进入,借用Material Design层的概念,使用阴影,将数不清的图像进行编辑和分离;斜面和动画,它利用自然交互关联深度与重要性。

Material Design,是由谷歌开发的一套设计标准,在这个文档中,它有无数独特而有趣的特性,但也许是最明显的是它提出了平面像素的Z轴概念。事实上,它在扁平化设计上面增加了一些拟物化,创造 了一种一群二维平面飞机浮动在对方指定的海拔印象。

想象一张纸,能够随意随意扩展收缩,重塑自身,融合和分离。现在把它们一个个叠放起来(他们也可以漂浮空中),然后在每张上面画一个网站要素。简而言之,这就是Material Design的概念。

然而Material Design并不是完美的设计文档的特征。它也并非一成不变的铁杆定律。试着更多的把它想成问我未来设计的物理框架和模板。它的设计具有普遍适应性,就像安卓穿戴手表一样,能响应屏幕的各种尺寸,甚至是不同形状。Material Design的应用在其他app开发商中也在推广。

Material Design是安卓应用设计的标准,因为它被应用到提及的穿戴设备上。它是否应该用到IOS上是引起不断争论的源头。有人争论说保持谷歌外形很有必要。其他人则认为它和剩下的操作系统相互冲突。孰对孰错,全看你自己的决定。

赞成的意见

  • 三维安排让程序更易于互动:比如阴影被安排用来显示分层。
  • 和扁平化设计不同,Material Design都有详尽明确的一套参考,没有什么需要你去猜测。
  • 如果你想开发一个多平台的东西,比如一个网站和一个安卓应用,Material Design对所有设备都提供统一的体验。这样的话就会增加用户使用方便性,进而巧妙地促进你的品牌化。
  • 如果你对动画感兴趣,Material Design是个不错的方法因为它自带了许多这一类型的动画。没有它们你就只能动手画了。

反对的观点

  • 不管喜欢与否,Material Design不可避免的和谷歌关联。如果你想使自己远离这点,为你的网站或应用创造一个独特的特性,使用谷歌指引来实现要困难的多。
  • 不是所有的系统都能实现预期帧频。而且你很难知道该怎么做才能提高那些不可实现者的可用性。
  • 动画会耗尽手机用户的电池。
  • 强制开发者们遵守设计指南可能会进一步扼杀个体创造力,阻碍更多动画和装饰特点的发展。

总结

Material Design和扁平化设计真的没有那么大的天壤之别:两个都用同样干净和最低的美感。当扁平化界面被分割,你基本能从中想到质感界面。尽管Material Design动画广泛收到表扬,但是总结起来也不过是更加用户友好化。事实上,没有人说你不能把二者的美感相结合,用Material Design激活一成不变的扁平化网站。

在我看来,扁平化网站很实用。比起满是动画和复杂图片的网站,它们的下载速度更快。如果你要设计一个极为简单的网站,针对使用不同设备,技术经验水平不等的各种用户,或者只是重视用户体验多于形式,扁平化设计正适合你。如果你对在网站上放各种动画或动态图片无感,主要对原始的简单化和可用性有兴趣,毫无疑问我会推荐你选择扁平化设计。但是如果你想创建一个有动画的更加花哨的网站,当然要选择Material Design。

【换个角度看设计系列好文】

设计师接单的艺术:

如何让设计作品变专业的技巧:

拒人千里不如提高实力:

原文地址:
译文地址:

【网 原创文章 投稿邮箱:2650232288@qq.com】

================关于网================
“网“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:。
设计微博:拥有粉丝量93万的人气微博 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗?
添加 优秀网页设计 微信号:【youshege】哥的全拼
您也可以通过扫描下方二维码快速添加:

sdcweixin

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:/flat-vs-material-design

发表评论 加载中....

验证码加载中....

评论加载中....

底下还有哟~快放我们出去~
uisdc

评论区都快饿瘪了,看看我期盼的小眼神...

评论就这些咯,让大家也知道你的独特见解 立即评论
以上留言仅代表用户个人观点,不代表立场

相关文章

关于我们

网(uisdc.com)是国内极具人气的设计师学习平台。2012年成立至今,一直专注于设计师的学习成长交流。目前正通过网站、微博、微信(ID:youshege)、各大社群为设计师提供高水准的行业设计讲座和领先的设计资讯分享。为设计师发声、替好作品说话,是平台的运营理念。想更全面了解或联系我们合作,欢迎访问。

我们的团队

微信

设计秘籍 一扫"掌"握!

                  官方 QQ 群:

Copyright © 2018 亚洲城ca88,ca88唯一官网,ca88手机版入口 -官方微信号:

sketch 大课堂 转场动效 设计师 扁平化设计 交互设计师 界面设计 排版布局 职场 平面设计 设计师专访 素材下载 视觉设计 配色 设计流程 web前端开发 AI教程 用户体验设计 设计理论 海报设计 神器下载 字体下载 设计趋势 设计规范 psd下载 动效设计 图标设计 产品设计 logo设计 ICON 神器推荐 职场规划 App设计 字体设计 酷站推荐 交互设计 ui设计 设计师职场 优秀网页设计 用户体验 ps技巧 酷站 PS教程 网页设计 经验分享

上周热门文章

热门专题

把好文章收藏到微信

打开微信,扫码分享
学设计 在这里