漫画创作的色彩科学

之前在嵌字的时候就注意到过一个问题: LabelPlus (在 PS 里导入翻译好的文本的工具) 会让 只有灰度通道 的 png 图片在 PS 内显示得 比在图片查看器里看起来更淡. 这个大概率是伽马的问题. 如果你不知道什么是 gamma, 可以看看这个 B 站视频:

https://www.bilibili.com/video/BV19A4m1F7zw/

视频备份: https://akiusagi.cc/gamma.mp4

而 Windows 照片查看器 和 macOS预览 在打开只带灰度通道的png时, 使用的亮度映射曲线正是 gamma 2.2 . 然而, LabelPlus 导入 png 图片的逻辑, 其实是先创建了一个 没有色彩配置文件 的 psd 项目, 然后再暴力将所导入的 png 文件的灰度值复制给 RGB 通道. 这样一来, 原始的灰度信息没有经过反 γ 变换, 直接就显示在了屏幕上.

img

观察上面那个视频的 γ 曲线图, 你应该就能明白为什么图片会变淡.

解决办法其实也很简单, 照常嵌字即可, 最后发布前,

img

img

只需将所有 psd 再转换回灰度通道, 手动指定 gamma 2.2 色彩配置文件, 导出为 png, 即可得到正确的亮度.

接下来还需要讨论全彩的情况. 老实说, 现代的显示屏你可以看作 P3 色域全覆盖. 唯一的问题是如何在观众的显示屏上也显示 P3 色域.

如果是使用浏览器看漫画, 那么 操作系统 + 浏览器 的组合就直接决定了颜色能不能正确显示.

具体可在此处测试:

https://webkit.org/blog-files/color-gamut/

备份站: https://akiusagi.cc/wide-gamut.html

如果显示正常, 打开中间的图片时, 你应该能看到图案:

img

在我的测试中, Windows 11 + Edge, Android + vivo自带浏览器, macOS + Safari, iOS + Safari 均成功正确显示. 但, 这些操作系统, 一旦使用了第三方浏览器, 全都会显示不正确 (甚至是以兼容性著称的 Chrome). 在显示不正确的例子中, 所有图片的原 sRGB 色值都被当成了 P3 的色值来显示, 也就是过饱和. 至于现代应用能不能正常显示, 就看他们用不用系统提供的 WebView 了.

如果想追求在大多数人的设备上显示都不会过饱和, 问题就在于 不是所有设备都会去读取图片的色彩配置文件 (ICC 配置文件), 以及就算读取了 ICC 配置文件也没法调动屏幕显示正确的颜色.

假定大多数人的设备都很现代, 那么只需要在创作时使用 P3 色彩空间, 导出时 不转换为 sRGB, 就不会有问题了. 即使看图软件不读取 ICC 配置文件, 这时也不会太多地影响准确性.