像素画读取失败。请刷新页面,或检查 assets/logo-mark.png。
THE MARK 源图 B · 裁去空白边距 · 未重绘
LOADING / 读取网格
01 / SOURCE
从一张图开始,不从一句描述开始。
先有格子,
才有形状。
PIXEL STUDIO 把图像理解为一组可被逐个指认的单位。我们不把像素当作滤镜,而把它当作结构:每个方块都有坐标、颜色和归处。
这件主视觉来自一张已经完成的方块像素画。网站读取它的真实像素,提取出 378 个方块,再用同一份数据完成解构与归位。最终画面不是重新生成的近似图,而是从源图反遮罩得到的透明母版。
源图 B 为 1672 × 941 JPEG,无原始 Alpha。透明通道由白底反遮罩重建;这一限制已在验收报告中记录。
- 方块
- 378
- 横向节距
- 20.170px
- 横向缝隙
- 3.670px
- 展示尺寸
- 824×928
- 近似替换
- 0
02 / SIX STUDIES
概念习作 · 非真实客户案例 · 全部可替换
六次关于方块的练习。
03 / METHOD
不是特效,
是归位。
一次动画只做一件事:让方块从分散回到唯一正确的坐标。所有扰动都是临时的,目标永远不动。
-
A
读取
从文件 B 的真实像素提取 378 个方块,保留每块的中心、颜色与缝隙。没有随机生成的替代网格。
-
B
编排
苏醒、汇聚、轮廓、重组、归位。轮廓格先到,内部格后到;每一块都有固定的结束坐标。
-
C
守住
暂停冻结当前帧,恢复从原位继续。交互只改变临时偏移;目标、颜色、形状和透明缝隙不参与扰动。
GRID RESPONSE
08 × 08 / 局部扰动
移动指针或轻触
离开即归位
TARGET LOCKED
OFFSET ONLY
0 MUTATIONS
RENDERCANVAS 2D
LOOPONE rAF
TARGETS378 FIXED
PAUSETIME FROZEN
REDUCED MOTIONSTATIC FIRST
04 / OPEN CALL
让下一张图,
从一格开始。
如果你也在做一件需要被逐格看见的作品,我们可以从一张图、一个网格、一次归位开始。
概念演示站点。未填写真实联系方式,不伪造提交或成功反馈。