May.04.2015

成為設計大師的第一堂課:20 個你不該打破的設計法則

15680565058_dc8b7b72fc_z

  • 字體空隙/字間最佳化(Kerning)

字與字間不要突然太擠、突然又離太遠。適當的字間空隙很重要!(注:這裡指同一個英文單字中的各字母間距。)

有人曾說如果你很討厭某個人的話,那就叫他們找出文章不好的字間處。校對文字排列距離是設計界當中相當基本也重要的工作。

字體空隙最佳化基本上就是調整單一字母之間的距離,聽起來好像不太重要,但是把這項工作做好可是可以創造出相當大的不同的,而其最終的目標就是要把字體間的距離做到相當平均,看起來才會整齊並且有秩序。

  • 別因為美觀而忽視了易讀性與辨識度

我知道有時候文字設計上深淺交錯、大小變換看起來比較有設計感,但是說到底「易讀性」還是第一!

我很確定我說了這個好幾百次了,設計的最主要目的就是溝通,所以易讀性與辨識度是第一優先

所以到底是什麼阻礙了這兩者?有許多事能夠影響讀者要花多少力氣來閱讀。一個常見的例子就是字體顏色與背景的對比不夠明顯。

另一個常見的例子就是英文中大寫字體的過度使用。大寫的英文字母不但有讓讀者覺得被怒斥的感覺,同時也減慢了眼睛辨識字體的速度。因為如果全部都是大寫字母,每個字都是大小高度相近的正方形狀,不像小寫的字母有不同的高度與形狀,能夠讓讀者一眼認出這個單字。

還有一個常見的錯誤就是字體的大小。你必須思考你的讀者是否因為字體太小而難以閱讀,如果你不確定的話可以試印然後拿去給別人看、問別人的意見。只是因為很好看並不代表能夠完整的表達與溝通!

  • 保持文章每行的長度夠短

雖然聽起來很微妙,但適當的文章長度很重要。

你是否曾經覺得某些雜誌的文章閱讀困難?可能每次要換到新的一行就會找不到?這就是文章每行長度的結構設計錯誤。

一般文章每行的黃金長度大概會落在最少 6 個英文單字,大概平均每行是 30-40 個字母(包含空白)。少於這個數字的話,文章看起來就會有斷斷續續的感覺;而更長的話則會讓人有冗長的感覺,要一次看完也會相當困難。

  • 將文字做有目的性的分級

有了易讀性之後,適當地將文字做大小、字體、顏色等的分級也是必須的。

就像許多自然而然的順序感,文章中做有目的性的字體大小區別分級是相當有效的工具。在設計的領域當中,分級是考慮到為了凸顯重要的資訊的視覺元素安排。所以最重要的資訊就會用最顯眼的字型、顏色、字體來做凸顯,反之,較不重要的資訊則可以不用那麼引人注目。

分級的元素最顯著的應用便是在文字排版當中。要知道加入了一點點文字分級的概念,儘管只有小小的改變,但重要的資訊便變得容易消化多了!

  • 練習適當的文字間格

再重複一遍:字與字的間隔很重要!

作為一個設計師,大量的打字是不可避免的,當中有許多必須考量到的元素與規則,有一個重要的要件便是文字間的空格,以下有兩個主要的重點:行距與字距

行距是文章中每一行所間隔距離的調整。而有許多決定行距的要素,像是你選擇的字體與文字的數量都是影響的因子。有個一般的規則是:句子長度越長通常會需要更大的行距,反之亦然。

字間通常是手動來調整,然而當你有一大篇字數極多的文章和緊湊的交稿底線時,就沒有這麼多時間來手動調整了。這時,字距的調整就相當重要了。字距調整工具基本上是改變每個英文單字為單位間的距離,這是個擺脫尷尬字句長度的好方法。而如同行距的規則一般,字距的調整通常在長的句子會放得較寬鬆,較短的句子則會抓得較緊。

另一個好的調整間隔方法是,在較小的版面當中,手動的調整常見的練習就是想像小寫「i」在每個單字間來調整字距,但是當然還是要依據當下所使用的字體與字型為主。

  • 使用正確的對齊方法

