QQ爱心图标的设计过程

进入论坛参与讨论: http://www.missyuan.com/viewthread.php?tid=419698

腾讯“月捐计划”倡导爱心人士，通过每月小额捐款的形式，长期关注和支持公益项目。并和亿万爱心网友一起，每人每月1份爱，点滴付出，汇成爱海，形成强大公益合力，随时帮助需要帮助的人！

“QQ公益图标”正式亮相，让QQ用户轻松实现献爱心的公益愿望。

“月捐计划”的icon设计是一次重大的挑战，因为赋予它的意义非凡，被点亮后，将排列在迷你资料卡上的第一位，是QQ用户的“公益通行证”，让爱传递的入口。通过它来凝聚9.9亿个QQ的爱心力量。

这个16*16的小图标，被委托重担，在前期设计的过程中，尝试过很多方案，经过方方面面的考虑，层层筛选，由pony亲自指点，最终敲定这颗充满爱心意义的跳动的心形icon,：红色舞动的丝带沿用了原公益网logo的造型，背景一抹温暖的黄色，象征着心灵的光明，点亮无数孩子的生命梦想。

推出后，看到越来越多的用户对它的热捧和喜爱，被大家誉为QQ图标中的“首席图标”，这是对设计师最大的认可和鼓励，现在来回顾一下“月捐”icon的设计过程。

前期我们一直构想着树苗（芽、叶）的造型，象征着被关爱，被呵护，播种希望的种子，让爱在每一个人心中生根发芽。

以下是初步尝试。

方案提出后，大家感觉造型看不清楚，第一眼难以辨认叶子的形状（上图1.）

于是重新绘制了树苗造型，调整了茎干的颜色，采用像素化边缘的策略，使叶子跳出背景，突出显示，易于辨认。（上图2.）

可像素化之后带来另外一个问题：过于卡通！于是继续优化，弱化了边缘，将大小叶子的位置对调，集中重心，突显右下角的等级数字，（上图3.）

至此，在该方案基础上，能想到的调整动作都一个像素一个像素尝试过了，基本没有可优化的空间了，以为大功告成！可突然有人提出icon的配色和我们的QQ音乐icon过于接近，容易产生混淆。大家反复斟酌，确实对icon识别性上存在干扰。造型雷同，配色雷同，并摆放在同一个工具条上，很难脱颖而出。

OMG~~~~
继续奋战

保留上一个方案的思路，仍采用叶子的造型，去掉了背景色，和music的icon对比出差异化（上图1.），可自己琢磨后，感觉此方案造型单薄，含义浅显了一些，于是继续深入，将两瓣芽组合成心形，延展寓意。（上图2.）

在确认每一个造型方向后，都尽力把能想到优化点做到最好。

大家知道16*16的icon表现是有限的，一个四方格子，不能太满当，也不能太单薄，在造型和色彩融合上需要一点一点的润色，故此有一美名，叫绣花功，哎呀，功夫梦能否圆满？还得看大家点评……
结果总是令人激动地~~~~，大家一致认为造型寓意不丰满，正赶上QQ农场菜园子收菜，放在菜地里正合适~~~~

OMG~~~~
继续奋战

延展上一个方案的思路，想到了树的造型，会更饱满，树干采用“You”的首字母“Y”的变形，托起一片新生和希望，强调每一位用户的参与性，为公益事业做出点滴贡献。（上图）
提案后，大家觉的有距离感，寓意虽然很好，但不够直观，色彩亲和力不够，并不能让用户从中感受到公益的力量和温暖。

OMG~~~~
继续奋战

这次换一种思路，跳出最初构想的圈子，苗、芽、叶、树本身就限制了icon的色彩，搭配工具栏的蓝色背景下，很难突出显示。何不保持公益的统一性，将现有镂空的logo造型重新包装，让它适合16*16的表现。(上图)

事实证明，换一个思维，抛开原有定势，经常出去转转，总能找到出路的。
大家终于一致认可了该方案。

我相信每一次设计背后都有很多故事，每一个作品都凝聚了所有人的期许，产品，策划，设计，总监，经理，甚至到总办，大家寄望于它，为QQ用户提供最佳的体验。
为公益事业一丝不苟的默默奉献。

如何点亮爱心图标？

当您的爱心积分达到108积分，公益图标会在您的QQ上自动点亮。有以下三种情况，您的爱心积分会达到或超过108积分。

1. 参加“月捐计划”（推荐）：当您参加“月捐计划”，并成功完成首月捐款10元，公益成长图标在您的QQ上自动点亮。（开通月捐请进：http://gongyi.qq.com/loveplan）
2. 其他成功捐款：当您成功累积捐款额大于或等于11元时，公益成长图标将于成功捐款的第2个月在您的QQ上自动点亮。
3. 在公益成长体系推出前，累积捐款大于或等于11元（且单笔大于或等于1元）的爱心网友，您的公益成长图标已经自动点亮，请登录查看。