重庆网站设计

2017年网站设计趋向：卡片式设计怎样在占尽优点？

在现实生活在，视觉信息一直很吸引人的眼球，卡片设计的应用不仅仅只是一种趋向。

有数据显示2014年 手机端操作率远远高于桌面端，网站设计都能很好的适应小屏幕。这个答案就是：简易的界面风格，比如：扁平化设计，极简设计，尤其是卡片设计比往年都要潮流。

网站设计 网站策划 网站优化 网站部署

好的卡片设计不会操作太多的加载时间，同时它也能在不同的屏幕上切换自如。小的模块对于客户来讲更能吸引留意力（尤其在手机端），它在Pinterest上培养大家的习惯，然后在Facebook和Twitter上面推广，卡片设计能应用于各个范畴的网页设计。

在这篇文章中，我们将会讨论卡片设计的崛起：为何它们有用，它们怎样适应于响应设计和material design，在未来又会发生什么？

什么叫抽屉式设计？

为了理解抽屉式设计，你首先得先理解卡片是什么。

每一个卡片拥有属于自己的信息。一张卡片能包括所有信息 — 视觉、文本、链接等等— 但是所有这些内容都是一张卡片里面的内容。

这种单独填满整个屏幕抽屉式展现信息的方式 被Guardian 叫做“抽屉形式”。它让客户更加径直清晰的看到整个界面，也有益于客户火速的寻找他们需要的信息。（最关键的是，这种方式可以有益于我们自己控制，下面的文章我会解释为何。）

让人觉得很有吸引力的是：它们操作的卡片界面是相互叠加的。

网站设计 网站策划 网站优化 网站部署

Trello 能让客户创立他们自己想要的任何卡片列表。所有人都能创立“to-do”卡片 ，同时可以根据自己的需求实行归类。

Trello不仅让卡片具备灵活性，而且还能被客户随便摆放。Trello的成功是由于相较于传统列表式部署，它让客户感觉很简易。

UI卡片在手机端和响应式设计中的应用

正如上文提到的，卡片为响应式框架提供了出色的兼容性，由于有些像Des Traynor把他叫做“网页的未来

这种设计可以在手机端随便很好的转化。”

网站设计 网站策划 网站优化 网站部署

首先，它可以自己扩展或者收缩去适应任何屏幕的尺寸。设计师能够很灵活的控制卡片的比例（几组卡片可以更好的适应彼此）。例如,你能够设计固定的宽度和统一的间距来适应可变化的高度。

对照上面The Verge的网页截图和下面的手机端截图：

网站设计 网站策划 网站优化 网站部署

留意他们两个的文本信息、图像和颜色的风格都是统一的。卡片设计让客户在不同的设备上有统一性的体验。

你能够看到这个优点在UXPin的e-book里面被借助。留意他们从手机端到全屏的界面是极其清晰的。

UXPin手机端界面：

另外一个优点是怎样让卡片适应人们手指使用。在触屏上，使用它就像按动一个按钮一样不需要花费多少精力。这个想法很简易：点击卡片，让它与内容交互。

像菲茨定律适应于网站设计展示那样，点击区域越大就越容易相互用途。还记得我们有多少次挣扎在移动设备上点击有些文本链接么？

Material Design很依赖卡片式设计，卡片描述在Material Design指南里值得你去寻找一个好的解释

网站设计 网站策划 网站优化 网站部署

卡片设计的未来

卡片设计形式不断的重塑自身以适应新的挑战，而响应式和手机端或许会受最大的影响。就像2015&2016网站设计趋向 描述的那样，这种设计潮流的转型是由于 Material Design 在安卓系统里面的应用。

1.技术

卡片不可能永远是静态的。随着网络性能的提升，也可以支持更丰富的多媒体内容。你可能会看到更多小节的元素，比如自动更新内容但是不会影响整个客户体验。

网站设计 网站策划 网站优化 网站部署

视频能变换图片（设计师考虑这个问题许多年了）或许会变为很潮流。Use Your Interface（上图），这些GIF动画功能让整个页面体验极其愉悦。

2.深度的交互

在不久的将来，卡片或许可以变为更加的有创意。就像我们看见 Material Design，它极其依赖个人的交互，随着自动排序和即时更新等功能的更新（比如天气预报）。

网站设计 网站策划 网站优化 网站部署

Windows手机里面已经着手应用卡片式自动归类方式，很有可能其他移动手机也会操作这种方式。

3.尺寸

图片并列的部署趋向，也让卡片更好的操作大尺寸屏幕。

大卡片上能部署更多的小节和复杂的字体，它从视觉上让客户感觉很舒服。大小卡片交替的时候，大卡片在视觉上更让人感觉舒服。

网站设计 网站策划 网站优化 网站部署

Arkitekter（如上图）是如何应用大尺寸和中等尺寸作为信息部署的。一些卡片有链接，一些卡片是静态的信息。大小不同的卡片体现方式，让整个页面更有呼吸感。

4.可穿戴的

多亏了谷歌眼镜，它让卡片的UI设计在穿戴设备上奠定了基本。

网站设计 网站策划 网站优化 网站部署

尽管有许多人认为谷歌眼镜会失败，但是也有一部分人认为它有市场。不管如何，穿戴设备的UI设计必须要很好的借助空间来设计，而卡片设计是它最实用的选取。

要素

在所有的媒介和设备上，卡片设计已经成为设计惯用的一种方式。他们现在的模式可能会随着技术的成长有所改变，但是他们确实是存在的。

毕竟，这些部署并不是一个表格。别忘了，在不久前卡片只是一张包括内容的纸片而已。