Natural Stupidity

播客漫游日 Homebrew 技术小揭秘

技术方案总体分成3块:

  1. LED屏幕:接收数据,完成个性化效果的展示
  2. NFC 接触式互动:接收用户的指令和数据,操作LED屏幕的展示
  3. 屏幕印章:读取实体印章信息,匹配印章数据与虚拟物品

LED 互动屏幕

先感谢热心即友拍的现场视频!点击链接可以看到效果 里程碑:

航行日志:(虽然一整天都排着大长队,但是似乎所有人都忘了拍视频…)

image

现场的多个大屏由上百个 LED 屏幕模块拼接而成:

  1. 10 个分散的meetup 屏幕组合:每个点位由 3 块 1:1 的无缝 LED 屏环绕拼接为 U 型
  2. 1 个里程碑屏幕组合:由左、中、右分别是 1:3、3:3、1:3 的 LED 屏环绕拼接为 U 型
  3. 1 个航行日志屏幕组合:由 7 块比例 1:1/1:2/2:2 的 LED 屏幕平面拼接

所有的现场用户都能使用不同的方式与屏幕装置互动,且都有事件驱动的动画效果,屏幕展示的内容由用户的数据动态决定。现场的屏幕装置数量又多又分散,策划前期我们很天真的希望能汇集到一个总控制中心来渲染显示内容,分发给多个 LED 显示。咨询了多家 LED 技术支持企业,获得了以下一些回复:

后来经过朋友推荐联系到一家海南的企业做整包的解决方案。他们的解决思路是用 GPU 集群实时渲染拼接视频流,现场不同的 LED 控制台通过互联网拉流进行画面输出。虽然我们对延迟并不敏感,但出于对场地 5G 网络的总带宽上限(漫游者们会占用基站资源)和预算不足(简直是天价)的考虑,最终还是放弃了。

怎么办呢,需求都接了,只能拿出 Homebrew 大法。

前端是我们老本行,这些动画效果全都仰仗 V8 帮我们搞定,浏览器去渲染各自的网页,LED 映射网页就行了。按道理来说,如果同一个装置的 7 块屏幕所要展示的画面内容各自独立,他就需要 7 个视频源用于渲染输出,7 个屏幕就要 7 个电脑……所幸供应商大哥给我搞到了一款LED控台,能手动矩形分割输出的一整块画面为多个,代价就是这个控台体积巨大,现场工程师1个像素1个像素的去手动调整画面分割。

所以现场的每个 LED 装置后面都放着一台 macbook,浏览器勤勤恳恳地拉取数据渲染动画到 LED 上。

我们能找到的供应商可以一次性租赁几十台 macbook 的,都拿不出 m 芯片的存货(B 端客户真·低人一等),所有的网页都只能运行在 19年甚至 17年的 MBP 上。谁都没想到我们还要给 LED 大屏幕搞性能优化以保证上面的动画都能流畅运行。多亏了我们 @leihan 总师,让各种全屏3D翻转、大范围高斯模糊动画都能在 5 年前的电脑上不掉帧。

NFC 接触式互动

两位漫游者正在通过装置交换贴纸

其实没有用到 iOS18 苹果开放的新 NFC API,甚至也没有定制设备(比如支付宝碰一碰付款这种),是每个 NFC 装置背后藏着一台 Android 手机……

由于 iPhone 其实很早就支持通过 NFC “发送”一段命令给别的设备(只能在 App 内调用),我们“接收” 端的NFC 设备都使用 Android,由它来识别这段命令,获取所需的数据,然后操作 LED 屏幕或实体装置动作。

直接用 Android 手机来当 NFC 设备,是因为确实没有足够的时间让工厂给我们定做一批支付宝碰一碰这种专用 NFC 嵌入式设备,而且体量太小没有供应商愿意给我们单独做十几台。代价就是这种 Homebrew NFC 设备容易被 Android 系统级的 NFC 逻辑覆盖,接收到的数据可能会触发系统进入被动 NFC 模式,导致我们的 App 接收不到数据直接进 Background 了。真的辛苦我们每个互动点位的志愿者,一整天都站在设备旁手把手协助漫游者们碰一碰。

起初考虑到稳定性,设计上是准备使用有线在 NFC 设备和 LED 屏幕之间传输数据(甚至实现了一版实验方案)。但是由于一些监管要求,以及考虑到本身这些数据还需要在线实时查询、采用无线的单体设备现场布线会方便一些等等,最终还是没用有线来传递命令。好在单个设备交互发送的数据量不大,户外 5G 的带宽和延迟对体验的影响其实并不明显。

屏幕印章

现场来的漫游者朋友帮忙拍的盖章全程:小红书视频

市面上有很多成熟的技术服务商提供从硬件到 SDK 的实现方案,本质上都是利用智能手机的屏幕多点触控功能,通过印章的凸起部分接触屏幕后获取点位分布坐标来区分不同的印章。但是在实际使用中我们还是发现了一些问题:

  1. 如果印章数量比较多,5个接触点的排布需要一些构思。且由于实际使用中有误差,算法除了需要满足平移、旋转和缩放不变性以外,容错度和精确度需要找到一个微妙的平衡;
  2. 有些用户的手机屏幕上有贴膜,如果贴膜上有气泡,将会影响触摸信息的采集;
  3. 当天下雨了,屏幕上的水渍也影响触摸信息的采集;
  4. 有部分小众的手机厂商,最多仅支持 3 个点的多点触控。

关于多边形相似度算法,3/4/5 个顶点的凸多边形,用 Hu 矩还算是可靠的,但是推广到凹多边形时,Hu 矩在判断旋转相似时精度低的离谱。纯粹的数学解法应该是构造仿射变换的矩阵,通过 SVD 去判断是否符合几何学的相似,但是这种方式又很难通过参数引入我们实际使用中的合理误差。所以这明明看起来是一个数学问题,但是却没有一个大家公认的能够符合工程学的解。

一些遗憾

扭蛋机在最初是准备做成 NFC 互动的,由于扭蛋机是工厂整包定制的,主控芯片的引脚定义我们找不到任何的文档或工程师交接,好在功能比较简单,拿万用表一顿测之后倒是能搞明白个七七八八。但为了配合活动使用(活动里有一个参与条件必须要人工验证),而且场地维保人力有限,最终只能放弃了 NFC 集成。

由于当天可能下雨(也确实下雨了),只能用户外防水 LED 屏幕,而长三角地区能够调货的户外 LED 最高只有 P2 屏,尺寸大的屏幕效果差异倒是不十分明显,小尺寸 LED 屏幕的颗粒感就会比较严重,比如 meetup 的屏幕拍照效果:

MEETUP 实地效果