论文部分内容阅读
【摘 要】Material Design及原质化设计，是Google在2015年推出的一种适用于电脑、手机等平台的崭新的视觉设计语言。这种设计方法以经典设计的原则为基础秉承了创新的设计理念、汲取了更多科技的力量，为用户创造了一种新的、符合时代的视觉语言。为现代设计的进步提供了新的方向，让设计方法变得更加生动和多元化。
【关键词】material design设计方法 instagram
1 Material Design设计方法分析
1.1 Material Design设计方法
Material Design中文是指原质化设计，它是google在2015年推出的一种崭新的视觉设计语言，目的是为手机、平板电脑、台式机和“其他平台”提供更一致、更广泛的“外观和感觉”。
1.2 Material Design视觉效果分析
这种设计语言在视觉效果呈现的优点中主要体现在这几个方面——视觉层级、色彩选择、界面排版，它正在用一种崭新的方法诠释了设计的意义。
在视觉层级的设计中，material design的表面和阴影起到了重要的作用，能够展示出界面的层级架构。精心选择色彩、图像、选择合乎比例的字体、留白，划分出导航栏与内容页，构建出合理的视觉层级结构，卡片式的简洁化设计也是其视觉层级中的一大特点。在色彩选择中，Material design的原则是“大胆、图形化、有意义”，在Material Design中，配色提倡一种主色，一种互补色。在区域较大部分的色彩采用主色色调，区域较小的部分例如状态栏采用深一点的色调。在界面排版中Material design对于界面的排版非常的重视。该设计方法中是按照基线的摆放位置来进行版式设计的，这样的界面会显得更加有序，而不是杂乱无章，我们可以看出，Material Design将第一基线放在距离边界16dp的地方，与文本项对齐的第二基线被摆放到距离左边界72dp的地方，这种对齐规则让用户更加快速阅读信息。
1.3 Material Design交互设计分析
Material design交互设计的优点主要体现其交互动画和响应式交互中，有意义的转场动画能够让人更加心旷神怡，而响应式交互设计则是满足了时代移动端发展的要求，这些交互形式都是基于用户体验和内容形式考虑而设计的。
Material design的动画的设计主要体现在一些按钮的动效和页面的切换动效中，其动画特征应用了视觉连贯性的特征，应用了淡出元素、通用元素、新入元素，使画面的整体感更加美观，而且这些动画是符合用户体验，服务于相应的功能的。
Material design的响应式设计不是简单的能在各种平台中适应屏幕，而是有了新的进步和发展，增添了元素响应和表层响应。元素响应是指屏幕中的每个元素本身也能做出交互响应，用户可以通过点击、拖动来生成、改变元素或者直接对元素进行处理。表层响应则是指可视化的图形在屏幕上会随着用户的点击或滑动产生相应的变化。
2 Material Design案例分析——app《Instagram》
2.1 《Instagram》产品定位及分析
该app产品定位为一款照片分享类软件，他是以一种快速、美妙和有趣的方式将你随时抓拍下的图片然后分享彼此的动态，它是一款基于碎片化时间的社区互动而产生的，人们可以随时随地把自己的心情表达通过图片、文字或视频的形式表达给世界各地的人，建立了一个很庞大的社区体系。
2.2 《Instagram》视觉设计
该app产品的视觉上应用了material design的设计方法，在颜色上选取了蓝色的主色调，并应用了浅蓝色的补色，将颜色进行图形化设计，在主页部分应用了卡片式的视觉设计方法，这样更加符合格式塔心理学，充分的将设计方式与内容形式结合起来，在视觉版式设计中也是有其标准，在两边的基线部分留有16dp的地方，这样的留白会让用户浏览起来更加有节奏感，会让用户更加快速的浏览文字以及图片。在产品导航栏icon设计中应用了无边框按钮设计，在激活状态下添加了阴影背景的变化，这样更加符合material design的设计方式。
2.3 《Instagram》交互设计
该app产品主要的交互是分享照片，而分享照片中包括用户发表状态，用户之间形成的评论，以及用户的分享这三种状态，浏览方式上主要是应用了超长页面的卡片式浏览模式，交互方式主要是点击与滑动，在交互模式上由分享、上传、评论等功能组成，其在交互设计上有独特的创新和发展。
3 Material Design设计潮流及未来趋势
该Material Design并不是简单的拟物化或者扁平化设计，将新的科技与设计进行了融合，形成了新的icon动画设计，提供了一套新的设计框架和设计思路。Material design UI设计方式处于拟物化设计和扁平化设计之间，相对于拟物化设计，他更加简洁明了，细节更少；而相对与扁平化设计，它添加了物理化的阴影和更加动态的icon，细节处理上比扁平化更多，材质设计解决了google大多数的问题提供了一种更轻，更明亮，更丰富多彩的设计方式，并带领了UI的设计潮流。
Material Design设计语言并不能完全的、强制性的套在所有的应用中，尤其是在pc端的网站中，其作用会比移动端产品的作用小，但作为一种设计潮流趋势，其影响力也是相当巨大的，作者觉得Material Design在设计上还是有一定的缺陷的，在icon设计中添加过多的动效，这会让用户更加专注的不是内容，而是效果了。
在这点上ios的扁平化设计比material design更加好点，material design在接下来的发展中应该要考虑到pc端的设计风格的发展和在内容页中应该更加倾向于内容，而不是动效。
结语
Material Design设计方法符合设计时代潮流的发展，为用户创造了崭新的视觉设计语言，与此同时，遵循了经典设计的原则，汲取了科技的力量，秉承了创新的设计理念。为现代设计的进步提供了新的方向，让设计的方法更加生动有趣。
【关键词】material design设计方法 instagram
1 Material Design设计方法分析
1.1 Material Design设计方法
Material Design中文是指原质化设计，它是google在2015年推出的一种崭新的视觉设计语言，目的是为手机、平板电脑、台式机和“其他平台”提供更一致、更广泛的“外观和感觉”。
1.2 Material Design视觉效果分析
这种设计语言在视觉效果呈现的优点中主要体现在这几个方面——视觉层级、色彩选择、界面排版，它正在用一种崭新的方法诠释了设计的意义。
在视觉层级的设计中，material design的表面和阴影起到了重要的作用，能够展示出界面的层级架构。精心选择色彩、图像、选择合乎比例的字体、留白，划分出导航栏与内容页，构建出合理的视觉层级结构，卡片式的简洁化设计也是其视觉层级中的一大特点。在色彩选择中，Material design的原则是“大胆、图形化、有意义”，在Material Design中，配色提倡一种主色，一种互补色。在区域较大部分的色彩采用主色色调，区域较小的部分例如状态栏采用深一点的色调。在界面排版中Material design对于界面的排版非常的重视。该设计方法中是按照基线的摆放位置来进行版式设计的，这样的界面会显得更加有序，而不是杂乱无章，我们可以看出，Material Design将第一基线放在距离边界16dp的地方，与文本项对齐的第二基线被摆放到距离左边界72dp的地方，这种对齐规则让用户更加快速阅读信息。
1.3 Material Design交互设计分析
Material design交互设计的优点主要体现其交互动画和响应式交互中，有意义的转场动画能够让人更加心旷神怡，而响应式交互设计则是满足了时代移动端发展的要求，这些交互形式都是基于用户体验和内容形式考虑而设计的。
Material design的动画的设计主要体现在一些按钮的动效和页面的切换动效中，其动画特征应用了视觉连贯性的特征，应用了淡出元素、通用元素、新入元素，使画面的整体感更加美观，而且这些动画是符合用户体验，服务于相应的功能的。
Material design的响应式设计不是简单的能在各种平台中适应屏幕，而是有了新的进步和发展，增添了元素响应和表层响应。元素响应是指屏幕中的每个元素本身也能做出交互响应，用户可以通过点击、拖动来生成、改变元素或者直接对元素进行处理。表层响应则是指可视化的图形在屏幕上会随着用户的点击或滑动产生相应的变化。
2 Material Design案例分析——app《Instagram》
2.1 《Instagram》产品定位及分析
该app产品定位为一款照片分享类软件，他是以一种快速、美妙和有趣的方式将你随时抓拍下的图片然后分享彼此的动态，它是一款基于碎片化时间的社区互动而产生的，人们可以随时随地把自己的心情表达通过图片、文字或视频的形式表达给世界各地的人，建立了一个很庞大的社区体系。
2.2 《Instagram》视觉设计
该app产品的视觉上应用了material design的设计方法，在颜色上选取了蓝色的主色调，并应用了浅蓝色的补色，将颜色进行图形化设计，在主页部分应用了卡片式的视觉设计方法，这样更加符合格式塔心理学，充分的将设计方式与内容形式结合起来，在视觉版式设计中也是有其标准，在两边的基线部分留有16dp的地方，这样的留白会让用户浏览起来更加有节奏感，会让用户更加快速的浏览文字以及图片。在产品导航栏icon设计中应用了无边框按钮设计，在激活状态下添加了阴影背景的变化，这样更加符合material design的设计方式。
2.3 《Instagram》交互设计
该app产品主要的交互是分享照片，而分享照片中包括用户发表状态，用户之间形成的评论，以及用户的分享这三种状态，浏览方式上主要是应用了超长页面的卡片式浏览模式，交互方式主要是点击与滑动，在交互模式上由分享、上传、评论等功能组成，其在交互设计上有独特的创新和发展。
3 Material Design设计潮流及未来趋势
该Material Design并不是简单的拟物化或者扁平化设计，将新的科技与设计进行了融合，形成了新的icon动画设计，提供了一套新的设计框架和设计思路。Material design UI设计方式处于拟物化设计和扁平化设计之间，相对于拟物化设计，他更加简洁明了，细节更少；而相对与扁平化设计，它添加了物理化的阴影和更加动态的icon，细节处理上比扁平化更多，材质设计解决了google大多数的问题提供了一种更轻，更明亮，更丰富多彩的设计方式，并带领了UI的设计潮流。
Material Design设计语言并不能完全的、强制性的套在所有的应用中，尤其是在pc端的网站中，其作用会比移动端产品的作用小，但作为一种设计潮流趋势，其影响力也是相当巨大的，作者觉得Material Design在设计上还是有一定的缺陷的，在icon设计中添加过多的动效，这会让用户更加专注的不是内容，而是效果了。
在这点上ios的扁平化设计比material design更加好点，material design在接下来的发展中应该要考虑到pc端的设计风格的发展和在内容页中应该更加倾向于内容，而不是动效。
结语
Material Design设计方法符合设计时代潮流的发展，为用户创造了崭新的视觉设计语言，与此同时，遵循了经典设计的原则，汲取了科技的力量，秉承了创新的设计理念。为现代设计的进步提供了新的方向，让设计的方法更加生动有趣。