下面这个案例是我们同学做的一个排版练习，右侧学员作品中间那个主体元素是他在网上找的，左侧是人家网上优秀的作品，我们来看这两张图：
我们就看这个其中一个维度“元素的摆放”，其实有的时候跟你排版是一模一样。
我们来看左侧这张素材参考图，嘻哈演唱会整个的大标题，我们可以理解为它是主要的一个元素，我们给它标红，然后第二个主元素是这个 CD ，第三个是面积放大一点的CD。
然后我们来看同学的作品，顶部的大标题是一个元素，我们来用红色标出，然后这个人物我们来分两个部分，一个是头部，一个是身体。
然后我们来看红色的区域，如果你来排版的话，你会用左侧的这种排版还是用右侧的这种排版？假设这个红色都是文字。
或者我们来看下面这张图，更直观一些，你会发现大家应该都会选择左侧的，这是为什么呢？因为左侧更有一种节奏感，它是长窄长，而右侧这个是宽窄更窄，太过于规律了。
我们把这些红色框去掉之后，你可以看到左侧参考图，它顶上的这个标题是宽的，然后中间来一个窄的，到底下它给你来一个宽的、大的，给你接住了这种重量感。而右侧底下接不住了，所以它整个的元素的布局和摆放其实就是有问题的。
接下来给大家分享第二个点，关于元素占比的问题。这是我们课上同学利用 AI ，再配合自己的一些排版做的一个效果，右侧两张图是他的参考。
你会发现左侧学员作业，其实有一个非常大的问题。我们在做任何东西的时候，你一定要记住，你的主体物从宽度来讲至少要占整个画面的 2/ 3，我们画两个方块来测量一下。你会发现空白区域和主体物，也就是灰色跟红色区域，差不多各占一半。
那我们再来看右侧的参考，基本上是空白面积占了 1/ 3，而主体面积占了 2/ 3。
所以大家在做这种界面的时候，主体占的面积区域一定得够大，不然的话你整个画面显得非常空旷。
接下来给大家分享一下画面互动感这个点。这两张是我们UI课两位同学交上来作业，做的是比较好的，得分还挺高。
而下面这个作业就稍稍差了一点，你会发现整个前面的排版跟人物跟那个主体没有什么互动。人物在后边，元素就在前面，完全是分开的。那如果你能把人物左侧这只脚跨过这两个带子，然后伸出来，那这种互动感就有了。
那我们再来看做的比较好的这两张，你会发现都有这种串联感。比如说下面这个作业，它的这条蓝色弧线压在了大标题的上面，然后它的两条细直线又压在了蓝色弧线的上面，这种感觉是非常棒的。
包括像下面这个作业也是一样的，你可以看到人物在这个画面中串联了三个区域，白色区域、蓝色区域和黑色区域，并且它的脚踩在了黑色区域上面。
这种互动感是一个画面中非常非常重要的一个属性。
我们再来看一个学员作业，虽然画面整个排版也稍微差一点，比例差了一点；但是它这个互动感做得很好，他把这双鞋跨过这个画面伸出来了。
作者：菜心轻量文
来源：站酷
蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
关键词：UI咨询、UI设计服务公司、软件界面设计公司、界面设计公司、UI设计公司、UI交互设计公司、数据可视化设计公司、用户体验公司、高端网站设计公司
银行金融软件UI界面设计、能源及监控软件UI界面设计、气象行业UI界面设计、轨道交通界面设计、地理信息系统GIS UI界面设计、航天军工软件UI界面设计、医疗行业软件UI界面设计、教育行业软件UI界面设计、企业信息化UI界面设计、软件qt开发、软件wpf开发、软件vue开发
