沒有排版基礎要怎麼 Freestyle｜下集
講座心得和學習筆記分享
下半場講者從三個排版的核心觀念切入，分別為「比例、順序、群化」，也強調設計是一門和數學有關的學問，尤其排版更是經過精密的計算，不是如表面上單純的圖文編排。
比例是一種倍數關係，所有的東西都有比例，就連人體從頭至腳都存在著某種比例。「三庭五眼」是臉長和臉寬的標準比例，「三庭」將人臉長度分為三個部分：髮際線到眉毛、眉毛到鼻尖、鼻尖到下顎；「五眼」以眼形長度為單位，將人臉寬度分為五個部分。常聽到的「頭身」就是身高和頭部的比例，五頭身代表身高是頭高的五倍。另外，手肘到手腕的長度相當於腳掌的大小，這個冷到不行的冷知識還幫助柯南破案呢！
也有一些特殊的比例，如黃金比例、白銀比例、費氏數列，按照這種比例組成的事物可以表現出一定的舒適、和諧、美感。
黃金比例｜Golden Ratio
上圖中黃金比例圖形長邊 a+b 和短邊 a 的長度比，等於 a 和 b 的長度比，比例大約是 1.618:1 ，關於黃金比例圖形的畫法和應用可以參考這兩篇文章：
白銀比例｜Silver Ratio
除了被廣泛運用的黃金比例，也有比較少見的白銀比例，下圖中白銀比例圖形長邊 a+b 和短邊 a 的長度比例大約是 1.414:1 ，國際間常用的標準紙張尺寸，長寬比例也是白銀比例。
王志弘設計的《短篇小說》書籍封面也運用到白銀比例：
延伸閱讀：王志弘《短篇小說》封面作品解構費氏數列｜Fibonacci Sequence
費氏數列原名費波那契數列，從 0 和 1 開始，下一個係數由前兩個數相加而成： 0,1,1,2,3,5,8,13,21... ，以費波那契數為邊長的正方形所拼成的矩形，會近似於先前提過的黃金矩形。
網格系統｜Grid Systems
那要如何將比例關係帶進圖文排版的設計中？我們可以利用「網格系統」將畫面簡化成有規律性的格子，版面上的元素可以藉由這些格子進行有效的規劃和組合，使得想要傳達的訊息能夠更快速、更有系統地被讀取。這裡有幾篇文章推薦大家閱讀：
網格系統如何繪製？不是隨意拉幾條參考線就好，不管是定出版心或決定欄位寬度都需要用到數學的概念，參考了幾種畫法以後，繪製出以下的網格：
第一步：定出版心
版心是由「天頭、地腳、左右頁邊距」所包覆的區域，重要元素放在版心內編排可以保證內容的識別度，次要元素可以放置在版心外的區域，為畫面帶來活潑、動感、張力。
第二步：定出欄寬
欄寬可以隨著網格的形式（通欄、雙欄、三欄、四欄⋯⋯）而定，最簡單的劃分方式是將版心寬度直接分為不同等份，再依據實際內容需求填入資訊。
另一種形式——比例網格，是運用美學比例劃分欄寬，下圖第二個步驟使用的是黃金比例，A 欄和 B 欄的寬度比為 1:1.618 。
黃金比例線段的分割法，會稍微複雜一點：
▍STEP 1
有一線段 AB，以 B 為端點，畫出線段 BC，BC 長度為1/2 AB，將 A 和 C 兩點相連
▍STEP 2
以 C 為圓心、BC 為半徑畫弧，交線段 AC 於 D 點
▍STEP 3
以 A 為圓心、AD 為半徑畫弧，交線段 AB 於 S 點
▍STEP 4
線段 AS 和線段 SB 即為黃金比例，約 1:1.618第三步：套入內容，此篇文章提到幾個注意事項：
- 網格內的文字與圖像元素必須與網格架構對齊
- 版面中所有元素的位置大小都要有一個比例依據
- 網格的內容沒有固定規則，需要根據實際內容決定
- 留白也是版面中的元素，不要把網格填滿
嘗試利用自行繪製的網格，套入兩種不同主題，呈現效果如下：
「網格的概念是，他給你一套層級系統，但同時也給你豐富的多樣性，網格完全沒變，變的永遠是網格裡面的東西，就是這點讓事情變得活潑有趣」—保羅・蘭德
希望大家可以善用「比例」於設計中，對於本文有任何建議、回饋，或者你認為有更好的設計方式都歡迎在底下留言噢！
