当前位置:首页 >教程首页 > U I 设计 > 艺术设计基础班 >黄金分割——设计师的设计利器

黄金分割——设计师的设计利器

发布时间:2018-11-17 19:57:24

 

 

导言:设计师在设计的时候,总会遇到这样那样的问题,和人PK不断,修改不断。界面区域多大合适呢?Icon多大?颜色区间多少?为什么这么定义?什么是普世的美?很多UI设计师都说,50%靠设计,50%靠交流,那么在交流的时候如何说服别人呢?ADS定位、用户群、用户环境、调研都可以作为参考的依据,在这里再向大家介绍一下我们身边存在的黄金分割,希望作为设计的利器,或创作或PK。

 

一、植物

“黄金角度”生物学家发现植物种类繁多、叶子形态各异,但是叶子在茎上的排列却有着特殊的规律。我们从某种植物的顶端往下看,便会发现上下层相邻的两片叶子之间所构成的角约为137.5°,如果每层叶子只画一片来表示,第一层和第二层的相邻两叶之间的角度约为137.5°,以后二层到三层、三层到四层、四层到五层……两叶之间都成这个角度,这个角度对叶子的通风和采光最为有利。这叶子之间的137.5°角与黄金数又有什么联系呢?我们知道,一周为360°,360°-137.50°=222.5°,137.5:222.5≈0.618。也就是说,各种植物叶子的生长规律中自然隐藏着黄金数。(图01)

 

图01

 

向日葵花有89个花辫,55个朝一方,34个朝向另一方。(图02)

 

图02

 

枫叶。(图03)

 

图03

 

喷嚏麦。(图04)

 

图04

 

1、1、2、3、5、8、13、21、34、55、89、144……后面的数除以前面的树,越往后越趋向于黄金比例。运用到设计当中,譬如一个齿轮的图标,齿的个数可以参考这组数列。PK词:这是自然的法则。#p#e#

 

二、动物

由这组数列引出斐波那契曲线,斐波纳契是在解一道关于兔子繁殖的问题时,得出了这个数列。假定你有一雄一雌一对刚出生的兔子,它们在长到一个月大小时开始交配,在第二月结束时,雌兔子产下另一对兔子,过了一个月后它们也开始繁殖,如此这般持续下去。每只雌兔在开始繁殖时每月都产下一对兔子,假定没有兔子活亡,在一年后总共会有多少对兔子?在一月底,最初的一对兔子交配,但是还只有1对兔子;在二月底,雌兔产下一对兔子,共有2对兔子;在三月底,最老的雌兔产下第二对兔子,共有3对兔子;在四月底,最老的雌兔产下第三对兔子,两个月前生的雌兔产下一对兔子,共有5对兔子;……如此这般计算下去,兔子对数分别是:1, 1, 2, 3, 5, 8, 13, 21, 34, 55,89, 144 ……看出规律了吗?从第3个数目开始,每个数目都是前面两个数目之和。(图05)

 

图05

 

下面再简单介绍下斐波那契,了解下周边总是可以唬人的。 

意大利数学家,12、13世纪欧洲数学界的代表人物。生于比萨,早年跟随经商的父亲到北非的布日伊(今阿尔及利亚东部的小港口贝贾亚),在那里受教育。以后到埃及、叙利亚、希腊、西西里、法国等地游历,熟习了不同国度在商业上的算术体系,他认为使用印度-阿拉伯数码最方便。1200年左右回到比萨,潜心写作。  他的书保存下来的共有5种。最重要的是《算盘书》(1202年完成,1228年修订),算盘并不单指罗马算盘或沙盘,实际是指一般的计算。全书共15 章,1~7章系统介绍了印度数码与记数制度,以及整数、分数的各种计算方法,结果用弃九法来验算。还列有乘法表、素数表和因子表等若干数表。8~11章是商业上的计算题,如物价、利润、利息、货币换算等,反映了中世纪地中海地区的广泛商业交往。(图06)

 

图06

 

黄金分割的算法:

1.如果线段AB被点C分成线段AC和BC,且BC/AB=AC/BC ,那么称线段AB被点C黄金分割,点C叫做线段AB的黄金分割点,AC与AB的比叫做黄金比。通过计算可知黄金比为