什麼場合用什麼樣的文字排法!

你過去一定遇過一些基本的對齊工具,但不論你是老手或剛入門,以下有四個基本的對齊法:文字靠左對齊、文字靠右對齊、文字置中、文字左右對齊。

文字靠左對齊是最常見的文章對齊法(甚至本篇文章都是),這是個易讀性高且整齊的方法。

文字向右對齊就如其名,是將文字在右方對齊,最主要的用途是有裝飾目的的設計或是文字量不多的特定出版品。文字向右對齊並不建議文字量多的文章使用,因為不整齊的左方對齊線會影響視覺上的易讀性。

文字置中有著相當大量的使用,如海報、邀請函等等。這個方法讓編排的平衡更加容易,同時也是個相當美觀的排版。同樣的,文字置中也不建議有大量文字的文章使用,同樣是因為缺乏對齊線讓眼睛要從一行文字移至下一行時造成困難。

最後,文字左右對齊,它看似是個完美的編排方式,有著左邊與右邊的對齊線,而在某些狀況下也的確是相當整齊的,如小說。

  • 使用格線

用 InDesign 拉拉看吧。

發展基本的隔線排版技能大概是每個剛入門的設計最重的課題之一。一個排版好的文章能將一個平庸的設計變成乾淨、俐落、效果極佳的作品。

隔線所創造出的空間可以有相當多的形狀、大小,你可以依照自己的設計來調整。它幫忙了設計師編排所有有關聯的文字或圖片,創造一個更整齊、有邏輯的設計。例如你可以用隔線創造的兩欄、三欄、四欄的排版。

格子的欄位越少,你的設計就越無變化,或許編排上有相當強烈的整齊感,但就是彈性上就會比不上欄位多的設計。多使用隔線設計吧!

  • 永遠為你的顧客設計

許多設計是從簡單的介紹開始,即使是個人的計畫,也會從基本的資訊開始。一個重要的問題就是:「我是為誰而設計?」每個設計都有目標觀眾,所以以他們的角度思考是相當重要的。 。

你的設計可能看起來很美觀,但不一定是傳遞訊息最佳的選擇,所以永遠要站在顧客角度思考。

  • 避免寡行(widow)及孤行(orphan)

就跟寫作文一樣啊,適當的字數調整可以讓文章更美觀。

一個簡單的方式就能將你的設計從業餘提升到專業程度,那就是避免文字編排上的寡行(widow)及孤行(orphan)。這樣的情形在文章當中出現是不可避免的,但重要的是要找出他們並且設法解決。

寡行,就是一段文字的最後一行在一頁或一欄的開始處,和該段的其他行分開。

孤行,則是一段的第一行在一頁或一欄的最後;第二個情形是一段的最後一行只剩一個字、或字部份,也可能最後一行的字母很少,因此和下一段之間看起來會有較多的空白。

解決的方式有很多,你可以改變每行句子的長度來做調整;將孤行前的字加入最後一行;還有一個方式是調整欄位或字體的大小來解決。

  • 使用符合邏輯的調色

顏色的使用也需要根據研究理論,選擇合適的應用場景。

在色彩的編輯上,可以試著引進色彩學的理論或是參考過去顏色使用的經驗。在色彩學理論中提到了許多顏色對於顧客的影響,如:橘色可以提升胃口,這就是為什麼許多速食店都喜歡使用橘色。

有時候換個角度來看就能夠獲得好的結果,但是在顏色的實驗上最好是依照理論上的根據來執行。

在顏色使用上確實是有特定的規則與方式,有時候不同的實驗與調色可能可以造成意想不到的結果,但是大方向上是盡量不要使用與你所要傳遞訊息背離的顏色。

  • 使用一致化的字體

不同的字體展現不同的風情、情緒,一個作品不需要太多情緒夾雜。選擇相輔相成、合適的才是正理。

如同顏色的使用一樣,在字體的選用上也必須相當小心。而不同的字體也同樣會展現不同的「情緒」,像是你一定不會在法律文件上使用海報字體。

