本文由sezignlab小组成员杨梦龙翻译校对
Web和移动App正从单纯的以页面为基础向更加个性化的体验转变。这种体验建立在许多独立元素的聚合上，卡片是其中颇具创造性的新概念。
不管你怎么看待这一概念，它都在那儿。
什么是卡片？
卡片指那些容纳了图片和文本信息作为入口以传达更丰富信息的矩形元素，由于卡片能够方便地展示由不同元素构成的内容，它几乎成为了平衡UI美观和产品实用性的默认选项。
卡片示例，图片来源：MaterialDesign
极佳的隐喻
在UI中使用卡片是一种很好的隐喻，因为这些卡片看起来与物理世界中实际的卡片类似。在移动设备普及前，这些真实的卡片就已经存在了，比如名片，棒球卡片，扑克牌等等。事实上，卡片是一种扩散相当广泛的交互模型。这些卡片就像现实生活中的一部分，因此，它们能够更直观地被用户感知。
就快速传达信息来讲，卡片无疑是一种优秀的工具。现实世界中的棒球卡片就是一个很好的案例，你想了解的球员的基本信息都在那张小卡片的正反两面上。
每一张卡片代表一位球员，图片来源：liveauctiongroup
内容组织
卡片将内容进行有意义的划分以占用更小的屏幕空间，就像文本通过段落来划分成不同部分一样，卡片能够聚合各种不同的信息以形成一组连贯清晰的内容。
卡片集示例，图片来源：MaterialDesign
卡片布局已处在设计前沿，像Facebook等巨头都在桌面和移动端的网站和App采用了基于卡片的界面设计。Facebook充分利用了容器风格设计将源源不断的信息流组合在一起。
赏心悦目的界面
卡片设计十分依赖视觉效果。重视图像是卡片设计的优点。研究表明，图像能够迅速有效地吸引用户注意力，进而提升网站与App的设计质量，强调重视图像令卡片设计对用户更具吸引力。
来看看Dribbble，一个供设计师展示作品的知名创意社区网站。卡片设计确实可说是展示此类内容的最佳形式了。
Dribbble网站
如何设计一个卡片？
采用相同布局的卡片应当有一致的宽度，但高度可以不同。卡片的最大高度应当受其所处平台的可用空间的高度限制，但可以暂时性地扩展放大（例如需要显示一些注释字段时）。
卡片的高度可设为固定或可变，图片来自：Inter
转载请注明：http://www.0431gb208.com/sjsbszl/942.html
