【Processing】模様のあるタイルを並べてみた。PVectorが理解できていない。

Processing

こんにちは、たやち(tayati369)です。

日々ちょっとずつProcessingでコーディングしています。

前回は「ランダムに配置した点を線でつないでみた。」に挑戦した記事を書いておりますので、よければそちらも御覧ください。

今回の模様は、スーパー銭湯に行った時、柱に綺麗なタイリングがされているのをサウナから上がった時に見ていて、これProcessingでできるかなーと考えていたのが始まりです。

温泉に入るのは大大好きなのですが、サウナの暑さが苦手で出てからボーとしてました。(笑)

シンプルなrect関数のタイリングとそのタイルの中にLineで模様を描くことをしています。

そして、PVectorを使ってみたくて使っています。正直なところPVectorの使いどころはイマイチわかっておらず、綺麗に使いこなせているかわかっておりません。ベクトルはどちらかというとアニメーションとかで使うのかなー。

では、Processingのイメージとコードを公開しておきます。

イメージ

サンプルコード

 

import time

def setup():
    size(400, 400)
    background(0, 0, 100, 0)
    smooth()
    noLoop()
    
def draw():
    x = 0
    y = 0
    w = 50
    h = 50
    for x in range(0, width, w):
        for y in range(0, width, h):
            x = x
            y = y
            tile(x, y, w, h)
    save('img'+dt()+'.jpg')
    
def tile(x = 0, y = 0,w = 50, h = 50):
    fill(getCol(c = int(random(1, 8))))
    strokeWeight(random(2, 6))
    strokeJoin(ROUND)
    rect(x, y, w, h)
    ri = [i for i in range(0, int(random(3, 6)))]
    ri2 = [j for j in range(0, len(ri))]
    pos1 = [p1 for p1 in range(0, len(ri))]
    pos2 = [p2 for p2 in range(0, len(ri))]
    pos3 = [p3 for p3 in range(0, len(ri))]
    pos4 = [p4 for p4 in range(0, len(ri))]
    pos5 = [p5 for p5 in range(0, len(ri))]
    pos6 = [p6 for p6 in range(0, len(ri))]
    r1 = [r for r in range(0, len(ri))]
    r2 = [r2 for r2 in range(0, len(ri))]
    for r in range(0, len(ri)):
        ri[r] = random(w/2, w)
        ri2[r] = random(0, w/2)
        pos1[r] = PVector(ri[r], 0)
        pos2[r] = PVector(0, ri[r])        
        pos3[r] = PVector(pos1[r].x + pos2[r].x, pos1[r].y - pos2[r].y)
        pos4[r] = PVector(ri2[r], h)
        pos5[r] = PVector(w, ri2[r])
        pos6[r] = PVector(pos4[r].x + pos5[r].x, pos4[r].y - pos5[r].y)
        r1[r] = random(0, pos3[r].x)
        r2[r] = random(0, pos6[r].x)
        strokeWeight(random(0.5, 3))
        line(x + 0, y + pos3[r].x, x + pos3[r].x - r1[r], y + r1[r])
        line(x + w , y + pos5[r].y , x + pos6[r].x - r2[r], y + r2[r])

def getCol(c):
    cols = ['#0D34DB','#304DDB','#2A88F8','#DB1855','#F0291B','#D93B0D','#309DDB']
    if c == 1:
        col = cols[c-1]
    elif c == 2:
        col = cols[c-1]
    elif c == 3:
        col = cols[c-1]
    elif c == 4:
        col = cols[c-1]
    elif c == 5:
        col = cols[c-1]
    elif c == 6:
        col = cols[c-1]
    else:
        col = cols[c-1]
    
    return col

def dt():
    dt = str(time.time())
    return dt

最後に

見た模様をProcessingでリアルに、そしてそれを拡張して自分の想像に持っていければ最高だなと感じました。

PVectorやclassなどプログラミングの技法を覚えつつ、それを使って自分が表現してみたいモノを作れたらいいなと考えております。

ではでは、最後までご覧いただきありがとうございます。

さようなら〜〜〜。

なにかあればTwitterまで。

コメント

タイトルとURLをコピーしました