所有分类
  • 所有分类
  • VIP素材
  • APP模板
  • 图标
  • 插画
  • 样机
原创 | 排版《玉女心经》之图版率!

原创 | 排版《玉女心经》之图版率!

引言:今天寡人又带来一篇十足的干货,安全无毒,放心食用!今个儿,咱继续修炼《玉女心经》,来唠嗑唠嗑【图版率】!图版率,乍一看好像是高深莫测东西,感觉有点意思,有点不明觉厉哟。但说白了就是,图片在版面中所占的比例。再直白点,就是图片大小。...

引言:今天寡人又带来一篇十足的干货,安全无毒,放心食用!今个儿,咱继续修炼《玉女心经》,来唠嗑唠嗑【图版率】!图版率,乍一看好像是高深莫测东西,感觉有点意思,有点不明觉厉哟。但说白了就是,图片在版面中所占的比例。再直白点,就是图片大小。

 

1.下面俩海报,哪个更有亲和力?

这还用说嘛,当然是「楚楚动人B」了!

毕竟「索然无味A」连个图都木得(déi),那么高冷,亲和力自然就弱。


反观「楚楚动人B」,仅仅加了一个图就生机盎然,亲和力暴增。

简直惹人怜爱,当真楚楚动人。


 

 

2.下面又俩海报,哪个更更有亲和力?

诶?这不是上面惹人怜爱的「楚楚动人B」嘛,

但跟「落落大方C」比起来,好像就没有那么惹人怜爱了呢,看来亲和力虽然可以,但还是不如C呀。

C为撒亲和力比B大呢?貌似是因为C的图比B大!
害,本猫果然喜欢大的


ABC同样的内容、同样的图片,为啥给人不同的感觉?

正是因为图片的大小不同。

而这,就回到我们今天的主题——图版率了。

告诉本宫,图版率为何物?

图版率,乍一看好像是高深莫测东西,感觉有点意思,有点不明觉厉哟。



但说白了就是,图片在版面中所占的比例

再直白点,就是图片大小。

嘿!朕讲的果然通俗易懂!


让寡人来举个例子来详细说道说道。

上面版式,因为全是字而没有图,图版率就是0。

 

这个版面,图所占的面积占整个版面的1/5左右,图版率就是20%。

 

这个版面,图片占比达到了整个版面的一半还多,那妥妥的图版率占了50%以上。

 

注意:

图版率可不是指单个图片的占比哟,

是指,所有图片加起来的占比。

比如下面这个作品,有好几张图片。


