今天给大家安利一本好书，是腾讯网UED十年精华输出的干货型读物，先节选一小段，关于版式设计的，既有腾讯同学的实战经验，也有大量的基础术语科普，非常不错 >>>
在信息化社会的浪潮中，快节奏的生活让人们开始学会选择性关注。如何在纷繁的信息中引导用户?有没有科学的方法?这是当今设计师所面临的问题。界面版式的构成是信息传播的桥梁，也是视觉传达的重要手段。科学的编排技术，以及实用性与艺术性的合理运用，才能成就更快、更准确的信息传递。时尚频道作为腾讯网中更强调视觉呈现的频道，在运营的过程中通常有非常鲜明的案例。本节我们就从这些案例中剖析一些方式，来感受版面设计中的科学性和趣味性。
图片的排列组合
距离感
“距离”在心理上表示亲近的程度，亲近度减弱则表示变远，亲近度增强则表示变近。在排版设计中，同样也可以用距离的远近表现各部分内容之间的亲密程度。例如，通过调整各部分内容的间距，来表现各部分内容之间的关联性。但需要注意的是，过多不同的距离设定反而会违背区分其关联性的初衷。
接下来我们来看一下时装周秀场专题界面秀场图的展示部分。由于每场大秀为相同的层级关系，所以其图片排布采用了相同的距离来展现。利用距离进行明确的组别划分，将一类的图片进行整合，同时也缓解了图片繁多的压迫感。同时每场秀的权重是平等的，所以运用了相同尺寸的图片平铺设计，利用了组合图片的反复效果，带给用户信息充足而又凝练的印象(见图1)。
而街拍的部分则运用大小不一的图片排布，通过主次关系的区分，突出独家看点的内容，同时图片的间距相同，代表它们仍然是从属于一个大环境下的平级内容，亲密度是相同的(见图2)。
这里也运用了数学上的两个理论，对称与等比。
对称构图有左右对称与上下对称等形式。对称的构图方式能够给用户带来一种整齐安定的印象。在基本的对称形式上加入一些微妙的变化，也会给用户带来惊喜，就如同此案例在对称的基础上进行了垂直翻转的处理。在设计此版块的前期，需求方提出此版块的内容为自动调取，均为正方图。因此我们运用了等比缩放的图片处理，减少了后期维护的工作成本，调取一张图片后，简单的JavaScript代码即可实现将其运用在任何位置，并保证其达到要求的呈现质量。同时，通过图片大小的不同，明确了图片之间的主次关系。为避免尺寸类型过多带来的杂乱感，我们只设置了大、中、小三个层级的尺寸，并调整了其平衡关系。
由此可以推导更多的呈现形式，把这种等比递进展现的方式运用在单品抠图的排布方式上也会有不错的效果，其对称和缩放的原理是一致的。如同下面两个例子，如图3(a)和图3(b)所示，虽然呈现的形式为抠图的单品，但其尺寸的层级实则仅为两个层级，同时版式的排布也采用了对称的形式，因此还是有规律可循的。