許多設計師會建議在多數的情況下,字體的數量大約可以落在 2-3 三種為上限。試著選用能夠互相和諧搭配的字體來讓你的設計有邏輯性與效果吧。

  • 千萬別在文章本體使用裝飾性字體

一樣,什麼場景就該用什麼工具。

在本文當中使用裝飾性字體就像是穿西裝去超市一樣,地點與時機都不對,如此只會讓讀者感到困惑。

裝飾性字體適合小區域的文字使用,而且比常用的字體都還來得吸睛,也因此他們通常是使用在短標題與副標題上,而不是通篇文章。

  • 千萬不要隨意拉長字體

這是個相當簡單且容易理解的規則,因為每個字體原本的設計都有考量過形狀與比例,所以任意改變其形狀就扭曲了其原本的效果。

許多人改變字體形狀是因為要比原本更長或更寬,其實有個不用拉長字體的解決方法,那就是使用其他的字體,如更長的像是Bebas Neue更寬的則像Silverfake

  • 避免色彩的衝突

紅配綠可能很顯眼,但用在文字的呈現上,真的會讓眼睛不舒服啊。

顏色的不協調是常常會發生的錯誤,也就是兩個在色相還上距離相當遙遠的顏色湊在一起時會發生的衝突感。衝突的色彩會創造出一種模糊、振動感的效果,讓眼睛難以分辨兩個顏色的交界線。

一個避免色彩不協調的簡單方法就是使用色相來避免對比過高的兩個色彩,對比過高,在觀看上會有模糊的效應產生。

有些設計師,特別是廣告設計師,其實有時會使用色彩的衝突來創造引人注目的廣告。所以在一般的狀況下,創造色彩的協調是建議應該要達成的,但並不是說色彩不協調的規則就不能被打破。

  • 別認為空白的部分就是空洞

好的作品不一定要填滿,「留白」有時候更有意境。

留白是增加設計的特殊感中一個相當有效的工具。使用空白的部分有許多好的效益,像是能讓觀眾更聚焦在重要的組成上,能讓設計當中的各個元素作平衡,讓你的作品能「呼吸」。

另一個留白的功能就是為你的設計加入更多意義。舉例來說,我們對一個耳機的廣告進行技術性的留白,可以表現出聚焦與 100%隔音的感覺,但卻不用刪掉任何資訊就達到廣告效果。

在這個例子以及其他許多案例中,留白並不是空白,他也和圖片中其他的元素一樣扮演了重要的角色,所以別忽視了留白的意義,試著加入一點到你的設計吧!

  • 別盲從設計的潮流

跟時尚一樣,設計也不應該盲目追隨潮流!

有時候設計就像時尚一樣,一陣風潮爆紅,接著就慢慢消逝。一旦一股風潮過去之後,所有同時期的東西瞬間就會變得過時與乏味。

但這並不是要你完全不關心時下的流行,應該要觀察並思考一個東西為何會流行。

可以從風潮當中學習到的是—為何他們會爆紅?從這些商標中我可以如何增強我的設計?所以你應該要做的事從潮流中學習而不是盲目的跳進這股大洪流中。

  • 使用正確的工具

你知道點陣圖、向量各應該用哪些工具使用嗎?

就像工人不會用榔頭來轉螺絲,設計師也應該要知道在什麼情況下該使用什麼工具。

一個只要使用正確的工具就能避免的常見錯誤就是點陣化的商標圖。數位圖檔當中分為點陣化及向量化。點陣化的圖片是由許多小像素格子所組成,而向量圖片則是由許多線段所組成。而由於點陣化的圖片是由像素組成,因此在畫素不夠的狀況下就會出現左邊的情形,而向量化的圖片則沒有這個問題。

因為向量圖可以在任何大小的狀況下保持其銳利度,因此常是商標所選用的方式,大小的應用上小從鉛筆大至建築物都能夠適用。因此在商標的設計上使用點陣圖是相當常見的錯誤,但也相當容易避免。

回到重點上,一個設計師應該要不只能分辨不同檔案格式的不同,還要會分辨在不同狀況下使用。像點陣圖常使用的工具為 Adobe Photoshop,向量圖則是會從 Adobe Illustrator 中誕生,所以確保你了解這些軟體,並且在適當的狀況下選用。

  • 考量所使用的媒介