图片加起来占整个版面的一半左右,那么图版率也是50%噢。(
小声道:确实通俗易懂

整挺好!

知名设计师鲁迅曾说:

光知道图版率有啥用?

大家伙儿得了解它怎么用才行!

 

告诉本宫,图版率怎么用?
爱妃莫急,朕这就告诉你们(
没错,朕佳丽三千~

图版率既然是指图片占比的大小。

那自然不同的占比会传达不同的感觉。


运用的关键就在
要知道不同图版率所带来的结果

图版率有两条黄金规律:
 

1.图版率越大,表现力&亲和力就越强。

2.图版率越小,格调感&枯燥感就越强。

其实这两条,上面的例子已经能说明啦。

但咱这里,还是要详细说说。


先来瞅瞅第一条。

图版率越大,表现力&亲和力就越强。

有科学数据表明,人们对画面的好感,会随着图版率的增加而增加。(也对。全是字,谁吖会耐心看~

不然朕的文章为撒子会放这么多表情包!还不是为了提高图版率咩~

主要是给大家送欢乐,愉快的学习总是那么浪漫,吼吼

图版率增加了,

好感度也就有了,

别人也就更喜欢了,

表现力自然就更强了,

亲和力自然就更更强了。

图版率在50%左右时,好感度会急剧上升。

这里有爱妃就说了:既然图版率越大,亲和力就越大,那我要极致的亲和力,图版率调成100%不就行了?

行吗?那自然是不行的。

虽然越大的图版率亲和力就越强,但也是有极值的。

一旦图版率超过90%,好感度反而会降低。

不信咱看一看这个100%图版率的图~

只有图没有字,图占满了整个版面。当真妥妥的100%图版率。

虽然是极致的图版率,但是不是感觉很空洞,亲和力好感度反而低了。

所以想要极致的亲和力,图版率100%是不行的。

不行就是不行,就算狗腿儿打断,也是万万不行的~


现在咱们要对这个版面做点不好的事情

那就是给它加点文字。

 

看吧,看吧!

虽然只是在左上角稍微加了点文字,版面却比之前有生气了,亲和力也提高了一点哟!

稍微加了一点文字,缓和了之前空洞、单调的感觉,版面的活力也比之前好了。

再来瞅瞅第二条

图版率越小,格调感&枯燥感就越强。

图占得比例越小,读的欲望就越低。

这种版面内心感受是这样的:

格老子的,爱咋咋地。老子就长这样,爱看不看!

客官您看,这是不是特高冷,特有范儿!

“喜欢老子的自然会看,不喜欢的咱也不强求。”这就是所谓的大佬吧。

所以这种有格调的,高冷的,咱就可以用低图版率。

但图版率越低,版面的枯燥感就会越强,这个就比较负面了。


那么问题就来了:

图版率0%,怎么搞才能不枯燥呢?

答案是通过不同文字层级、大小对比,不同字体来营造趣味性。


而这就引出下一篇《玉女心经》中的又一杀招——文字跳跃率了。

这一点,咱下期干货会重点讲,这里就仅放张图略过吧~

俩图的图版率都是0,

但「大大小小B」相比「平平无奇A」来说,

用了不同的层级关系、不同字体来表现,

亲和力就比A好撒~

毕竟,人们还是喜欢多元的东西,

天天吃一个菜,再好吃也会腻撒!

嘿!寡人就是喜新厌旧了~

有人就问了,低图版率和高图版率怎么去界定呢?

其实我们可以参考40%这个值,

低于这个值的就是低图版率,

高于这个值的就是高图版率。

当然了,这个值是寡人定的莫要打我,呜呜

所以只起到参考作用哟!

知道了图版率的多寡对版面带来的影响后。

朕就要举办科举考试,来反向测一下众爱卿的掌握情况。


来吧,请听题~

 

1.要表现有格调、高冷的感觉,应该用高图版率还是低图版率?

低图版率!

这个对页,图片只占了10%的版面,给人感觉就是有点格调咯,

当然,也有点乏味。

再来瞅瞅下面这个~

这个因为文字的编排原因,格调感比上面的强多了!

更重要的一点,是人家图版率非常低。

云的图片因为跟背景非常相似,可以不算到图版率中,有效图版率也就是最下面的小人。

所以格调感必须强呀。
 

再来看最后一个~

这个网页,图片就只有下面的俩人,图版率就很低,10%都不到。

给人的感觉就是比较高冷,比较有格调的。

 

2.要表现活泼和张力,应该用高图版率还是低图版率?

高图版率!

超高的图版率加上少量文字,给人的感觉就非常的活泼!

 

这个作品虽然是黑白的,但图版率占比很大,所以尽管是黑白的,给人的感觉也是比较有张力的!

所以,版面率的多寡取决于你项目的调性。

内向的、安静的,咱就用低图版率。

外向的、奔放的,咱就用高图版率!

见不得人的那就……那就别放呗!

表现力&图版率有啥区别?

上篇咱说了表现力,那么表现力跟图版率有啥区别呢?

咱就这么说吧,

图版率完全一样的版面,表现力可能不同。
 

比如咱看一下这个版面,图版率和排版完全一致,但「含蓄的B」视觉表现力比「内敛的A」强多了。
 
这个就是表现力不同所造成的~

根据寡人上篇干货中说的,表现力排序为:
插图>照片>文字。

而插图与照片当中根据画面焦点则能排序为:人物>动物>物体>没有焦点的图(如风景照)

关于表现力,具体可以翻看上篇原创文章哟~

这里寡人再捋一捋吧。

低图版率→→→版面安静、高冷,但也无趣。
低表现力→→→版面安静、高冷,也很无趣。
高图版率→→→版面亲和力强、更活泼。
高表现力→→→版面更活泼,更放荡
跟朕一样

两者某种程度上传达的感觉是差不多的。但图版率更多的是图片占比的大小,而与图片本身的表现力无关。

况且,咱们说的排版《玉女心经》中的八奇技,设计时都要综合考虑。


咱现在八奇技学了俩了,就综合用他一用。

是时候让老夫传授传授组合拳了!

 

低图版率+低表现力图片是什么感觉?

两个都是安静+高冷+无趣,强强相加,那必须是极致的高冷和无趣呗!

这个全是字, 那就是极低的图版率+极低的表现力,最后的结果就是很无聊、很正式。

只能在文字的编排上加点韵律活络一下版面。

虽如此,但还是杯水车薪,无聊的一批!

这个主页,图版率低,图片也是风景之类的表现力不强的图。给人的感觉也是优雅、有格调的。

 

高图版率+高表现力图片是什么感觉呢?

这还用说,两者都是亲和力+活泼+放荡,那组合起来必须是极致的活泼和放肆!

这个作品版面中除了到处都是图,还用了表现力超强插图类型。那自然是男上加男,更活泼了!

 

再来看下面这个

这个版面到处都是人物的图片,图版率自然就高。况且元素丰富饱满,表现力也很高!

 

给人的感觉简直是放肆!


这俩组合都能理解,没有难度吧。

接下来就是有难度的了!也就是不同的图版率和表现力的组合,会是撒子感觉。


 
低图版率+高表现力

其实低图版率就注定了翻不起大浪!

所以一般低图版率+高表现力的形式也会很有格调感,但枯燥感会降低很多。

上面作品采用的就是低图版率+高表现力(人物照片)的形式,给人感觉比较优雅、有格调。

也不至于那么单调。

图版率低+人物照片(高表现力),给人的感觉也是比较优雅简约吧!

 

同样低图版率(比上面俩稍微高些)+高表现力,同样是比较优雅有格调的。

 

高图版率+低表现力

这个也比较有意思!

高图版率但低表现力,给人的感觉会更有趣一点!而且虽然图版率高,但会给人简约+干净的感觉。

这个海报虽然是满版,但因为照片是风景照,比较开阔,表现力不高。给人的感觉就比较干净,没那么放荡!

这个嘛,跟上面的同理,高图版率+低表现力,给人很清新的感觉!

再看这个

这里就有爱卿问了,这么多特写的手,这不应该是高表现力嘛?

本来应该是高表现力没错,但手的颜色跟背景太过接近,仿佛融为一体。所以在这个版面中其实是算低表现力的。

高图版率+低表现力,造成的结果就是很有格调,同时也很有设计感。

再来看下面这个~

这个就比较过分了,上面还是手,现在直接搞个人像上来!

表现力和图版率都这么高,但给人感觉却并不是那么放肆,这不是打朕的脸嘛?


这到底是为啥呢?其实也是因为色彩。

人像的颜色跟背景很接近,所以表现力只能算中,并不是特别高。

勉为其难就算 高图版率+中表现力。给人的感觉虽然简约,但已经比低表现力的强多了!


其实大多数时候,图片表现力的大小是需要我们主观去判断的。

毕竟理论是死的,

人是活的。

世界是向前发展的,

万物是在变化的。

而大猫,

是在不断变帅的!

以上~

唉~写干货上瘾了,一不小心就写了快4000字了呢。

虽写了这么多,但咱也不知道咱这套《玉女心经》有木有把图版率说清楚。

所以有木有说明白,各位大佬留言告诉我吧~

 

原文地址:大猫设计(公众号)

作者:大猫Sunjay


 


 

本页地址:http://www.seeui.net/29426.html; 所有素材与文章均来自于互联网,经网友投稿后发布,如有侵权,请联系 3147141550@qq.com。如果下载失败可提交工单哦。

0
分享海报

站点公告

早鸟限时特价,年会员半价,限量1000份哦

购买地址: https://www.seeui.net/vip
没有账号? 注册  忘记密码?