p5js動態作業臨摹

2021-09-28 19:51:16 字數 953 閱讀 2668

臨摹作品

先觀察正方形分布情況,可以得到奇數行是白黑,偶數行是黑白。

再觀察其運動規律,先是白方塊放大 然後黑方塊放大,也可以看成白方塊放大縮小。(隨著一定的週期進行變化)

先根據剛才得到的規律畫好正方形,**如下:`

for

(i=0

;i<

8;i++

)else

}else

else}}

}

接著分析其運動規律,應該是正弦或者余弦函式,也就是說正方形的rect()裡的後兩個引數隨著時間作有規律的運動。大概是這樣的:

cos(25

+50*i,25

+50j,

25sin(2

*pi/t

*t)+25,

25sin(2

*pi/t

*t)+

25)

所以將這個運動函式再琢磨琢磨放進rect()後兩個引數裡便可以讓正方塊動起來。

修改了運動函式之效果如下

也就是說圓的半徑隨著時間做100*sin((millis()%t)/200+100)的運動。

此次作業讓我對碼繪有了更深刻的了解,運用程式設計繪畫是如此的有趣。

p5js動態互動式碼繪作業二小結

p5js碼繪小律老師作業二之動態碼繪 互動功能 實驗截圖 碼繪由程式動態完成 使用者可以用滑鼠互動的直接畫出帶點的線條 手繪 真的是碼繪五分鐘手繪兩小時還不止!這局計算機完勝了!碼繪 var t function setup function draw var x1 width noise t 15...

P5JS靜態碼繪作業一小結

p5js碼繪小律老師作業之靜態碼繪 碼繪版 手繪版 一 技術比對 很直觀的是,手繪時要想把圓畫的很圓,直線畫的很直是需要不斷訓練的,把影象畫的很精準是手繪的難點。而相反,精確的定位是碼繪的優勢。如何想要增加電腦繪製的影象的自然性就是碼繪的難點了。同時,由於手繪時直接由手作圖,想法可以直接付諸筆端在紙...