2.黄金矩形:一个矩形如果两边之比具有黄金比值,则称这种矩形为黄金矩形。它是由一个正方形和另一个小黄金矩形组成。事实上,如(图07),如果设大黄金矩形的两边为a、b,则 。这表明小的矩形也是黄金矩形。

 

图07

 

3.如何得到线段的黄金分割点C呢?这里介绍一下操作方法:首先画一个参考Y轴(纵轴),如图所示。A点位于Y轴上,水平画出AB直线,长度任意。以A为中心,AB为半径,画一个圆,得到与Y轴相交的X点。即AX=AB。取AX的中心点Z,即AZ=ZX。连接ZB,并以Z为中心,ZB为半径绘制一个圆,得到与Y轴相交点Y(下方相交点)。即ZB=ZY。最后,以A为中心点,AY为半径绘制一个圆,得到与AB相交的C点,此时AC=AY。C点即为黄金分割点。(图08、09)

 

图08

 

图09

 

鹦鹉螺的曲线黄金分割构图也体现在网页构图上,如Twitter的iPad版。(图10)

 

图10#p#e#

 

三、人物

1.面部比例

相貌对不起观众的人各有千秋,美丽的人却有很多相似的地方。奥黛丽赫本有这标准的三平五眼,作为公众的美女,我们看看他的脸部有那些黄金分割吧。(图11)

 

图11

 

再以一个普通人凤姐为例,对比看看,在画卡通形象的时候可以夸大面部各部分的黄金比例。(图12)

 

图12

 

2.身体比例

肚脐:头顶-足底之分割点;(2)咽喉:头顶-肚脐之分割点;(3)、(4)膝关节:肚脐-足底之分割点;(5)、(6)肘关节:肩关节到中指尖之分割点;(7)、(8)乳头:躯干乳头纵轴上这分割点;(9)眉间点:发际到颏底间距上1/3与中下2/3之分割点;(10)鼻下点:发际到下巴底间距下 1/3与上中2/3之分割点;(11)唇珠点:鼻底到下巴底间距上1/3与中下2/3之分割点;(12)颏唇沟正路点:鼻底到颏底间距下1/3与上中2 /3之分割点;(13)左口角点:口裂水平线左1/3与右2/3之分割点;(14)右口角点:口裂水平线右1/3与左2/3之分割点。(15)在人体中三分之二是水;在22.5 ℃的环境中人体的新陈代谢处于最佳状态,而22.5 ℃是人体正常体温36.5 ℃的0.618倍;(16)心脏中心位于胸腔的黄金分割点上;(17)整个脊柱的0.618是胸与腰的分界处,也就是第12胸椎处,从肩至中指指 尖的 0.618是肘关节,从肘关节至中指指尖的0.618为腕关节,从膝关节至足尖的0.618是踝关节。(18)姿态优美,身材苗条的时装模特和翩翩起舞的舞蹈演员,他们的腿和身材的比例也近似于0.618的比值。(图13、14)

 

图13

 

图14

 

思考:如果小明的身高是1.75米,假如肚脐在0.97米位置,增高垫用多高能使肚脐达到人体的黄金分割点?答案最下面公布。(图15)

 

图15#p#e#

 

3.其他和人体有关的黄金分割

一年12个月,12的0.618是7.4,7、8月份人体血液中的淋巴细胞最多,它可参与抵御细菌的侵袭,所以这时是人体抵抗力最强的时期。一天中气温最低的时间是凌晨2时气温最高是在14时,它们之间的黄金分割点为9.4,上午9、10时的气温是一天中最适宜的,这时人的头脑最清楚,办事效率最高。中医的三个主要健身穴位枣百会、涌泉和劳宫的位置也符合这一分割律:百会位于前发际至后发际的0.618处,涌泉位于足掌部的0.618处,劳宫位于手掌的0.618处。(图16)

 

图16

 

4.DNA的比例

最有意味的是,在人的生命程序DNA 分子中,也包含着“黄金分割比”。它的每个双螺旋结构中都是由长 34个埃与宽21个埃之比组成的,当然34和21是斐波那契系列中的数字,它们的比率为1.6190476,非常接近黄金分割的1.6180339。这是否说明黄金分割律是比DNA中的遗传密码更基本的东西?因为承载DNA的结构——双螺旋结构——也遵循黄金分割律。(图17)

 

图17

 

四、建筑雕塑

