恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
Google重塑安卓表情符号全解析
0.0°
2017-11-27 自译外文 经验/观点 原作者: Google Design 举报 2046 6 4 0

/ 潮闻 / 2000+的系统表情符号是如何被重新定义的,一套完整的设计系统如何被建立,Google Design给你答案。

Image title

自Android KitKat以来,我们的表情符号已经超过2000个,符号和符号之间只有细微的风格变化。 随着高分辨率屏幕和新增消息使用案例的激增,我们决定是时候给我们的表情符号进行彻底重塑。


在2017年Google I / O大会上,我们宣布全面重新设计Android表情符号,包括统一视觉风格和全新的设计,通过多样化和包容性的表情符号来培养文化意识。

Image title

重新设计的表情符号


· 如何过渡到新的表情符号

我们原始的表情符号风格简单而平坦,色彩大胆且流行。 扁平设计成为Android的标志性风格,将我们与其它平台区分开来。


多年来,随着额外的表情符号被添加进来,整体的符号风格上变得不同。 我们的设计系统没有提供统一各种表情符号和所有插图外观的标准。 因此,我们的表情符号在新旧设计交替之时变得不一致,难以快速从键盘上找到正确的表情符号。确实是时候改变了。

Image title

我们将动物组合从各种样式变成了统一的头像和身体


· 创建一个新的设计系统

通过学习过去的经验,我们重新设计的主题必须是一个强大的设计系统,可以很容易地创建一个容易识别的表情符号风格。 除了统一的风格之外,系统必须帮助我们保持一致和充满活力,因为将来会持续推出新的表情符号。


通过形状,网格,表现形式和颜色的具像化,我们能够在保留表现力和个性的同时保持统一性。 通过创建一个强大的设计系统,我们也解决了之前一个主要缺点,就是表情符号即使不是一个插画师创建,但在任何情况下都保持一致,清晰,可理解和具有代表性。


· 图形系统

Image title


再见blob! 你好,情绪轻松的圈圈

是的,我们做到了。 我们从容器的不对称和略微立体的形状转移到一个容易浏览的柔软的圆圈,依靠大胆的色彩,有目的的不对称 , 如新的思维表情或穿着牛仔的表情符号 ,和传达情感的面部特征符号。


我们也花了很长时间,确保我们跨平台的情感一致性问题。 因为我们重新设计的主要目标之一就是为了避免跨平台的混淆或沟通不畅,我们希望向用户保证,当他们向朋友发送表情符号时,无论是在iOS,Windows还是三星 ,或任何其他平台都能足够顺畅。


· 网格系统

Image title


本着可读性和一致性的精神,我们在单个网格上创建了表情符号。 我们使用的网格是Material Design产品图标网格的修改版本。 对于插图,我们并没有严格遵守规则,就像我们绘图一样,但我们通过三种特殊的方式来使用网格:


1. 通过插图统一规则和尺寸。

2. 在整个集合中构建一致的形状。

3. 促进设计师在正确的地方对表情的各个部分进行对齐(考虑特定的眼睛和嘴巴)。


我们还统一维度和角度跨越集合,选择尽可能简单的角度 ,强调二维视图,以简化和使用我们的网格。 我们在少数情况下引入了三维的观点,比如表情符号可读性不清楚的情况。

Image title


我们使用网格来创建角度和比例标准。 在Android N中,动物的姿势,

角度和风格是不一致的


· 可重复使用的组件

Image title


可重复使用的表情元素涵盖了广泛的情感


除了网格之外,我们为某些类别的表情符号构建了一个新的可重复使用的组件集合。 这些可重复使用的部件不仅可以保持整个表情符号的一致性和可读性,还有助于定义插图风格的独特性,同时使未来的表情符号更易于构建。 混合和匹配两种类别都是很有趣的,这让一些动物表现的非常生动。

Image title


我们分享了许多表情和动物表情里的眼睛和嘴巴的组成部分


· 颜色

Image title

颜色强化情感


我们新引入了鲜艳的颜色的新鲜一致的调色板。我们为某些类别创建了集合 , 最显著的是红色,蓝色,黄色和绿色现在与特定的情绪相关联。


我们创造了一种照明风格,使表情符号更有触感,同时让我们有机会玩转色彩。渐变也使表情符号在各种各样的背景中更清晰易读。

Image title


渐变和色调笔画可以确保表情符号在任何背景颜色下均清晰可辨


确保可读性的另一种方法是在表情符号上添加色调描边或轮廓。我们根据表情符号和类别来确定线的颜色。动物,人物或表情符号等较简单的类别使用了两种主要颜色和一种基于次表情符号颜色的笔触。

Image title


新的颜色系统统一了表情符号集


这种方案超越了视觉性并进一步推动我们的色彩系统,色调笔画确保无论它们出现在任何背景颜色上总是清晰的,无论在任何键盘或应用程序里。


· 69个新的表情符号

作为Android O重新设计的一部分,我们还引入了69个新的表情符号,它们是Unicode 10的一部分。这个新的表现形式包括提供性别中立的人物表达,戴着头巾的女人和女子母乳喂养的形象。

Image title

69个新的表情符号的抽样


还有九个新的表情来帮助用户扩大他们可以传达的情绪范围。 幻想爱好者,动物爱好者和美食家们也会发现一些很棒的新表情符号 ,还有可怕的绿色僵尸到凶猛的霸王龙和美味的饺子。


5月17日起,Android O beta用户将可以使用完全重新设计的表情符号集以及新的Unicode 10表情符号。


这是一段漫长的旅程,今天我们正在进行最大的飞跃,并进行全面的重新设计! 我们希望您喜欢使用我们新改版的表情符号,就像我们喜欢制作表情符号一样。


Image title


更新:2017-11-27

收藏

6人已收藏

GianniChia

交流群公号:GianniChia

  • 38

    作品

  • 1915

    粉丝

  • 12

    关注

  • ICON网格制作极简手册
  • 网页网格设计极简手册
  • 动效灵感集 5.17
  • 如何画出完美手机模板

    猜你喜欢

      2017-11-27 自译外文 经验/观点 原作者: Google Design 举报 2046 6 4 0

      Google重塑安卓表情符号全解析

      0.0°

      你确定要举报Google重塑安卓表情符号全解析

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年11月27日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      4
      6
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录