Goal: 藉由有趣的「海龜繪圖」學會基礎的 Python 程式設計
本篇著重在以 Python 海龜繪圖模擬藝術圖形, 討論與生成式藝術的關聯.

本篇我們列舉一些網路上見到的, 用電腦程式或某些軟體產生美麗的圖形的例子, 許多都是用程式語言 Processing 來繪製, (或是 在 Processing 打開 Python mode, 語法是 Python, 但是繪圖指令是 Processing 才有的)
我們之後會再分篇討論是否可以用 Python 來製作類似的效果.

---

“Talk is cheap. Show me the code.”
― Linus Torvalds

老子第41章
上德若谷
大白若辱
大方無隅
大器晚成
大音希聲
大象無形
道隱無名

拳打千遍, 身法自然

“There’s no shortage of remarkable ideas, what’s missing is the will to execute them.” – Seth Godin
「很棒的點子永遠不會匱乏，然而缺少的是執行點子的意志力。」—賽斯．高汀

本系列文章之連結

• 從turtle海龜動畫學習Python-高中彈性課程1 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 2 安裝 Python, 線上執行 Python link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 3 烏龜繪圖 所需之Python基礎 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 4 烏龜開始畫圖 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 5 用函數封裝重複性指令-呼叫函數令烏龜畫正 n 邊形 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 6 畫多重旋轉圓,螺旋正方形 link

• 從turtle海龜動畫 學習 Python - 7 遞歸 recursive - 高中彈性課程系列 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 8 碎形 (分形 fractal) link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 8.1 碎形 L-system link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 9 Python 物件導向介紹 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 9.1 Python 物件導向的練習 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 10 藝術畫 自定義海龜形狀 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 10.1 藝術畫 python繪製天然雪花結晶 https://blog.csdn.net/m0_47985483/article/details/122262036 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 10.2 藝術畫 Python 製作生成式藝術
  link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 11.1 氣泡排序 - 用 turtle 呈現演算法之執行動作 link

• 從turtle海龜動畫 學習 Python - 高中彈性課程系列 11.2 maze 迷宮 - 用 turtle 呈現演算法之執行動作 link

---

---

主題: 列舉一些網路上見到的, 用電腦產生美麗圖形的例子

以下我們列舉一些網路上見到的, 用電腦程式或某些軟體產生美麗的圖形的例子, 許多都是用程式語言 processing 來繪製, (或是 在 Processing 打開 Python mode, 語法是 Python, 但是繪圖指令是 Processing 才有的)
我們之後會再分篇討論是否可以用 Python 來製作類似的效果.

螢幕保護程式與生成式藝術

exploring the beauty of algorithms with generative art - talk
https://youtu.be/Y1bPsh1mFUI link
SM C
本影片講者來自馬來西亞, 她提到這些早年的螢幕保護程式其實就是生成式藝術的濫觴!
(可惜 Linux RedHat 7 或 8 的那些碎形的螢幕保護程式, 當時曾令我極為驚嘆, 這個演講並沒有講到, 我一直不知如何找到他們的原始碼.)

本影片講者自己做的:

Koch 島圍繞著8個小 Koch 島所形成的磁磚:

Coding Cassowary

他有一系列用 Python 繪製 generative art 的教學:
https://www.youtube.com/playlist?list=PLBLV84VG7Md9oO4MUOhyqz7gBFOzx8XIw link

Generative art in Python: Basic Tiling

https://youtu.be/Cm_SzDlQ2cM link

Generative art in Python: Basic Tiling
觀看次數：1,405次
2022年2月20日

This video is the the start for a a new series of videos on how you can create generative art in Python using the Turtle module. In this first video I cover one of the most basic techniques in generative art which is tiling. The canvas is divided recursively into a number of small areas. In each of these areas a line is randomly drawn in one of two possible ways. And with just a few levels of recursion this can already lead to some surprising results.

Contents
00:00 Introduction
01:35 Turtle basics
04:00 Vertical and horizontal lines
06:02 Recursive tiling
10:24 First results
12:05 Diagonal lines

我照著他的影片走一遍, 把第一份tiling 的線條是垂直的程式碼試成功:

# Generative art in Python Basic Tiling.py
# 20220704 Noted by Prof. P-J Lai MATH NKNU
# 初版, 沒有使用 theme.py
##https://youtu.be/Cm_SzDlQ2cM
##Generative art in Python: Basic Tiling

from turtle import *
#from theme import set_theme
import random

setup(800, 800)

def tiling(x, y, s, level):
    # We have reached the final level recursion
    # and we now draw
    if level == 0:
        # 隨機畫直線段或橫線段
        if random.random() < 0.5:
            penup()
            goto(x,y-s)
            pendown()
            goto(x, y+s)
        else:
            penup()
            goto(x-s, y)
            pendown()
            goto(x+s, y)

    # Split the screen and go to next level of recursion
    else:
        s /= 2
        level -= 1
        # 左上區塊繼續分支
        tiling(x-s, y+s, s, level)
        # 右上區塊
        tiling(x+s, y+s, s, level)
        # 左下區塊
        tiling(x-s, y-s, s, level)
        # 右下區塊
        tiling(x+s, y-s, s, level)

################
width(2)
hideturtle()
tracer(False)

tiling(0,0,400,5)

tracer(True)
exitonclick()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50

Generative art in Python: Nested Squares

https://youtu.be/XruRIaB01Ls link

