⬡ 产品设计构成 · 创意编程实验台

三步选择 → AI 直接出代码 → OpenProcessing 运行配图 → 单变量迭代至少两版 → 案例搜索与修改对比 → 导出作业  

正在读取工卡…实验记录与导出将使用对应工卡
案例搜索与修改对比 ↓
STEP 1定义元素 (Element)
STEP 2设定规则 (Rules)
STEP 3表达与交互 (Expression)

点击后由 DeepSeek 直接生成 p5.js 代码,提示词不再需要手动复制转发

🧪 这一轮实验怎么做
1
左侧完成 三步选择,点「生成第 1 版」。系统直接调用 DeepSeek 出代码,不用再复制提示词发给别的 AI。
2
在下方方案卡里点 📋 复制代码,粘贴到 OpenProcessing 运行。报错或白屏时,回到该版点 🛠 运行报错/修改代码。运行成功后截图并 配上作品图。
3
在方案卡底部选定 本次要改变的那一个变量,写下修改指令,点「生成下一版」。
4
重复第 2、3 步。每个方案至少完成两次单变量迭代(起始版 + 两次改版),运行修复不计入次数,完成后导出实验记录。
⚠️ 单变量原则:每一版只动一个变量,其余保持不变。这样图片对比出来的差异,才能归因到那一个构成要素上——这是这份实验记录的全部价值所在。
OpenProcessing 打不开、报错或白屏怎么办?
  1. 网站本身打不开:先检查网络或刷新;代码无法修复网站连接。也可将代码放到 p5.js 官方编辑器 测试。
  2. 网站能开,作品运行失败:使用 p5.js/JavaScript 模式,将完整代码粘入 sketch.js,替换原内容;不要连同 Markdown 围栏或说明文字一起粘贴。
  3. 复制 Console 的第一条报错和行号。没有报错就描述“白屏/卡住/点击后没反应”,回本页该版本点“运行报错/修改代码”。
  4. 直接手改,或请 DeepSeek 修复。AI 会被要求用中文注释写明原因、修改与验证方法;也可复制完整提示给 DeepSeek/Kimi,再把代码粘回来。
  5. 整段替换、运行、保存修复版并配图。原版保留,修复只解决运行问题;改变配色等设计实验仍用“生成下一版”。
OpenProcessing 官方报错说明
🗂 方案区 0 💾 自动保存 · 刷新不丢失

本机保存用于断网续作。清理本机不会删除已同步的云端作业;清理前先确认“云端已同步”或备份。清理后本页暂停同步,可点“恢复云端”继续。

🗂

还没有方案。
左侧完成三步选择,点「生成第 1 版」开始第一个方案。

AI 正在写代码…

通常需要 20–50 秒,请不要关闭页面

已用时 0 秒