2015-2016年最有影响力的移动界面设计是什么？看看Google就知道了

【编者按】文章来自百度MUX翻译小组，应作者要求，如文章已获雷锋网授权转载，也请保留原标题。

译者注：本文译自UXPin出品的电子书Mobile Design Book of Trends 2015&2016中第二章Layered Mobile Interfaces。第一章卡片设计可参看：《2015-2016年最流行的APP设计是什么？比如，Facebook那样的》。

UXPin 这本电子书结合丰富案例讲述了2015-2016年间重要的移动设计趋势，共有6个章节：灵巧的手势操作、层级化的移动界面、隽永的字体排印、扁平化设计、愉悦的微交互、小卡片。

Google的Material Design是最有影响力的视觉设计理念之一。它用清晰的设计和可用性准则重新塑造了一种所见即所得的交互方式。

（Photo credit: Dropbox）

然而Material Design的理念不仅仅局限在Google和安卓APP中。设计师们通过很多方法在使用这个设计理念。正如名字所暗示的那样，多个元素的分层叠加，就像一副牌一样，建立一种独特而又统一的体验，既实用又美观。

将元素在界面内分层的想法并不是一个新理念。然而， Material Design结合了大量具备美感和动态的体验，使得这一理念更进一步。

在我们更进一步说明之前，先确保大家对Material Design的认知都一样。让我们回忆一下：

Material Design是Google的一种设计理念，它概括出了APP在移动设备上应该长什么样以及如何工作。它打破了一切——如动画、风格、布局，同时给出了模式、内容、可用性的准则。如Google所说——

我们进行自我挑战，为我们的用户创造出了一种视觉语言，它遵循经典的设计准则，同时结合最新的科技和创新，这就是Material Design。

Material起源于移动设备，同时可以扩展到其它设备。它立足于以下几个准则：

1、真实的视觉提示：该设计是建立在真实的基础之上，通过纸张和墨水的实际展现得到的启发。

2、形象鲜明，意图明确：传统的设计技术驱动了视觉效果。排版，网格，控件，尺度，色彩和图像等等这些引导着设计。元素都按照清晰的层级归属于既定空间。色彩和样式的选择更加形象鲜明。

3、动画呈现意图：Material Design中动画是一个关键要素，但它不仅仅是为了动起来。动画需要发生在一个特定的场景中，通过简单的转换来聚焦设计。运动和行为都应当是真实物理世界的实际反应。

我们在讨论分层界面设计的时候，常常会碰到一个概念叫“触觉设计”。把它想象成好几张纸堆叠在一起，它们组成一个包含所有事物的框架。这些纸张和显示物理世界中的纸略有不同的是它们可以改变形状和形式，比如延展或倾斜，但在某种程度上又是符合真实的物理反馈的。

（Photo credit: Google Material Design）

触觉界面是一个内容和信息的容器。容器被设计成扁平的，边缘带有淡淡的影子，这样不同容器和层级之间得以区分。其它区分层级关系的方式，比如纹理、渐变和划分都是不必要的。

（Photo credit: Reddit）

在Reddit这个APP上，你可以看出不同层级之间的分离。覆盖在主内容的灰色浮层之上，有一个明显的最顶部的菜单界面。甚至是顶部大图也包含了分层的元素和阴影来强调三维的触觉界面。

（Photo credit: Google Material Design）

通过触觉界面的设计可以清晰的明确内容之间的联系和功能。（每个容器通常有一项工作，比如链接或视频播放器。）这种方式也可用来定义深度，元素在容器中可层叠着展现，创造出一种近乎三维的世界。

层级设计本质上是为了自适应设计而生。所有的设计原则实际上都在鼓励设计师进行自适应设计（无论你更喜欢称之为自适应或响应式都可以）。

在考虑层级界面的时候，元素之间的相互关联是很重要的。

（Photo credit: CBS Sports）

Google提及它的标准是源自于“弹性的网格确保了不同层级的一致性的布局，尺寸的临界描述了内容如何重排在不同尺寸的屏幕，应用界面如何能能够从小尺寸扩展到大尺寸。”

（Photo credit: Google’s Material Design Guidelines）

注意事项包括：

  临界尺寸：宽度包括480、600、840、960、1280、1440、1600像素

  网格：12栏布局，包括模块宽度和间距(8、16、24、40像素)，以及基线网格

  界面行为：UI自适应屏幕的规格，可切换或隐藏

  模式：功能模块是基于界面尺寸的，包括显示、变形、扩展、集合和划分。

设计师可以更容易的确保他们的界面可以在任何情况下适应任何设备。他们提供了一种规范来帮助设计师构建台式电脑、平板电脑和手机的界面布局。

创建层级化界面的时候，其他的设计趋势同样可以发挥作用。Material Design借鉴了大量扁平化和其它技法的设计理念。实际上也存在Material Design是2.0版本的扁平设计的争议，因很多视觉处理方式非常相似。

（编辑：云计算网_宿迁站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!