你的網頁要在手機、平板還是點腦上呈現?不同載具、不同媒介都有其相應的設計。

你的設計會在哪裡出現?在海報上?還是網站、雜誌?知道你的設計會如何被應用是個相當關鍵的層面,因為這是你的設計會最常被閱讀的方式。

最常見的錯誤就是文章沒有考慮到書頁中的溝槽。書頁的溝槽可以是易讀性的原因而留下或是在兩面書頁連接上的原因而設計。在某些狀況下,溝槽是作為連接所使用時,設計師就必須在過程中考慮到這點,確切的說就是確保不會有任何圖片或文字卡在溝槽中。

所以要如何避免呢?如果你不確定,那就和印刷商、顧客溝通,確定你必須留住多少的空白。

  • 學習文法的規則

在使用英文文字最為設計的主要內容時,相關文法還有標點符號規則都需要多多注意!

文法是個相當棘手的問題。有許多隱藏的規則你打破了卻不自知,直到印出成品之後才發現,所以花時間學習設計導向的文法規則能讓你的作品呈現專業感。

首先,「&」這個符號不應該出現在文章當中,所以必須避免將「and」替代為「&」。這個符號一般只用在組織的名稱(像是:Johnson & Johnson)或是在商標設計上的美感功能。

另一個常見的錯誤就是表點符號後的兩個空白鍵。最簡單的解決方法:就不要用兩個!如果你還是覺得文字很擠,你可以再調整字距。

還有一點是連字號與破折號的使用。一般來說分為三種連字號 (-)、破折號 (–)、全形破折號 (—),連字號是要將兩個單字聚合在一起成為複合單字,像是「custom-built」;半型的破折號是用來連接數字的,像是「1984–1998」;最後全形的破折號常用在句子的中間,表示停頓的語氣,像是「Grammar is hard — or so I once thought」。

還有其他許多的文法規則,隨然看似不太重要,但卻是個能夠將你的作品帶至職業等級的重要關鍵。

  • 別用太多的效果

有時簡單,反而更清晰。

說到交流性的設計,在很多時候簡單就是最好的,而這也是必須不斷自問的議題:「我能夠加上這些特效,但有必要嗎?」

一個常見的狀況是,大多的特效都加在圖表與圖片上。

雖然在某些特定的狀況下,一些元素、價值是不能被刪掉的,但是最好盡量在不影響傳達的訊息前提下,拿掉可以去掉的東西,有時候,簡潔真的就是比較美。

  • 最後

看完了這麼多的規則之後,其實真的規則就只有一條:「沒有規則。」和學習設計的基本規則一樣重要的東西就是試著挑戰這些規則。

一個絕佳的例子便是,為實驗性雜誌 Ray Gun 設計的傳奇設計師 David Carson,在 1994 和音樂家 Bryan Ferry 的整個訪談以 Zapf Dingbats 字體紀錄,使得完全無法閱讀,只因為他覺得訪談相當無聊。打破規則有時候是留下傳奇設計的最好方法。

將這些規則好好精通一番吧,如此才能正確的打破他們!

更詳細資訊可以到 Canva 參考。

(資料來源:Canva;圖片來源:Mario Felipe_,CC Licensed)

不可轉載
TechOrange 科技報橘
《TechOrange》,專門追蹤全球網路產業的科技網誌。提供網路創業者、行銷人員、媒體人員關於網路的資訊與知識是我們的任務;每天大概花吃顆橘子的時間來瀏覽就夠,吸收科技新知沒負擔。
《TechOrange》,專門追蹤全球網路產業的科技網誌。提供網路創業者、行銷人員、媒體人員關於網路的資訊與知識是我們的任務;每天大概花吃顆橘子的時間來瀏覽就夠,吸收科技新知沒負擔。

更多文章


READ MORE

更多文章

READ MORE

LOGIN

SIGN UP

FORGOT
PASSWORD

請輸入你的帳號或電子郵件位址。你將收到含有建立新密碼鏈結的電子郵件。