设计案例分析:QQ公益图标诞生记

永不熄灭的爱心图标——腾讯公益月捐计划 “QQ首席图标”诞生记

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

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

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

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

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

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

以下是初步尝试。

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

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

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

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

时间: 2024-12-22 15:54:20

设计案例分析:QQ公益图标诞生记的相关文章

设计案例分享:QQ登陆节日banner的创作过程

文章描述:设计案例分享:QQ登陆节日banner的创作过程. QQ登录banner是与用户沟通情感的小窗口,在一些特殊的日子里我们尝试一些力所能及的表达方式来给用户一种感动,一种记忆. QQ登录banner正力求避免直白的画面呈现,增强画面的趣味性.故事性,唤起用户共鸣,以幽默的方式带给用户愉悦的心情. 下面分类归纳一些节日banner的创作过程,通过记录一些设计过程中的反复与纠结,总结几点与大家共享.一. 避免低幼与直白的画面铺陈 [开学日] 九月一日开学,对于在校学生或是毕业许久的社会人士,

交互设计案例分析:影响用户体验的关键因素

下面分享一个交互设计的小案例,这个案例很好地说明了我们在具体工作中怎么样去追求"易用"并且"轻量级"的设计,而这是影响用户体验的两个关键因素. 交互设计不是在控件库里挑选合适的控件,这是我最近工作中的一个感受.线上应用的环境复杂多变,不一而足,很多在书本或别人的实践中看起来合理的方法,放在自己具体的环境中就会出问题.下面分享一个交互设计的小案例,这个案例很好地说明了我们在具体工作中怎么样去追求"易用"并且"轻量级"的设计,而这

快速设计专题:营销类节日专题设计案例分析

文章描述:快速制作专题!利用颜色查找快速制造大感觉. 当接到一个紧急需求的时候,设计师脑子里一定在抱怨不爽了.因为设计要用"赶出来"的话,是很难有优秀的作品的.但有时候不得不面对现实,需求方急着要,我们也只能加快速度设计.把脑子里有的设计形式全都翻出来,全用在页面上. 有时候可能会有意想不到的结果!有时候又会出现那种连自己都不愿意承认是自己做的尴尬处境. 这种快速设计没有经过前期的精细推敲,总有站不住脚的地方,但是时间有限,能达到一眼望去,让各位爷能心里感叹一声"哇"

邮件设计案例分析

  对于美,仁者见仁智者见智,但在邮件设计中,订阅者才是最终评委.为了能够吸引订阅者在打开后继续点击.产生后续转化,我们通常会设计明显的call to action,其实尝试跳出传统产品链接的模式,比如通过投票.选择等方式也达到间接转化的目的邮件.下面我们一起来分享以下这些案例,看看在同样的设计思路下,会有怎样不同的表现. 1.投票 J. Peterman 公司的"野餐决战鸡尾酒"邮件,让订阅者为户外休闲装(野餐)或正装(鸡尾酒)投票,每种选择都对应一个定制的着陆页,投票结果会在下期邮

网页设计实例分析:日式网页设计案例分析

文章描述:在很多人眼里,日本是一个隐忍.充满禅意的国家.以寺庙.茶道.电子产品而闻名.既传统,又现代.日本的建筑设计.书刊设计受世界瞩目.但是不知怎么的,日本的网页设计风格很怪异.有点像1998年的网页风格. 在很多人眼里,日本是一个隐忍.充满禅意的国家.以寺庙.茶道.电子产品而闻名.既传统,又现代.日本的建筑设计.书刊设计受世界瞩目.但是不知怎么的,日本的网页设计风格很怪异.有点像1998年的网页风格. Rakuten NicoNicoDouga Gigazine 看看日本这些最流行的网站(比

网页设计案例解析;绿色调网站设计案例分析

文章描述:每个人都有自己最喜欢的颜色,在工作以及生活中,当购买产品或进行艺术创作的时候,他们会选择自己喜欢的颜色.对于设计师来说也是同理.设计师偏好在设计中重复使用他们最喜欢的色系.虽然命题是无限的,但是他们还是喜欢遵循自己的审美感觉. 每个人都有自己最喜欢的颜色,在工作以及生活中,当购买产品或进行艺术创作的时候,他们会选择自己喜欢的颜色.对于设计师来说也是同理.设计师偏好在设计中重复使用他们最喜欢的色系.虽然命题是无限的,但是他们还是喜欢遵循自己的审美感觉. 绿色的定义方案. Narhir T

网页设计案例分析:客户是不是要你设计的

文章描述:要做一个篮球专题页的时候,我们脑海里通常是这样的:它是篮球赛专题,背景很重要.能说明他的性质,动感激烈.方向就更简单了,直线型,沉重又明快的对撞色应该是主要考虑的地方. 要做一个篮球专题页的时候,我们脑海里通常是这样的:它是篮球赛专题,背景很重要.能说明他的性质,动感激烈.方向就更简单了,直线型,沉重又明快的对撞色应该是主要考虑的地方. 唯一的疑问是?客户是不是要这东西.一般,做之前,会先问问客户有没有参考的资料.客户方很爽快的扔了个前一个团队交付给他们的设计稿,他们只说了不满意.具体

解析基于栅格的网站设计案例分析

如今,Grid-based(基于栅格的)网页设计已相当普遍,这意味着网页布局混乱的日子就要终结.尽管还无法用肉眼分辨,但我们的确是步入了有序和结构化的时代.栅格布局整体趋于匀称,通常会使网页更加整洁美观.同时,栅格框架已经成为现代所有网站功能实现的基础,这都要归功于它为终端用户提供了完美不失真的设计体验. 一般来说,栅格仅仅是水平线和垂直线隔出来的特定空间,它似乎很难承载任何设计元素,所以大部分设计师会根据路径描绘出几何特性.我们已然看惯画廊.博客.以及新闻相关网站中那些干净利落的栅格,但其实只

用户体验设计案例分析:关于链接的文字描述

文章描述:提供链接时 比"点击此处"更好的说法是什么?. 你肯定有过这样的经历,希望你的用户点击你提供的链接,但却不知道要怎么吸引他们这么做.某些人在碰到这个问题时,会倾向于在他们的链接上放上"点击此 处"四个字.但是,在你屈服于这样的诱惑之前,你应该要知道,使用这类词汇可能会影响到用户的界面体验.提供链接时,比"点击此处"更好的说法是什么? "点击"这个词过度强调了鼠标的动作 在 你的链接上放上"点击"这