• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >心得技巧 > 上亿人使用的3D版QQ黄脸表情是怎么做出来的?

上亿人使用的3D版QQ黄脸表情是怎么做出来的?

作者:腾讯设计 字体:[增加 减小] 来源:互联网 时间:2018-08-23

本文主要包含QQ表情,经验分享,腾讯,表情包等相关知识,腾讯设计希望在学习及工作中可以帮助到您

QQ黄脸在2003年加入QQ表情后就一发不可收拾,从此成为中国网民记忆力中信息量最大、最魔性的存在之一。

黄脸作为表情符号的含义,也发生了许多天翻地覆的变化,比如「微笑」=嘲讽版「呵呵」、「再见」= 友尽版「再也不见」……

而随着一代代网民审美风格的变化,QQ小黄脸的形象也经历了几次变身。

△ 最经典的表情

△ 在一个喜欢扁平化设计的年代

编者注:先回顾一下去年火爆的扁平QQ小黄脸加了哪些新表情→《揭秘QQ 新版表情背后的设计故事》。

近期,这个人人都爱的QQ黄脸又迎来了新一次升级——它变成3D的了!

Q:在哪里可以看到3D化的QQ黄脸?

A:在新版手机QQ里,点击左上角头像打开菜单,选择「个性装扮」——「表情」,然后搜索「QQ黄脸」,就可以看到3D版本的黄脸表情了,有「经典心情」和「热聊日常」两个免费表情包。

目前使用率最高的是这么几个表情:

△ 太魔性了小编盯着看了几十遍

尤其是第一个「可爱」,可能现在年轻人聊起天来最喜欢做的就是互相卖萌吧。

Q:为什么要做这次3D升级?

A:我们的设计师发现,更大的球体,更直接丰富的外观,对于夸张的表达内心情绪有着更富于冲击力的意义,3D的形式也是近来表情流行的一种趋势。

Q:3D黄脸表情的设计过程中有哪些有趣的研发故事?

A:以大家熟悉的「笑泪」表情为例。首先需要将小的圆头QQ黄脸拉大并一比一设计还原,确认五官比例准确无误时,才开始进入3D制作。

而如何把握好表情每个细节部分的质感是个难题。第一稿的「笑泪」,两眼居然流着「有毒」水银材质的眼泪!

设计师在怒改11稿后依然发现眉毛与眼睛的迷之尴尬质感,到最后精修十二稿才终于定稿,有了现在的「笑泪」。

其他的表情也并不是什么软柿子,这里献上一批独家黑历史:

△ 设计师平时腮红用的不是很熟

△ 这二次元少女式大眼闪闪发光

△ 最是那一低头的温柔和眼影

Q:3D黄脸表情设计有没有一些窍门?

A:我们在一笔一画的打磨过程中,总结出了目前3D黄脸表情设计的一些经验。

比如,3D的黄脸嘴巴分3种形式体现:

  • 凹陷多用于静态或动作微妙的状态。
  • 悬浮多用曲线变化夸张的动作。
  • 掏空多用于嘴巴张开的动作。

再比如,3D的黄脸眼睛也可以总结为3种主要形式:

  • 凹陷多用于静态或动作微妙的状态。
  • 悬浮多用曲线变化夸张的动作。
  • 立体多用于静态夸张表情。

而这几种表现形式的选取,主要取决于表情动画的多少,这直接影响到设计和制作的成本。

一般,做3D表情设计制作时,都会用到一种「面部布线」的方式。嘴巴、眼睛这样的部位,活动范围大、样式多,不仅需要布较多的线才能做出需要的表情,还常常会「牵一发而动全身」,每一次细微的变化都会引发一连串的调整。

而将嘴巴、眼睛等部位独立出来后,只根据需要做它们的动画就会相对简单一些。毕竟,同样能表达夸张的表情,一条立体的线的动画(嘴巴)就比整张脸的动画简单得多。

所以,悬浮、立体等体现方式,既能最大程度节省铺线的成本,还能表达出更加微妙的表情内涵。

Q:3D黄脸表情还有哪些有趣的应用?

A:发展到今天,黄脸俨然已经成为了一门独特的网络交流语,甚至演变成一种独特的文化。而QQ黄脸未来还可能出现在除了聊天以外的场景中,比如贴纸、胸针、冰箱贴、笔记本、APP变脸贴纸……

QQ黄脸3D表情不仅是千变万化的情绪展现,更是标志着一种创意想象,而这种年轻、好玩、有趣的感觉正是这套表情想赋予大众的情感。

「收藏一波!还有这些有趣的表情包」

  • 《设计师专用表情包合集(一)》
  • 《设计师专用表情包合集(二)》
  • 《设计师专用表情包合集(三)》

================明星栏目推荐================

优优教程网: UiiiUiii.com 是优设旗下优质中文教程网站,分享了大量PS、AE、AI、C4D等中文教程,为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章,按照我们的专栏一步步学习,一定可以迅速上手并制作出酷炫的视觉效果。

设计导航:国内人气最高的设计网址导航,设计师必备:http://hao..com

优设大课堂

您可能想查找下面的文章:

  • 上亿人使用的3D版QQ黄脸表情是怎么做出来的?
  • 上亿人使用的QQ iPad版「斗图神器」原来是这么设计出来的!

相关文章

  • 2017-08-06我们能从Google的全新UI中学到的知识(图文)
  • 2018-08-23科普好文!作为UX设计师你需要知道的52个专业术语
  • 2017-08-06网站标准开发流程图
  • 2017-08-06让人想亲自体验的17个404页面
  • 2018-08-23那些很熟悉但又叫不出名字的设计法则:禁果效应
  • 2018-08-23「这个控件叫什么」系列之Popover/气泡弹出框/弹出式气泡
  • 2017-08-06前端开发工程师和美工对于网站开发所掌握的知识的区别
  • 2018-08-23新闻资讯类App 该如何设计?这儿有一份UX分析
  • 2017-08-06最棒的9个国外免费图片素材网站
  • 2018-08-23版本控制工具 Abstract 是如何提升设计团队协作效率的?

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • IE6中奇数宽高的BUG
    • 实例教学!25个帮你运用好极简风格的设计方法
    • 有创意的关于我们网页页面设计
    • 高效导航设计三原则 网页设计师必知
    • 老妈,才是那个最难搞的甲方!
    • 正确的空链接写法 防止点击后页面会跳动问题 a href #号问题
    • 通过这5个AR APP,帮你一窥现实增强技术的应用
    • 入门知识 网站地址前的http是什么意思?
    • 推荐一个前端工程师做的超酷交互式网站
    • 如何提高设计能力?来看腾讯设计师这个方法总结

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有