版式設計-如何設計低成本小型卡片

本文介紹了我們如何將一張單色卡名變成充滿視覺吸引力的設計

科爾是一個大忙人。他是四重奏樂隊的其中一名成員,而他自己還有一支爵士樂隊,他本人還帶領6個學生,作為一名音樂家,他總是忙得不可開交。他彈奏的樂器是大提琴和低音提琴,這些樂器的外觀就如其演奏的音樂一樣迷人。而他的名片由于其簡單的設計而顯得非??帷粌H僅是在印刷時成本更低廉,而是其通過簡單的元素卻能傳達出很多的視覺信息。整張卡片的顏色對比度并不高,使到其表現元素雖然占據著卡片的主要空間,但卻沒有給人一種過于壓抑的感覺。它傳達了一種手工藝的古典感覺,而且版面開闊不擁擠,可以說,整個版面給人的感覺是既簡單但又充滿活力。為了達到這種效果,我們在設計的過程中有很多因素需要考慮,透過這個設計的過程,看一下我們能夠學會什么。

上述這張卡片只有一種色調,無論是設計還是印刷都顯得更加經濟。但在設計這個過程中涉及到一些很重要的技巧,其中關鍵之處在于通過一種色調表達三種層次——深、中、淺。通過層次我們可以對表現元素進行更加靈活的處理同時又不會讓其喧賓奪主。字體采用一種具有現代感的字體,而字體的尺寸選擇使我們能夠輕易閱讀相關文字。而其中的線條采用了一種粗畫筆效果,傳達了一種陽剛及活力。另外,我們同樣選擇一種表面不光滑的紙張印刷,進一步強調這種活力。

從“關鍵詞”開詞

我們在著手開始設計時,首先要決定你希望讓你的設計傳達什么信息。這一點對于版面很小、每個細節都要充分考慮的情況下顯得尤為重要。所以你要決定設計中的“關鍵詞”是什么。


讓我們尋找一些能夠符合科爾先生特點的一些詞匯。比如,對于古典音樂及那些精美的演奏樂器,我們或許會找到一些相關詞匯:正式,藝術,手工,專業,陽剛,手藝精巧。為了表達爵士及科爾先生的個性,我們可以有:親切,隨和,歡樂,輕快。你會發現,這些特點有些是相反的。比如,正式/隨和,古曲/輕快。這就是你希望的:相反的特點表現在設計中會顯得更有張力,也更有助于你設計一個更好的設計。

由于在設計中,成本是一個我們需要面對的因素,我們不打算采用圖片來設計版面,而是在傳統線條的基礎上創造一種風格。在下面,我們將會看到線條是如何與大小、顏色及顏色數值一起來綜合考慮以達到我們設計的目的。

在設計中,就算一些細微的差別,都會傳達不同的意思:


選擇什么線條?

線條具有很強的表達能力。仔細觀察你的圖片,看一下這些線條在傳達什么樣的信息?

小提琴、中提琴、大提琴及低音樂器具有世界上最漂亮的線條,仔細觀察這些圖片,然后寫下你所看到的:


畫線條:

上圖A是由鴨嘴筆所畫的線條,感覺就象一條飄帶,傳達了一種動感、流水、開闊的感覺,讓人聯想到隨意、感性、女性等特征。B是只有一種寬度的線條,給人的感覺是中性的,無變化的。

但我們在設計中希望線條給人一種陽剛氣,而線條的特性卻給人一種女性的感覺,所以我們需要對線條進行改造,我們希望線條更粗曠、流動感較弱。在矢量軟件中,我們將鋼筆線條用畫筆效果來描繪,可以輕易實現我們的目標。

與那些優雅平滑的線條不同,炭筆效果的線條顯得更加粗壯,也更加粗糙。在Adobe

Illustrator軟件里,要實現這種效果很容易:


1 、打開軟件后,置入您的圖片(像素并不需要太高),然后用鋼筆工具或鉛筆工具描繪圖片的輪廓,在描繪時,并不需要非常精確。描繪完后隱藏圖片。


多大?如何處理?以哪一種方式處理?

尺寸、位置及方向的不同處理方式直接影響了圖片的傳達。在處理版面時,首先要使信息能夠清晰傳達,其次才是如何將它調整得漂亮。


A:將整個元素盡量縮小,使到其完全容納在版面中。這樣處理雖然可以接受,但所要傳達的信息在哪里?它看起來無足輕重。但低音提琴給人的感覺是很大的,而且還能演奏出響亮的聲效。但A的處理給人的感覺好象是小巧的,并不是主要的元素。需要注意的是:我們在設計中安排對象是要與它本身給人的感覺是一致的。

B:元素非常大,具有一種很吸引人的效果。然而,圖片在水平剪切時上下靠得太近,使到傳達元素特性的主要輪廓消失。導致它傳達的信息并不清晰的。

C:側放的元素使其呈水平感。雖然它現在能夠與整個版面配合,但問題是,它傳達的信息并不準確,它給人的感覺象是一把吉它,而不是提琴。


