在我們平時的設計工作中,經常會需要做一些有動感的畫面,去體現某些產品所具有的運動屬性,比如汽車的速度感、球鞋的運動感等等。可是由于載體或是成本的原因,導致客戶沒辦法投入動態畫面的制作,所以就要求我們只能在靜態的平面中去創造動感,讓原本不會動的畫面看上去好像也能動起來,這就是今天要為大家帶來的內容。
我們先來看一組照片,這些貓的圖片明明都是靜態的,可是為什么我們看到這些照片的時候,卻能夠明顯的感覺到貓在跳躍的動感呢,這個主要是因為我們的心理作用。
正如佛教里所講的,不是風在動,也不是云在動,而是心在動。那些看上去帶有動感的圖片并不是真的在動,也不是屏幕在動,而是我們的心理作用。
所以我們做設計的時候,就可以很好的利用這一心理作用,去實現一些具有動感的畫面。既然要做動感的畫面,我們需要先了解,關于運動在物理學中的定義。
物理學中的運動,必須具備兩個要素,分別是速度和能量。
那我們就可以總結出兩種畫面中的動勢,第一種就是具備速度和方向的動勢,比如畫面中這兩張圖片,我們可以很明顯地感覺到,圖片中的主體是正在運動的,并且具有很快地速度和明確的運動方向。
第二種就是靜止的,但具有強烈能量的動勢。比如畫面中這兩張圖片都沒有在動,可是我們也能夠感覺到它的動感。如果說前一種動勢更注重于刻畫運動的速度感,那么第二種則更加注重刻畫一觸即發的能量感。
那么,我們在平面中應該如何去創造動感呢?其實很簡單,因為張力在畫面中不平衡時,便會產生動感。
所謂張力就是畫面中元素向外擴張的心理作用力。
這么解釋可能有些抽象,我們可以將張力與萬有引力進行類比。萬有引力就是,任意兩個物體具有通過連線方向上的力相互吸引。而我們可以將張力定義為畫面中任意兩個元素,通過連線方向上的力相互吸引。也就是說畫面中的任意元素都有相互吸引的力。
比如我們在一個畫面中的上下左右各放一個圓點,然后在畫面的正中間放一個較大的點,中間這個點由于均衡地受到上下左右吸引力的作用,所以它所受到的張力是平衡的。
當我們將中間這個大點往上移動,大點受到的張力平衡就會被打破,產生了要往下墜的動勢。
根據萬有引力定律公式,物體所受的吸引力和質量是成正比的。
所以我們同樣可以類比到張力中來,畫面中打破平衡的那個元素的質量和面積越大,所帶來的動感就會越強烈。
看完了剛才所講的這些,相信大家現在心里大概都會想起一句話,就是聽過很多道理,依然過不好這一生。的確,聽了這么多的理論公式,難免會越聽越懵。而且我們在做設計的時候,也不可能去測量畫面中每一個元素的大小、間距、方向,也不可能把每一個元素之間的張力進行量化,然后再用公式去計算出動感的大小強弱。那大家肯定還會繼續追問了,那么到底該如何去制造動感呢?
這里我總結了三點產生動感的原因,分別是基于生活經驗與心理認知、誘導視線移動,以及非平衡狀態下產生的視覺沖擊。
我們先來看基于生活經驗與心理認知,每個人在成長的過程中都會碰到許多人和事,并且對不同的事物會總結出一套規律和認知,也可以說是刻板印象,所以我們就能感覺到一件事物是運動的還是靜止的。
比如這兩個小人,雖然只是一個輪廓,但是我們卻能感覺到左邊的人是站立的,靜止的,而右邊的人正在走路,是運動中的。
這樣的例子很多,例如書本是靜,車子是動。
樹懶是靜,猴子是動的。
另外由于人類擁有一種組織傾向,所以當我們看到某一個運動的瞬間時,會自動腦補中出他運動的過程。比如這張靜態圖片,相信很多人看到時都會腦補出那個視頻。
但是這里有一個問題,就是不同的人他的生活經驗是不同的,對于事物的認知和理解也就不同,可能對于一部分人來說這是具有動感的,而對另一部分人來說卻是靜止的。比如剛才那個打籃球的圖片,如果是沒看過視頻的人,當然就腦補不出他的動感了。所以對于這種刻板印象的利用,我們需要根據受眾的具體特征具體分析,千萬不要盲目使用。
接下來我們來講講第二種情況,誘導視線移動。由于運動是相對的,所以我們在看東西的時候,視線移動也可以理解為是物體相對視線發生了移動。
比如我們在看報紙的時候,從左上角往右下角看,在我們眼睛里出現的畫面是這樣的,從而便產生了好像報紙在動的動感。
最簡單移動的案例就是箭頭,例如這是一條水平的直線,我們會認為他是靜止的,而當我們在一端加上箭頭之后,我們的眼睛就會隨著箭頭所指方向移動,從而產生動感。
這兩個都是通過一些指向性的圖形進行引導視線移動的作品。
接下來我們來說一下第三種情況,非平衡狀態下產生的視覺沖擊。
比如在天平的兩端各放一只豬,那么這個天平就是處于一個平衡的狀態。
當我們在其中一邊再加一只豬時,天平就會失去平衡,重量更大的一邊會往下倒,直到找到一個新的平衡。
而我們的大腦其實也和天平相似,當我們看到一些不平衡的畫面時,我們就會有把它轉換為平衡狀態的傾向,所以動感的產生,也就是大腦腦補不平衡到平衡的這個運動過程。
我們在半空中放一塊石頭,由于這塊石頭受到重力的作用,處于一個不平衡的狀態,所以我們認為他有向下掉的趨勢,直到與地面接觸找到新的平衡狀態。
如果我們把石頭換成一個氣球,那么情況就相反了,由于氣球受到重力作用的同時也受到了更大的浮力,所以氣球會有往上飄的趨勢。
舉一個更加能說明的例子,其實我們大多數人或多或少會有一些強迫癥,比如看到這種一只鉛筆沒對齊的畫面就會很難受,特別想把它懟回去。
所以我們就會腦補出這只鉛筆往左移動的過程,從而產生了動感。
這兩個海報都是通過創造一些不平衡的場景帶來刺激感,從而產生動感。例如顛倒的房子和懸空的蒸籠。
經過前面的講解,相信大家應該對動感是如何產生的,有了一定的認識,但是,我們剛剛只是從理論的角度去講解了動感是如何產生的,運用到實際的設計中可能還是會一頭霧水。那接下來的部分就是真正的干貨環節了,去給大家講一些比較實用的制造動感的技巧。
這里總結了 9 個小技巧,我們一個個來看。
我們在前面提到了當我們看到某一個運動瞬間時,我們就會腦補出整個運動過程。那我們就可以反過來,從運動過程中捕捉某一個瞬間,用這一個瞬間來表達平面中的動感。
這里可以分為兩種情況,一個是捕捉運動剛開始的瞬間,強調運動剛開始的那種能量感。
這是兩個捕捉運動開始瞬間的例子,兩名運動員都穿好了裝備,雖然還沒開始動,但是卻能感受到一觸即發的緊張感。
第二種就是捕捉運動過程的某一瞬間,這種方式帶來的動感會比上一種強烈得多。
例如這兩個例子都是捕捉了運動員正在運動中的瞬間。
這種方式所傳達的動感強弱是由運動物體的動作姿態所決定的,所以我們需要認真比較每一瞬間的動作,選出最適合的一幀。
第二種技巧是傾斜構圖,一般橫線和豎線都會給我們一種穩定平衡的感覺,而斜線相對于橫線和豎線來說,則會給我們帶來強烈的不平衡感。
例如這些圖片,無論是邁克爾·杰克遜的經典舞蹈動作,還是比薩斜塔,都給我們帶來一種不安定、危險、不平衡的視覺沖擊。通過這種不平衡感從而產生動感。
我們觀察這些線,會發現 45° 時的斜線相對于橫線和豎線的傾斜角度最大,所以 45° 傾斜時不平衡感最強,動感也最強烈。
漫畫中的傾斜構圖
在漫畫作品中經常會將劇情畫在傾斜的格子中,目的是為了彌補漫畫紙質作品的缺陷,強化漫畫內容的動感。
電影中的傾斜鏡頭
在電影中也會故意用到傾斜的鏡頭,由于電影本身就是動態的,所以運用傾斜鏡頭一般是用來強調危機感、動蕩不安的漂泊感等等。
攝影中的傾斜鏡頭
攝影作品中也會用到傾斜視角,這兩張都是通過傾斜視角強化速度感的例子。
文字傾斜
那么我們看看傾斜在設計中是如何使用的,首先可以是文字傾斜,這兩個海報的人物主體都是豎直的,通過文字傾斜來增加動感。
主體傾斜
這兩張海報則是保持文字水平排列,將主體進行傾斜處理從而帶出動感。
疊加傾斜色塊
我們也可以將文字和主體都水平或者豎直放置,然后添加傾斜的色塊強化動感。
畫面整體傾斜
這種是將包括主體和文字在內的畫面整體進行同一角度傾斜處理。
多角度傾斜
最后這種是難度比較高的,畫面中出現了多個角度的傾斜對比,畫面十分靈活且動感十足。
接下來看看第三種傾斜技巧,錯位。什么是錯位呢?就像這輛小車一樣,他在運動的過程中,身后會產生的一些虛影錯位,使得畫面中的一部分被破壞了,視覺需要在腦子里想象補充這一被破壞的部分,使畫面還原為原本的樣貌,從而產生運動感。
重復
錯位這種技巧我們也可以分為幾種類型,首先第一種就是重復,通過重復的手法去模擬物體的運動軌跡,讓人腦補運動的過程,從而產生動感。
模糊
第二種就是通過將背景或者是主體進行模糊,從而傳達動感。第一張圖片是通過模糊主體身后的背景去產生動感,而第二張則是通過模糊文字的外輪廓從而產生一種收放的動感。
錯開
第三種是錯開,就是將畫面的某一個部分進行錯開處理,讓畫面遭到破壞,需要人腦去修補這部分的破壞,從而產生運動感。
其他
除了上面三種還有許多別的類型,例如通過車輛行駛濺起的水花,融化往下低落的液體等等,都可以造成對畫面的破壞,從而制造動感。
對于集中與發散我們可以分為兩種,第一種是這種通過線條繪制的發射或是集中圖案,從一個中心向某一方向或四周擴展,或者是四周向一個中心集中的線條圖案,盯著看會出現一種光耀感,通過光學效果產生視覺幻想,從而產生視覺動感。
而第二種則是通過物體或圖形的疏密節奏變化,從而產生出類似擴散或是集中的效果,這種效果會令我們聯想到河流或是煙霧擴散的情形,從而產生了動感。
當擴散的圖案配合上透視的效果,會使得動感變得更加的強烈。
背景
對于這種集中發散的圖形,我們可以將它作為背景來烘托動感和氛圍。
文字
也可以將文字編排成發射狀,模擬出那種噴口而出的效果。
主體
或者是將圖形作為主體去表達特殊的主題。
以透視作為發散
這兩個海報是比較特別的例子,將放射狀與透視相結合,體現了很強烈的動感。
接下來講講關于螺旋的技巧,因螺旋發展或內收形成的曲線,會讓人聯想到水的旋渦形,視覺上就形成動感,且螺旋曲線的旋轉曲度越大,動感就會越強。
另外,密集的螺旋曲線也能給人帶來一種集中或者是發散的效果,從而也能帶來一定的動感。
這兩張海報是將螺旋曲線作為主體使用,來表達其特定主題。
這張海報個人比較喜歡,非常靈活地將畫面中的文字和圖片沿著螺旋曲線排布,加上大小的變化,讓畫面產生了一種集中的動感。
這張海報則是將螺旋線作為背景,并將文字放在螺旋曲線間排列。
第六種技巧是波狀曲線的使用。因為曲線的來回反復扭曲,會令人聯想起翻滾的海浪。
而且由于曲線本身就具有不平衡的張力,他會有一種向直線轉變的趨勢,所以波狀曲線特別適合用來表達動感。
波狀曲線的曲度越大,他所產生的動感就會越強烈。
對于波狀曲線,我們可以將其用來作為主體或者是背景進而表達動感。
也可以通過將文字做成這種扭曲的效果,從而產生一種文字在扭動的動態感。
第七種技巧則是對色彩的使用。因為色彩有前進感和后退感,所以我們可以利用這一點來制造動感。其中最容易理解的就是使用色彩的漸變,沿著色彩逐漸變化的方向,來誘導人們的視線移動,從而產生視覺上的動感。
這兩個都是利用不同色彩的漸變來引導視線移動,從而產生動感。
我們在前面講過運動是需要能量的,而象征高溫的暖色調比象征低溫的冷色調更具備能量感,所以暖色調比冷色調更適合表達動感。
這是一張日本新干線的海報,雖然用的是靜止的列車作為主體,可是鮮紅的背景卻能很好地傳達出列車的能量感。如果我們將紅色的畫面換成藍色的話,那種能量感瞬間就沒了,多了些科技的屬性,畫面變得冷靜克制了。
接下來是重心偏移。一般我們編排版面時都會注意版面重心的均衡,將畫面整體的重心放在畫面中間??墒窃谒茉靹痈挟嬅鏁r,我們卻可以將畫面的重心偏離視覺中心,使畫面形成一種不平衡感,從而產生動感。
我們來看看這兩個海報,都是通過將畫面的重心全都放在畫面的一側,從而產生了一種很強烈的不平衡感。
另外,由于視覺重力的原因,當畫面重心偏上時,能很好地塑造出往下墜的動感?,F在畫面中的這兩個作品都是將重心放在了畫面的上方,我們能感受到畫面中的主體會有一種往下掉的趨勢。
最后一種是蒙太奇的手法。前面我們說過人類天生具有一種組織傾向,當我們看到運動的瞬間狀態時,我們便能腦補出運動的過程。所以通過蒙太奇的手法,將一些不同時刻或狀態的圖片放在一起,便能使畫面產生動感。蒙太奇手法比起單純使用一張運動瞬間圖片,能承載更長時間的運動和更多的運動內容。例如畫面中的這兩個動作,把他們放一起之后我們就可以聯想到這個小哥從熱身到起跑的過程。
其實漫畫運用的就是蒙太奇原理,通過幾個關鍵的情景,去傳達一個完整的劇情。
這些都是運用蒙太奇手法的作品。
以上就是今天的理論部分,接下來我們進入案例實操的環節,這次我給大家帶來了四個案例,分別運用到了傾斜、重心偏移、發散與集中,以及蒙太奇的手法去塑造動感。希望通過這些案例的演示,能夠讓大家更好地理解今天的內容,下面我們就來進入案例的部分。
案例一
首先確定好畫面的頁邊距,并且將畫面橫向分為 6 份。
然后將主體,也就是科比的形象,放在畫面正中間,橫向占中間四欄。
接著在科比的下方疊加一個紅色的傾斜色塊,強化科比傾斜的體態和動感。
從球鞋的名字中提取出關鍵詞疊在科比下層,并將球鞋的中文名放在英文下方。
將球鞋與介紹性文字做成文字組的形式放在畫面下方 。
由于主標題英文被遮擋了一部分,缺失了一些可讀性,所以我們將球鞋的英文名做一個重復放在左上角,并在右上角添加 logo。接下來我們在背景上疊加一個籃球場的場景。
并將畫面的四周涂上黑色的漸變,強化主體形象。
由于現在畫面和主體都有一些偏暗了,所以我們對整體畫面進行稍微調亮,那么這個案例就完成了。
案例二
這個案例同樣也是一雙運動鞋,但是我們這次利用重心偏移的技巧去塑造動感。
同樣的確定頁邊距,并將畫面橫向分為四欄,將主體放在畫面左上角占上方兩欄。
然后從球鞋的名字中提取出相關英文放到版面頂部,并置于主體下方。
因為我們要做一個重心偏移的版面,所以我們接下來將所有的介紹性文字按照主體的負空間排列在版面上方。
為了防止重心的過度偏移,同時和左上角的球鞋做一個對角線的呼應,所以我們在版面的右下方放置價格以及球鞋的型號等信息。
然后吸取球鞋的顏色做一個色彩上的呼應。這一張球鞋的海報就完成了。
案例三
這個案例我們來做一個放射光線的海報,這個海報內容是一款果汁軟糖的促銷海報。
首先確定好頁邊距。
然后我們從這款軟糖的包裝上提取出一個圖形作為畫面主體。然后將軟糖的名字和介紹文案放到這個圖形中。
把圖形按照黃金比例和網格放到畫面中間。
在主體圖形后面疊加放射線條,底下留出一部分空間放置產品圖片及其他信息。
將產品圖片和促銷信息以居中對齊形式排列在畫面下方。
然后我們可以在放射線上添加一些表情愉悅的人物圖片,去強化吃了這款軟糖會很開心的這個動態過程。
還可以在畫面周圍添加一些可愛的小圖形去烘托氛圍。
最后加上 logo,這個軟糖的促銷海報就完成了。
我們也可以將這個海報做成不同的配色,每一款產品對應一個配色。
案例四
這是一個藝術展的海報,我們通過蒙太奇的手法來表現。
由于展覽主題是過去、現在和中間的一切,所以我們將畫面分成三份,并用運動過程中的三個不同動作來代表著三個階段。
由于第一張圖片的底色偏亮了,所以我們將它摳出來,做一個與另外兩個圖片的相同背景。
將主題和時間這兩個比較重要的信息放在畫面的左上角。
其余信息排列在右下角。那么這個案例就完成了,也是非常簡單的,利用的就是蒙太奇的手法。
本期教程到這里就結束了,我們來簡單地總結一下今天的內容。首先我們了解了動感是畫面張力不平衡所造成的,以及強調速度感和強調能量感的兩種動勢。接下來我們講解了三種產生動感的原因,分別為基于生活經驗與心理認知、引導視線移動以及不平衡狀態下帶來的視覺沖擊。最后我們總結了 9 點實用的小技巧,分別為捕捉動態瞬間、傾斜、錯位、集中與發散、螺旋、波狀曲線、色彩、重心偏移、蒙太奇。希望大家能夠掌握好這些方法,讓原本靜態的畫面也能帶來全新的動感。
文章來源:優設
如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里
在日本文化中,「屬性標簽」是一個重要的組成元素。一個人是「御宅族」還是「視覺系」,抑或是「食草男」,細分標簽總會添加上去。雖然這樣的標簽會給人一種「固化」的感覺,但是有時候也會讓人對一個事物有更清晰明確的認知。日本的雜志同樣如此。一本雜志應該針對什么樣的群體,帶有什么樣的特征,傳達什么樣的情緒,都會有非常清晰的「屬性標簽」。
20世紀80年代是日本時尚雜志百花齊放的年代,眾多現有知名日本雜志誕生,例如《ViVi》、《CanCam》、《JJ》、《mina》、《sweet》、《SPRING》等等。不同的雜志風格不同,面向的群體也不同,上面所帶的標簽也不同。
比如時尚雜志《PopEye》是針對「City Boy」的男性,「美式復古」和「學院派風格」是這本雜志最典型的標簽。
而女性向時尚雜志《mina》的標簽則是「清新少女」、「獨立」、「青文字系」?!盖辔淖窒怠故且粋€非常日本的標簽,簡單來說,帶有「青文字系」標簽的雜志在精神內核上強調女性要瀟灑獨立,不應該對男性諂媚,帶有同樣標簽的雜志還有《sweet》、《steady》、《mini》、《SPRING》、《InRed》。與之相反的標簽則是「赤文字系」,帶有這一標簽的雜志特別強調女子力,會教讀者如何穿搭、如何做才能討男生歡心,帶有這一類標簽的雜志有《JJ》、《ViVi》、《Ray》、《CanCam》。當然,近年來還出現了「黑文字系」,其實指的是喜歡穿一身黑的姑娘……
不過言歸正傳,今天我們要聊的主要是《mina》這本雜志?!秏ina》其實在新世紀之初進入過中國大陸,當時中文名稱為《米娜》,巴拉排行榜曾將其列為全球十大時尚雜志之一,是日本少女清新風格的雜志。
《mina》能獲得這樣的贊譽,和它本身極高的內容素質是分不開的。包括尾身沙紀在內的許多著名的攝影師,會給《mina》拍攝圖片,而模特更是有村架純、竹內涼真這樣的一線明星。
清新秀麗的妝容,凸顯少女氣質的整體設計,真實而細膩的場景,《mina》借助精心打磨的視覺排版,將女性最真實可愛、貼合年紀的美麗以及元氣滿滿的少女感,都呈現出來了。
如果你是一名熱愛視覺和排版設計的設計師或者愛好者,《mina》簡直就是為你量身定制的排版素材庫。稍加拆解,你會發現這個雜志中到處都是可供學習的排版知識。
《mina》雜志因為其少女特性,多樣活潑的使用不同的區域放置元素,同一本雜志會給你帶來不同的視覺效果。下面左圖四周無間距的設置,會使你的視線更加開闊,無論看向版面的哪一部分,都可以傳遞信息給你,吸引你打開這本雜志。右圖的框線設置,限制了閱讀的區域,讓你的視線聚焦在框線內,閱讀精心為你準備的內容。
下面左圖三張圖片和兩段文字的排列,使整個版面顯的更加充實和生活化,而右圖單張圖片和零星的文字使得整個版面顯的更加高級,這不僅僅是圖片和顏色選擇的影響,更多的還有元素的排列給你帶來的視覺感受。
為了讓讀者更加易于閱讀,在該版面上停留更長的時間,分組的設計在雜志中較為常見。圖文元素整齊的搭配,是不是給你一種畫面美觀,信息可信賴的感覺呢?這樣的設計也更加的吸引讀者進行閱讀。
同一排版樣式的反復使用,會給你舒適的閱讀體驗,整個版面會更加的有節奏感,不會讓你覺得某一元素特別跳脫。同樣,為了美觀和便于閱讀,無論是圖片還是文字,都遵循著一定的對齊原則,常見的有左對齊、上對齊和居中對齊。
活躍于廣告界的白承坤先生說,無論使用怎樣的圖片,目的都是為了讓眼睛停留兩秒鐘。同理,各類元素或色彩之間的對比是雜志常用的讓你停留「兩秒鐘」的方式。由于視覺心理的作用,相對來說,大的元素、鮮艷的元素會更加的吸引人眼球,引人注意。
對于少女雜志而言,如何體現少女心和元氣滿滿的感覺是一個需要解決的難題,而出血的設置為這個難題提供了一把鑰匙,讓整個畫面活潑生動起來,右圖奶茶開放式對話框的加入,有一種奶茶說「快來喝我!」的活潑感,使得整個版面頓時可愛起來。
《mina》很少在版面的四角放置滿滿當當的元素,是因為適當的留白可以讓人在眾多的元素沖擊中舒緩下來,給你清新舒適的觀感。讓你在開闊的視野中,使雜志想展現出來的重點,成為你的焦點。這樣好用的突出重點的方式,快快學起來吧。
摳出來的人物沒有其固有的背景,會讓你聚焦于少女的動作和輪廓,隔著屏幕都能感受到少女滿滿的活力。而四方版更加強調人與環境的關系,讓你得以獲得更多的信息。兩種方式如何恰當的使用,就看你想用來傳遞什么樣的信息啦!
傳遞信息是最重要的,其余的套路就快去打開《mina》找尋吧!
文章來源:優設
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。
如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里
大家可能聽過很多關于想創意要靠靈感的說法,而在設計師的日常工作中并不是這樣的,至少絕大多數的時候不是。你想想,靈感這個東西是不可控的,快的時候可能幾分鐘就有了,慢的時候可能得等上一兩個月,如果隨便一個創意都要靠靈感,那我們的效率得有多低啊。所以,那些說有靈感才創作、沒靈感就去游山玩水的大師,他們通常指的是大創意,而且他們肯定有比較多的創作時間。而對于日常的設計、創意工作,我們絕不能靠靈感出創意,靠什么呢?當然是靠方法。蔥爺特意幫大家總結了 21 種商業廣告設計想創意的方法,希望可以幫你們提高想創意的效率。
比喻在廣告設計中一般的用法是,把產品或者能代表產品的元素比喻成具有某項功能的事物,這一手法成立的條件是兩個元素在外形上要有一定的相似性。
△ 把產品(雞塊)比喻成代表熱辣的火焰
△ 把布匹比喻成紅酒
借用某元素替代另一元素,或者借局部替代整體。
△ 用涂了口紅的嘴唇代替女人
△ 用一只綠色的手代表綠巨人
即把產品或能代表產品的元素擬人化,擬人手法通常還具備幽默效果,其表現形式主要為以下兩種。
1. 外表擬人
即給事物添加人的特征,如五官或動作。
2. 文案擬人
這一做法并不需要改變事物的外表,而是在文案上賦予人的特征,比如用形容人的話語形容某事物,或者讓它說話等等。
即模擬攝影中的雙重曝光效果,最常見的用法是在人或物的基礎上疊加與其相關的場景,具有一定的藝術效果和視覺沖力。
△ 通過雙重曝光的手法把大象與汽車巧妙結合起來。
即把產品置于中央,往四周發散與其相關的元素,用來表現具有的功能,或包含的服務。
這種做法可以使視覺主體更集中,同時能增強畫面的形式感和視覺沖擊力。
比如手機、銀行卡、書本、手掌等都很適合做成擺放元素的平臺,可以用于表達該元素上具有什么產品或服務等等。
比如可以把包含了寬帶、手機流量的全家共享套餐,包裝成一個全家桶的概念。
再比如我們可以把一些主題活動包裝成 XX 星球,代表一個新的世界。
△ 《奇葩說》的奇葩星球
即用兩個或兩個以上結構相近,但質地不同的元素組合成一個新的整體,這種效果既統一又有對比。
同樣,這個符號必須是跟主題相關的,而且該符號不宜太復雜。
把正常事物或場景中的某個元素替換成其他元素,用來說明該元素也具有原事物的效果或特征。
△ 用快遞員置換炮彈,來說明送貨快的特點。
△ 用飲料包裝置換樹枝上的水果,以說明該飲料原汁原味。
比如說海洋、草地、房間,這些元素的邊界感不明顯,現實中不會以一個獨立的狀態出現,但我們可以給它制作一個邊界,使其從整體中獨立出來。
比如把 Logo 圖形,或者是能代表產品功能、傳播主題的圖形符號,打造成一個由相關元素組成的場景。
西游、三國等典故,超級瑪麗、俄羅斯方塊等游戲經常被引用到廣告創意中,可以有效增加消費者對廣告的注意力。
如果廣告的核心訴求是某個數字,或者是符號,那么也可以把它當成核心元素融入到場景中,然后圍繞它來添加相關元素。
如把功效夸大、把事物的大小比例夸大等等,或者改變事物原本的比例。
這是很直接的一種廣告設計形式,把常規的圖加文結合為一個整體,可以增加圖文的關聯度,降低傳播成本。
正負圖形除了在 Logo 設計中很常見之外,也是海報設計和廣告設計的常用形式,正負圖形一般比較簡潔、創意巧妙,具有很強的視覺沖擊力。
△ 可口可樂的海報很喜歡用這種手法
在產品中添加場景,將其功能或特點視覺化。
為了滿足需求,很多廣告設計中都融合了兩種或者兩種以上的創意手法。
△ 上圖為置換加比喻
△ 上圖為符號場景化和把文字融入場景
△ 上圖為夸張加元素抽離
凡事都有方法和技巧,即使是藝術和創意這種看似不可控的事物。方法和技巧雖然不能保證帶給你一個 big idea,但他能為你提供清晰的思路、提高你的效率,并能將你的創意水準維持在一條基線之上,希望這篇文章能夠對你有所幫助。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。
如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里
我們常說:設計就是在向用戶傳遞信息,在設計的日常工作中,傳遞信息的方式大多都是圖文相結合的形式,而文字作為信息傳遞中最直觀的表現形式,對于整體而言是至關重要的一環。很多設計師一味強調追求圖具有吸引力,而忽略了文字的重要性,最終導致圖文無法結合、虎頭蛇尾。說到文案吸引力,最佳的表現位置就是標題字,所以本期就和大家一起分析、總結一些比較實用的標題文字的處理方式,提升對讀者的吸引力。在文字排版中,想要提升標題文字的吸引力,就要與其他非標題性文字形成視覺上的反差、對比,進而讓標題文字在整體排版中更加吸引用戶眼球。這里說的第一個比較實用的處理手法就是切割文字筆畫,即:以標題文字的筆畫為切入點,在不影響其辨識度的前提下,通過一些特殊的處理手法,提升視覺比重。
切割文字筆畫也可以理解為將文字的筆畫分離字體的本身,然后再以文字筆畫為切入點,進行處理,常用的筆畫處理方式:變色、模糊、刪除、陰影,下面我們逐一來看。
1. 分離筆畫 – 變色處理
顧名思義就是有意將分離的字體筆畫進行變色處理,提升標題文字本身字體上的變化強度,從而提升標題對于用戶的吸引力。舉例說明:
上圖中,這兩種標題形式在設計工作中都是可取的,只是對比而言,案例 1 給人的感覺更加平緩,屬于比較常見、中規中矩。而案例 2 則更加新穎,在視覺上變化更強烈(主要體現在文字筆畫與筆畫之間),更加吸引用戶眼球,也起到了提升作品設計感的作用。
2. 分離筆畫 – 模糊處理
同樣的理解方式,就是將分離的字體筆畫進行模糊化處理,目的是通過筆畫與筆畫之間的虛實對比,營造出視覺上的前后關系,從而提升標題文字在整體文案中的視覺注意力。
上圖案例中通過對比我們發現:案例 4 相較于案例 3 更吸引人,原因在于其筆畫之間的虛實結合使得字體本身就形成了一定的反差感,形式上的多變造就了文字更吸引人,同時如果感覺文字筆畫之間的變化強度不夠,可以結合變色+模糊的處理形式,比如:
這樣給人的感覺就更加強烈、也更誘人,但是這種筆畫之間的變化多了,也就意味著掌握的難度提升了,一定要避免過多的效果導致出現凌亂的現象。
3. 分離筆畫 – 陰影處理
可以理解為將文字筆畫分開來看,通過添加陰影的方式,營造視覺上筆畫的前后關系,從而增強其整體的視覺變化,舉例說明:
上圖中,案例 8 就是通過給文字筆畫添加陰影的形式,使得筆畫與筆畫之間在視覺上形成了很明顯的前后遮擋關系,將原本平面的文字變得更立體,也更易于吸引用戶眼球。這種處理手法在平時工作中也很實用,只需要理清楚筆畫的前后邏輯關系,通過畫筆涂抹的方式慢慢調整即可。
4. 分離筆畫 – 刪除處理
刪除筆畫的處理形式相對來說在工作中運用較少,因為一旦處理不恰當,很容易影響字體本身的辨識度,適得其反,舉例說明:
如上圖所示,刪除了一些筆畫,給用戶留下一些想象的空間,也是比較新穎的處理方式,比較適合一些平面海報標題的設計。
這種刪除字體筆畫的處理形式雖然很新穎,但是應用的局限性較大,屬于比較難把控的一種。
注意:將文字筆畫單獨拆分出來進行處理的手法,一定不要過于追求變化強烈,否則很容易導致標題文字非但沒有起到吸引用戶的作用,反而最基本的辨識度都會被破壞,一定要把握好度。
在日常工作中,通過給標題文字添加輔助元素,從而突出標題的處理手法是非常實用的,這里所說的輔助元素可以分為很多種,比如:圖形、肌理、光效等等,目的都是借助輔助元素與標題文字的相互結合,讓文案標題的視覺形象更鮮明、更吸引用戶。
添加圖形是屬于比較直觀且應用廣泛的一種處理方式,而這里的圖形一般情況下會和標題文字在屬性上有所反差,這樣有利于最終效果的呈現更加明顯,舉例說明:
如上圖所示,標題文字通過添加下劃線、邊框、形狀等等輔助圖形元素,較常規標題而言,其視覺變化更加強烈,整體豐富度提升了很多。但是這種輔助元素不能添加太多,否則很容易出現亂的現象,要讓這些添加的元素與標題形成相輔相成的關系。
上圖的設計案例,通過對比我們發現,右側案例視覺更豐富,且標題文字添加下劃線后,其在畫面整體的視覺形象更加鮮明、更吸引用戶眼球。
現實生活中一個物品如果置身于某一個環境內,它自身就會受到周圍環境的影響,而如果我們假定環境,將標題文字看做物品,那么我們就可以給予標題文字在環境中的光影,比如:投影、倒影、發光、環境色等等,這樣就間接地增強了標題文字的視覺變化,從而起到吸引用戶眼球的作用。
如上圖所示,把文字當做處于環境中的物體,通過投影、倒影、陰影的方式體現其環境,在視覺上有了更深的層次變化,也能起到強調、加深印象的作用。這種營造環境感的處理形式在平時工作中也很實用。
再說下發光的處理手法,這種形式大多用在暗色調的畫面中,將文字看做一個發光體,即受周圍環境的影響又影響著周圍環境,舉例說明:
上圖中雖然說左右兩種表現形式文字都比較清晰、明了,但是就視覺感受而言,右側將文字作為發光體與周圍環境相輔相成、融為一體的處理形式更容易吸引用戶眼球,而且更加新穎、有創意。這種表現形式在一些電商海報中也很常見,比如:
發光的效果給人的感受很舒服,打破了常規的單純平面編排文字的現象,將文字場景化,使其更誘人。
還有一些在平時工作比較實用的,只不過或多或少在之前文章中都有提過,這里以補充說明的形式展開。
1. 標題文字 – 關鍵詞變色
說到關鍵詞變色算是比較常用的一種,就是將原本標題文字中一些關鍵詞進行變色處理,目的是增加標題文字的視覺變化強度。
通過將案例中「免息」一詞變色處理,使得標題在視覺感受上更加明顯、有吸引力,而且給人的感覺也很舒服,這種處理手法是非常實用的,不妨多試試。
2. 標題文字 – 描邊
描邊文字在平時工作中用到的相對少一些,這種處理手法也間接地起到了打破常規的作用,當我們一直按照某一些常規形式工作時,偶爾做一些改變也許會得到意想不到的效果。
3. 標題文字 – 與主體遮擋
文字與主體營造遮擋關系也是在日常工作中很實用的一種,就是將主體與文字相互穿插排放,通過必要位置的陰影進行加深體現。雖然元素并不多,但是最終呈現的視覺效果卻很舒服、有吸引力。
這種主體與標題穿插表現的形式使得兩者更加整體,對于畫面而言,主體和標題都起到了很好的強調作用。
文章中提到了一些比較實用的提升標題文字吸引力的處理手法,但是需要注意不能過于追求效果而忽略了設計的本質,要根據需求選擇恰當的方式,不管何種形式,都要保證文字本身的識別性。文章中提到的并非全部,主要還是為大家提供一個可以參考的方向,要學會舉一反三、大膽嘗試。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。
如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里
我們在日常工作中幾乎離不開扭曲和變形工具,它可以幫助一個設計師校正一個元素的透視關系,或者為設計好的標志貼效果圖。除了這些日常的應用以外,扭曲工具還有哪些有趣的應用場景呢?我們今天的內容就會幫你找到答案。
從宏觀的角度來講,這種扭曲的手法,它設計出的版面變化方式是非常多的,我們將比較熟悉的文字進行扭曲,是可以呈現出其它的表現形式的。
比如說,最左側這個海報,我們不光能看出來它的文字信息,還具有樓梯的印象;中間的這個海報,它把文字變換成了晾衣繩的感覺;我們再看最右側的這個海報,很明顯它就是一把扇子對吧。
這種表現形式它是比較抽象的,再加上它能夠變異成其它的形狀,所以,這種版面風格也會傳遞出一種趣味感。
我們在現實生活當中扭曲的圖像,它屬于一種光學的現象,比方說哈哈鏡,它就是利用了這個原理,表面凹凸不平的鏡面,反映出人像或者是物體的扭曲面貌,進而產生了幽默感。
生活當中的望遠鏡放大鏡顯微鏡,也都是利用了這種凹凸的透鏡原理來實現的。
我們人類還處于原始的時期,就已經開始運用繪畫來記錄身邊的事物,在經過不斷的發展,藝術家它們的繪畫技藝也變得越來越逼真,甚至達到了和照片難辨真假的程度。當寫實的風格幾乎走到的時候,藝術家為了尋找新的藝術發展方向,畫風就開始變得扭曲起來,變得抽象起來,從而產生了超現實的藝術流派。
我們將本來是圓形的西瓜和籃球限定在一個圓角矩形的這種做法,也是一種抽象的思維方式。
在這里我們為大家劃分了五種常用的表現技巧,這些都是我們日常工作當中經常用到的一個扭曲技巧,我們分別介紹給大家。首先第一個就是液化這個工具,液化這個濾鏡應該算是非專業人員都會知道的美顏功能,這個 ps 濾鏡被用在了各種美艷的 app 里,這種夸張的藝術創作在漫畫里面是經常出現的。
我們來通過網格感受一下液化命令到底是出現了哪些變化,液化的好處就是能夠根據實際情況手動調節畫面的扭曲幅度。它的自由度比較高,但是它的缺點也是自由度比較高,所以難度會比較大一些。
在設計的過程當中,也可以運用這個功能來刻畫主體,產生一種遮擋的效果。我們也可以通過扭曲讓文字的部分結構變得不容易認讀,這就能達到設置懸念的作用,我們也可以通過其它不同幅度的扭曲變形,達到自己想要的狀態。我們看上圖是日本TDC 的獲獎作品之一,作者是村上雅士,它運用的就是液化功能,將原本很平淡的版面,通過扭曲的變化,達到了吸引眼球的藝術效果。
這個是臺灣設計師聶永真,他為2017年金點概念設計獎制作的主視覺海報,這個海報它以不規則的曲線呈現,并且搭上充滿想象的文案,有耳目一新的形象。
下面我們來看一下球面化的工具,我們大家都知道,杯子中的水具有扭曲光線的作用,我們插到水里的這個筆它就會產生扭曲的現象,這個就是光的折射。我們在設計當中進行簡單的圖像合成時,也需要遵守這個物理定律。
我們這里通過網格來看一下這種形態的具體表現,顧名思義球面化的命令就是能夠將選區內的畫面進行球面的扭曲。它適合用在圖像合成或者是還原真實性的場景里面,我們通過調整不同的幅度,產生不同的魚眼效果。
除了基本的球面化扭曲,我們這個選擇里還提供了水平和垂直的變化,形成類似圓柱體的表面效果。我們在產品貼圖圖像和形象的領域是經常用到這個東西的,我們調整不同的扭曲幅度,能夠完美的讓圖像貼合到柱狀的弧形表面上。
這里給大家準備了一個案例,我們給它添加一個氣泡,然后再產生一些光影的效果,如果說我想讓這個畫面變得更真實一些,我們在設計的時候就要考慮到物理定律,這個時候就可以用球面化的命令。我們讓圓形下面的文字產生光線折射的感覺,調節選項中的滑塊,找到那個最接近真實的反射效果。
這個案例是我們研習設之前教程里提供的一個案例,我們看圖中這個玻璃球和文字的銜接部分,用的就是球面化的效果。我們只看右側這個對比圖,你可以明顯感覺出來,底部這個經過修改后的細節是更真實的,文字經過玻璃的反射,它一定會產生扭曲的視覺印象。
下一個給大家介紹一下極坐標,極坐標這個詞聽上去會比較陌生一些,但是你會非常熟悉,比如說這個啟動畫面,這個是PS cc版本的啟動插圖,它就是運用極坐標的命令實現的效果。除了能夠實現從內部向外旋轉的這個洞穴效果,還可以表現成類似于球體的效果。
我們繼續通過網格來看一下它的扭曲原理,這里給大家做了一個細節的變化,是為了方便大家觀察它的扭曲方向,我們給這個網格添加了顏色,頂部是藍色,底部是紅色,接下來我們為它執行極坐標的命令。
執行極坐標這個命令后可以很明顯地看出,原來底部的網格內容被扭曲到了圓形的外側,就是紅色部分,變成了這個球的外側,內部這個藍色,就是之前頂部的藍色部分。
它也提供了另一個額外的扭曲選項,扭曲后的效果就是這樣的,這個效果我們不常用。
我們選擇這張圖來作為演示,讓大家明白極坐標是什么原理,我們為它添加極坐標的效果,這個時候需要確定什么?就是圖像的朝向問題,因為這個直接決定了最終的扭曲效果。
頂部的區域會在圓的內部出現,底部的區域會在圓的外部,我們根據想要達到的最終效果,來判斷圖像的具體朝向。這里制作了兩種朝向的扭曲畫面,左邊的是地面在內部的球體效果,右邊是地面在外部類似于洞穴效果。
我們在扭曲命令之后,需要手動將畫面這個銜接部分處理掉。你可以用圖章工具處理掉,這個畫面就做完了。
再舉一個例子,這個畫面我要做的是人物在球體表面的效果,我們要考慮到方向,所以我們要將它旋轉180度,然后添加極坐標命令。
使用修補工具來完成這個銜接部分,這個畫面就完成了。
我們再來看下一個,下一個就是文字扭曲,也是我們這節課比較重要的一個內容。這個命令跟其它命令不同的地方就在于它不是在濾鏡菜單下面,它是在文字編輯欄的右側,在樣式選擇里,它提供了很多不同的扭曲方法。
這種方法相對于液化或者是自由變換更方便一些,因為它的這個可操控性很強,頂部提供了兩種扭曲方向,底部選擇則是調整扭曲的幅度。
這里我們簡單地制作了幾種文字樣式,就是這個命令,它會讓文字變得更接近圖形化。
下一個我們來給大家介紹一下置換的扭曲風格,它的扭曲原理就是將被置換的元素,再加上需要被扭曲的元素,它們二者相結合,從而達到被置換元素一樣的扭曲效果。這個話有點繞,我們通過下面的例子就明白什么是置換了。置換的幅度不同,扭曲的大小也會發生相應的變化。
比方說我們這里被置換的元素可以是任何圖像,煙霧、絲綢、水波紋、液態流體或者是火焰,它們都可以當成被置換的元素。
比如說這里我們想讓鴿子圖案和旗幟結合,這個時候就需要用到置換的扭曲命令。首先第一步要做到的就是確定好鴿子在旗幟里的比例大小,然后要調整透視和傾斜角度來適應旗幟的表面輪廓。
最后執行置換命令,讓鴿子的圖像加入旗幟的扭曲輪廓,這樣就形成了兩者的完美結合了。界面里水平與垂直的比例,都是可以用數值來調整的。
我們再看下一個,不光是圖形,文字也是一樣的,添加置換命令之后,文字就會置入到了這個場景里,它的原理和之前是一模一樣的。
我們再來看一下其它使用置換手法設計出來的版面,它們都是在表現原有信息的基礎之上,通過置換的扭曲為版面,加入了另一種形態。左側的飄動絲綢中間的樓梯和右側的這個有點類似于紙張扭曲的效果,這些都是用置換這個命令來表現出來的。
我們來看一下,同樣都是這個扭曲,用扭曲的這個思維,它設計出來的畫面應該是什么樣的。這個版面里文字信息使用的就是扭曲的變換形式,主體文字周圍圍繞著不規則的扭曲文字,增加主體形象的形式感。這種手法雖然會減弱文字的識別性,但換來的是視覺吸引力。如果想讓選擇的文字扭曲的話,這個文字最好是比較大的標題性文字。如果是小文字扭曲之后,它的識別性基本就沒有了。
我們再來看下一個版面,大家應該能看出來,它就是運用了我們前面講到的液化扭曲命令,思路就是重復的文字,它能起到強調作用。但有的時候你每一個細節都完全一樣,它就會有單調的感覺,我們通過液化工具在對角線上進行扭曲,這樣就會產生變化。
我們再來看下一個,這個效果是比較有趣的,它是用什么方式制作的?它是拍攝的。這個設計有的時候就像拍電影一樣,并不是所有場景都必須依賴電腦,有的時候實景拍攝也能夠帶來更好的真實感。
這個版面用的是置換手法,由于我們沒有辦法找到相同的幕布,這里我們找了一個類似的作為載體,我們在上方加入文字信息,然后用置換命令,這個就變成了跟海報類似的感覺了。
這個版面和上一個有一些類似,但是不同的是它沒有背景,它沒有載體。這是因為扭曲的材質背景直接鑲嵌在文字的輪廓里了。給大家舉一個例子,很簡單的思路,我們選擇一個具有扭曲表面的背景圖片,然后將文字放到這個圖片上方,應用置換命令,采用多重曝光的手法。我們將這個材質鑲嵌到文字里面就完成了,這樣就看不到材質了。
那么最后,給大家做一個案例演示,用到的就是扭曲的命令,這是一個活動展覽的項目,它的主題叫流動消融。
為了達到宣傳的目的,這里尋找一個能夠讓文案中的概念實體化的載體,就是標題,它的標題很直接了,那么提取主標題作為版面里的視覺元素,讓它變得很大,成為本案的主體。然后我們將文字稍微拉長一些,這個拉長是手動拉長的,所以它會出現橫粗豎細的現象,這個時候就需要修改了,調整筆畫的粗細統一,去掉一些不必要的細節,這樣這個主標題就刻畫完成了。
然后我們繪制版面的比例關系,這一步的目的就是確定主體在版面里的大小。然后主體的這四個字就放在畫面里的上部區域,底部的這個紅色區域,我們來安排其它的文字信息。
接下來把其余的文字信息編排到版面的下方,我們所有文字編排好以后,最后一步,為畫面添加一個水波紋的細節部分。
采用置換命令讓二者結合,然后把水波紋去掉,鑲嵌到文字里。
這個版面到這里就完成了,我們來看一下它實際的應用效果。
今天我們一起學習了扭曲技巧在版面里的應用,也知道了這類風格它的五種常用表現技巧,扭曲的這個版面不但可以和其它形狀結合,更能為版面帶來豐富的形式感,它是我們做主形象非常好用的一個手法。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。
如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里
之前我們更新過如何做投影的文章:《投影一直做不好?看這篇文章就搞定!》,主要針對的是投影的原理進行講解,包括如何用圖層樣式去做投影,怎樣用工具繪制投影,這些都是我們了解投影的一個基礎。教程發布之后,很多同學留言,表示沒看夠,希望針對其他投影形式再進行更深入的講解,那這次我們就來滿足大家要求。其實投影的設計不難,只要符合畫面的光影邏輯,然后加上制作投影的方法,基本就能搞定很多基礎的投影形式,話不多說,我們開始今天的教程。其實投影在設計中的應用是非常廣泛的,比如這些海報,都運用了投影的形式。
在平面設計中,除了合成設計之外,我們在什么情況下會選擇用投影?
1. 增加識別性
比如,在顏色比較混亂的背景上添加文字,或者添加圖片,為了區分他們之間的主次關系,我們會添加一個投影。
2. 增加空間感和層次感
這兩個畫面,通過投影與主體的位置關系,產生較強的空間感和層次感。
3. 提升畫面格調
反應產品質感的投影形式,會提升畫面的格調,這類比較多的是化妝品與品。
4. 增加形式感
如果你的畫面缺少創意性,不妨試試這類投影形式,通常來說它們都是用投影作為畫面中的主體,以此來傳遞出很強的形式感與故事性。
5. UI設計
UI 設計中使用投影。
常規型投影包含了普通投影,弧形投影,接觸投影,彌散投影。
普通投影
普通投影就是我們最常見的一個投影形式,它可以用圖層樣式來設置,它的特點就是在圖像的四周都會有點陰影的感覺,讓畫面與背景形成前后景的關系,就像這里的案例。
弧形投影
弧形投影,它的投影是在物體的一側,像翹起的邊緣。
接觸投影
接觸投影,是物體立面與底面的關系,會有一種三維立體的感覺。
彌散投影
彌散投影,與普通投影的區別在于,它更有深度,也是現如今比較流行的投影形式。
長投影主要分兩種,一種是色塊投影,一種是在色塊的基礎上的漸變投影。
比較常用在圖標的設計,還有海報的設計。
倒影,這類型陰影應該是比較難處理的了,想必大家在做設計的時候,大多數情況會規避倒影這種形式,除非是拍好的照片自帶倒影,不然很少有同學愿意觸碰這塊。因為它比較考驗大家對圖形的認知能力,以及對透視基礎的掌握,之前我們有講過一篇關于素描知識的文章,在里面介紹過關于物體的基本結構,我們所看到的任何一個物體都有一個結構或者形狀,比如立方體、圓柱體、圓錐體、球體。任何一個物體都可以視為這四種幾何形狀中的一種或幾種的組合。那在倒影當中,這些基本形狀同樣適用。
首先來看二維的倒影,二維的倒影比較簡單了,也都很好做,復制一個下來,加個蒙版做漸變處理就可以了。
三維物體,最基本的就是這幾個形狀,或者幾種形狀的組合,掌握幾種形狀的倒影,就能應付大部分倒影的形式。
立方體為基礎型的倒影。
圓柱體為基礎型。
圓錐體為基礎型。
球體為基礎型。
組合型。
懸空投影,這類投影給人很強的空間感,并且大多數情況,投影都會成為畫面中的主角。
分為三種類型,二維的懸空投影,2.5D 的懸空投影,三維懸空投影。
二維的懸空投影
先來看看二維懸空投影,是二維的平面懸空,添加一個彌散投影。
2.5D的懸空投影
2.5D 沒有消失點,但是會有立體感,在下方添加一個投影,就會有懸空的感覺。
三維懸空投影
三維懸空投影能有很多創意形式。
創意投影,它不會根據物體本身的形態去表現,而是根據文案和設計構思而產生的很有創意的投影形式,這個主要靠大家發散思維的聯想了。
最常見的就是電影海報中的投影表現。
一種情況是接近真實的投影,和實際照片是一樣的道理,一種情況是類似于創意投影,合成的投影算是這幾種投影當中最難的。
合成中的投影要自己創造一個光源,也就是想象出一個光源,根據光源關系,繪制出投影效果。
投影在這里都是很真實的表現。
合成也可以做創意投影,這三張公益海報的主角是動物的影子,但是形成影子的是前面的物體,這是很有創意的表現方式。
制作投影的方法比較多,比如說利用圖層樣式,用矢量圖形做投影,高斯模糊設置投影,手繪投影等,每一種方法都適用不同的投影類型,我們想更有效率的完成工作,就要對這些技法有個較深的了解。下面我就帶大家來了解下每種方法。
1. 圖層樣式
第一個,也是最簡單的,用 ps 當中的圖層樣式來做。
模式一般我們就選擇默認正片疊底,這是在正片疊底文章中講到過,后面的顏色,如果是主體與背景顏色差異比較大的時候,我們可以選擇環境色;如果差異不大,我們可以選擇主體的相近的顏色,很少有選擇純黑色的投影。
不透明度就是陰影的透明程度,也是很好理解。下面角度,是光線照射的方向。全局光,選擇之后,畫面中其他元素添加投影,就會默認為一個光源,這樣畫面中投影會更和諧。
距離,物體和投影之間的距離,數值越大越遠。擴展,就是陰影面積的大小。大小,就是陰影的虛化程度。
等高線,可能很多同學不太理解,其實很簡單的,我們來看下,縱向,越向上,越實,越向下越虛化。橫向,最右側是投影的中心位置,越向左,離中心越遠。根據畫面中的等高線,我們來分析下。
這樣就好理解了,我們看畫面中藍色圓點的位置,代表中心位置很實,黃色圓點的位置代表遠離中心的位置很虛化,最后就得出右側的投影。
那如果說,我想讓投影的周圍都變得很實,該怎么調整?
就是把虛的那個點向上調整,這樣,就代表外圍投影變得相對較實,我們會得到這樣一個投影。
如果我想,投影靠近外圍的位置,變得比較實,靠近中心的位置,變得比較虛,就可以這樣調整。
得到的投影是這樣的,我們看到中間白色的區域,就是虛化之后的效果,接近了透明。這個搞懂了,利用圖層樣式做投影也就基本沒什么問題了。
ps 還自帶了這么多等高線的樣式,大家可以去實驗一下。
那什么類型投影,比較適合用圖層樣式來做?
普通的投影和彌散投影。
畫面中人物的投影設置。
2. 矢量圖形做投影
畫一個矢量圖形,之后選擇實時形狀屬性,然后點擊蒙版,通過調整羽化值,來調整投影的虛化程度,用這個方法會比較直觀的觀察到,而且因為是矢量圖形,所以還很方便我們隨時調整它的形狀。
高斯模糊和矢量圖形做投影,所適用的投影類型是一樣的,同樣適用于普通投影,弧形投影,接觸投影,彌散投影。
還有懸空投影,它和矢量圖形投影的區別就是,矢量圖形更方便改顏色和形狀,還有虛化程度。
在主體下方加一個小面積的虛化陰影,就會有懸空的感覺。
3. 高斯模糊做投影
添加高斯模糊之前,一定要記得給圖層轉換為智能對象,因為高斯模糊對圖層是有不可逆的破壞性的,所以添加智能對象之后會很方便我們隨時去調整它的顏色和模糊程度,動感模糊同理。
高斯模糊做投影,適用的投影類型。
4. 手繪投影
最后一個,用鋼筆工具或者畫筆工具來繪制投影,這個是比較難的,在投影那篇文章中,我們已經講過在一個場景中,怎樣分析投影的位置,大小,形狀,方向,以及如何用鋼筆工具去繪制投影,這里我們就不再重復了,如果有不懂的同學,回看之前的文章《投影一直做不好?看這篇文章就搞定!》
那我們來看一下,手繪投影適合什么類型的設計。
第一種就是合成設計,這個要考慮光源的位置,投影的透視,投影的顏色等,一般會采用畫筆和鋼筆工具的結合。
創意的投影同樣適合,因為它和合成投影基本一樣,只不過不會根據對象的實際特征去繪制。
倒影適合用鋼筆工具和畫筆工具來制作,這里就涉及到了透視,我們能看到物體在基面上的倒影,實際上是物體在基面上的投影的倒立映像。
在平時的工作生活中,我們要學會觀察,比如積水的路面,反射建筑的倒影是什么樣子的,鏡子里的自己,或者可以多看看攝影照片,慢慢養成習慣,提高對倒影的敏感度。
做倒影最重要就是兩個字──拆分,我們給這個立方體做倒影,首先要思考的是,它的倒影是由哪幾個面產生的,找到物體與承影面接觸的線,然后把這兩個面提取出來,沿著這個線把所在的面拆分出來。
然后向下鏡像,根據實際情況再翻轉,要注意,倒影的透視和原本物體的透視要一致,也就是平行原本對象的邊線。
然后給倒影添加一個蒙版,做一個漸變,就可以了。
用剛才的方法給魔方做一個倒影
同樣把與底邊接觸的面裁剪出來,可以看到透視關系還是不一樣的,我們應該讓倒影的面和上面的魔方透視一致。
用調整大小里的斜切,調整倒影的透視。
添加蒙版,然后在與地面接觸的位置添加一個閉塞陰影就可以了。
再做一個復雜點的,給包做倒影。
同樣,找到底面接觸面,然后把相應的面裁切出來。這里注意的是,每個面要單獨拆分,這樣才方便為每個面設置倒影。
把所有拆分的面復制一個出來上下鏡像。
調整透視,就用調整大小工具,斜切,合并倒影的圖層。
用蒙版漸變,別忘了閉塞陰影。
倒影規律及特點:
好了,前面介紹了每一種投影形式,以及適合的場景。那接下來,我們來看看在同一光源的前提下,不同承影面,也就是投影在不同的材質上是如何表現的吧。
布面材質是軟性材質,在光源下會吸收光的反射,所以投影的邊緣會相對模糊,不會過于鋒利。
案例演示
我們來看下在布面材質上的投影的做法,首先在物品與布面底部繪制一個閉塞陰影:
然后新建圖層,根據光源繪制出陰影的長度與形狀:
給長投影做高斯模糊,然后用蒙版把邊緣處理得柔和一些:
統一光影,把產品修飾一下:
整體調整下色調,就可以了:
鏡面是光滑的,所以光照射之后,會形成和物體一樣的影像,也就是倒影。
設計之前,先參考下帶有鏡面倒影的照片。
案例演示
第一步,閉塞陰影:
第二步,拆分圖像,拿到下方,調整透視,這是之前我們講過步驟,這里就不重復了。
調整產品的光影與色調:
加點小裝飾,烘托氛圍:
最后是整體調整下色調和明暗:
水面和鏡面類似,但是水面會存在水波紋,所以在做投影時候要注意投影的形態要與水波紋一致。
參考一些帶有水面倒影的照片。
案例演示
依然先畫閉塞陰影:
繪制出整個投影形態:
高斯模糊處理,因為是水面,所以陰影和倒影要共存:
下面就是倒影了,方法步驟同樣。
那么問題來了,是怎么做到彎曲的效果的?其實就是用 PS 當中的置換來做,這是置換的參數與水面素材。
關于置換的教程我們也發布過,《平面高手課堂!如何用扭曲工具快速強化作品設計感?》
最后統一色調和光影就完成了。
地板有的會打一層蠟,這個時候,就會存在一些倒影,所以在這樣的地板上倒影和投影是并存的。
先看一下在不同地板上的投影樣貌。
案例演示
這個我們選擇大理石材質,首先閉塞陰影:
繪制投影的形態:
給投影高斯模糊,添加蒙版做漸變:
然后,按照光影和環境色,處理產品的明暗和色調:
5. 漸變色/純色
這也是我們設計中遇到比較多的情況,在純色或漸變色的背景中,為了讓畫面具有空間感,我們經常會給物體加投影,這個投影可以是常規投影,也可以是倒影。
案例演示
閉塞陰影:
根據光源繪制投影:
高斯模糊,然后添加蒙版做漸變:
修飾產品的色調和光影:
統一光影色調:
教程到這里就結束啦,估計有的同學會納悶,為什么我們沒有細講怎樣根據光源繪制投影?因為在之前投影文章中已經手把手給大家演示過了,沒看過的同學趕緊去補課,可閱讀《投影一直做不好?看這篇文章就搞定!》
總結下今天的內容,第一,投影在畫面中作用。第二,我們給投影形式做了分類,有常規型,長投影,倒影,懸空投影,合成投影。然后是制作投影的方法,著重介紹了倒影該怎樣做,最后是投影在不同材質上的表現。通過關于投影的這兩篇教程,相信大家已經能掌握一些原理和技巧了,其實最快速學習投影的方法,就是要學會觀察生活中的事物。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。
如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里
抽象圖形拼接
坦白說,這些抽象的 LOGO 設計讓我立刻想起了JK·羅琳和她書中的魔法符號。如果這些Logo背后都有著獨特而富有力量的故事,那么它們確實可以很好地服務于品牌。這樣的了 LOGO 設計應當在筆觸上保持一致,并且充滿意義,我覺得如果能傳遞出這樣的信息,它就很優秀了。
利落清晰的筆觸,完美的角度和弧線,這樣精準的設計會給人帶來可靠的感知。當然,這些Logo 的應用場景同樣有著嚴格的環境要求,設計師幾乎沒有異想天開的余地。這些 Logo 看上去相當正式,有著明顯的高級感。
借助負空間來傳遞信息一直一種巧妙的 LOGO 設計技巧,它就像缺少關鍵證據的犯罪現場,墻上的洞,它并不是借助現有存在的因素來告訴你信息,而是通過一個「不在場的關鍵元素」,來傳遞重要信息。負空間就是這樣,它同樣也是一塊畫布,只不過給人的感覺是通過畫布的背面來呈現信息和故事。
負空間并不是為了隱藏信息而存在,就像聯邦快遞 (FedEx) Logo中隱藏的箭頭,或是 Toblerone 巧克力 Logo 中山腰上的熊。這些元素都不是為了隱藏信息,而是為了通過這種不完整來傳遞更多的信息。通過正空間來凸顯負空間就是關鍵的技巧,正如 Reinhard Ernst 博物館的 Logo 所示,中間開放的矩形區塊如同畫框,似乎可以代表博物館的任何一件藏品,這也是一種「less is more」的設計。
很多做 Logo 的設計師都曾經歷無法控制的時刻,發呆失神應該也經常會發生。如果你是在紙上畫草圖,筆尖無意識地滑動,或者墨水洇出,都會產生有趣的筆觸痕跡。我知道這不是電腦上繪圖的方式,但它確實幫助我描繪出這種視覺設計的特征。將筆尖繪制成一個完美的圓,而筆尖后則是留下托拽的痕跡,在筆痕結束的位置,自然留下的也是一個圓弧邊緣。
不管這些 Logo 的布局特征是怎樣的,它們都呈現了類似視覺特征。小圓點和托拽痕跡構成了它主要的「筆觸」,它們而生動地拼出字母,繪制出路徑,或者勾畫出有意義的符號。我想你已經捕捉到了它們的特征了——活力四射,生動新鮮的筆觸路徑。
在logo設計中廣泛使用漸變色,是整個行業在過去十年中經歷的最兩極分化的趨勢之一。仍有很多設計師抵觸過渡色,因為從LOGO設計的角度上來說,漸變色違背了很多規則,而這些規則是在數字時代之前就已經存在了。不過,LOGO 設計師們總能想出好辦法,比如間隔漸變式的設計。
將均勻漸進的色彩變化用連續的純色片段來替代,同樣呈現出色彩的變化和韻律感,但是消解了漸變色在 LOGO 展示過程中潛在各種問題。上面案例中,Qwant 的 logo 就是通過輪廓化的顏色分割來實現這一點,它真實地模擬了漸變的效果,所呈現出的效果比CPA Ireland 要好,CPA Ireland 則使用了的四等分幾何分割加上色階轉換??傮w上來說,間隔漸變的色彩使用技巧,很好地在當下的流行趨勢和 LOGO 設計訴求之間找到了平衡點,值得嘗試。
使用線條來勾勒和描摹事物,傳達信息,是一項古老而傳統的技藝。在時下的審美體系當中,使用輪廓線條來繪制 LOGO 似乎顯得太過于老派,不夠現代。不過技術總歸是服務于表達的,依然有設計師能夠充分的利用這一技術——加入透視,不再局限于二維,而是開始描繪三維的對象。
這一的設計看起來和如今的線性圖標的繪制方式在技法上保持了延續性,但是它在維度呈現上更加深入,更加具有表現力和形式感。通過富有規律性的利落的線條,設計師不用太多的線條就能勾勒出立體而抓人眼球的LOGO。這種設計要求設計具備更強大更精準的描摹能力。你可以延續這種思路到整個設計當中,這會使得整個品牌化設計思路更加開闊、有趣。
在 LOGO 設計當中,使用句點這樣的標點符號,通常都會借用它身處標點符號中的含義和功能。當我仔細琢磨這一趨勢時,發現這些類似句點的符號有時像句號,有時則偏向冒號,它們在LOGO中總帶著一些奇特的意味。如你所見,這些原點在更多的時候,它更接近于句號,充當收尾和封頂的終止符。
有的時候,它的裝飾性更強,以不同的形式漂浮在文本和符號周圍。如果你要深究這些 LOGO 設計本身的含義會發現,這個小圓點可能是字母 i 上的那個小圓點簡略之后的殘留痕跡。這個小圓點,在如今的很多 LOGO 中已經超出了裝飾性的范疇,基于不同的需求和設計出發點,它可能意味著時間,可能代表著字母,承載著特定的詞匯和含義,可能是感嘆號或者句號,表達情緒或者終止。設計師將內容抽象成幾何圖形,承載意義,提升了對話的智慧。
在傳遞放飛、飛翔、展望、自由、遠見、輕盈、速度等含義的時候,很多設計師都會借用翅膀的意象。這也是為什么越來越多的地方會看到被提煉和抽象出來的翅膀和羽毛的符號或者圖形,某種意義上,翅膀已經遠超出了它本身的意味。這些被設計得形制不一的翅膀類的圖形,有著冥想的前傾或者后掠的姿態,仿佛在對抗變幻莫測的大風,借助空氣動力學向上飛起。
很多翅膀元素形制類似于字母 U,只不過兩只翅膀在傾斜角度、弧度和長短上,進行了比較深入的調整。之后,再對 Logo 進行弧度和細節進行修飾,這樣就完成了。如同我們上面所在展示的幾個案例,設計師經過很快的迭代就可以完成這樣的設計。與此同時,在具體的設計過程中,設計師還會引用品牌中一些字母的特征,比如Jetta的字母J,DoorDash 的字母 D。大量包含 Fs、Ps 和非字母的意象共同孕育出了雙翼的意象。蘋果有翅膀,烏龜也可以有翅膀。我們可以用翅膀填補空白。
門其實我們常常會引申出「打開新世界大門」的概念,它在實際設計中會帶有通道、時間、新世界,甚至一種全新心境和意境的概念。很多品牌 LOGO 都想借助這個意象來承載更高遠的含義,微軟就是一個典型。門和窗本身一直都是一組象征性極強的元素。門象征著通行的權利,解決方案的途徑,機會,甚至歡迎的含義,某種意義上它們和眼睛在含義和隱喻上是共通的。這也是很多設計師在設計 LOGO 的時候青睞這一意象的原因所在。
2019年的LOGO趨勢報告,是我們的第17份 LOGO趨勢報告。每年的趨勢報告都是從成千上萬的 Logo 中,尋找新趨勢和細微微妙的差別。我們承認,每一個設計案例都代表著來自世界各地的設計師們的思考和心血,我們對他們表示敬畏,并感謝他們不遺余力地幫助我們完成這份報告。感謝所有在過去、現在和未來幾年為潮流報告做出貢獻的設計師們。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。
如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里
在過去的一年里 LOGO 設計行業蓬勃地發展著。對我而言,查看各大設計機構的LOGO趨勢分析和報告,就像開禮物一樣,因為我知道等待我的是一段獨特體驗。這其中有平凡到令人失望的設計作品,也有令我歡欣甚至驚喜的好作品。而這便是LOGO設計行業仍然充滿活力的證據,是值得感激的恩賜。值得欣喜的是今年的設計作品依然體現著設計師的好奇心與勤勉,這激勵我們向著新高度進發。你會在今年的趨勢中看到往年主題的延續,但是融合和改變形成了跟為獨特的設計趨勢。設計師們開始采用非傳統的色彩和線條,賦予新的內涵。
Logo中的圖案通常以黑白配色呈現,營造一種復古感。設計師們以大量的網點元素作為構建差異的方式。粗礪的噪點、條紋以及網線銅版和木紋磚紋的調合,使logo呈現一種復古的視覺特征,這似乎與時下的高飽和漸變色彩的使用趨勢背道而馳。
現代流行文化不僅改變了我們看待符號的方式,也影響了視覺設計時的優先級。隨著紋理、圖案、排版、攝影和插畫元素在視覺品中的優先級發生變化,視覺元素愈發地被收到重視?,F代品牌很多時候會被視作為是被視覺美學所推動前進,因此也會要求 LOGO 具備更強的視覺吸引力。
陰陽相生。當一種新的風格、思路,新的濾鏡、插件和設計工具出現的時候,設計都會向著不同的方向演化。但是,每一個精心制作的LOGO,包括動態LOGO 你都很難把功勞歸結于某一個工具或者方法,它始終是多種方法、工具和流程共同作用的結果,很難把不同的因素徹底地區分開。嘗試新的事物從來都不是壞事,但是我仍然寄希望于獨特的技術和方法,希望在設計里留下自己的痕跡。
我需要再一次重申的是,潮流并非是趨勢所造就的。與時尚領域不同的是,設計趨勢不會隨著文化變遷而突然爆火,相反,它在設計維度上,一直是向著兩個方向延伸,觸摸過去也面向未來。更準確的來說,是我們一直從過去的天才構想中汲取經驗,同時還在不斷開辟走向未來的路。
毫無疑問,今年流行的主題中出現了很多時下流行的元素和主題,包括無人機、蘑菇、刺猬、鵜鶘、蛇、華夫餅、針、燈泡、三眼虎和蒸汽波。雖然這些流行元素只是暫時的,但許多作品仍然制作精美。盡管這種流行元素的風潮最終會落幕,我還是要向它們致敬。
我仍然要感謝 LogoLounge 社區的2萬多名來自世界各地的設計師,他們為這份報告提供了大量素材。在本報告發布時,我們的網站擁有超過30萬個的logo設計師,我們可以與會員一起繼續觀察他們的職業發展趨勢。能夠與他們并肩工作,支持我們熱愛的這項事業,是一種榮幸。
老實說,要求一個老練的LOGO 設計師在 LOGO 當中加入流行的陰影效果,這仿佛是對設計師靈活的創造力進行質疑。今年我們的團隊精心設計了一種新的方式來為他們的作品加入陰影——因為陰影效果本來就不止一種,而還需要兼顧到 LOGO 本身的可用性。我們避開短暫流行的漸變色,用一連串同心的點和線來呈現光影動態,以這種新的方式,比傳統陰影更具視覺張力,更重要的是,它可以更自然地輸出純矢量的單色 LOGO 。
在過去的幾年里,我們看到圓點和線混合在一起,展示了不同元素的融合。通常,這的設計方案會以同心圓為中心,其他元素彼此平行,但不會完全合并到一起。通過將這些元素彼此融合到一起,讓它們和主體元素融合、交匯,在負空間的幫助下,設計師以這種方式讓消費者在頭腦中自覺將圖像填充完整。比如咖啡杯中的幾個點,以及用點狀表示的兔子尾巴。
有人會因為盤子里的食物混在一起而崩潰,也有人對此毫不介意。所以,有的設計師將元素之間的各種元素之間的界限給先打破了,通過重疊來創造層次感,互相堆疊的元素會呈現出一種模糊的效果。而其中大多數 Logo 都呈現出了一種引人入勝的信息,巧妙地吸引了人們的關注。當然,也許大多數人會選擇創建一個對比明顯、信息清晰的LOGO。
這種堆疊式的LOGO設計,使用兩個圖層足矣,三個圖層也勉強可以駕馭,但四個圖層就太過了。如果背景無法辨認,發揮作用的就只有最頂層的視覺元素。上圖所示的這些logo融合了類似于徽章和插畫的排版,正如這些例子所示,這些源自復古的設計能夠煥發出全新的力量。
陰影作為logo設計中的一個元素,在很多方面都是至關重要的。我用了一個完整章節來討論陰影的重要性。陰影暗示著光的方向,更確切地說,它可以顯示維度和空間關系。一條垂直線和一條水平線,再加上一點陰影,就可以確定誰在平面上方了。畫一匹色調均勻的馬,那么馬的兩條后腿就應該處理得暗一點。
有時候,我們作為設計師會受限于自己的技法,這是很正常的。在這些標志當中,包含著一個非常微妙的小陰影,雖然在 Trustpilot star 這個案例中,看起來確實做了比較清晰的分離處理,但我仍然想知道,如果按比例縮小,這種對比是否足夠明顯發揮作用。我的建議是,如果需要效果,就要盡量使得效果可以明顯地呈現,而不是要佩戴老花鏡才能看得清楚。但是毋庸置疑,有很多設計師是經過審慎考慮之后,才選擇了這樣的方案。
熱情飽滿的新生代設計師正在重塑潮流。在數字時代之前,想要在插畫中加入條紋、圓點、中間色調、木紋或其他異國情調的半調效果,首先需要去當地的藝術用品商店逛逛。如今如果你想要實現半調效果,你只需花費很少的錢就可以將其應用到你的設計當中。復古風的設計書籍中充斥著各種各樣的標志,展示著一些非常漂亮的半調式的漸變效果,這會讓設計師們對這種相對古老卻陌生的技術感到好奇。
這一趨勢是非常典型的70年代復古,不僅在風格上,而且在色調上也有體現。這些帶來半調效果的斜條紋線所創造的效果接近于40%的黑色。這樣的 LOGO 設計能夠讓用戶一秒回到以往那個美好的時代,不那么機器制造的感覺。但是它仍然存在缺陷,就是當它縮小的時候,斜條紋會模糊,最終會呈現出一片灰色的效果。
在半調和高亮式的設計技法之間,波點元素還有一席之地。這些超大的圓點其實也算得上是半調的一種形態,它們實際上算是圖標中的一個組成元素,而不僅僅是背景。從這些LOGO的設計案例當中,我們可以看到,這些圓點近似于編織的籃子或桃子的紅暈,圖案并不僅僅是用來表達色調的,它還暗含光影和紋理。
使用更大膽圖案元素,已經是一個公認有效設計策略,打破緊張的平面色調和布局,并創造視覺吸引力,讓元素更醒目。作為一種從在漸變和失真之間尋求平衡感的設計,波點使得設計師可以以有限的顏色,簡單而有趣的矢量圓點來吸引消費者。
人們很容易認為,在吸引人們注意的領域里沒有什么新技巧。猿類拍打胸部,孔雀展開羽毛,人類則在社交媒體上發帖。還有一小部分身份設計師會選擇高亮效果來修飾他們的設計——至少這是今年最引人注目的趨勢之一。
我們通常認為黑白配色的 logo 是在添加高光之前展示給客戶的。當下流行的高亮色調有淡紫色,日光粉,和冰藍色。拋開所有的視覺趣味性不談,設計師們認識到,正是色彩的火花讓這些logo擺脫了潛在的平庸性。
過去兩年之間,設計主題已然延續到簡化設計,以及 Logo的純粹化。這種對前人作品結構的致敬,同樣體現著設計師的創造性,因為他們想出的解決方案是基于重新排列幾何元素而來的。每當你聽到有人表示相信一切都是以前做過的,只要提醒他們,作家和音樂家一直在重新排列了一些筆記或字母,而且新的音樂和書籍,比logo 要多的多,但是靈感之泉卻從未干涸。這大概也是以四分之一圓微代表的幾何元素,開始大規模地出現。
今年,四等分的圓圈元素——或者說扇形,隨處可見。大多數情況下,設計師會完全基于這個扇形來作為唯一的模塊,但偶爾也會讓它們與圓、半圓、正方形、三角形和其他幾何形狀混合在一起。即使在表達復雜的信息時,形式的純粹性可以恰當地與之進行平衡。如果logo看起來很冗雜,那么放入元素的數量應當有所限制。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。
如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里
排版的難處在于,我們不是根據已經設計好的版面來填充內容(套模板),而是要根據具體的內容來布局版面。比如版面中的圖片有時候是一兩張,有時候是十張八張,由于構成元素的不同,導致采用同樣的構圖、版式、形式往往是行不通的,所以蔥爺今天的這篇文章就是要來分享,在不同情況下有哪些圖片排版技巧。1. 平鋪
即把圖片鋪滿整個版面,這種處理方式多用于封面設計。
或者在內頁中把某一半版平鋪一張大圖,另一半則排列文字或者小圖。
平鋪的圖片比較有張力,有視覺重心的圖片適合這么處理。下圖平鋪的效果就一般般。
還有一種情況是把圖片當做背景,也可以采用平鋪,如下圖:
2. 四周留白
即圖片要比版面小,并讓其四周都留出空白。這里也分兩種情況,一是圖片位于版面正中央,圖片周圍的留白是對稱的,這種效果類似于相框,常用于封面設計。
還有一種情況是圖片周圍的留白并不對稱,如下圖,留白較多的區域會用來排文字,常用于海報設計和畫冊內頁設計。
3. 一條邊出血
即把圖片的一條邊對齊邊界,這么處理有點沖破束縛的意思,可以增加圖片的想象力和版面的設計感。
4. 三條邊出血
這么做會把版面分成兩部分,一部分為色塊,一部分為圖片,在排版時我們還可以通過文字、色塊或顏色把這兩個部分聯系起來。
5. 拆分
即把一張圖片拆分成幾份,然后隔開一些排列,這么做比單獨放一張圖片會更有設計感和趣味性,風景類圖片適合這么處理。
6. 跨版
即在畫冊設計中,讓圖片同時占據兩個版面。當在一個跨版中只有一張圖片時,如果只把圖片排在某一半版中,那么另一半版就容易單調,所以在這種情況下通常會使用跨版,而且圖片放大后會更有張力,還能把左右兩個版面關聯起來。
在畫冊的設計中,有時候我們應該把一 P 當成一個版面,而有時候則需要把一個跨版當成一個版面,這取決于具體的內容以及排版形式,所以圖片的排版也要分成這兩種情況來考慮。
1. 統一大小對齊排版
在一些作品集或產品畫冊中常用到此排法,視覺流程簡單、清晰。
2. 統一大小錯位排版
比對齊排版更有動感,且由于圖片不多,所以也不會顯得混亂。
3. 一大一小排版
這種排版對比鮮明、更有張弛,可以在一個跨版中使用,也可以是在某一 P 中使用。
還可以把其中的一張圖片去底,這么組合起來更靈活,對比更強烈。
如果把整個跨版當成一個版面,那么可以把大的那張圖進行跨版,小的那張圖則不跨版。
或者把大圖鋪滿一個 P,而小的圖片和文字則排在另一個 P。
這兩種排法都很大氣且不失細膩。
有時候一個版面內的圖片會有很多,這種版面排起來會更有難度,常用的排版方式有以下 8 種。
1. 大小統一對齊排版
這種排法比較整潔,但缺少變化,適合用于目錄頁或者產品和人物介紹。
2. 大小不統一對齊排版
這種排法會比前一種更靈活一點。適合利用網格工具來輔助排版。
這種排版雖然沒有統一圖片的大小,但由于保持了嚴格的對齊關系,所以依然顯得很整潔。
3. 圖片與色塊組合排版
圖片與色塊組合在一起排版既不會像只有圖片那么單調,還可以利用色塊排文字。不過注意色塊的顏色不要太多,且顏色最好來自圖片。
4. 錯位排版
即把相連兩張圖片刻意錯開,或者把圖片與文字的位置互換,這么做可以有效打破圖片完全對齊的單調,且由于有一定的規律,所以也不會對視覺流程造成太大影響。
5. 把圖片拼成特定的形狀
這種排法適合圖片比較多的情況,這么做可以避免圖片太多而顯得混亂,而且因為拼成的形狀要與設計需求相關,所以會顯得更有創意。
6. 按照某一路徑排版
這種排法跟前一種一樣,適合數量較多的同類圖片使用,可以避免圖片排得太過分散,如果不統一圖片的大小和方向,效果會比較活潑但不規范,適用于照片墻和兒童畫冊的排版。
如果統一圖片的大小和方向,或者使它們呈漸變式的變化,這些圖片還可以形成一定的節奏感,不僅不會亂,還很美觀。
7. 一大多小排版
如果在版面中分開排列大小差不多的多張圖片,那么該版面就會缺乏重點且沒有張力,而如果把其中一張圖片放大,與其他圖片形成鮮明的大小對比,就可以有效解決這一問題。
8. 自由排版
即大小不需要統一、圖片與圖片之間也不一定要嚴格對齊,效果比較靈活,設計感較強,常用于雜志排版中。
這種排法有兩點需要注意,一是圖片不要排的太分散;二是最好要有大小對比。
去底圖也很適合這么做,當然,在排版的時候也要有大小的區分,同時要注意圖片與圖片、圖片與文字之間的輪廓要形成互補。
版面中的圖片數量有從一張到數十張不等,圖片的排版方式也非常多,所以我沒法一一列出,以上總結的 17 個技巧僅僅代表一些比較主流的方向,具體的變化還需要大家根據具體的內容和設計需求去做嘗試和突破,希望這篇文章能給你一點幫助。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。
藍藍設計的小編 http://www.syprn.cn