跟Mac QQ学设计：揭秘黄金比例的应用

每天学点设计知识，装起X来不费劲。...






点击题目下方视觉艺术，即可关注我们！

最近，MacQQ推出5.0版本。作为中国最大的Mac软件，QQ本次更新带来了包括界面改版和新增功能在内的全面优化，其中“极简模式”更是将屏幕划分为接近7：3的比例，事实上这也是对著名的黄金比例的一种拓展用法。

黄金比例是一个比较特殊的数学比例，取其前三位数字的近似值是0.618。而这个被称为“上帝的尺寸”的数字已经被应用了好几个世纪，特别是在设计领域最被人所熟知。因为这个比例带来和谐与美感，凡是能贴合黄金比例的作品所营造的艺术感都会倍增。

黄金比例最基础的设计应用，就是“完美矩形”。如果你将一个正方形拉伸为一个矩形，让长是宽的1.618倍，将两个图形叠加，你就可以获得一个清晰直观的黄金比例，被分割出来的小矩形同样遵循着黄金比例。以这样的方式向新的矩形中填充正方形，那么你填充的正方形会越来越小。



像上图所示，你最终绘制出来的将会是一个黄金螺旋曲线，它所包含的数列遵循的规律是，每个数字都是前两个的和：0、1、1、2、3、5、8、13、21、34 、55、89、144……



好吧，说这么多我知道你们根本不care，因为对大部分同学来说，数学是一个永远无法填的坑。还是看点案例来的实在。



当然，当美的要求越来越多，黄金比例的应用也不局限于0.618如此精确，由此延伸出的三七分比例也尤为常见。

除此之外，三分法也是黄金比例的完美延伸，这在摄影技巧里十分明显。将摄影图片按照1：1：1均等的方法划分出来，所有的空间都是相同的大小。最重要的设计要素可以配置在中央的长方形的四个角周围。

比如这本《Complex》的封面，整体布局符合黄金比例，而黄金比例三分法下的两个交点上则正好和女性的鼻子与眼睛上，真是怎么看怎么美~LOGO的黄金比例案例更是数不胜数。就一起看看国内外QQ和苹果公司这两大品牌的LOGO设计吧！从企鹅整个身体构造，到头部、眼睛甚至胳肢窝都没放过，将黄金圆运用的淋漓尽致，简直完美。







圈圈圆圆圈圈，已看晕。整整13个大小不一的黄金圆的组合才设计出这颗神奇的“苹果”，不愧是改变人类世界的3个苹果之一，大写的服！

而将这两大品牌特点无缝融合的社交软件Mac QQ在更新为5.0版本后，更是将黄金比例这一美学应用得细致入微。

以往的版本中QQ占用屏幕大约2/3，用户开始使用时会习惯性将窗口拉动调整到右边30%的区域，而且需要频繁切换版面，这个过程其实拉低了一些效率。QQ的产品团队在大量观察用户的使用习惯中发现，边工作边沟通时，用户经常将窗口布局成左右两部分，左边70%为工作界面，右边30%用来沟通，这就是常说的三七分比例。

然而，简单的拖动治标不治本。由于拉动改变了预设的界面尺寸，所显示的信息可能会由于界面压缩而被隐藏。于是Mac QQ5.0将之前的4栏简化为2栏，而占用面积比较大的左侧菜单栏也被移至顶部，节约了近一半的屏幕空间，而且功能并没有被迫删减。

而在另一方面来看，Mac QQ5.0的隐藏功能设计也与手机QQ进行了贴合，例如成员列表被收纳到右上角位置，保持了与移动端的统一体验。

而在边工作边聊天的情况下，这样的版面似乎还是略微有点宽，于是Mac QQ的“极简模式”真正派上了用场，进一步将QQ界面调整至屏幕的30%范围内，符合大部分用户的操作习惯。“极简模式”隐藏了列表部分的好友/群组名称和消息预览，但是别担心分不清好友是谁，将鼠标移至头像上将会有气泡显示名称，移开则消失。这项设计避免了空间的浪费，也让用户不会错过新信息。

对话框里的头像也被精简掉，保留了好友的名字，确保精确了解消息内容。毕竟在工作中，如何用最短的时间了解最全面信息更为重要，而这也为界面争取了更多的优化空间。

在各个细节部分的优化后，“极简模式”的界面只占到整个电脑屏幕的30%，聊天的各项功能也被优化到最直观的位置方便使用，而并非常用的功能也找到合理的入口进行收纳，确保用户在需要的时候简单操作即可找到。



Mac的产品设计风格非常明确，大板面、简约、干净利落都是Mac的关键词。随着用户对Mac使用场景越来越丰富，如何适应用户的使用习惯来完成多场景工作就成为新的挑战。Mac QQ在这方面率先进行了探索，且一直拥有积极优化的态度，这也造就了QQ在Mac端应用中的出类拔萃。

点击底部链接阅读原文，跟着Mac QQ一起学设计！

    关注 视觉艺术