设计 RubyConf China 2015 的 Logo

话说我在沙溪 7 月初的一个周末正准备重新练习着画些 Logo 和 UI,@jasl 问我是否有兴趣给这届在深圳举行的 RubyConf 画大会 Logo。来得真巧,开始是想拒绝的,因为我怕我不够时间去完成,可还是欣然接受了。但是我提议我做的方案可以做备选,能找到设计师的话还是用设计师的好,毕竟我是业余的。

每天,吃完饭后我都会到石桥周围散步,阳光太猛时就躲到旁边的大树下,伴着树叶哗哗的声音来回走动,一边活动筋骨一遍思考图标应该表达的意思和图形; 傍晚则在石桥的另一边,那里是我最喜欢去的地方,在那常常自言自语也不顾旁边路过的游客和村民。

在石桥的一边来来回回走动设想 Logo 的图形

第一天我便想出了一个图形,是一个 Ruby 形状的层层叠加,我非常高兴,几乎迫不及待的想把它画出来,但是我告诉自己不急,再等等、再想想。一旦开始动笔就会开始关注具体的图形细节,会把注意力放到怎么画图上,更何况我不怎么会画图。第二天、第三天我都在脑子里不断的想象着图形的样子、颜色、如何解释图形的意义,越想感觉越好;中午半小时、傍晚半小时,平时我都要去工作,晚上则休息、继续工作或者和旅舍里的旅人聊天。

无论是画画、书写、打字、描述,得出的结果多少会和脑子里想到的内容有差异,这种差异是原始想法的损耗,而损耗的多少和你使用的工具和表达途径有关,越是精湛损耗越小,但始终是有的。想法会随着时间的推移越来越模糊,有时候是好的,有时候是不好的;好的是能自动去掉不重要的地方,不好的是会消耗想法的「新鲜度」和「保真度」,这对较大的想法才有好处。所以当一个大的想法得到发展或者打磨后,不要急着将它表达出来,想象力是最好的载体。即使整体想法成型,也不要急着表达出来,时间可以帮忙去掉不重要的部分。

但在第四天中午在树下转了几圈后,我把前三天想象的结果彻底抛弃了,我有了一个新的想法:用三角形、矩形组成 SZ,图形表示楼,间隔表示马路,而 Ruby 图形在中间,使其看上去像是坐标标识。同样的,刚得到这个想法的时候我总是高兴一整子、总不禁想去动笔画出来;但在我花了一段时间不断想象完善这个图形后,在一个傍晚也被我舍弃了。

我觉得 Logo 的细节要尽可能的少,不能有看不清楚的部分,要保持简单,每一个角度和转弯都要有它存在的意义。另外应该把重点放在整体的形状上,尽可能用最简单的线条和形状。Logo 是一种标识,就好比是指纹;它必须是唯一的,组成结构是不可变的,这是为了让 Logo 具有识别累积的作用。如果有几种组合的话,你要对这个 Logo 重新认识好几遍。

足够简单的 Logo 可以让人非常容易记忆,而 Logo 的唯一性让人容易累积对它的识别:每一次短时间内看过一个图形,过了一段时间后,回忆起来只会是个模糊的形状,但在下次再看到一模一样形状后,它们马上就会关联起来并加深印象;多次叠加后印象就会变得深刻。简单性影响受众的接受速度,而唯一性影响记忆深度。


按照以上想法,我开始重新寻找结构非常简单,有深圳特色又能表达我认为的 Ruby 和 Ruby 群体的一些特质。我后来想到了一个方向,从抽象方面去考虑。

一天中午我在大树下转着圈,根据新的方向不断搜寻和想象一个新的图形。突然,我脑子里冒出了一个画面,那是一个深圳有代表性的雕塑,我很久以前,至少在还常看电视的年代,在一个深圳市容市貌的宣传片里看到过。也就看了几十秒的画面。

那个雕塑是一个健壮有力的巨人将一道门框给撑开了,门框顶部中间有个明显的裂口。我并没有急着去找出这座雕塑的名字和详细介绍,我猜那应该是关于深圳的开拓精神的;这个时候脑子出现的那个画面非常有趣,我不能描述雕塑的具体细节,但我非常清楚的记得巨人的动作和门框的那个裂口,而这两个元素我认为正好是雕塑的核心,模糊的记忆正巧帮我把雕塑给抽象和提炼了,它其实也是一个 Logo,而且富有含义。

我开始构思 Logo 的形状:门框是一个正矩形,缺口用一个梯形,为了表现它们的坚硬,没有把他们弄成圆角,坚硬的东西被破坏了才能表现出力量;中间的巨人正好是 Ruby 的形状代替。我有尝试想象将门框的脚折一个角,标识是被中间一股力量撑开的样子,但是后来觉得它们会变成干扰;我只想非常的突出那简单的三个元素,门框、缺口、Ruby 图形,而我觉得最好的突出方法就是没有其它元素,只有它们三个。

后来我找到了那个雕塑的资料,名字为《闯》


