## ##

        設計師不可錯過的黃金比例指南

        2018-10-24 18:35:47 閱讀 261654 本文來源:invisionapp
        分享至:

        好的設計一直以來都是大眾爭論的焦點,雖然永遠不會有一種放之四海而皆準的方法,但卻有一種具體的數學方法可以幫助我們更接近于好的設計經驗:黃金比例。

        黃金比例是你幾乎可以在任何地方找到的數學比例,比如自然,建筑,繪畫和音樂。而當專門用于設計時,它便創造了一種有機的,平衡的,美觀的感官享受。

        在本文中,我們將深入探討黃金比率是什么,如何計算它,以及如何在設計中使用它——包括一個方便的工具列表。

        20181024182202092.jpeg

        yourlocalstudio.dk


        什么是黃金比例?

        黃金比例,也稱為黃金分割、黃金平均數、神圣比例或希臘字母phi,黃金比率是一個大約等于1.618的特殊數。比例本身來自與神秘的斐波那契序列—— 一個自然出現的數字序列,它可以在任何地方找到,從樹上的樹葉數量到貝殼的形狀。

        20181024182338527.jpeg

        斐波那契序列是它之前的兩個數的和。它是:0,1,1,2,3,5,8,13,21等等,到無窮大。源于這種規律,希臘人開發了黃金比例,以更好地表達序列中任意兩個數字之間的差異。

        那這和設計有什么關系呢?當你把一條線分成兩部分,較長的部分(a)除以較小的部分(b),等于(a)+(b)除以(a),兩者都等于1.618。而這個公式可以幫助你創建出更賞心悅目的形狀、標志和布局等等。

        20181024182503319.jpeg


        創建一個黃金矩形

        取一個正方形以及和正方形同樣長,但寬為1.618比例的長方形。

        20181024182538617.jpeg

        將正方形放在矩形上,兩個形狀之間的比例就為黃金比例。

        20181024182538664.jpeg

        如果你繼續將黃金比例公式應用到最右邊的新矩形,那么你將得到一個由越來越小的正方形組成的圖像。

        20181024182538713.jpeg

        如果你在每個方格上畫一個螺旋線,從一個角落開始到另一個角落結束,將創建出一條斐波那契序列曲線(也稱為黃金螺旋)。

        20181024182538795.jpeg


        如何在設計中使用黃金比例?

        既然數學課已經結束,我們又如何將這些知識應用到每天的工作中?

        以下是在設計中使用黃金比例的四種方法:


        1.排版和定義層次結構

        黃金比例可以幫助你確定在網站,登錄頁面,博客文章甚至平面廣告中使用的標題和正文副本的字體大小。

        20181024182538887.jpeg

        假設你的正文部分是12px。那么將12乘以1.618,得出的值為19.416,如果遵循黃金比例并平衡12px正文字體大小的話,那么你的標題文本大小就可以是19px或20px.

        反過來同樣,如果標題文本為25px,則可以將其除以1.618以確定正文文本大小(15或16像素)。


        2.裁剪和調整圖像大小

        裁剪圖像時,很容易識別要剪切的空白區域。但是,在調整大小后,如何確保圖像仍然平衡?你可以使用黃金螺旋線作為圖像構圖的指南。

        20181024182538816.jpeg

        例如,如果在圖像上疊加黃金螺旋線,則可以確保焦點位于螺旋的中間。


        3.布局

        利用黃金比例可以幫助你設計一個視覺上吸引人的用戶界面,并引導用戶將注意力放在那些更為重要的部分上。

        20181024182538939.jpeg

        20181024182538916.jpeg

        例如,在左側突出顯示內容的大塊,右邊的列更窄的頁面可以遵循黃金比例的比例,并幫助你決定將最重要的內容放在哪里。

        20181024182932212.jpeg


        4.LOGO創作

        如果你正處于Logo創作的瓶頸期,那么不妨參考一下黃金比例原則,它可以幫助你勾勒出大致的比例和形狀。許多流行的logo都遵循黃金比例,如Twitter,Apple和百事可樂等等。

        20181024182932306.jpeg

        via:Mostafa Amin和Brandology Studio

        設計師Kazi Mohammed Erfan甚至挑戰自己完全基于黃金比例創建了25個新logo。

        20181024183157782.jpeg

        via.Kazi Mohammed Erfan


        幫助你使用黃金比例的工具

        有時候并不需要鉛筆和紙張來計算黃金比例 ,有很多工具可以為你工作。以下五種工具可幫助你在設計中使用黃金比例:


        1.黃金比例計算器

        https://www.omnicalculator.com/math/golden-ratio

        計算兩側的較短邊,較長邊和組合長度以計算黃金比例。

        20181024183157926.jpeg


        2.goldenRATIO

        https://itunes.apple.com/us/app/goldenratio-tool-for-every/id485258055?mt=8

        這款應用程序專為設計師和開發人員而設計,可根據黃金比例為您提供設計網站,界面,布局等的簡便方法。它包括一個帶有視覺反饋的內置計算器和用于存儲屏幕位置和設置的功能,因此您無需為每項任務重新安排黃金比例。

        20181024183157968.jpeg


        3.黃金比例排版計算器

        https://grtcalculator.com/

        輸入您的字體大小和寬度,為您的網站發現完美的排版。您可以根據字體大小,行高,寬度和每行字符進行優化。

        20181024183200780.gif


        4.PhiMatrix

        https://www.phimatrix.com/

        這款Golden Ratio設計和分析軟件提供可自定義的網格和模板,您可以在任何圖像上疊加,可用于設計和組合,產品設計,徽標開發等。

        20181024183157885.jpeg


        5.黃金比例草圖資源

        https://www.sketchappsources.com/free-source/1190-golden-ratio-sketch-freebie-resource.html

        下載黃金螺旋的免費草圖文件,幫助圖像和布局組成。

        20181024183157945.jpeg


        開始使用黃金比例

        一旦你知道要尋找什么,你就會開始注意到到處都是黃金比例。(不相信?看看你的手,甚至你的手指也遵循黃金比例。)人類的眼睛習慣了看到這個神奇的數字,我們潛意識里對它作出了積極的反應。

        而作為設計師,我們可以利用這個數字來獲得優勢。哪怕是對裁剪圖像或開發布局的方式進行微調,仍然可以顯著地改善用戶與設計交互的方式。

        責任編輯:wly

        認可我的創作,就鼓勵一下吧

        0人打賞
        分享至:

        聯系客服

        故障反饋