在此前一期《新媒体(公众号)端GIF动态图压缩对抗与优化的核心方法》中,计育韬老师为广大运营人全面解析了 GIF 图的优化策略,但众所周知:GIF 作为一种图像格式本身,只具备 256 种颜色渲染上限,但 PNG/JPEG 格式广域可达 16777216 色。这样的客观文件特性决定了 GIF 天然存在与静态图之间的色差。
所以,出现色差情况后首先不应过度紧张甚至苛责设计能力——这是一种近乎必然的合理现象。
而运营人应当积极寻求的解决方案,在计育韬老师看来就对应包含了两大路径:1) 从色彩数着手,统一动态图与静态图的颜色;2)从设计着手,让切片实现合理的过渡和优化。
方案一:颜色表锁定
在 GIF 的导出流程中,一般设计师会选择通过 PS,将视频的 MOV 格式或 PS 自身制作形成的动态转化为 GIF 格式。而在导出面板中,请留意 PS 分配给你的初始 256 颜色表(如颜色数有限,也可能小于 256 色):
如果你对这个显色方案基本满意,那么先请导出此刻的颜色表,会对应获得一个 ACT 颜色表文件:
请基于此颜色表先导出 GIF 图像本身。随后在制作与之衔接的静态图时,以相同方式导出并选择 PNG-8 或其他支持二次载入颜色表的格式进行导出:
由此,运营人就获得了两个完全基于相同颜色表生成的动态图与静态图文件,确保 100% 的无色差衔接。但 256 色本身的色彩局限性,就意味着其显色的丰富性不足,因此计育韬老师认为它并非是解决 GIF 色差问题的上上策。
方案二:视觉设计过渡
计育韬老师在这里举例他与喜茶团队的合作案例《终于,阿喜冰箱贴被文旅局“盯”上了》,其开篇动态就涉及了色差修正需求:
这里为了确保开场动态效果及其背景色与后续内容的完全衔接,并保持静态图色彩的自由广度,计育韬老师采用了蒙版(MASK)过渡的方式对画面进行分层:
同理,这种解决方案在诸多奢侈品牌公众号内也被广泛应用:
可见“分层”是非常重要的 GIF 动态优化思路,包括在一些非对照色差(GIF 自身显色问题严重)情况下也同样体现其价值。以 Burberry 的《雪上飞鸢,尽游新愿》为例,以下这个画面涉及了动态图(背景)、静态文案(中景)、动态提示符(前景)三大要素:
正如《⏰适合新品/新店介绍的SVG模版⏰》中的解析,三层叠加是相对最讨巧的动态布局思路。试想如果以上画面完全采用 1 个 GIF 呈现,那么清晰度和显色度都会大打折扣。
综上,计育韬老师认为公众号图文内 GIF 色差衔接问题的核心解决方案更应侧重设计思路的变通。当然如果你对色彩理论本身尚有知识漏洞,也可以阅读计育韬老师的新媒体理论专著《硬核运营:新媒体技术流养成》进一步开展学习。
-END-