D:垂直擺放,我們將整個版面旋轉成垂直,以配合元素的固有特征,現在整個元素與版面非常搭配。但是,在上方形成了一個并不吸引人的空白區域,而下方又給人一種很厚重的感覺。

E:將元素放大,使整個版面形成兩個空間。在視覺上(不是指面積)給人的感覺趨于平衡,而且也能夠充分表現那些粗糙的線條及主要的特征。這也是我們最后確定的選擇。

選擇什么顏色?

顏色至關重要。我們在這個例子中并不是要采用很多種顏色,而是只采用一種色調來傳達不同的層次。其中的關鍵是顏色飽和度的選擇!


色輪直觀呈現了色彩之間的關系,色輪中的色彩都非常飽和,其色彩對于古典音樂甚至是爵士樂來說都顯得過于明亮。上述右方的顏色可以說是一種幼兒園的顏色,如果你有注意到,你會發現很多兒童在畫畫時會經常選擇這些顏色。而我們要選擇的顏色并不需要太高的飽和度。


而上圖則是低飽和度的顏色,理論上,這些顏色相對于上述的顏色來說,是由于滲入了灰色所致。這些低飽和度的顏色其色相無論是深淺都更加接近。在Photoshop里,可以降低某一種顏色的飽和度,在選擇一種顏色后,打開色調/飽和度對話框(上圖所示),將滑桿移到負數的一邊,在這里我們選擇-60。另外,由于我們在這個設計中需要一種較暗的顏色,所以在明度滑桿中,我們設為-40。

這些低飽和度的顏色顯得較暗,傳達了一種久遠、傳統、專業的氣息。

選擇哪一種顏色數值?

因為不飽和色彩里面有很多灰色,所以在顏色變亮或變深時都不會改變它們主要的色調。這種特性使到我們可以通過一種顏色來形成不同的層次感。


由于在設計中,我們始終都是在用同一種色調,為了保證在運用上的靈活性,我們在開始選擇顏色時必需選擇一種較深的顏色,以便為下一步的顏色調整留有余地。據此,我們將剛才的那些低飽和度顏色進一步降低飽和度,上圖為統一調整到-60時的效果。你會看到,經過進一步的調整后,所有不飽和度的顏色看起來感覺更加接近。也可以說,它們在應用上都具有更多的靈活性。其中改變的是灰色,但色相仍然透露出不同的顏色主調。

如果說,色輪幫助我們確定顏色的范圍,那現在,我們要將剛才的顏色(一般是四色印刷色)變成專色(Spot colour),所以我們需要用到專匹配系統模式(Pantone

Matching system)。在Photoshop軟件的顏色庫里有專色(Pantone)一項。

我們決定采用“專色5815 ”及降低50%的色調。如果將這兩種顏色放在白紙上,可以傳達三種不同的層次感:深,中,亮。觀察下圖中顏色的四種分配方式:


*你可以購買到印刷版的Pantone色卡(見上)。在電腦上顯示的這些專色顏色其實只是一種模擬色,最真實的觀察仍然是查對色卡上的顏色。

選擇什么字體?


相似:字體與線條具有相似的特點往往能夠形成和諧的搭配,Lettres Eclatees字體與畫筆效果的線條具有很多相似的地方。兩者線條都具有較粗、隨意、不平滑的特點。但這種字體也只是在轉角位處才呈現這種特點。問題是,主要的元素線條非常長,而且逶迤流動,但這種字體卻顯得較矮小,給人一種墨點的感覺。如果兩者重疊在一起排版,在視覺上將會互相排擠。另外,字體顯得粗糙,這一特性與科爾先生的特征并不相配。所以我們更傾向于選擇一種簡潔的字體。


沖突:你可能會認為Palatino字體是一個不錯的選擇。它的歷史與這種提琴的歷史幾乎一樣長。它是一種正體,結構開闊,傳達了一種權威、尊貴、正式、古典的味道,線條呈硬朗感,輪廓分明。既然這種字體有種種優點,但為什么在這個例子中卻沒有發揮其應有的作用?因為這種字體的細節與線條的細節大小過于接近,同時,兩者的風格卻完全不同。當兩者放在一起時,這些過于相似但卻不同風格的細節便出現視覺沖突。


互補:Ultra-sleek

Helvetica Neun Thin Extended字體與主要元素的線條毫無相似之處。這種字體的線條幼細、干凈、樸實。而元素的線條剛是粗壯粗糙。這使到在一個版面中,元素的線條仍然能夠支配整個版面,而字體由于其結構特點傳達的是一種干脆利落的聲音。名字及職業描述的文字采用全大寫體,并且處于卡片高度中間的顯要位置,而其它文字則用小字。所有文字都是左對齊。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,546評論 6 533
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,570評論 3 418
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事?!?“怎么了?”我有些...
    開封第一講書人閱讀 176,505評論 0 376
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,017評論 1 313
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,786評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,219評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,287評論 3 441
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,438評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,971評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,796評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,995評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,540評論 5 359
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,230評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,662評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,918評論 1 286
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,697評論 3 392
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,991評論 2 374

推薦閱讀更多精彩內容