真人来了！我如何设计了那个上亿人使用的Doge表情？
扫一扫 
扫一扫 
扫一扫 
扫一扫
微博那个魔性的狗头表情是如何诞生的？今天请它的创造者@JOnes冯大伟 来亲自说一下Doge的诞生过程，包括同学们现在用的微博表情，也有一大半是他绘制的，改版过程好玩有趣有干货，一起来探秘背后的故事！ 同样是表情改版，QQ设计师是这么做的：《腾讯设计师揭秘！QQ默认表情优化背后的设计故事》 首先自我介绍一下，我叫冯大伟，西安美院毕业，最早入行的时候在一家做设计服务的公司（现被洛可可收购）。后来进了新浪微博，14年底从微博出来和当时的同事创办了UI培训机构章鱼学院以及半吊子的设计公司WinoDesign，后来被坑了（这段黑历史就不提了）。现在担任小米生态链某公司的UI设计总监，管理一个8人团队服务公司7个产品线。五年间从一个小UI设计师到创业者再到老师再到团队管理者，这一路风风雨雨充满荆棘但我却乐此不疲。
言归正传，做微博表情纯属是机缘巧合，这个项目没有产品经理没有排期，甚至除了UDC-M其他部门的领导都不知道，是一次完全是由设计师主导的改版。 14年初微博刚刚做了大改版3.6，战略商业化，界面卡片化，且正当iOS6与iOS7的过渡期。 不规则形状的表情已不适应当下扁平且商业化的界面，所以老大（岳阳明－现微博UDC老大）经过深思熟虑，决定重新改版微博表情，把重任放在了我和另一个设计师（厉芳洁）身上，我做黄脸和手的表情她做其他表情。在正经需求排满状态下每天画一两小时不正经的表情，断断续续做了三个月。最终呈现给大家的就是现在微博客户端上的这套表情。
项目刚开始我们做了一些用户调研，把所有的表情打印出来让公司其他非设计非产品的同事填写语义。之后又调取了某段时间表情发送数据。得出以下结果，并针对不常用表情做了删减。（列表为旧版表情，按发送量排名）
我拿到这个文档首先做竞品分析。对比多个产品中的表情的语义哪个更准确哪个更生动。
之后开始上手做，我的方法是把所有表情排列挨个对照设计。（以下为当时的PSD画布，上半部分是新版，下半部分是旧版，按照当时微博客户端排列方式排列，逐步修改添加。）黄脸底板调了十几遍每次调整都是牵一发而动全身，小表情的面部调整不计其数。
其中有些创作过程分享给大家， （爱你）
这个表情其实旧版设计的已经很生动，憧憬的眼神，卖萌的嘴形，还有吐出的桃心，完全可以突出“爱你”的语义。我再创作的时候，纠结了很久，尝试了很多方案。中间尝试的几个方案都没有原版生动，最后只修改了底板，沿用了旧版的面部。（飞机稿3純恶搞，灵感来源：越狱兔里的小黄鸡） （大哭）
大哭的表情改了很多遍，旧版语义其实有种躲在家里默默流泪的意思，但是“大”这个意思表达的不够深刻。 虽然都是哭但是哭中似乎还能看出其他内含，比如飞机稿2是否让你想起了那个痛并快乐着的夜晚？ 新版较飞机稿3只是眼睛眉毛靠近了一下，嘴靠下一些，但是语义更深刻了。 表情设计与其他UI设计不同的是，可能挪了某一像素整个表情的语义就全变了。也许这也是设计表情的魅力所在。（画这个表情的时候我是对着镜子做了很多次鬼脸的） 其他一些旧版表情，语义不正确或者混搅的，都一一做了改版。
这三个语义在旧版表情里太过相近，比如“困”张嘴有打哈欠的语义，“打哈欠”有困的语义。为了区分这三个表情的语义我大费周折，对比了许多其他产品但都无果，最后想起了漫画中常用表现形式。
比如“困”我借鉴了《加菲猫》里乔恩的灯泡眼，而睡觉则用漫画中常用的 -zzzz来表现
这三个旧版表情的语义难以区分，‘呵呵’与‘可爱’太相似，且‘拜拜’只是在呵呵基础上加了手掌。但却是用户最钟爱的表情，很多用户用‘呵呵’和‘拜拜’已经脱离原有语义，进化成高冷的语义。新版表情上线之后吐槽最多的就是这两个。 “新版表情都带了美瞳，丑哭了，还我高冷”—微博某深度用户
创作过程，大号灰底为旧版，大号白底为新版中间为飞机稿。部分表情在我离开微博之后又有优化。 如‘呵呵’现在增加了眉毛，嘴角也有所变化。 这套表情发布之后，每天都有人骂，甚至有人创建了话题＃抵制新版表情＃。 我每天提心吊胆，搜关键词看用户反馈到半夜，生怕公司因为用户反映强烈把这辛辛苦苦做了三个月的项目下线了，还好被老大顶住了。
看评论，很多人说美工去吃屎，还有邀我和他去天台的。开始不理解为何用户疯狂吐槽，后来想明白了，无非是用户用着不习惯，无法立刻接受改变。就像iOS6突然改成iOS7，当时很多人骂丑，但是现在你用惯扁平化的界面再回去看看iOS6的拟物，会感觉low爆了。 且常使用表情的用户多为90后，喜欢的不会专门发微博赞美你，但是不爽的一定会骂你。可能10个人中有1个喜欢8个无感还有1个不爽的，你看不到那9个人的反馈，唯一能看到的是这个不爽的人吐槽。 做这个项目得出一个结论那就是产品要一点一点改，绝不可一下来个大改版，一定会有用户流失的（将死的产品不算）。 说到正题，虽然很多用户骂其他表情，但是没一个用户骂它：
其实我在做表情之前，神烦狗doge在国外已经炒鸡火爆了。各种设计交流群里几乎每天都可以看到有人发这只表情诡异的柴犬。
常看到这只黄皮肤的狗，我就在想：如果在一群黄脸中塞一只表情诡异的狗一定会有特别的效果。（当时并没有想到它会这么火。）
然后这只狗就诞生了，当然也做了很多尝试，我并没有完全按照照片去画，那样的话这只狗太过写实与周围的黄脸们就不搭了。所以就把它卡通化，放大眼睛以及眼神的萌傻感。 擅自在表情中加入doge，并得到老大认可，（有个英明的老大是多么重要），同事兼好基友老汤同志对doge爱不释眼，也擅自设计了‘喵喵'作为doge的女票。之后我又擅自加了浪头的表情。
感受一下用户怎么玩最后一只表情的。
再感受一下作为doge他爹是如何的光荣。
再感受一下用户的智慧，以下表情都出自微博用户之手。
老汤同志的延伸设计
之后老汤同志还把我们部门小伙伴的宠物都画了一遍做了一套微博主题，可惜没上线
左上角是我家猫’钻钻‘第二条微博内的照片就是它。右下1是老大岳阳明家哈士奇，右下2是老汤家’粘粘‘。中间是交互部门老大家猫。 设计来源于生活，在无趣的工作中给自己创造点乐子又为公司创造价值，这个点我们做的很好。 新版表情发布之后那段时间，我每天都看用户吐槽，每天担心用户会因表情流失。 当时微信朋友圈特别流行一些小游戏，有一款游戏是在一堆蔡依林中间找凤姐。 灵机一动，我是否可以做个小游戏在一堆表情之间找doge呢？但是没有开发，然后把这个提议和老大说了，老大一口答应，帮我找到h5客户端的开发大哥。（再一次拍马屁：有一个英明的老大是多么重要）然后让我自己推动这件事。游戏特别简单，就是在一分钟之内看谁找doge找的多。我熬了一夜加两个白天，游戏规则＋UI＋文案全搞定。
开发大哥调了一周，跟着微博h5客户端一块上线了。 上线之后。。。。老板来总玩了一把！
你想像不到当我看到一群大佬在下面聊我主导出来的东西的那种感受，爽极了！ 这个游戏带动一个话题，当时有2055w阅读量~
让我意淫一下 （这是去年做分享时的PPT内容，现在数据是2302.8万）
作为一个UI设计师，我的成就感80%来源于自我意淫， 感谢微博UDC-M的小伙伴，很怀念当年没心没肺的样子。 找柴犬游戏链接：http://m.weibo.cn/client/game 话题链接：http://weibo.com QQ交流群：494906156 附高清无码3x表情资源：http://pan.baidu.com/s/1slekZq1 而我现在又走上了独自创业之路，为需要学习的设计师们服务，想了解请戳：www.dayu.design 「那些优秀设计作品背后的故事」
【木子设计网 原创文章 投稿邮箱：13671295@qq.com】 ================关于木子设计网================ 手机扫一扫，阅读下载更方便˃ʍ˂ |
@版权声明
1、本网站文章、帖子等仅代表作者本人的观点，与本站立场无关。
2、转载或引用本网版权所有之内容须注明“转自(或引自)网”字样，并标明本网网址。
3、本站所有图片和资源来源于用户上传和网络，仅用作展示，如有侵权请联系站长！QQ: 13671295。
最新评论
