像这样的 PPT 页面,有大量的图片,而且,尺寸还不统一,该怎么去排版呢?
对于图片较多的页面,我们一般能想到的做法,就是整齐地把它们并列摆放。
就像这样:
但其实,你知道吗?还有一种非常简单的方法,却可以让图片的排版,更有创意。那就是『瀑布流布局法』:
这是网页设计中,经常会用到的一种布局形式,这种方法的特点呢,有两个,我总结了一下:
- 非常适合用在多图片排版中;
- 能够呈现出数量庞大的感觉;
啥意思呢?比如说像在苹果的官网设计中,我们经常会看到这种布局方法的使用:
既能够在较少的页面区域,展示大量图片信息,而且会给人一种海量的视觉效果。
最关键的一点在于,这种方法使用起来超级简单,因为我们只需要把尺寸不一的图片,均匀地摆放整齐即可。
就像这样:
当然,如果你不想要让它纵向排列,你还可以更换其他形式。
比如倾斜式的瀑布流布局:
再比如像三维式的瀑布流布局:
都是可以的。
但是,在使用这个方法的时候,有一点需要注意,那就是一定要保证图片的间距相等:
否则,页面的排版,看起来会很乱。
怎么样?是不是足够简单?而且,最气人的是,几乎所有的多图片排版,都可以使用这种方法。
比如你可以来排版企业荣誉证书:
你也可以来排版会议照片:
……
为了让各位能够加深理解,咱们通过两个实际的案例,来实际应用一下。
首先第1个案例
就是页面上有很多的证书,那我们该如何利用瀑布流,进行布局呢?
别着急,老规矩,咱们先来处理页面上的内容。这里的文字信息很简单:
在排版之前呢,可以先来划分内容的层级关系:
然后呢,基于这层关系,来对内容进行排版
把文字信息放到页面上,会发现,页面左下角区域被占据了,只留下右上角的空间:
所以,在进行瀑布流布局时,可能需要用到倾斜的版式:
在这里呢,可以对图片进行旋转,从而,让图片的布局变成这样:
把处理好的图片,放到页面上,来看一下效果:
还不错,对吗?但这时候页面稍微有一些单调,怎么解决呢?
可以沿着图片倾斜的角度,插入两个斜边四边形,用作背景的装饰:
颜色是取自企业的logo
这样一来,我们的页面排版就算完成了,非常简单:
来看下最终的页面效果:
接下来再看另一个案例
这是一款运动类 App 的介绍:
主要就是在讲 App 能提供多种健身方案。因为没有文字,因此,直接对图片进行排版即可。
我们可以按照纵向的瀑布流布局,完成图片的排版:
但这时候,页面看起来有一些单调,咋解决呢?很简单,找一张运动相关的背景图:
然后,把排版好的图片,放在背景图上:
但如果只是这样的话,下方的3张图片,与页面底部边缘融合感较差,会让人感觉出现的很突兀。
怎么解决呢?我们可以在下方,插入一条渐变蒙版,来让底部边缘融合度更强:
效果还不错,对吗?
以上呢,就是今天要跟大家分享的,一种非常好用且简单的图片排版方式。
最后,额外补充一个点。
这种瀑布流布局适合多图片排版,因此,当使用时,我们希望观众感受到的,是数量丰富,而不是让他们看清每一张图片的具体内容。
这一点一定要知道。