The Verge本周的周末消遣栏目里提到了一款叫Musical Spirograph的浏览器工具:转动几个虚拟齿轮,画出经典的螺旋曲线,曲线扫过一圈圈同心的“触发环”就会发出对应的音符。原文用不到两百字讲完这件事,除了一张截图几乎没有别的信息。

但只看这两百字,你不会知道这个玩具背后有一套相当讲究的几何—音乐映射算法,也不会想到一个和“免费网页小工具”这个身份相悖的细节:谁都能点开玩,但没人能拿到它的代码。

这不是随手写的Canvas demo

Musical Spirograph是独立开发者Tim Holman旗下Musical Toys系列的第07号实验。它支持最多三条旋转臂同时画图,内置Classic、Flower、Star、Orbit、Lotus、Spiral六种预设图案,外加六种音阶、六种合成器音色和三档节奏量化可选——参数密度已经不是一个消遣类demo该有的样子,更像是一件设计过的乐器。

音符从哪来?系统检测绘图点是否穿越了预设的同心触发环,穿越瞬间按位置换算成对应音高,再交给合成器发声。真正决定音乐是否“跟得上拍子”的,是背后的调度方式:整套系统靠Tone.js的Transport时钟排布节拍,而不是依赖浏览器的动画帧刷新(requestAnimationFrame)。这个选择不是技术洁癖——动画帧的刷新间隔本身就不稳定,用它来卡音乐节拍,早晚会听出鼓点漂移。

螺旋涂鸦如何变成音乐 几何运动 多臂旋转 画出曲线 环形触发 曲线穿越 同心触发环 音阶映射 触发位置 换算成音高 Tone.js调度 Transport时钟 卡准节拍 发声 六种 合成音色 不用requestAnimationFrame计时:动画帧刷新间隔不稳定,卡不住音乐节拍

免费体验,不等于代码开放

这才是这件小事真正反常的地方。整个Musical Toys网站的技术栈是Preact + Tone.js + Hugo + Netlify——一套典型的、创意编程圈子里常见的开放式配置。Tone.js本身就是开源项目,很多人也确实靠它自己复刻类似的几何生成音乐效果。

按照这类“网页小玩具”的行业惯例,代码要么直接挂在GitHub上,要么至少在页面留个仓库链接方便别人学习。但检索没有找到Musical Spirograph或整个Musical Toys网站公开的代码仓库,Tim Holman本人的GitHub主页倒是活跃,只是这款工具没链过去。更明确的一点是,网站的服务条款把源码和功能描述写成受保护内容,只授权个人非商业访问,不是开源许可。

免费可以玩,代码从来不是免费的。
  • 提醒.目前只能确认“未公开索引到仓库”和“条款非开源”,不能排除私有仓库或未来开放的可能,结论建立在现有检索结果上,留有余地。
直觉 vs 条款 创意编程圈的默认想象 免费试玩 → 随手能抄 网页小玩具 → 常见开源 用了Tone.js → 生态默认开放 GitHub主页活跃 → 应该能查到仓库 Musical Spirograph的实际条款 源码列为受保护内容 仅授权个人非商业访问 页面未提供仓库链接 未见公开索引的代码库

放进生成音乐的谱系里,它算哪一类

几何驱动声音,只是生成艺术里的一条老路。多数“可视化音乐”项目走的是反方向——音乐驱动画面变化,比如常见的雪花形态可视化工具是听着音频波形去生成图案。Musical Spirograph反过来,先有几何运动,再有声音结果,创作者定规则、参数空间,音乐是规则和用户交互共同长出来的东西,不是逐音符写出来的。

这类项目通常定位成探索性的“玩具”而不是严肃作曲工具,The Verge这篇报道本身也印证了这一点——除了给个链接、说声“挺好玩”,几乎没有再往下挖。检索里能查到一些关于创作者“边做边学”之类的说法,但这些多半是搜索引擎自身的转述,没有一手采访或官方声明佐证,可信度打个问号,设计动机到底是什么,目前还看不清。

对想学几何—音乐映射的创意编程爱好者来说,这意味着能玩、能听、能拆解思路,但拿不到现成代码,想复刻只能照着Tone.js自己重写一遍。对Musical Toys这类小型独立项目而言,“免费体验但闭源”未必是疏忽,更像是一种有意的版权和访问控制选择——这种选择在同系列的其他实验里是否延续,值得后续再看一眼。