---
tags: 程式設計,第一個作業,教師版,互動藝術程式創作入門,Creative Coding
---

# 第一個作業

[演算法影片說明](https://youtu.be/PF_IdMQiBgM)

{%youtube PF_IdMQiBgM %}

---

啟動你的程式碼

## 步驟一


ellipse(25,25,50)

---

## 步驟二


rect(25,25,50)

---

## 步驟三


ellipse(50,50,20)

---

## 步驟四


for(var i=0;i <int(height/50);i++)
{ellipse(25+(i50),25,50)
rect(25+(i50),25,50)
ellipse(50+(i50),50,20)}

---

## 步驟五


for(var j=0;j <int(width/50);j++)
{ellipse(25+(i50),25+(j50),50)
rect(25+(i50),25+(j50),50)
ellipse(50+(i50),50+(j*50),20)}

---

## 步驟六


for(var j=0;j <int(width/50);j++)
{ellipse(25+(i50),25+(j50),50)
rect(25+(i50),25+(j50),50)
ellipse(50+(i50),50+(j*50),20)}
for(var j=0;j <int(width/50);j++)
{ellipse(25+(i50),25+(j50),50)
rect(25+(i50),25+(j50),50)
ellipse(50+(i50),50+(j*50),20)}

---

## 步驟七


for(var j=0;j <int(width/50);j++)
{ellipse(25+(i50),25+(j50),50)
rect(25+(i50),25+(j50),50)
ellipse(50+(i50),50+(j*50),20)}

---

## 步驟八


for(var j=0;j <int(mouseX/50);j++)
{ellipse(25+(i50),25+(j50),50)
rect(25+(i50),25+(j50),50)
ellipse(50+(i50),50+(j*50),20)}

---


//https://youtu.be/PF_IdMQiBgM

---

# 自行設計畫面