跳到主要内容
所有灯都在同步呼吸的那张灯塔地图

所有灯都在同步呼吸的那张灯塔地图

阿舟
阿舟

· 阅读约 5 分钟

凌晨一点多,我在 mapped.earth 的 /lighthouses/world 上,从 Scotland 那个入口点进去,盯着一盏灯看了三轮。

闪两下,停,隔一会儿再闪两下。间隔不匀。第一反应是缓动没调好,第三轮才反应过来——那不是抖动,那是周期。旁边那盏节奏不一样,再旁边那盏又不一样。

关掉页面,心里不太舒服。不是被美到,是被戳到。

去年我也动过这个念头。我跟那阵子的工具说,做一个世界灯塔地图,点位从一张能下载到的表里来。它做得很快:深色底,海面一层细噪点,几千个发光点贴着海岸线铺开,缩到城市级别还挺稳。我看了十分钟,觉得挺好。

第十一分钟出问题:所有灯以同一个 1.5 秒周期,一起亮,一起暗。

画外音:整齐得像合唱团。海上的灯从来不合唱。

我当时的记录长这样:

{ "name": "…", "lat": 58.12, "lng": -6.26 }

三个字段,够画一个点,够做一次 hover,够在弹窗里显示一个名字。我当时甚至觉得这挺干净。现在回头看,那叫干净得可疑。

海图上给一盏灯建档,不是这么建的。至少要写清楚灯质:几闪、什么颜色、一轮多少秒。

{
  "name": "…",
  "character": "Fl(2) W 10s",
  "range_nm": 18,
  "elevation_m": 37,
  "sector": [210, 95]
}

Fl(2) W 10s,两闪、白、十秒一轮。这串东西不是备注,它是这盏灯身份的一部分。海上认灯,位置只负责把候选缩到三五座,最后靠节奏认人——同一段海岸上相邻两盏都在闪,你分不清谁是谁,除非一个十秒一轮、一个十五秒一轮。

所以那个页面干的不是“地图加了个动画”。它把每条记录里本来就有、而我的版本里压根不存在的那一段,还回了视觉上。

我一开始想据此下个结论:这种东西 AI 做不出来。写到这儿我改主意了,这个判断是错的。

动画那部分 agent 完全写得出来——给它周期字段,让它按 character 解析出明暗时间轴,再套个 requestAnimationFrame 循环,这活它干得比我省事。它做不出来的是“知道周期这件事重要”。而这个不知道,是我的,不是它的。我不知道有 character 这个字段,就提不出“缺失就留空,不许估”这种要求。我提不出,它就替我编了一个——一个统一的 1.5 秒,好看,匀称,全是假的。

反直觉的地方在这儿:真实数据的视觉呈现,往往比假数据难看。真实的灯,有的两秒一闪,有的十五秒才转完一轮,切进这个页面的第一分钟,我确实怀疑过动画是不是坏了。整齐是安全的美学,参差是要挨骂的美学。你要是按“看起来对不对”去审,会把对的改成错的。

这种项目到底审美先行还是数据先行,我到现在也没完全想清楚。可能顺序是反的:先有人愿意为一个用户永远看不见的字段较真,然后才有那个页面的手感。反过来不成立——先有一个漂亮的地图,再往里塞数据,塞进去的通常就是那种三字段的记录。

顺便说那六个地区入口:Scotland、Brittany、New England、Japan、Norway、Cape Town。

这六个名字不是“全球热门城市”的选法。没有中国,没有澳洲,没有“Top 10 灯塔打卡地”。这是一条条海岸线,是几个真有灯史、真有人守着数过周期的地方。做这个页面的人不是先有了一张世界地图再找内容填,是先知道了这些海岸,才需要一张地图。这个顺序骗不了人。

还有一点我挺在意:整个页面没有一篇长文说明,信息全压在地图和动画里。克制是克制,代价是新来的人第一眼不知道自己在看什么——比如我,差点以为动画坏了。但他还是这么做了。我猜是因为任何一段说明文字,都会把“看灯闪”这件事降级成“读介绍”。

版权行是 © 2026,署名 Aaron J. Becker。一个人名,一个年份。现在这类页面的背后通常是一个内容团队、一张路线图、一个增长指标;这个背后是一个人,和一堆他从海图里抠出来的周期。

扯远了,回正题。

我不打算把这个页面吹成什么范本。它就是个地图,交互控件只有 + 和 −,连图层开关都没有。但它让我把一条以前模模糊糊的感觉说清楚了:视觉层的成本已经归零。任何一个 agent 半小时能给你一张带发光点的世界地图,朋友圈能收三十个赞——所以它不再说明任何事。现在判断一个可视化项目好不好,我只看一个问题:它有没有某个字段,是你必须去查资料、并且查错了会被懂行的人当场抓出来的。

有,就是项目。没有,就是壁纸。

那次不算缴智商税,没花钱,只花了十分钟的自我感觉良好。但教训是实打实的:我的错不在用了工具,在我不知道自己要什么。

这条听着像废话,落到具体动作上是有区别的。以前我审 AI 的产出,看它有没有写错;现在我多看一眼它有没有在我没给的地方,替我补了一个默认值。补默认值本身没错,错的是补完不吭声。海图上那个 1.5 秒,就是它补完不吭声。

以后凡是页面上会动的东西,动的那一下必须能在数据里找到对应的字段。找不到,就让它静止。静止好歹是诚实的。

阿舟
阿舟

写代码写到一半开始怀疑人生,靠 AI 工具续命,顺手把踩过的坑都记下来。

查看主页 →