HDRimg,30秒一键生成亮瞎眼的HDR表情包。

boyanx2周前技术教程4
这篇文章,写的我眼睛疼,真的。。。
上周末,一个离谱的表情包,在我的微信群里刷屏了。
我相信你们肯定见过了。
真的,这表情包只要一在群里出现,就绝对成了所有iPhone和Mac用户眼中,最亮眼的存在,这个亮眼,真的是物理级别的亮眼。
不过安卓用户其实看不太到这样的亮瞎眼效果,这个背后的原因,其实是HDR和微信的兼容问题。
差评X.PIN上周五的科普文章写的已经非常详细了,推荐去可以去看看: iPhone用户被表情包闪瞎,这事得赖微信。。
我大概用非常简短的话解释总结一下:

我们现在用的很多图片和视频,其实默认都是SDR格式。它有点像老电视,不管你拍得多好,它都只能给你显示一个平均水平的画面。

亮的地方不会太亮,暗的地方也不会太暗,一切都被压成了差不多的亮度,细节也被吃掉了。

HDR就不一样,HDR是新一代的显示标准。它能让亮的地方真的亮起来,比如阳光、灯光、高光反光,在屏幕上真的就像现实一样在发光的那种亮。而暗的地方也不会糊成一团黑,而是能看到阴影里的细节,比如一张脸上的毛孔、一个角落里的褶皱。

而这次这个青蛙表情包,之所以能发光,其实全靠微信程序员一个小小的疏忽。

设备能不能显示HDR,看它有没有高亮度、广色域、10bit色深的屏幕。
图片能不能触发HDR效果,关键看它有没有 告诉设备“我是HDR”

那告诉的这部分,就靠 ICC颜色配置文件

微信在处理大部分图片时,会自动把颜色配置文件(ICC)剥掉,这就使得咱们平时通过微信发送的图片,丢失了很多关键信息。

但表情包,它忘了动刀。。。

结果就是,在表情包上,HDR的ICC配置文件被原封不动保留下来,iPhone一看:哦,这是HDR图啊?那我得给你上上强度,HDR亮度整上。

于是,在支持HDR的苹果设备上,这张小小的表情包,就成了整个聊天框里,最炫目的一束光,对,物理意义上的一束光。

不过,HDR表情包,这事其实不过国内第一个发现的,一个月前,在国外的通讯工具Slack上,就爆了把大的。
最下面的那个青蛙,是不是很熟悉?对,这就是这波的主角。
而且甚至他们不仅搞了表情包,甚至还有老哥,把头像也换成了HDR图片,这真的太艹了。。。
我也顺藤摸瓜,找到了一篇国外老哥写的,怎么做HDR表情的博客。
而且,还在帖子里,直接附上了自己的脚本。
不过这个脚本门槛还是稍微有一点点高,也有点奇怪,但整体思路是一致的,本来我就想,自己搓一个程序,能批量把各种表情包变成HDR的。那现在一切就绪,说干就干。
把一张普通图转成闪光的HDR图片,其实不难。
核心是给图片调整部分数值,再植入一个带HDR的ICC文件。
最关键的其实是这个ICC文件,你当然可以,直接去网上搜一个ICC文件植入进去,比如这个萤光青蛙的ICC配置文件,就是Rec.ITU-R BT.2100P。
但是我是个懒逼,既然你萤光娃里都有了,我还下个啥,直接把你荧光娃当母体就行= =。
于是我直接让4o,先写了一段非常简单的程序测试一下。
Prompt是这样的:

在本地运行测试,方法很简单, 打开IDE产品,Cursor或者Trae,随便找个文件夹,新建文本文件,粘贴刚刚写的代码,双击运行就可以。

当然你完全可以直接用Cursor或者Trae直接写,我是最近太喜欢用4o了,干啥都是本能反应打开4o直接开干了。。。
跑了一下,发现一把成功。

代码里的图片文件要根据情况修改,比如我这里是黄色小胸.jpeg。运行一下代码,成功处理图片,肉眼可见右边亮了很多。