埃菲尔铁塔是一座纪念性建筑物,为了纪念法国大革命100周年,巴黎决定在1889年举办国际博览会,并要造一座永久性纪念建筑物。埃菲尔铁塔在 1889年初建时,高度已达300米,是当时全世界最高的建筑物,直到1930年,仍是最高的(1959年在埃菲铁塔顶部增设广播天线,使塔高增加到 320米。) 埃菲尔铁塔在距离地面57米,115米和276米处,各有一个平台,计算表明:(300-115)  300=0.617。所得比值与黄金比0.618相差甚微,由此可见,埃菲尔铁塔第二层平台的位置,非常接近于全塔高度的黄金分割点,从图中可以看出,第二层平台正是埃菲尔铁塔张开的四条腿开始收拢的转折点。埃及金字塔的高和底部边长是黄金比例。(图18)

 

图18

 

雕塑维纳斯的身体各部分也符合黄金比例。(图19)

 

图19#p#e#

 

五、绘画摄影

1.蒙娜丽莎的微笑

达•芬奇的“美丽密码”共有六大“法则”,其中包括脸的宽度必须是鼻宽的4倍;前额的宽度、鼻子的长度以及下颌骨长度必须都相等;研究人员吃惊地发现,“六大法则”中的5个都与现代人的审美标准奇迹般地吻合,只有一项关于“鼻子与嘴的比例”的法则与现代略有出入。小巧的嘴型是文艺复兴时期的审美标准,嘴的宽度是鼻宽的1.5倍被认为最完美。与之不同的是,研究发现,现代人普遍认为嘴宽与鼻宽的比例达到1.6的更美。达•芬奇的“美丽密码”要求如此严苛,以至于大多数普通人都不能全部符合其标准。因此研究人员也表示:“尽管这一研究结果显示脸部器官的大小、组合方式以及位置不同,都会对个人魅力产生影响。但一个人的美丽是一个复杂的组合,其中还涉及到其他许多因素。”(图20)

 

图20

 

2.摄影的九宫构图法

九宫构图顾名思议,将画面平均九等分,而四个交叉点侧是黄金点,拍摄时将主体放在图中四个交叉点中的任何一个点上,而不是放在画面的中心或接近中心的位置上。而四个点中,一般认为,右上方的点,是最理想的位置。(图21)

 

图21

 

六、其他

1.美剧中的黄金分割过场

盛开的花瓣中隐藏着蜻蜓的翅膀,花心是费马螺线组成,而螺线的排列与黄金分割和斐波那契数列相关。

青蛙的背后有希腊文第21个字母PHI(Φ),这个字母用来代表黄金分割,1.6180339887。

角的形状就是斐波纳契螺线,而仔细观察可以看到角上的数字,就是黄金分割数值Phi-Ö——1.6180

海马的身上图形是Fibonacci Spiral斐波纳契螺线,同时,螺线里面包含的线代表了黄金分割的比例。海马的尾部是Fibonacci Spiral,一些图片中还包括了L-histidine 组氨酸和L-proline脯氨酸的结构图。(图22)

 

图22

 

2.手机界面

iPhone宫格界面,每个图标都是57*57,图标宽度与图标顶部到下一排图标的高度的比例是黄金比例。

天语手机传统的九宫格形式,对屏幕也进行了视觉上的黄金分割。

WM6.5的蜂窝系统,六边形一方面最省空间,一方面也接近于黄金比例的5边型。

 

图23

 

关于黄金分割的总结就告一段落了,一些例子可以灵活的运用到设计当中,希望对看到这篇文章的同学们不管是设计或者PK都有所帮助。

 

PS:小明的答案(0.97+x)/(1.75+x)=0.618,x≈0.29(米)。

学员作品赏析
  • 2101期学员李思庭作品

    2101期学员李思庭作品

  • 2104期学员林雪茹作品

    2104期学员林雪茹作品

  • 2107期学员赵凌作品

    2107期学员赵凌作品

  • 2107期学员赵燃作品

    2107期学员赵燃作品

  • 2106期学员徐正浩作品

    2106期学员徐正浩作品

  • 2106期学员弓莉作品

    2106期学员弓莉作品

  • 2105期学员白羽新作品

    2105期学员白羽新作品

  • 2107期学员王佳蕊作品

    2107期学员王佳蕊作品

专业问题咨询

你担心的问题,火星帮你解答
×

确定