當(dāng)前位置:圖趣網(wǎng)(Tuquu) > 網(wǎng)頁(yè)設(shè)計(jì)教程 > 視覺(jué)設(shè)計(jì) > 渣圖也能質(zhì)感炸裂,五個(gè)案例教會(huì)你!

渣圖也能質(zhì)感炸裂,五個(gè)案例教會(huì)你!

之前圖趣剛給同學(xué)們分享過(guò)一篇教程:《素材low?看我玩轉(zhuǎn)百變中文排版》,對(duì)于沒(méi)有高質(zhì)量的素材,很多設(shè)計(jì)師無(wú)從下手,覺(jué)得自己拿到了一張比較普通的圖片,沒(méi)有質(zhì)感,色調(diào)乏味。最后做出的圖稿太過(guò)簡(jiǎn)單,只是簡(jiǎn)單整合信息對(duì)整體畫(huà)面的作用從視覺(jué)效果來(lái)看并不大。


所以平時(shí)看設(shè)計(jì)的時(shí)候就開(kāi)始哀嘆,怎么人家拿到的圖那么好,我這個(gè)命哦...


確實(shí),平時(shí)我們根本拿不到這么好的圖,不是所有的甲方都這么有錢(qián),有專(zhuān)業(yè)的模特,專(zhuān)業(yè)的攝影,專(zhuān)業(yè)的營(yíng)銷(xiāo)團(tuán)隊(duì)。但是問(wèn)題是,甲方有錢(qián)的人家找你做嗎?你多便宜啊。心里沒(méi)有點(diǎn)數(shù)嗎?


這次的教程我們用五個(gè)方案來(lái)逐步一點(diǎn)一點(diǎn)告訴你,不同的圖片處理對(duì)于整體畫(huà)面的影響力到底有多大。那么具體到一個(gè)畫(huà)面當(dāng)中,需要顧及的部分挺多的。

圖片處理,構(gòu)圖方式,文字整理分組排列,顏色選擇,圖形點(diǎn)綴,這些方面我們盡量都注意到。

首先,我們來(lái)看一下,這次我們拿到的圖片,為了裝作圖片的質(zhì)量一般,我的確是隨便百度了一個(gè)圖。而且是顯示的第一個(gè)圖,都不帶挑的。很少有像我這么真誠(chéng)的人了,注意珍惜。


再來(lái)看一下文案,文案這次我就簡(jiǎn)單處理一下,什么叫做簡(jiǎn)單處理呢?就是把字體選好,中英文搭配好,字重選對(duì),字距調(diào)整,行距調(diào)整,信息分組,層級(jí)明確,字距拉開(kāi),簡(jiǎn)單的形式化處理,你看,就是這么簡(jiǎn)單。


文案的處理不用特別復(fù)雜,你要注意,無(wú)論如何我們是要傳達(dá)信息給受眾的,不要陷入自嗨,整理信息的時(shí)候不要你覺(jué)得哪個(gè)重要哪個(gè)次要,站在受眾的立場(chǎng)來(lái)看。

如果你要去健身的話,你關(guān)注的信息點(diǎn)到店重要的有哪些,哪些不重要,層級(jí)順序又是如何劃分的?多想想。


我們拿到的圖是這樣的,所以你要觀察了,這是一張人物為主的畫(huà)面,人物在一個(gè)場(chǎng)景之內(nèi),這個(gè)場(chǎng)景重要嗎?重要,她是在健身房運(yùn)動(dòng)的一個(gè)狀態(tài)。但是這個(gè)場(chǎng)景我們不用全部保留,摘取一部分就可以了。所以這一步,我們要進(jìn)行圖片裁切,讓畫(huà)面進(jìn)行主要聚焦。讓第一視線留在人物上。


然后用一個(gè)簡(jiǎn)單的圖形讓人物二次聚焦,其余部分我給了百分之八十的黑色透明度疊加。然后加一個(gè)小的常規(guī)裝飾圖形,兩個(gè)小圖點(diǎn)綴。


然后文案依次排列。


這個(gè)一個(gè)非常常規(guī)的方向。

總結(jié)一下這個(gè)案例我們用到的方法主要是兩個(gè)。

01.圖片裁切

02.明暗對(duì)比再次突出主圖。


那么圖片的裁切我們已經(jīng)確定了,下面我們來(lái)簡(jiǎn)單演示一下第二種形式表達(dá)。

