莫b

點擊下方觀看視頻版哦~

以下是圖文版:

說到版式設計,涉及到的相關理論和方法可以說非常多了,包括之前我們的教程也講過很多關于版式方面的知識,今天的這期教程我們就換一個思路去看待版式設計。在之前的的教程中,我們教過大家一些關于色彩訓練的方法,因為我們都知道,要想學好一門技能或專業,最重要的就是理論和實踐的結合,而這其中又以實踐操最為重要,所以本期教程我們就從版式訓練的角度來探討一下,如果進行有效的自我訓練,來提高版式能力和敏感度。
在這之前我們先來闡述一個概念,就是看待事物的角度,比如我們看周邊的景物,最常見的方式有兩種,一種是橫向去看,比如左右移動視線。
另一種就是縱向去看,比如抬頭望望天,低頭看看地,當然了這只是最粗淺的比喻。
我們再打個比方,比如我們人類本身,如果從橫向的維度看,就是性別的劃分,例如男性和女性,比如《海賊王》里的路飛和女帝。
當然了隨著時代的發展和進步,也產生了介于二者之間的性別,就是人妖,比如人妖王。
而如果從縱向的角度來看人的話,就是年齡,大體上可以分為兒童、少年、青年、中年和老年。
再比如我們平時看電影,都會按照分類去查找,如果從橫向的維度去看,大體上可以有兩個方向:一個是按照地區或國家,比如國產電影、香港電影、美國大片、泰國鬼片等等;另一種就是按照種類或類型來分,比如喜劇片、愛情片、動作片、犯罪片、恐怖片等等。這兩種方式都是從橫向的維度就劃分電影,那如果從縱向的維度去看呢?就是時間,也就是不考慮地區和類型,只從片子拍攝的年代來劃分。
為什么要先跟大家講這些呢?主要是為了告訴大家一個道理,就是任何事物都可以從不同的角度去看待,通常得到的結果也是不同的。橫向和縱向的維度,只是最基本最簡單的一種看待事物的方式,但是只要能夠運用好,就會讓你的學習效率提高,才能靈活自如的去學習,這種方式適用于任何領域,當然也包括我們的設計。
比如用橫向的緯度去看待設計,這個大家應該都比較熟悉,就是不同的設計領域。但是從縱向的緯度去看設計,就很少有人去深究了,其實就是設計本身到底包含些什么。
最基本的就是字體、圖片、圖形、插畫、色彩等等,可能很多人還會想到那一些合成技法或者3D軟件設計出來的東西,其實無論是用什么方式創作出來的東西,最終放在設計里都是一個元素,也就是等同于圖片或圖形。
所以我們可以得到一個結論,就是最基本的設計元素,就是字體加圖片,最后組合成版式。那我們就可以抓住這個要害,進行重點練習,就是利用純文字和圖片來訓練版式能力。
這種從縱向的維度去深挖設計有一個最大的好處,就是可以忽略掉不同領域之間的差異,因為無論是什么領域的設計,雖然彼此各有各自的特點和差異,但是歸根結底都離不開文字和圖片,所以無論你是從事哪個領域的設計,只要能夠做好文字和圖片的編排,對你來說都是百利無害的,因為如果純文字加圖片的排版你能做好,那你的設計能力基本上已經可以達到六十分了。
當然需要設計就離不開理論和技法,這里我們就使用最簡單最基本的兩個表現形式。
就是對稱和重復,然后用這兩個形式加上純文字和圖片,來看看可以產生多少種不同的版面。
我們先來看對稱,首先最常見的形式就是左右完全對稱,也就是左右兩側的元素是一樣的,可以是單獨的圖片,也可以是文字和圖片一起進行對稱。
以下的練習案例我們都用這個文案來編排,因為是版式訓練,所以暫時先不考慮圖片是否完全符合主題。
左右完全對稱的案例我們使用這張圖片。
首先先對圖片進行處理,去掉一些多余的部分,這里我們將麥克風去掉,并且適當的去除一些點元素。
然后將圖片置入到版面當中,并且對圖片下方生硬的邊緣進行處理。
然后根據中軸線復制一個對稱擺放到版面右側,中間空余的位置留給文字編排。
人物圖片部分可以調整光影變暗一些,讓圖片更有質感,最后將文字信息編排就來就可以了,這個海報也比較簡單,就是使用左右完全對稱的形式。
我們再來看第二種對稱形式,也是左右對稱,但不是完全相同的元素,比如畫面中的這幾個作品,都是很明顯的左右對稱的形式,但圖片的內容是有差異的。
這個案例我們就用這張有點類似正負形的圖片。
首先將圖片向左錯位移動。
接著復制一個向右移動,這樣左側就是以黑臉部分為主,右側以白臉部分為主,然后將中間背景色調整成和圖片的背景一樣,讓圖片融入到背景當中。
這樣版面的主體就是左右對稱的形式,雖然是同一張圖片,但是通過位置的變化使得左右并不是完全一樣的,也就是近似左右對稱的形式。最后將文字信息編排進來,這個海報就設計完成了。
還有一種對稱形式就是天地倒置,也就是旋轉對稱,比如畫面中的這幾個海報,都是對一個群組元素的復制旋轉形成的一種對角線對稱。
我們用這個圖片來進行模仿訓練。
首先旋轉角度放到版面的一個角落。
接著復制一個旋轉到對應的角落,這樣圖片就是一種天地倒置的形式。
然后編排文字信息,同樣文字信息也可以進行倒置。
復制旋轉放到對應的一角,整體的形式就差不多了,中間空余的位置編排時間信息,這個海報就完成了。
關于對稱的相關理論之前我們專門有一期教程講解過,想了解的話大家可以回顧一下。對稱可以說是非常簡單實用而且易操作的一種表現手法,而且特別適合文字加圖片的形式,雖然看起來簡單,但是只要合理的運用也可以做出不錯的版面,并且通過剛才的演示大家也不難看出來,我們做的相關案例并沒有使用什么方法或技巧,就是文字加圖片,再通過對稱的形式來編排,大家不要看我這里的演示簡單的幾步就完成了,覺得很輕松,這不是重點,重點是你得自己去用這個方法進行練習。
下面進行重復的訓練。首先是位移裁切重復,也就是像畫面中這幾個作品那樣對一張圖片或一個文字進行裁切,然后進行復制,雖然是相同元素的重復,但是通過裁切又讓每個元素都有所差異。
我們選用這張圖片來進行演示。
首先就是對這張圖片進行不同位置的裁切,然后組合在一起,整體矩形的外框保持不變,通過每個圖片之間的空隙形成一種漸變的層次感,跟原圖的相比更加具有變化性,用我們的俗話來說也就是更加具有設計感。
然后將這組進行裁切后的圖片放到版面的偏上方充當畫面的主形象,然后編排文字信息,這個海報就完成了,也沒有什么難度,使用的方法就是位移裁切重復。
下一個表現形式就是文字邊框重復,這種重復并不是嚴格意義上的重復,而是在視覺上的重復,比如畫面中的這幾個海報,整體都是密密麻麻的文字來作為一種邊框,中間是主體或圖片。
我們用這張圖片來練習下這種重復形式。
首先先將圖片放進版面中,大致的調整位置,因為我們事先預設好了要使用文字充當邊框的形式,所以要為文字留一些空間,適當的裁去圖片的邊緣,現在圖片的四周就可以用來編排文字信息了。
因為這種表現形式往往需要大量的文字,所以在文字信息量不夠的情況下就可以對文字進行重復。最后再將其他信息編排到畫面比較空的這個地方,這個海報就完成了,也是文字加圖片的形式。
我們再來看下一個,通過這幾個作品不難發現規律,就是同一個圖片或元素的重復,這種重復的形式看上去比較簡單,因為就使用了同一張圖片,但是如何編排、編排在版面的什么位置是很難的,因為要考慮到整體的構圖以及文字和圖片的關系。
我們用這張圖片來做一個相關的案例,雖然這個訓練規定只能使用文字和圖片,但是并不是只能原封不動的使用圖片,當然可以根據自己的喜好進行調整。
比如這張圖片,我感覺層次不是很明顯,帽子部分和背景融合在一起了,所以帽子部分可以提亮一些。
如果覺得還不夠明顯,可以繼續提亮,這樣基本上就可以了。
然后將這個圖片放進版面當中。
復制這個圖片進行重復編排,最后在空余位置編排文字,這個案例就完成了。
需要注意的是,因為這種文字加重復圖片的形式并沒有使用其他技法,所以文字的處理和編排非常重要,如果文字編排不夠好,整體版面的效果就會大打折扣。可能有的人會問,雖然同一張圖片的重復很簡單,但是自己還是不知道具體應該放在什么位置,其實這個也正是我們進行這個訓練的目的,通過不斷的調整嘗試來提升版式的感覺,如果你事先就知道圖片怎么擺放,那也就不需要進行這個訓練了。
我們接著往下看,下一個重復的形式是網格排列重復,什么意思呢?比如像上一個那種形式你不知道圖片具體應該放在哪,那你就可以使用這種形式,根據網格來約束圖片的位置,我們看畫面中的這三個海報,圖片整體是重復的形式,并且還很有規律性。
我們用這張圖片來嘗試編排。
首先先對圖片進行裁切,截取自己喜歡的部分。
然后根據網格將圖片復制擺放到版面中,每個圖片占據兩個網格的位置,這樣編排的好處是既有工整性而且還具有變化性。
比如這里我們的編排,雖然是根據網格規范來擺放的圖片,但是去掉網格之后仍然具有變化。最后對文字信息進行編排,這個海報就完成了。
下個重復的形式相對來說要難一些,也就是自由排列重復,這種重復形式無論是位置還是大小,都沒有一定特定的規律,所以對版式能力的考驗就比較高,因此進行這個訓練也是非常有必要的。
我們用這個圖片來做一個自由式的重復。
先將圖片放到版面中。
然后復制,調整大小和位置。注意這個過程在你自己練習的時候可能需要一個漫長的調整,才能實現比較不錯的排列布局。最后同樣根據留白關系來編排文字,這個版面就可以了。
下面是最后一個重復的形式,也就是分割重組重復,這個跟之前有一個分割的形式有點類似,但是又有不同,不同的地方在于重組,也就是說不是簡單的分割就完事了,還需要將分割出來的圖片進行有形式感的編排。
我們用這張圖片來做這個案例,整體分兩步,首先就是分割。
這個分割并沒有什么規律,同樣也是需要不斷的嘗試和調整,這也正是訓練比較有趣的地方。
然后就是第二步,重組。這里我們將這幾張分割出來的圖片充滿版面作為一種背景的形式。
但是我們看這里有一個相對比較完整的圖片,所以我們可以利用它來做點文章。
也就是使用線框的形式,讓線框和圖片有一種穿插的關系,具有一些形式感,最后再將文字信息編排進來,這個海報就完成了。
我們看就是通過純文字加圖片,再利用對稱和重復的表現手法,就可以設計出這些不同的版式。
以上這些就是這個訓練方法的一個流程,因為是進行版式訓練,所以大家自己在練習的時候不需要太多的去顧慮文案的內容,甚至都可以用文字來代替,不需要落實到具體的文案上,因為我們主要練習的是版式的感覺,但是肯定會有人覺得,如果落實到具體的工作上是不是就不適用了,這是對版式訓練的誤解,為了打破這個誤解,接下來我們就用相對來說比較常見的題材來做三個案例,使用的方法就是這節課所講的純文字加圖片,再結合對稱和重復的表現手法。
首先我們做一個關于化妝品的海報頁面,這是我們要用到的文案內容。
第一步就是找相關的產品圖片,因為這兩個圖片本身的特性也就是外形的相似,所以使用對稱再適合不過了。
先將這兩個產品放到版面當中,使用的方式就是我們之前講的左右近似對稱,為了營造產品的調性,所以需要改變背景的顏色。
這里我們先填充一個粉色,但是這個背景色的色調跟產品的色調有些不符,所以我們可以根據產品本身的顏色填充一個漸變。
這樣通過色彩的對比更加強調了左右對稱的形式,最后將文字內容編排進來就差不多了。但是我們看現在產品有些假,很明顯就像是摳出來的圖直接放上去的一樣,所以我們可以添加陰影。
這樣就會好很多,那么這個頁面就完成了,也是非常簡單的表現形式,就是我們之前所講的左右近似對稱。
我們再使用一個重復的形式,來做一個關于狂歡薯片節的海報,當然在具體的表現形式上有很多,而重復只是其中的一個選擇。
這里我們不想使用太多復雜的素材,就是一張薯片的圖片,但是一張很明顯不夠用,所以我們可以根據重復的原理復制出一些擺放到版面當中。
同樣這一步也是需要反復嘗試和調整位置的,然后將文字內容編排進來,但是現在畫面中有一處明顯有些空,顯得很不舒服,所以這一塊可以編排時間信息,為了和整體薯片的形狀相契合,所以可以填充白色塊。最后再將二維碼添加進來就可以了,但是現在整體全是黑色的文字有些不舒服,所以我們可以嘗試改變主標題的顏色。
這里我們為主標題填充較暗一些的黃色,這個活動海報就完成了,使用的就是同一圖片的重復排列。
我們再來看最后一個案例,是關于月餅DIY的一個活動宣傳海報。
首先就是找到和主題月餅相關的圖片然后放到版面中,但是大家需要注意的是,這個使用整體重復形式排列的月餅并不是一張圖片,也是需要我們自己一個一個拼湊出來的,這也是重復的一個難點。
然后上方和下方的空余位置編排文字,主標題居中排列,然后是時間、LOGO、二維碼以及次要信息,最后在比較空余的位置添加圖形和文字進行一下調和,這個海報也就完成了。
那么本期教程到這里就結束了,在視頻的開篇我們主要為大家闡述了一個道理,就是用和橫向和縱向這兩個不同的維度去看待問題,然后從設計上比較容易被人忽略的一個縱向角度來告訴大家,設計中比較重要的是什么,這里我們總結出的就是,無論是何種領域的設計,都離不開最基本的文字和圖片,得出這個結論之后,我們就要自己進行有針對性的訓練,不使用其他元素,只用純文字和圖片進行排版,而這里使用的設計表現手法也是比較簡單的對稱和重復,通過對相關的優秀作品進行詳細的分類,進行自我的模仿訓練,整體上就是這個流程。最后再強調一下,就是本節課的重點是想教大家這個自我訓練的方法,而至于使用什么樣的設計形式并不是重點,大家可以自由發揮。最后,感謝大家的觀看和支持,我是K先生,我們下期再見。

 

原文地址:?研習設(公眾號)
作者:研習設無我、靜瑜

轉載請注明:學UI網 » 如何光明正大的抄襲

登錄收藏
 
你可能喜歡的:
跨界設計 | 突破常規的設計思維跨界設計 | 突破常規的設計思維
你過來,我有1個設計技巧想對你說你過來,我有1個設計技巧想對你說
圓角矩形背后的含義|深度解析圓角矩形背后的含義|深度解析
如何用臨摹來提升你的設計能力如何用臨摹來提升你的設計能力
敲黑板!劃重點!圖文混排要注意哪些?敲黑板!劃重點!圖文混排要注意哪些?
學設計的最佳捷徑(非常精辟)學設計的最佳捷徑(非常精辟)
如何做好交互驗收?如何做好交互驗收?
一張好海報的決定因素是什么?一張好海報的決定因素是什么?
11個小標題的排版技巧11個小標題的排版技巧
有效提升傳達率的7個折頁設計技巧有效提升傳達率的7個折頁設計技巧
?
陕西快乐10分