Coding Cassowary
329 位訂閱者
In this video we have a look at an early piece of computer-generated art. The canvas is tiled with squares. Within each of these “outer” squares there are a bunch of “inner” squares stacked into one another. Random offsets in either direction make for a 3D-like overall effect.

Contents:
00:00 Introduction
02:07 draw_squares( )
05:15 Drawing the outer squares
06:50 Drawing the inner squares
09:20 Shrinkage
10:58 set_theme( )

以下是我嘗試的程式碼, 特別注意, 這份會用到他加寫的 theme.py,
我是照著他的影片, 自己打入他的 theme.py 的 codes 存成 theme.py,
需要在一開始引入
from theme import set_theme
其實不使用也沒關係, theme.py 只是一個畫布呈現風格的設定檔, 較方便使用而已:

# Generative_art_in_Python_NestedSquares_set_theme.py
#比前一版 Generative_art_in_Python_NestedSquares.py
# 增加 from theme import set_theme
# 20220630 Noted by Prof. P-J Lai MATH NKNU

# Generative art in Python_Nested Squares

# https://youtu.be/XruRIaB01Ls

##Coding Cassowary

from turtle import *
from theme import set_theme
import random

def draw_square(x, y, s):
    penup()
    goto(x-s/2, y-s/2)
    pendown()
    for i in range(4):
        forward(s)
        left(90)
        
##setup(800, 800)
##width(2)
##hideturtle()
##tracer(False)
set_theme(thickness=2)    
############
# codes:

noise = 5
size = 100
shrink = 15

for x in range(-300+int(size/2), 300, size):
    for y in range(-400+int(size/2), 400, size):
        # the draw the outer square
        draw_square(x, y, size)

        # determine the offsets
        x_off = random.uniform(-noise, noise)
        y_off = random.uniform(-noise, noise)

        # draw the inner suqares
        for i in range(6):
            draw_square(x+i*x_off, y+i*y_off, size-i*shrink)

################
tracer(True)
exitonclick()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51

以下是執行的結果:

How To Draw With Code | Casey Reas

How To Draw With Code | Casey Reas, https://youtu.be/_8DMEHxOLQE
link

有很多數學的 motiv

YouTube上的:

Creators

For Casey Reas, software is the most natural medium to work with. He uses code to express his thoughts—starting with a sketch, composing it in code, and witnessing the imagery that it ultimately creates. We visit his studio to see how he uses color to convey emotion and how his programming language Processing is closing the gap between software and object.

The Creators Project is a partnership between Intel and VICE: http://thecreatorsproject.com/

Casey Reas 有一本書:
Casey Reas, Processing, second edition, A Programming Handbook for Visual Designers and Artists.

裡面有很多用 Processing 畫的有數學動機的美麗圖案, 讀者可以試著用 Python 重現看看,

Hari Dulal

他的 YouTube站的影片, 有一系列 Generative Art 的入門影片, 有一些不是太難, 但是也很有數學之美的圖案, 也有難度較高的, 也是用 Processing 寫的,

• Generative Art Tutorial for Beginners- Introduction to Processing
  https://youtu.be/dGleb-w14w4

• Generative Art- Sinusoidal Circles
  https://youtu.be/DQAEfXFjn-A

• Generative Art- Sinusoidal Circles in Processing
  https://youtu.be/YOSSfVrzFwc

• Sinusoidal circles
  https://youtu.be/9Y9DipPhsb4

• Generative Art Tutorial for Beginners- Trippy Rectangles Animation in Processing
  https://youtu.be/US-Y9q-wqV0

• Sierpinski triangle (Fractal Triangle) from fractal tree…
  https://youtu.be/t_TO94uqvSU
  碎形樹的動畫, 海龜繪圖較困難

• Spot-light effect效果, 海龜繪圖較困難
  Generative Art- Spot-light effect and fractal tree in Processing
  https://youtu.be/N1I4WIquDN8

• Generative Art- Kaleidoscope
  https://youtu.be/PMi2YZg8_zI
  

Perlin Noise 數位藝術家很常用的方法 用來產生流體的美

Generative Art using Perlin Noise in Processing
https://youtu.be/Z3tZM-Jxl7Y link
Hari Dulal

Hari Dulal 這個站對於原理, 幾乎很少解說,
Perlin Noise 是數位藝術家很常用的方法, 常用來產生流體的美, 詳細的說明可以看
I.2 Introduction - Perlin Noise and p5.js Tutorial
https://youtu.be/Qf4dIN99e2w link

Coding Challenge #24 Perlin Noise Flow Field
https://youtu.be/BjoM9oKOAKY link

等

Live Stream #46 Perlin Noise and Flow Fields
彩色的
https://youtu.be/sor1nwNIP9A link
The Coding Train

Eric Davidson, TheBuffED

在 github上有不少難度較高的設計, Eric Davidson, https://github.com/erdavids/Generative-Art link

Basic Introduction to Circle Packing
https://youtu.be/QkJHDIwPQ9E link

References

• Casey Reas, Processing, second edition, A Programming Handbook for Visual Designers and Artists.

• How To Draw With Code | Casey Reas, https://youtu.be/_8DMEHxOLQE
  link

• Generative Art- Kaleidoscope
  https://youtu.be/PMi2YZg8_zI

• Eric Davidson, 在 github上有不少難度較高的設計, Eric Davidson, https://github.com/erdavids/Generative-Art
  link

• Eric Davidson, Basic Introduction to Circle Packing
  https://youtu.be/QkJHDIwPQ9E link