实验介绍
本页汇集了两个创意编程实验。第一个实验让电路板从导线、焊盘和水彩般的色块中逐步形成;第二个实验把像素风吉祥物构建成可用鼠标或手指旋转的互动式 3D 对象。
制作方式
两个场景都使用 p5.js 构建。电路板视觉使用 p5.brush 添加自然笔触、纹理与半透明色层,各个电路元素按照设定的循环逐步出现并消失。吉祥物运行在 WebGL 模式中,由具有真实体积的几何模块组成,Pointer Events 则把鼠标或手指的移动转换为双轴旋转。
什么是 Processing、p5.js 和 WebGL
Processing 是面向创意编程的开发环境和编程语言:图像与动画通过代码生成,而不是在图形编辑器中逐笔绘制。p5.js 将这种方法带入浏览器,并提供基于 JavaScript 的绘图工具。WebGL 利用显卡高效渲染三维图形。在本实验中,它负责几何结构、纵深、灯光以及吉祥物的实时旋转。
这种方式很适合生成艺术:每个元素都可以被赋予动画、连接数据或响应用户操作,并且无需逐帧绘制就能生成同一场景的不同版本。