排版《玉女心经》之图版率

用户头像
成都/设计爱好者/5年前/94843浏览
排版《玉女心经》之图版率
用户头像
大猫404

继续修炼排版神功!


众爱妃,又见面啦!

今天寡人又带来一篇十足的干货,安全无毒,放心食用!


今个儿,咱继续修炼《玉女心经》,来唠嗑唠嗑【图版率】!



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字了呢。


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


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


这篇文风这么搞,咱就要这种不正经的,轻松愉快的氛围。所以,点个赞吧~



5374
阅读原文
|
举报
|
3119
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
加载中
推荐素材
平面插画设计女孩喝咖啡
海底世界插画
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
中国传统纹样创新图案设计
古风平面仕女与瓷器
课程海报,平面素材
城阙凡花
金色颗粒质地的平面
“知识宅急送”外卖,快递,平面,海报,素材,教育
牛奶乳液层次平面平铺平面
城市园林平面布局航拍
空的平台平面和自然景观
平面书法字手写
平面花卉图案扁平简约无缝拼接插画
空的平台平面和自然景观
城市园林平面布局航拍
金色颗粒质地的平面
平面男孩喝咖啡插画设计
倒计时,海报,平面
平面风格黄绿色系花朵装饰
金色颗粒质地的平面
中秋节可爱呆萌平面兔子蛋黄月饼贴纸素材
金色颗粒质地的平面
平面设计 吊牌设计
水蜜桃和李子的平面水果图案
你可能喜欢
相关收藏夹
大家都在看
登录注册