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

上亿人使用的QQ空间萌宠形象,原来是这么设计出来的!

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

本文主要包含卡通形象设计,品牌故事,经验分享等相关知识,希望在学习及工作中可以帮助到您

腾讯ISUX – EU:QQ空间在去年推出了全新“萌宠”玩法,上线以来,获得了不少用户的喜爱,同时也收到了大量忠实用户们对想要养小鸡小猪等的心声。为了给用户带来更好的体验,项目设计组决定新推出一大波各异形态的萌宠,让萌萌的宠物融化用户们的心?

关键词

围绕着宠物的世界观,吸引更多用户参与新玩法,确定产品定位并且提升用户黏度,我们提炼出了一些关于“空间宠物”的关键词。

设计过程

1. 第一轮尝试

设计理念: “可爱”这个元素是各个年龄段都会受用的,形象多用圆形或椭圆形的设计,再围着着“成长”,“多样性”,“地球”等关键词尝试。

意见反馈:初步沟通反馈,希望以宠物的真实形象类别作为分类,确保每一个宠物的形象都有鲜明的性格。

2. 第二轮尝试

设计理念:根据不同类型的宠物真实形象改变之前的拟人化的设计,符合宠物真实的形态,减少多余的细节,提取特征作抽象化。

意见反馈:经过多次的沟通,确定了满意的方向,接下来进行了细节优化与调整。

3. 规范制定

在本次制作中需要短期内输出18个新的形象,留给单个形象设计及输出合格时间较短。从零开始重新创作形象的方案不太现实。所以,我们必须得先明确本次多宠物制作上形象设计的形象要求,制定相应形象规范,内部设计的同时在外部CP进行合作,以及寻找合适的现有形象进行二次创作。

形象风格:宠物的形象一般偏可爱风格,在无特殊情况下,线条保持圆滑自然尽可能采用形象原型本身的姿态;

形象角度需偏左30度左右;

形象设计统一使用扁平风格,无色彩渐变,无描边,色彩使用上不要使用过;

高饱和度或者与白色过于相近的颜色(由于空间馈送底色是白色,如果宠物形象本身是白色,用偏白的灰色代替)。

阶段分类:每个形象有3个阶段,分为:幼年,少年,成年阶段之间需区分明显,而且个头差异不能过于巨大。

细节规范:为了制作脊椎动画,设计时需注意身体四肢运动的可能性对于身体和四肢同一颜色的情况,不要使用阴影来区分四肢和身体。

输出规范:提供宠物形象在自然状态下的,另需对形象的手,脚等活动部分进行调整;

形象在自然状态下是为了方便身体活动,不一定与形象默认动作一致,确保自然状态下的身体能满足需要做的绝大部分动作。

蒙皮规范:不同宠物有不同装扮,设计师需在理解装扮范围的原则上,进行适当的装扮设计并输出设计稿。

形象输出

给予不同形象的人性化特点,以更有情感化的形式设计新形象。

结语

QQ空间萌宠全新改版升级,突出物种的多样性,全新定于了宠物的世界观以及新玩法从脑爆方向 – 风格尝试 – 落实设计 – 最终上线,需要感谢很多为此付出的同学,让空间的玩法更加丰富。也期待着“空间宠物”有更多更有趣的玩法以及创新。

「上亿人在使用的产品是这么设计出来的!」

  1. 《我如何设计了那个上亿人使用的DOGE表情?》
  2. 《上亿人使用的手机淘宝卡券包,设计师是这么做改版的》

原文地址:腾讯ISUX

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

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

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

优设大课堂

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

  • 8种引导方式,7个设计要点,让你全面了解新手引导!
  • 超详细的动态表情包新手绘制指南
  • 实战深度总结!如何设计和运营品牌形象?
  • 没有美术基础怎么画卡通肖像?来看这个方法!
  • 上亿人使用的QQ空间萌宠形象,原来是这么设计出来的!

相关文章

  • 2018-08-237种不同类别对比,小程序和APP相比还有多大差别?
  • 2017-08-06CSS优先级的相关知识详细介绍
  • 2018-08-23交互设计师和产品经理PK的一点心得
  • 2017-08-0650个漂亮的FLASH网站设计实例
  • 2017-08-06Web前端开发工程师需要掌握的核心技能
  • 2018-08-23豆瓣9.0分的《我不是药神》,海报也是超高分!
  • 2018-08-23从这3个层面出发,让你的产品实现人格化
  • 2017-08-06我们能从Google的全新UI中学到的知识(图文)
  • 2018-08-23实战干货!​网页设计中如何运用方框/方形元素?
  • 2017-08-06网页无法打开 原来是元素div缺少结束标记

文章分类

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

最近更新的内容

    • 三八XX节专题页设计该怎么玩?看这篇就够了!
    • 商业设计比赛中如何提升获奖率?高手总结了这4个实用小技巧
    • 设计好看但没人用?6个技巧告诉你到底该如何影响用户!
    • 如何构建 Web 端设计组件之树和日期时间选择器
    • 写给入门者的三十条HTML代码编写指南
    • 科普好文!作为UX设计师你需要知道的52个专业术语
    • 前端开发必备常用工具函数小结
    • 固定在网页右侧的浮动层实现代码
    • 想成为云计算交互设计师,该具备哪些能力?
    • 天猫App 首页迎来史上最大改版,背后的设计过程是这样的!

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

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