黄金螺旋线在界面设计中的运用

斐波那契螺旋线也称“黄金螺旋”，是根据斐波那契数列画出来的螺旋曲线，自然界中存在许多斐波那契螺旋线的图案。是自然界最完美的经典黄金比例。

斐波那契螺旋线，以斐波那契数为边的正方形拼成的长方形，然后在正方形里面画一个90度的扇形，连起来的弧线就是斐波那契螺旋线。

斐波那契数列（FibonacciSequence）数列是这样一个数列：

1、1、2、3、5、8、13、21、34、55、89…

在数学上，斐波那契数列是以递归的方法来定义：

F0=1

F1=1

Fn=F(n-1)+F(n-2)

(n>=2，n∈N*)

斐波那契数列比在字号大小、界面布局、Logo设计上具体有哪些用法？

01字号大小

1.01 大字体与小字体比例系统

我们在选择一个字号大小做为参考时，我们正常会选择最大字号或最小字号做为参考。按照黄金比1:1.618可以得到比它大的字体，按照黄金比1:0.618可以得到比它小的字体。

为了方便排版，我们除了可以使用黄金分割比例外，还可以使用斐波那契数列比。可以有更多灵活的排版方式，通过对比可以选择最适合的。

斐波那契数列比1:1/1:2/1:3/2:3/1:5/2:5/3:5 …

如上图我们可以根据字体的高度比来排版，这里我们大字高度：间距：小字高度比为8:5:5，可以灵活使用斐波那契数列比，多排几个版式找到最适合的一个。

1.02 文字的长度比例

在设计字体大小的时候，可以根据字体的长度来做为参考，黄金螺旋线整体长度为140px,下面的字体比较长我们就乘以1.618来得到比较大的比例226.52，取整数为226，我们对应长度字号取整数即可。

02界面布局

上图案例由UISTAR提供，整个界面的布局很舒服，字间距也恰到好处。在做后台界面，客户端界面时候很多时候会出现界面分段布局，很多时候认为后台不是特别重要而忽略了它的美观性。看下图我们应该怎么通过斐波那契数列比来切割画面

我们通过斐波那契数列比8:5:3:2:1绘制了正方形，在后台复杂的界面中我们肯定要参考画面中重要的最小宽度来确定这个比例大小，红框框就是我们确定的最小宽度，确定宽度后8:5:3:2:1得到大小不一的方格，剩下来就是根据内容自由组合合适的方格。

很神奇的事情发生了，好的作品大体都符合这个规律，几像素的偏差已经不重要的，所以前期我们可以参考方法论，当你的能力上来之后就可以放弃它慢慢凭自己的感觉来判断作品的好坏。

03LOGO设计

黄金斐波那契螺旋法是国际上通用的LOGO设计手法，也是最工整最严谨的设计手法。

BIGD牛大大已经出了类似教程，具体请查看。《Ai中用黄金比例法快速作图》

这边引用BIGD视频教程是想让知识更系统，也省点精力撸其他的干货。

我写了一篇《如何学习Yoga Style？》，里面有圆切法的基础教程。

这里说一下为什么要用黄金螺旋线去重新定义标识呢？

打个比方很多时候我们会找一张动物图片用圆切法去绘制它，但是我们绘制时候因为不知道怎么去做减法，会让这个形态变的复杂，绘制结果更多像是图案或者图形，而不是标识。我们使用黄金螺旋比例去切形态的时候要抓住动物的主体形态和特征，尽可能的抽象化简单化。

黄金螺旋线在logo中的应用

黄金螺旋比例用圆去切割很多人已经会了，但是最最最高级的就利用好黄金螺旋线。最近站酷很火的一个设计师DAINOGO，它的作品中就用到了黄金螺旋线，能用一个圆解决的绝对不用俩个圆。我们在设计中如果有运用到弧线的地方可以考虑使用黄金螺旋线做为参考。