换台手机就不是那张画了？生成艺术的响应式布局与确定性边界

生成艺术没有“那张图”——有的是一段代码和一块画布。同一枚作品在手机和显示器上长什么样，取决于一件容易被忽视的事：代码怎么处理你给它的那块窗口。fxhash 官方的响应式指引把这件事讲得很具体，也顺带解释了一个常见困惑：为什么同一枚生成艺术在不同设备上构图可能不同。本文依据 docs.fxhash.xyz 的 Responsive Browser Projects 页整理。

官方把项目分成两类。一类以浏览器窗口为画布，画面永远铺满视口——这类作品的输出天然跟着设备走，换设备就换构图。另一类更常见：固定宽高比的画面，官方对它的标准是三条：任何视口里完整居中、不被裁切；不拉伸变形；随窗口缩放。实现建议用 CSS 完成：去掉 body 默认外边距，用一个 100vh 乘 100vw 的 flex 容器把 canvas 摆正中，画布自身设最大宽高约束。要点是把“显示缩放”交给浏览器排版引擎，而不是在脚本里改画布尺寸——后者会直接改变绘图坐标系，让同样的随机数落到不同像素上。

为什么强调这个？创作规范里有前提：作品内容由固定随机种子决定。种子固定而窗口可变时，保证“同一枚代币在任何设备上是同一件作品”的责任就落在布局代码上。一个画布尺寸依赖窗口高度的脚本，在手机上的输出和桌面截图不是同一张画——严格说，它已经不能自称确定性输出。

这类知识还有一个收藏语境外的用处：解释“截图考古”的可信度。老项目的历史截图往往来自当年某块特定屏幕，作者或社区在社交媒体上转发的图，可能出自一个今天已经买不到的显示器比例。当你拿着某张“标准图”与现场画面比对并感到不符时，先量一下双方画面的宽高比——多数构图差异其实是视口差异，而不是版本差异。真正的版本差异有另一副面孔：颜色体系变化、元素增减、字体缺失，这些与窗口尺寸无关，出现了才值得往代码与环境兼容的方向查。分诊清楚这两类“不一样”，能避免大量错误的怀旧判断。

最后给内容平台与个人博客一个工程侧结论：把生成艺术嵌进文章时，iframe 高度与宽度就是你的展陈设计。给一个三百像素高的窄容器，铺满视口类作品会被压缩成邮票；给一个不定高容器，等比类作品可能在加载瞬间塌陷或跳动。稳妥做法是给容器写死一个合理宽高比的框，让作品在框内自行适配——这与博物馆给不同画框配不同墙面是同一门手艺。理解了响应式规范这一层，你不会再把“嵌进来不好看”归咎于作品本身，因为那多半是你的墙挂错了。

反过来，固定视口类作品也自有一份好处：输出尺寸可预期，印刷、装裱、出版时按声明比例取图即可，不需要为每种媒介重新构图。规范文档没有说哪种选择更好，它只要求每一种都被诚实实现——铺满就真铺满，固定就真固定。判断一件生成艺术在工程上是否认真，看它对自家类别的三条硬指标守得齐不齐，比看任何宣传图都准。

对收藏与展示端，这组知识对应三条常识：作品页截图来自哪块虚拟视口，决定了你看到的构图，别人手机上的版本可能裁得更紧；把官方 iframe 或 generator 地址嵌进自己的网站时，容器尺寸会传进去，嵌图走样先查容器而不是怀疑作品版本；看到两版构图差异先别下“假图”结论，让对方把窗口拉到同一尺寸重开一次，多半是布局问题而不是真伪问题。代码不变、种子不变、容器变化输出就变化的项目，等于把作品视觉锁定交给了所有浏览器的排版行为——这个依赖关系本身就值得记录进尽调笔记。本文为机制说明，不构成任何投资建议。