scaffold-art-script

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Scaffolding Art Blocks Projects

搭建Art Blocks项目

Always Fetch the Generator Spec First

始终先获取生成器规范

Before any art script work, fetch this MCP resource:

artblocks://generator-spec

It contains the authoritative reference for:

tokenData

structure, hash-based PRNG patterns, FLEX dependency types (IPFS, Arweave, ONCHAIN, Dependency Registry), supported script types and library versions, HTML structure requirements, and

window.$features

. It also includes the step-by-step conversion guide for porting existing scripts.

在进行任何艺术脚本工作之前，请获取此MCP资源：

artblocks://generator-spec

它包含以下内容的权威参考：

tokenData

结构、基于哈希的PRNG模式、FLEX依赖项类型（IPFS、Arweave、ONCHAIN、依赖项注册表）、支持的脚本类型和库版本、HTML结构要求以及

window.$features

。它还包含移植现有脚本的分步转换指南。

Scaffolding a New Project

搭建新项目

Use

scaffold_artblocks_project

to generate a ready-to-run

index.html

+ starter art script.

使用

scaffold_artblocks_project

生成可直接运行的

index.html

+ 初始艺术脚本。

Parameters

参数

Param	Options / Notes
`scriptType`	`"js"` (vanilla), `"p5js"` , `"threejs"` — required
`dependencyVersion`	p5.js: `"1.0.0"` or `"1.9.0"` (default). Three.js: `"0.124.0"` , `"0.160.0"` , `"0.167.0"` (default). Ignored for `"js"` .
`includePostParams`	`true` — adds ONCHAIN/PostParams (PMP) stubs in `tokenData` and example usage
`includeFlexDependencies`	`true` — adds IPFS and Arweave dependency stubs with usage patterns
`includeFeatures`	`true` — adds `window.$features` trait assignment stub

Note on Three.js v0.167.0: uses ES module import maps instead of a global

<script>

tag. This affects script type detection on-chain — see the generator spec for details.

参数	选项/说明
`scriptType`	`"js"` （原生）、 `"p5js"` 、 `"threejs"` — 必填
`dependencyVersion`	p5.js： `"1.0.0"` 或 `"1.9.0"` （默认值）。Three.js： `"0.124.0"` 、 `"0.160.0"` 、 `"0.167.0"` （默认值）。对于 `"js"` 类型将被忽略。
`includePostParams`	`true` — 在 `tokenData` 中添加ONCHAIN/PostParams（PMP）存根及示例用法
`includeFlexDependencies`	`true` — 添加IPFS和Arweave依赖项存根及使用模式
`includeFeatures`	`true` — 添加 `window.$features` 特征分配存根

关于Three.js v0.167.0的说明：使用ES模块导入映射而非全局

<script>

标签。这会影响链上的脚本类型检测——详情请参阅生成器规范。

Other supported script types

其他支持的脚本类型

scaffold_artblocks_project

covers vanilla JS, p5.js, and Three.js. Art Blocks supports many more via the on-chain dependency registry: regl, Tone.js, Babylon.js, A-Frame, Paper.js, Zdog, Processing, and custom types. See

artblocks://generator-spec

for the full list and how to reference them.

scaffold_artblocks_project

支持原生JS、p5.js和Three.js。Art Blocks通过链上依赖项注册表支持更多类型：regl、Tone.js、Babylon.js、A-Frame、Paper.js、Zdog、Processing以及自定义类型。完整列表及引用方式请参阅

artblocks://generator-spec

。

Converting an Existing Script

转换现有脚本

When a user has an existing piece to convert to Art Blocks format:

Fetch
```
artblocks://generator-spec
```
— it contains a detailed step-by-step conversion guide
Use
```
scaffold_artblocks_project
```
with the matching
```
scriptType
```
to get the correct HTML shell
Walk through conversion:

Conversion checklist:

Replace
```
Math.random()
```
with hash-based PRNG derived from
```
tokenData.hash
```
Replace hardcoded canvas dimensions with
```
window.innerWidth
```
/
```
window.innerHeight
```
Ensure the initial render is deterministic from the hash alone — same hash must always produce the same initial visual output
Interactive elements (mouse, keyboard, touch) are allowed and encouraged, but must not change the initial render. Interaction should only modify the view after the artwork has loaded deterministically.
Remove any time-based variation (
```
Date.now()
```
,
```
setTimeout
```
) that affects the initial render (time-based animation after load is fine)
Extract visual traits into
```
window.$features
```
(optional but recommended for reveals) — features must be set synchronously before or during initial render
Verify determinism: reload the page with the same
```
tokenData.hash
```
and confirm identical initial output

当用户需要将现有作品转换为Art Blocks格式时：

获取
```
artblocks://generator-spec
```
— 它包含详细的分步转换指南
使用匹配
```
scriptType
```
的
```
scaffold_artblocks_project
```
获取正确的HTML框架
按以下步骤完成转换：

转换检查清单：

将
```
Math.random()
```
替换为从
```
tokenData.hash
```
派生的基于哈希的PRNG
将硬编码的画布尺寸替换为
```
window.innerWidth
```
/
```
window.innerHeight
```
确保初始渲染仅由哈希决定——相同的哈希必须始终产生相同的初始视觉输出
允许并鼓励使用交互元素（鼠标、键盘、触摸），但不得更改初始渲染。交互只能在艺术品确定性加载完成后修改视图。
移除任何影响初始渲染的基于时间的变化（
```
Date.now()
```
、
```
setTimeout
```
）（加载完成后的基于时间的动画是允许的）
将视觉特征提取到
```
window.$features
```
中（可选但推荐用于作品展示）——特征必须在初始渲染之前或期间同步设置
验证确定性：使用相同的
```
tokenData.hash
```
重新加载页面，确认初始输出完全一致

When to Enable Each Flag

各标志的启用场景

Flag	Enable when...
`includeFeatures`	Script has distinct visual categories worth exposing as traits
`includePostParams`	Script will have configurable on-chain parameters after minting (PMP)
`includeFlexDependencies`	Script loads external assets from IPFS or Arweave

标志	启用场景...
`includeFeatures`	脚本具有值得作为特征暴露的不同视觉类别时
`includePostParams`	脚本在铸造后具有可配置的链上参数（PMP）时
`includeFlexDependencies`	脚本从IPFS或Arweave加载外部资源时