资料来源:Youse.com。

链接:https://www.uisdc.com/newbie-drawing-dynamic-emoticons

今年想做个表情包，以前没做过。网上搜教程没找到有用的。所以我大多是看很多喜欢的表情包，然后录屏，一帧一帧的分析。

表情包做完后，想做一个记录总结，分享给同样想做表情包的新手朋友们。

我用AI画原画，AE做动画，最后PS导出gif。

当使用AE导出透明图像时，请记住在“输出模块”的设置中选择“视频输出:通道→ RGB+Alpha ”,以便保留不透明度。

一、确定表情包的内容

微信表情商店的“表情相册”有两种:16个表情和24个表情。

常见的表达式包类型如下:

第一次选择了有16个表情的表情相册。这样就不会因为表情太多而耽误，也可以很好的练习卡通形象的风格控制和动作设计。

把要做的表情一一列出来，给每个表情设定具体的时间节点。分割工作量。

这么短的“设计→制作→看到结果”的时间，有助于我们完成长远的计划，避免拖延和懒惰。

二。卡通形象设计

微信商店的相册表情包设计尺寸为240 x 240 px，应该< 100KB。

图像大小:由颜色数量、颜色面积、图形复杂程度、图形大小决定。

在设计表情包的卡通形象时，描摹越复杂，颜色越多，面积越大，那么空占用的空间就越大。

制作gif时，动作设计的帧数越少，可能会造成动画感觉不流畅。

所以卡通形象设计简洁，有利于后期的动作设计。

过于精细的人物设计会让人产生距离感、严肃感、拘谨感，而不是随意的打发和使用，会产生相反的效果。

比如白二九的形象设计就比“百变巧”复杂一点，后期的设计动作也确实有些头疼。

三。动作设计

表情包用在我们日常聊天中，直接简单的表达我们的情绪和态度。即时聊天的属性和大小限制，不适合做太复杂的动画效果。

大部分表情都是一帧一帧的动画，也就是每一帧都画出来，然后连续播放，创造出动态效果。

一般一个表情可以做1~2个动作，一个动作可以是3~4张图片。如果多了，尺寸很容易超过极限。

在表情包的设计上，一些微表情效果会更好。比如动物摇耳朵，摇尾巴，点头，眨眼。

例如，29被风吹动耳朵的图形:

如图，摇耳朵不需要很大的幅度差。三个耳朵叠在右边，差别不大，已经有明显效果了。所以在设计动作的时候，要多注意动作的幅度，避免停滞不前的感觉。

人眼识别连贯动作是1s，将近25帧。

所以每张图片在运动变化中的停顿时间只有3帧，少于3帧就容易捕捉不到这种状态，多于3帧有时会导致缓慢停滞。

暂停画面可根据内容确定，一般为5~10帧。

像白二九这种稍微复杂一点的图像，大概15帧的表情就是保险方案了。也有特例可以达到30~50帧。这种动作帧数多的图形占用面积小，色彩分布简单。

例如，当狗运气好的时候，表达:

为了避免我们在做完所有表情后导出gif时，发现已经超出极限太多的悲剧，尽量采取保守的方案。或者尽量最后导出gif的大小，尽快调整。

我画每一幅原画的时候都是用AI画矢量图，这样的好处是方便形象做后期的扩展设计。比如表情页面的banner banner banner等。，但缺点是不动的地方会感觉有点死板。

为了改善这种状态，我们可以让主像或者眉毛等细节微微抖动。

比如上下或者左右，抖动幅度不需要太大，0.5~1px即可。

在很少的帧数下，我们可以实现相对连贯的微运动，运动幅度很小，一般可以变化2px左右，比如“嚼嘴”、“动眼、动眉”等变形。

如果想有明显的变化效果，4px就够了。

如果整体不变，只需要对某一部分进行几次改动，比如伸出舌头，可以在AE中用旋转功能对图形进行分割，摆动舌头，减少工作量。

同样，还有四肢的摆动，眼睛的转动等等。

四。常见问题

在我们说完所有的表达式之后，最后一步导出gif时，最容易出现问题的有以下三个方面。

1。大小超过100KB

我一直在强调这一点，因为我自己的三四个问题都是在做的过程中发生的，很头疼。

除了前面提到的原因，还有一个杀伤力很大的元凶，那就是“文字”。

虽然不建议在表情上有很多描述非常具体，但是用场景狭窄的词。但是很多情况下，还是要加词的。比如在日常的问候中:谢谢，撕比吵架的表情包等。，有很多字出现。

因为汉字笔画多，复杂度高。所以很多图形比较复杂的gif，添加文字后很容易超过大小限制。

另一种方式是在纯色背景上添加文字，可以参考上面“狗年”的表情包。不过这个的适用范围比较窄，但确实比透明底加文字小很多。

2。表达式中没有添加2px白笔划

微信表情制作规范要求图片要有2px白描。

你可以在做完所有动画，准备从PS导出到gif的时候，把所有图层统一分组，在图层混合模式下添加2px的白色描边，简单方便，一次完成，绝对不会有遗漏。

3。表达式背景是不透明的

可以不透明，只要你的背景不是全240×240 px。换句话说，你的背景也需要一个2px的白描。

这个记录到此结束，第一部制作还有很多不足。希望能和大家多交流。希望想做表情包的同学看完这篇文章能有所收获。

最后，如果你对百二九感兴趣，微信表情商店可以搜索“狗子百二九”。