這個(gè)案例我們主要看一下,利用簡(jiǎn)單的色彩疊加圖片,處理一下圖片的色調(diào)和質(zhì)感,不需要你做更多復(fù)雜的調(diào)色操作,非常簡(jiǎn)單。

下圖可以看見(jiàn),首先我給圖片做了一個(gè)人物的聚焦?jié)u變,還是沿著第一個(gè)方案的思路,其余部分我全部給了一個(gè)黑色到透明的漸變,文案會(huì)更加清晰一些。


因?yàn)闃?gòu)圖方式幾乎是從左右構(gòu)圖變成了半包圍構(gòu)圖,所以文案的部分我稍微調(diào)整了一下。

對(duì)比第一個(gè)方案,是不是這個(gè)案例圖片的質(zhì)感稍微提升了一點(diǎn)點(diǎn)呢?


總結(jié)一下這個(gè)案例我們主要用到的方法。

01.圖片裁切

02.漸變疊加圖片(我這里用到的是“柔光”)


第三個(gè)案例我們結(jié)合一下案例一和案例二,然后在色彩上可以再突破一點(diǎn),兩個(gè)小圖的部分我也進(jìn)行了簡(jiǎn)單的形式感處理,這樣整體出來(lái)的對(duì)比效果更好一些,更顯質(zhì)感。


有同學(xué)就有疑惑了,這個(gè)左右的對(duì)比有什么依據(jù)嗎?沒(méi)錯(cuò),正是白銀比。


黃金比和白銀比都是常用的一種比例方式,在日本海報(bào)當(dāng)中其實(shí)我們經(jīng)常會(huì)見(jiàn)到白銀比。

但是不要盲目用,如果合適的話就可以加,不能加不要勉強(qiáng)。


扯遠(yuǎn)了,我們來(lái)看一下這個(gè)案例的最終效果。


總結(jié)一下這個(gè)案例我們主要用到的方法。

01.圖片裁切

02.漸變疊加圖片

03.明暗對(duì)比再次突出主圖

04.圖片分成兩部分做白銀比


第四個(gè)案例我們主要來(lái)說(shuō)一個(gè)很重要的調(diào)色功能----漸變映射


這個(gè)功能是在ps里完成,也是比較簡(jiǎn)單實(shí)用的一個(gè)方法。


然后圖像—調(diào)整—漸變映射,找到這個(gè)功能之后,開(kāi)始進(jìn)行細(xì)節(jié)調(diào)色,一直調(diào)到你想要的效,我這里主要是想讓人物的明暗對(duì)比再大一些。


添加文案之后的最終效果。


總結(jié)一下這個(gè)案例我們主要用到的方法。

01.圖片裁切

02.漸變映射


第五個(gè)案例其實(shí)是為了加深大家對(duì)于漸變映射這個(gè)功能的理解,換了一種顏色和排版方式重新演繹了一下第四案例的方向,你會(huì)發(fā)現(xiàn)以上這些案例中我主要用到的構(gòu)圖方式基本還是左右構(gòu)圖,而且人物一直是在左邊,這個(gè)因?yàn)槿宋锏哪抗馐亲詈檬悄芨采w在文案上,受眾會(huì)沿著人物的目光方向來(lái)閱讀文案,也是一個(gè)小細(xì)節(jié)。


然后這個(gè)案例中,我用了一個(gè)簡(jiǎn)單線條與人物之間做了一個(gè)穿插關(guān)系,有同學(xué)就要問(wèn)了,你那個(gè)看也看不懂的英文到底是個(gè)什么東西?看不懂就對(duì)了,我想讓你看懂的話它就是重要信息,如果你看不懂,那么它就只是一個(gè)簡(jiǎn)單的裝飾作用的點(diǎn)綴,儂曉得伐?


總結(jié)一下這個(gè)案例我們主要用到的方法。

01.圖片裁切

02.漸變映射

03.線條與人物的穿插關(guān)系


[教程作者:王猛奇]
免責(zé)聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉(zhuǎn)載,請(qǐng)注明出處,素材資料僅供個(gè)人學(xué)習(xí)與參考,請(qǐng)勿用于商業(yè)用途!
本文地址:http://likemindfilms.com/tutorial/ui4203.html
騰訊ISUX:2019 - 2020 設(shè)計(jì)趨勢(shì) · 圖形篇
如何通過(guò)設(shè)計(jì)提升banner點(diǎn)擊率?
圖趣網(wǎng)微信
建議反饋
×