因为 Logo 的图形非常简单,其实很容易画,但是图形的宽窄和位置关系会影响图形整体,这些都是非常细节的东西,可以说失之毫厘差之千里;这在我后来遇到问题重绘图形的时候特别明显,看上去感觉差很远。我使用 Sketch ,在 iOS 7 的图标网格系统的辅助下去画;它给出了很好的框架,那个网格是我一条线一条线去计算仿造出来的,而且我拿它临摹了几十个图标,很是熟悉。

第一版设计稿
看看在不同颜色的效果
展示例子

绘制完后我很开心的把它发给 @jasl,并简单的介绍了设计的想法和思路,还有所表达的意思。过了一周后他给了我反馈,那是一个设计师的意见;大概的意思是想法很好,但是图形不行,不匀称,看上去是很勉强的凑在一起的。

当时第一感受就是不爽。因为自己花了很多心思,而且也自我感觉良好;前三天心里是接受不了的,我已经拒绝在上面花心思了,感觉我没办法对它做改进,也想不出其它的图形,因为我觉得它真的很好了。

在一天工作的休息间隔,我想通了。那种意见和批评是好的,它可以加快我走出对自己想法甚至创意的迷恋。如果没有那个设计师的意见,也许我自己过几天也会觉得当时很满意的图形也不好,也会像我前面的几个想法一样直接被我舍弃。

有些感觉「难听」的话背后其实是很有价值的,只是自己觉得它的外表很难看而已,只有抛开或者忽略自己脑子里的「偏见」才能感觉到它的「真心」。即使是不对的,也能促使我去进一步思考。
然后,我对于这种「难听」的话开始产生积极的态度,甚至希望能听到更多。

但我实在没办法在那个图形上进行改进,我觉得不能在上面加多一条线,所以我抛弃了那个想法,开始重新构思一个新的,这很困难。


我把设计图标的事情放下了几天,专心工作和看书去了。某一天在看到了苹果的 MUSIC 应用后,我产生了新的想法;而这次的重点是颜色,MUSIC 应用是音符图标里各种颜色的融合,但主色调是紫色。

于是我开始选颜色,我没有一开始就在一堆颜色里找,那样效率很低;

在想象设置图标的过程中,我发觉每天早晚饭后散步的时候分别花半个小时在没有任何干扰的情况下效率非常高;没有手机、电脑、和我搭话的人。而且散步的时候身体和眼睛都在休息,加上沙溪的风景很舒服,融入其中去思考是非常让人享受的一件事情,而且思路会变得开阔,比坐在工作台和电脑前要好太多太多。

另外我想到一个片名:让子弹飞一会,和一个词:发酵。分散的两个 30 分钟的效率要比一个小时效率高很多。

在那半个小时里,脑子里充满了关于图标的一切:不同颜色给人什么感觉?可以表达什么意思?MUSIC 应用里运用的颜色表达了丰富的感情色彩,而紫色的主色要给人什么感觉呢?图标的形状当然是 Ruby 的外形,而里面融合了不同的颜色,主色调会是 Ruby 的红色,而怎样的红色会比较好?我还需要选出 4 个希望表达 Ruby 的主旨,然后给这些主旨匹配的颜色。期间,不时望望远处的山,近处的缓慢流动的河水,来来回回的走动。

时不时放眼望去

而在天色渐暗,离开石桥的时候我就已经不再想任何关于设计图标的事情了;但是就如我无意中发现 MUSIC 图标后马上产生想法一样,当我没事在刷 Instagram 的时候,我看到一张图片突然就觉得里面的颜色用于 Ruby 图标的设计非常棒,没有刻意寻找、完全不需要预热;那些半小时里的想法和问题在我脑子里也许一直低耗低频运转着,不断「思考」的同时也不断的接收着信息,只是我察觉不到而已;也许就是所谓的潜意识,我也说不清楚,但是这样做非常好。

想象一下,每天两个 30 分钟,坚持一周,那就是 7 小时,这是「纯度」非常高的 7 小时;谁能一天一连 7 小时如此呢?

但是,有一点非常重要,需要持续。


在最后一天尝试旋转缺口,形成一个圈,我惊喜的发现,这个旋转的圈有将视线聚集到中心的导向作用,而且看上去是个对称的图形,有平衡和稳定。这个向中心的导向吸引了我,而且我很快就想到了一个很棒的含义去诠释那个图形,而且是对第一版图形含义的演变和丰富;我马上抛弃了混合色的那个想法。

最终版 Logo
示例

在后来制作动画和调整图形细节的时候,我也不断的让图形所要表达的意思稳定下来,可以用简单的话语去写出来,最后就是两句简短的话,用简短的动画表达出来。同时,我也持续的调整着图形:

演变过程

这图形所要表达的意思将在下一篇文章里具体介绍,那是紧扣这图表所要表达的含义的动效(动画);而且,我当时完全不会做动效,从寻找制作工具开始。

动画最后的效果,感谢一个叫 Tommy 的朋友提供的背景照片。

我在 2014 年的时候有一段时间为了学习设计,使用 Sketch 每天高保真度的临摹一个 icon,持续了一个多月;而后当我觉得那已经不再困难的时候,发现其实画出那些图形很简单,难的是构思出那些图形,也就是设计,于是我停止了临摹。而这是我尝试设计的第二个 Logo 了,体会更多。