2019-12-25 資深UI設計者
自從做設計以來經(jīng)常會看到一些很高大上的理論，例如：格式塔法則、網(wǎng)格系統(tǒng)、黃金分割法等等，這些詞語給人第一印象就是很高大上，很難學會，也有很多設計師看到這些理論就被嚇到，認為自己學不會，也不想學，因為理論知識確實是學起來很枯燥。對于初學者的設計師來說，這些理論可以在短時間不用學太多，但是對已經(jīng)工作幾年的設計師來說，這些設計理論知識也是必不可少的。
只有掌握設計中必要的設計知識，才能讓自己的設計眼界、技能得到提升。就我個人而言，我在設計初期也是很反感這些所謂的理論知識，對于我來說簡單通俗的教學才是最容易讓人接受的，理論太深奧，我真的無法從中體會到真正的奧秘。但是，越到后面，我越喜歡研究那些設計理論知識，因為我越來越懂得那些理論的重要性，對我的設計也有很大的幫助。所以今天我采用通俗易懂的方法，教大家去理解和掌握這些高大上的設計理論知識。
今天主要分享我們經(jīng)常聽到的黃金分割構(gòu)圖法。
黃金分割構(gòu)圖法：是一種由古希臘人發(fā)明的幾何學公式，遵循這一規(guī)則的構(gòu)圖形式被認為是「和諧」的，在欣賞一件形象作品時這一規(guī)則的意義在于提供了一條被合理分割的幾何線段。
黃金分割構(gòu)圖法的基本理論來自于黃金比例 ── 1 : 1.618。
黃金分割構(gòu)圖法運用到海報設計、畫冊設計、網(wǎng)頁設計、繪畫、服裝設計、logo 設計、電視電影、建筑等等領域。在攝影中也經(jīng)常會引入黃金分割比例，可以讓照片感覺更自然、舒適，更能吸引觀賞者，給人一種賞心悅目的視覺感受。
我們先賞析一些運用黃金分割法的優(yōu)秀案例，通過賞析能讓我們體會到它的美和重要性。
1. 在海報中的應用
從上面的 2 張人物海報案例中，可以看出都利用了黃金分割螺旋法的技巧，當整張圖作為背景時，我們不知道圖片主題位置的掌控時，就可以采用黃金分割法的原則。對于人物，可以根據(jù)想要突出的人物某一部位，直接采用這種分割方法快速找到版面位置
下面2張海報是通過圖形和文字的結(jié)合，主題文字排版的位置也都剛剛好是黃金分割的編排，帶給人一種美的、舒適的畫面感，圖片和文字在版面的比例剛好是 1 : 0.618。
2. 在網(wǎng)頁中的應用
上面 2 個網(wǎng)頁都采用了黃金分割的原則，大體將版面分為圖片區(qū)+文案區(qū)，比例為 1 : 0.618。上面同時采用了網(wǎng)格重疊的形式，而下面的就是最基本的黃金分割比例。版面的編排整體給人一種呼吸感、有序的、層次分明的視覺感受，并且瀏覽的順序也是井井有條，如下圖閱讀順序指引：
3. 在繪畫上的應用
像我們看熟悉的名畫「蒙娜麗莎」、「維納斯的誕生」等也符合黃金分割的比例。黃金分割比例也在這些作品上經(jīng)過了歷史認證，利用黃金分割布局，讓畫面更耐看、更精致。
4. 在攝影上的應用
在攝影中也經(jīng)常會引入黃金分割比例，可以讓照片感覺更自然、舒適，更能吸引觀賞者，給人一種賞心悅目的視覺感受。使用黃金分割的攝影可以制造出一種空曠、寂靜的視覺效果，也可以制造出一種特寫鏡頭的效果。不知道怎么拍照好看，學會這一招你的攝影立馬高大上。
5. 在建筑上的應用
在建筑設計中的運用也有很多案例，例如上面的金字塔和泰姬陵的多處布局都能看出黃金分割，第三張中國古建筑也都運用了黃金分割構(gòu)圖。自古以來很多文化建筑都采用了這個構(gòu)圖，讓建筑看起來更加美觀、耐看、精致。
了解了螺旋黃金分割法的用途和好處，我們最主要的是需要知道怎么來畫這個螺旋黃金圖。
1. 新建畫布
2. 畫正方形
這里畫正方形是最關鍵的一步，我們只要知道螺旋黃金圖的比例就可以很快的畫出來。
螺旋黃金圖比例為：13 : 8 : 5 : 3 : 2 : 1
只要知道螺旋黃金圖的比例我們就可以開始畫正方形了，簡單的正方形不用我多說吧。我們按 10 倍的比例來畫圖，簡單的意思就是前面的螺旋黃金圖比例都乘 10，變?yōu)?130 : 80 : 50 : 30 : 20 : 10，再根據(jù)這個數(shù)字畫出 6 個正方形。
正方形畫好后按照這個轉(zhuǎn)圈的順序排好即可。
3. 畫圓弧線
正方形畫好后，畫圓弧線，可以通過畫正圓得到。
圓弧線為正圓的四分之一，圓的半徑為每個不同正方形的邊長，通過不同大小的正方形畫出不同大小的圓弧即可。
開始畫圓?。阂源笳叫蔚挠蚁陆菫閳A心畫正圓，注意相切位置，畫好后刪除多余的錨點。
△ 圓心位置
△ 相切位置
△ 刪除多余錨點
△ 圓弧畫完后
到了這一步基本也就出現(xiàn)我們想要的螺旋黃金圖，最后只需要將我們的正方形改成描邊的模式即可。
△ 最終圖形
這里展示一下第二種方法：
螺旋黃金比1 : 1.618在畫面中怎么看？
說了這么多，沒有實際的操作案例你們是不是也很頭痛，到底拿到這個技巧怎么去使用呢？在我這里例舉一個橫版和一個豎版的案例。
找素材
這里找來幾張圖片，因為是做分析案例，所以我就選擇我自己喜歡的圖，我選擇的是圖1。
圖片調(diào)整
圖片確定后，我們就需要把圖放到我們的畫布中。
但是問題來了，一般我們的設計尺寸基本是不會和找到的素材是一樣大的，我們到底要怎樣放大圖片呢？圖片中哪些元素可以忽略，哪些需要重視？螺旋黃金分割法就可以用上了。
利用我們的螺旋黃金分割圖，放在我們的版面中。接下來就放大我們的素材圖片，分析圖片結(jié)構(gòu)。圖片上方都是天空，左邊是海和天空，只有右下比較復雜，有人和零碎的石頭，所以我們這里圖片就以人為畫面中的焦點，那么我們的螺旋圖就需要改變一下位置。
調(diào)整圖片大小和位置，將圖片中的人物放在螺旋圖的焦點位置，這樣我們的版面就快速地確定了視覺焦點。
文字排版
將文字排版在畫布中，再根據(jù)文字豎排的樣式，和人閱讀的習慣，調(diào)整圖的方向和文字位置，使人看向主題文字，給人一種指引的方向。
總結(jié)：主要利用螺旋黃金分割法調(diào)整圖片的位置焦點，使畫面中心達到舒適耐看和精致的視覺效果。
標記分析圖：
這個案例我就不做太多的講解，因為很簡單，直接利用螺旋黃金分割構(gòu)圖的方法，將版面按1 : 0.618的比例劃分，然后在這個比例畫布中排版文案和圖片。
圖片位置排版
素材選擇上面的圖2，這里就做一張豎版的海報。
將素材圖放在畫布中，準備好我們的螺旋黃金分割圖，也放在畫布中。根據(jù)圖片本身的特點，人物只有上半身，所以將圖片放在底部最為合適。至于人物應該靠中間還是靠邊，我們同可以根據(jù)圖片人物本身的姿勢判斷，根據(jù)人物是微抬頭向上看，角度約 30 度，所以選擇將人物靠邊。
再就是人物具體位置的掌控，我們同樣和上面的案例一樣直接利用螺旋黃金分割圖做參考位置選擇，所以就很快找到合適的位置，如上面右圖。
填充背景和文案
我們將背景顏色填充為天空統(tǒng)一的色彩，建立網(wǎng)格，將文案排版在畫布中，上面主要是海報中的主要文案及主題文案，文案和圖片的總體比例為1 : 0.618，遵循我們的黃金法則。
根據(jù)圖片的氣質(zhì)，圖片中的色彩和人物都屬于文藝氣質(zhì)，清新、寂靜、雅致的感覺，所以我們這里可以選襯線體宋體，結(jié)合韓文來體現(xiàn)整體的氣質(zhì)。
效果展示
最后看看海報效果吧，主要講解螺旋黃金分割圖的使用，所以排版方面講解的比較簡單，以及主題文字都采用最簡單粗暴的字體，沒有過多的修飾。
文章分享了螺旋黃金分割構(gòu)圖的用途，很廣泛，包含海報設計、畫冊設計、網(wǎng)頁設計、繪畫、服裝設計、logo設計、電視電影、建筑、攝影等等領域，以及分享了黃金分割圖形的畫法，3 個簡單的案例實操，利用黃金分割構(gòu)圖來幫助我們構(gòu)圖和排版，最有利于我們對圖片焦點位置的選擇和排版分布的掌控。
文章來源：優(yōu)設