下图界面中,设计师很好的运用到S视线形构图,增强了穿插感和灵动性。人物的信息上下穿插布局,头像则成为视线的转折点,使这种双列模式的排版更为有节奏。而具体到每一部分,头像与内容采用了三角形构图,内容描述段落用到了文本居中式,画面稳定、和谐。
在引导页中也会常常运用到S形的构图。图文进行穿插布局,这样的构图层次感分明,动感十足!
由图文版式布局,我们还可以演变出F字形构图,这种类型的构图大部分运用在图文左右搭配图和banner中,使用F形构图能让图文搭配更有张力,更大气,产品信息更为简单和明确。
在F形构图的规律中,主图为F的主干,右侧两行(或两部分)文字为辅,要注意合理分配图片和文字的占比。
想深入了解的同学,参阅:《网页设计中的F式布局》
F形构图在banner中使用,能将标题更为突出,主题更加吸引视线。
值得注意的是,要充分利用主图的画面的指向性。比如,主图是人物,可将文字放置于其眼神、朝向、手势等对应的方向,加强视线引导。如果是产品图,则可以通过产品的朝向来引导。这样做,用户能最快速的关注到文本信息,加强认知度和购买度。
小结:
这一课没有什么实战技巧,更多的是引导大家学会欣赏,学会用基本的设计原理来描述自己看到的作品,而不是简单扔下一句“人家设计得真好”就完了,要明白其中道理,并努力为自己所用。构图先说到这里,当然版式不仅仅指构图,还有很多东西可讲,有时间我再整理给大家。