计育韬:公众号图文内GIF色差衔接问题解决方案

用户头像
上海/平面设计师/1年前/18浏览
计育韬:公众号图文内GIF色差衔接问题解决方案
在此前一期《
新媒体(公众号)端GIF动态图压缩对抗与优化的核心方法
》中,计育韬老师为广大运营人全面解析了 GIF 图的优化策略,但众所周知:GIF 作为一种图像格式本身,
只具备 256 种颜色渲染上限,但 PNG/JPEG 格式广域可达 16777216 色。
这样的客观文件特性决定了 GIF 天然存在与静态图之间的色差。
所以,出现色差情况后首先不应过度紧张甚至苛责设计能力——这是一种近乎必然的合理现象。
而运营人应当积极寻求的解决方案,在计育韬老师看来就对应包含了两大路径:1) 从色彩数着手,统一动态图与静态图的颜色;2)从设计着手,让切片实现合理的过渡和优化。
方案一:颜色表锁定
在 GIF 的导出流程中,一般设计师会选择通过 PS,将视频的 MOV 格式或 PS 自身制作形成的动态转化为 GIF 格式。而在导出面板中,请留意 PS 分配给你的初始 256 颜色表(如颜色数有限,也可能小于 256 色):
计育韬:公众号图文内GIF色差衔接问题解决方案(图ZMTUwOTg2ODA=) - 教程 - 站酷设计师JZCreative原创素材 - 站酷ZCOOL
收藏
如果你对这个显色方案基本满意,那么先请导出此刻的颜色表,会对应获得一个 ACT 颜色表文件:
计育韬:公众号图文内GIF色差衔接问题解决方案(图ZMTUwOTg2ODQ=) - 教程 - 站酷设计师JZCreative原创素材 - 站酷ZCOOL
收藏
计育韬:公众号图文内GIF色差衔接问题解决方案(图ZMTUwOTg2ODg=) - 教程 - 站酷设计师JZCreative原创素材 - 站酷ZCOOL
收藏
请基于此颜色表先导出 GIF 图像本身。随后在制作与之衔接的静态图时,以相同方式导出并选择 PNG-8 或其他支持二次载入颜色表的格式进行导出:
计育韬:公众号图文内GIF色差衔接问题解决方案(图ZMTUwOTg2OTI=) - 教程 - 站酷设计师JZCreative原创素材 - 站酷ZCOOL
收藏
由此,运营人就获得了两个完全基于相同颜色表生成的动态图与静态图文件,确保 100% 的无色差衔接。但 256 色本身的色彩局限性,就意味着其显色的丰富性不足,因此计育韬老师认为它并非是解决 GIF 色差问题的上上策。
方案二:视觉设计过渡
计育韬老师在这里举例他与喜茶团队的合作案例《
终于,阿喜冰箱贴被文旅局“盯”上了🤩
》,其开篇动态就涉及了色差修正需求:
计育韬:公众号图文内GIF色差衔接问题解决方案(图ZMTUwOTg2OTY=) - 教程 - 站酷设计师JZCreative原创素材 - 站酷ZCOOL
收藏
这里为了确保开场动态效果及其背景色与后续内容的完全衔接,并保持静态图色彩的自由广度,计育韬老师采用了蒙版(MASK)过渡的方式对画面进行分层:
计育韬:公众号图文内GIF色差衔接问题解决方案(图ZMTUwOTg3MDA=) - 教程 - 站酷设计师JZCreative原创素材 - 站酷ZCOOL
收藏
同理,这种解决方案在诸多奢侈品牌公众号内也被广泛应用:
计育韬:公众号图文内GIF色差衔接问题解决方案(图ZMTUwOTg3MDQ=) - 教程 - 站酷设计师JZCreative原创素材 - 站酷ZCOOL
收藏
可见“分层”是非常重要的 GIF 动态优化思路,包括在一些非对照色差(GIF 自身显色问题严重)情况下也同样体现其价值。以 Burberry 的《
雪上飞鸢,尽游新愿
》为例,以下这个画面涉及了动态图(背景)、静态文案(中景)、动态提示符(前景)三大要素:
计育韬:公众号图文内GIF色差衔接问题解决方案(图ZMTUwOTg3MDg=) - 教程 - 站酷设计师JZCreative原创素材 - 站酷ZCOOL
收藏
正如《
⏰适合新品/新店介绍的SVG模版⏰
》中的解析,三层叠加是相对最讨巧的动态布局思路。试想如果以上画面完全采用 1 个 GIF 呈现,那么清晰度和显色度都会大打折扣。
综上,计育韬老师认为公众号图文内 GIF 色差衔接问题的核心解决方案更应侧重设计思路的变通。当然如果你对色彩理论本身尚有知识漏洞,也可以阅读计育韬老师的新媒体理论专著《硬核运营:新媒体技术流养成》进一步开展学习。
-END-
0
阅读原文
|
举报
|
收藏
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
科技医疗透明柜UI界面设计
UI通用设计素材1
高级表盘系列UI源文件
【新年UI图标】礼物/活动icon
3D渐变流体抽象矢量UI背景图
【新年UI图标】钱包icon
新能源APP应用UIKit
盲盒APP UI设计
APP/小程序商业项目UI模板|99个高保真UI+79个原型
新拟态风格 UI设计组件库
UI 登录界面设计模板包
UI界面 组件
【新年UI图标】会员icon
3D卡通UI界面图标可爱插画免扣素
【新年UI图标】旅行icon
【新年UI图标】秒杀icon
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
户外旅行飞机情侣假日出行
钱包ui模板
【新年UI图标】体育icon
我的钱包-UI界面设计-app
智能家居中心 简约 UI设计组件库
【新年UI图标】30个图标
拟物风质感写实UI卡片合集源文件
你可能喜欢
相关收藏夹
大家都在看
登录注册