现在介绍一下微软这款表情包的大致情况吧,有些小伙伴可能是刚听说这个系列的表情包。微软在 21 年的 7 月 15 号宣布了在 Windows 11 等系统上采用新的 emoji 表情符号系统,其中包括基于 Fluent 流畅设计重新设计的 1800 多个表情符号:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/b41bdbdd059c7cfc8817aa5d74a3c8ca.png)
从上图可以看出,微软选择了 3D 设计而不再是 2D,并选择将大部分的表情符号做成动画。在改变风格后,它们可以更加的软化或强化对话的语气,为原本平凡的互动增加了更多的乐趣和俏皮感,并帮助我们以一种比书面文字更普遍、更符合时代审美的方式表达自己的想法:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/4302e871981ebe254f1cd4733eb7608e.png)
在表情的设计上,微软可是下了很大功夫,根据不同的需求设计出多样性表情,并倾向于明显的眉毛表情,关键是要保留情感的本意,同时将新的设计融入其中,使用简单的几何形状作为新风格中每个表情符号的基础。螃蟹表情符号通过大胆、美丽的颜色和厚实、图形化的形状体现了这一点:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/3b9ddbc7a878fe681bc2fc7d3a93cf21.png)
之前微软没把这些资源放出来,可能是出于独特性考虑吧,想把这个系列的表情包最为自己的特点产品。具体原因咱们就不深究了,没啥意义,因为现在微软把它开源了,放出来了,那重点就是怎么获取这些资源了,接下来就向大家介绍一下具体的下载方式!
微软日前在 GitHub 上开源了这组 3D emoji 表情符号库,除了可以在 GitHub 上找到这些 emoji,微软还将这些表情符号整合进了设计工具 Figma,方便我们在设计工程中调用。那接下来我就先介绍 GitHub 的获取方式,再说Figma吧,By the way,要是大家不想了解这些的话,可以直接下拉到文末,我们把这些表情包文件放在了文末,大家可以直接下载!
作为UI设计是,应该听说过 GitHub,因为我们需要跟前端打交道,比如讨论实现方式什么的。但可能也就是听说过,没用过,那今天正好也能了解一点 GitHub 的用法。
像 Fluentui-emoji 这组表情包,我们需要先打开 GitHub 中的项目地址,Fluentui-emoji 的项目地址是这个:https://github.com/microsoft/fluentui-emoji
点开这个地址,我们就可以看到项目的详细资源列表:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/c0e2d4e6d976f6ec0ae1367d2d6b4918.png)
资源的获取不用登录注册进 GitHub,直接就可以使用,我们目前需要了解的版块就只有上图框出的这两个部分。「文件夹列表」是对所有资源的集合,它就像我们电脑上的文件夹,里面有一些图片文件和开发文件,不过大家不用一直盯着它看,因为这里的内容我们可以直接打包下载为 ZIP 压缩包。
「资源预览」的部分是给了一张图,让我们看看能得到的文件里都有哪些具有代表性的文件。好了,现在我们就看看怎么把文件的ZIP压缩包给下载下来吧。首先我们要找到一个绿色的按钮:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/aa1e337d3f1ca3d151a4500603b966ed.png)
就是这个名叫「Code」的按钮,点击后会出现一些下拉选项:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/96fa825b7ff40f39c491056f65f1b9f1.png)
最后一个选项就是「Download ZIP」按钮,只要点击这个按钮,浏览器就会自动启动下载任务,把「文件夹列表」展示的所有内容给下载下来:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/eb62df890cb1da6865c12f4c973bb500.png)
压缩包名叫「Fluent-emoji-main」,解压过后会得到一个同名的文件夹,在文件夹里有一个名叫「assets」的文件夹,这里面就是全部表情包的图片了:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/a77482254da6aa128beee3ea3f3bdb1c.png)
表情包的格式有 PNG、SVG 两种,看我们的项目需要自由选择。除此之外的文件,大家如果看得懂的话可以多了解了解,看不懂的话也不要浪费太多时间去了解,因为其他文件基本上都是些开发同事才用的到。
从 Figma 获取这些表情包可就更加适合我们设计师了,基本上都跟 Figma 打过交道吧大家,那大家应该都知道 Figma 有一个「社区」,就是这里:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/4552e7967987054c01f44b509799856e.png)
这个「社区」就是各种插件、素材的集合地,Fluentui-emoji 表情包也在这里,进入社区,搜索「Fluent emoji」,就可以把表情包项目给筛出来:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/5751e08f05316c660bcbe5149b8f481f.png)
上图所示的这三个项目都是 Fluentui-emoji 表情包,可以看到上传者的 ID 都是微软。点击项目缩略图进入项目详情页,我们需要找到一个「Get a copy」按钮才能把它们保存成我们自己的项目:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/92426a89d3ac8d27d23438bb52f22908.png)
只需要点一下这个按钮,就可以自动把项目保存下来,之后就可以打开项目尽情使用这些表情包:
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/13341fab98e9498c6ded02b371f869bc.png)
Figma 的获取方式相比 GitHub 对我们设计师来说可能更加熟悉、方便,但从 GitHub 获取的话,可以得到一个完整的压缩包从而获得全部图片,更加自由,这两种方式大家根据自己的喜好和习惯自行选择吧!其实都很方便!
这个问题大家丝毫不用担心,这个 3D emoji 库使用的是对创作者极其友好的 MIT 许可协议,在该协议下我们可以自由修改源文件,拥有很大的自由度和发挥空间。至于 MIT 许可协议究竟是什么,我先展示一些大概的介绍给大家了解一下吧,感兴趣的话大家可以自行百度了解更多信息哈,不过总而言之,这些表情包图片是可以免费商用的!
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/c01a2dee3048706829047cb4d6b7ae44.png)
![Fluentui-emoji](https://gaosheji.oss-cn-shanghai.aliyuncs.com/2023/06/2ddb0b5db096eb29981aadc7182f22aa.png)
数据评估
本站搞设计导航提供的Fluentui-emoji都来源于网络,不保证外部链接的准确性和完整性,同时,对于该外部链接的指向,不由搞设计导航实际控制,在2023年6月26日 下午7:03收录时,该网页上的内容,都属于合规合法,后期网页的内容如出现违规,可以直接联系网站管理员进行删除,搞设计导航不承担任何责任。