不过我其实,还是想把这玩意,给大家也一起用的,所以,需要一个网站,能让大家有手就行就能直接转换。
于是,我就打开了Cursor,发了一段Prompt和刚才4o写的代码:
写一个Python程序,功能是把表情包图片转换为HDR格式,从参考图像"fluorescent_frog.png"中提取ICC配置文件,并添加到表情包图片里,最后保存为带"hdr”后缀的PNG文件,以网页形式提供服务,使用tailwindcss,模仿卡片的设计。【再加上刚才4o生成的Python代码】
很快,一个版本就出来,不过各种UI细节还有点奇怪,我就跟他又对话调了调细节之类的。
甚至,为了它更好看点,我还去用即梦画了个logo。。。
名字是瞎取的,HDRimg,就非常的直白且庸俗。
于是,这么一个把普通图片转HDR图片的小工具,就搓出来了。
感觉确实能当一个小小的产品,于是,我又部署到了线上,花了85块钱,买了个域名。。。
网址在此:hdrimg.com,免费给大家玩。
支持JPG、PNG格式,最多支持20张图,只需要把图片全部上传上去,你就能批量处理成HDR图片文件。
图片传上去以后,只需要等待几秒钟。
一群闪瞎狗眼的表情包,就出来了,不过,这里跟手机是一样的,你得是Mac才能看到荧光效果,Windows电脑也能转换,但是大概率在电脑屏幕上显示是有问题的。
而且说实话,大半夜的看这玩意,还真挺吓人的。。。
我们有了图片之后,正常下载,然后把图片,想办法弄到手机里。
Mac和iPhone可以直接隔空投送,或者也可以把图片变成压缩包通过微信传到手机上,网盘也行,U盘也行,就是别直接通过微信发图片,因为ICC会被干掉。
同时,原图尽量小一些,最好不要超过400x400的尺寸。
到了手机以后,你就可以,直接在微信里,添加表情包。
给你们看下效果。
就。。。真的很萤光。。。
最后再说一句,安卓和Windows大概率看不到萤光的效果,只有iPhone和mac才可以,至于为啥安卓不行,请看差评X.PIN的原文解释:
苹果的大一统,还是有大一统的好,安卓阵营,还是太分裂了。
这个HDR图片的方式,其实不止是用在微信表情包里。
还有人,用在了网站上,作为一种超级特殊的强调色。
比如,给二维码强调。
等等。
很有意思,很好玩,虽然好像说,是有点影响用户体验。
但,它的亮,是真实的,它的骚,也是精准的。

别让这些有趣的小Bug,被无聊的规范和所谓的正确抹平了。

有这些亮瞎眼的光在。

那这个世界。

它就还没有无趣到让人绝望。

相关文章

Vue书组件设计与实现详解

在 Vue 中,书组件通常用于展示书籍信息(如标题、作者、封面、简介等)。以下是一个详细的组件设计与实现示例,包含关键代码和注释。1. 基础书组件结构创建一个可复用的书籍展示组件,包含基本属性和样式。...

大厂都在用的10个css高级技巧,我敢说你最多用过3个!不服来辩!

1. clamp()函数:流体布局神器应用场景:苹果官网响应式字号、淘宝商品卡片宽度自适应。代码案例 :<style> .clamp-text { font-size: clamp(1...

2025年vue前端框架前瞻

Vue 是一个轻量且灵活的 JavaScript 框架,广受开发者喜爱,因其简单易用的 API 和组件化的开发方式而闻名。Vite 是一个现代化的前端构建工具,以其极快的开发服务器启动速度和热模块替换...

CSS 架构方法论实战:从 BEM 到原子设计,彻底解决样式混乱难题

CSS 架构方法论实战:从 BEM 到原子设计,彻底解决样式混乱难题为什么大型项目需要 CSS 架构?当代码量突破千行,你是否遇到过这些困境:样式规则重复定义,!important随处可见选择器层级深...

Gemini把截图转html,草图直接变游戏,这波操作太赞了!

Gemini 2.5 Pro模型更新,在Arena竞技场排名第一,是目前唯一得分冲到1400分以上的大模型:他们宣称,此模型有了更好的编程表现:对此我非常感兴趣,从5月6日发布到现在,每天都在测试。今...

Kik的商业模式在哪里?除了虚拟货币、HTML5浏览器,今天它也推出了公共号

跟微信、Line、Whatsapp 等应用不一样,Kik 在功能延伸上定位在了浏览器上,尤其方便用户在各个网站上搜索热图、受欢迎的视频、游戏等,这些内容消费很容易和聊天场景结合起来。不过,这个成立于...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。