2024年3月3日星期日

week 3. repeat

Jacquard loom (1801)

charles babbage analytical engine

Arktura Ricami Stool

OP ART

Bridget Riley

Yaacov Agam

Richard Anuszkiewicz

Jesus Rafael Soto

Victor Vasarely

Martin Wattenberg, Shape of Song, 2002

http://turbulence.org/Works/song/method/method.html

Turbulence.org Commission: "The Shape of Song" by Martin Wattenberg v1 (2001) from Turbulence.org on Vimeo.

Modell 5 - Granular Synthesis

PSC 31, Mark Wilson

Frieder Nake

http://dada.compart-bremen.de/item/agent/68

Vera Molnar

https://www.surfacemag.com/articles/vera-molnar-in-thinking-machines-at-moma/

https://www.openprocessing.org/browse/?q=Vera+Molnar&time=anytime&type=all#

Manfred Mohr

https://www.emohr.com/

CODE Tutorials:

Structure

Statements and Comments

Homework:

1. 找一位 code artist 的作品，參考:

Computer Artists in Database of Digital Art

2. 搜尋這位 artist 的所有相關作品

3. 如何以手繪，以及 code 來重現?

2024年2月25日星期日

week 2. form and computer

Ivan Sutherland (1963), Sketchpad

Morisawa Posters, John Maeda, 1996

Electronic abstraction, Ben Laposky, 1952.

Entramado , Pablo Valbuena, 2008

Volume, by United Visual Artists, 2006

Cirrus 2008, Zaha Hadid

Repeat

1. ACG at MIT Media Lab.
Aesthetic and computation Concept video

2. for-loop
if

FORM+CODE examples

Ex: Draw 10x10 (or 11X16) basic elements with some repetition

2024年2月17日星期六

week 1. introduction

Aesthetic Computing: A Brief Tutorial
An Introduction to Aesthetic Computing by Paul Fishwick
conceptual art

computational aesthetics ?
https://www.britannica.com/topic/computational-aesthetics

FORM + CODE

設計、藝術和建築中的FORM+CODE：如演算般優雅，用寫程式的方式創造設計的無限可能

Wassily Kandinsky
Victor Vasarely
Sol Lewitt

code artists:
Ben Laposky, 1914-2000

John Whitney Sr., 1918-1995

Herbert W. Franke, 1927-

Lillian Schwartz, 1927-

Harold Cohen, 1928-

Roman Verostko, 1929-

George Legrady, 1950-

Mark Napier, 1961-

John F. Simon Jr., 1963-

John Maeda, 1966-

Mary Flanagan, 1969-

Casey Reas, 1970-

Jared Tarbell, 1973-

Ben Fry, 1975-

EX1: (2024/3/5)
Take photos of Computational Aesthetics in everyday life.

Grading:

平時作業 30%

期中作品 30%

期末作品 40%

2023年5月28日星期日

week 15. images

https://www.processing.org/examples/pointillism.html

https://www.processing.org/reference/PImage.html

https://processing.org/tutorials/pixels/

https://processing.org/examples/blur.html

Final presentations:

experience of using AI tools sharing

10 mins PPT presentations about using AI tools to do the final project

including:

tools, steps, results, discussion and reflection, suggestion

what-we-learned,

Final Project:
using AI tools (chatGPT, Midjouney, Stable Diffusion....) to do Self Portrait:

At least 1 processing code (最少有一種用 processing 程式碼)
最少三種
例如，Andy Warhol 風格，字型風格，拼貼風格，動態曼陀羅風格，...
參考: https://aestheticcomputing2010.blogspot.com/2020/12/week-15-self-portrait.html

6. 6 2023

2023年5月14日星期日

week 13. Project 2 demo & Object-Oriented Programming

1. Mandala Project demo:

2. object oriented programming:
https://processing.org/tutorials/objects/
https://www.youtube.com/watch?v=YcbcfkLzgvs

3. simple particle system

https://processing.org/examples/simpleparticlesystem.html

EXercise:
draw 'array-like' object with OOP

reference:

https://processing.org/examples/arrayobjects.html

2023年5月7日星期日

example 1:

float cX;
float cY;
int nSegment = 24;

void setup() {

size(600, 600);
cX = width/2.0;
cY = height/2.0;
stroke(200);
noFill();

}

void draw() {
float x;
float y;
float angle;
float r = 200.0;

background(0);

for (int i= 0; i < nSegment; i++) {
angle = i*(PI*2.0)/nSegment;
x = cX+ r*cos(angle);
y = cY+ r*sin(angle);

pushMatrix();
translate(x, y);
rotate(angle);
ellipse(0, 0, 40, 20);
popMatrix();

}

}

example 2:

structured :

float cX;
float cY;

void setup() {

size(600, 600);
cX = width/2.0;
cY = height/2.0;
stroke(200);
noFill();
noLoop();

}

void draw() {

background(0);
for (int i= 0; i< 4; i++)
drawLayer();

}

void drawLayer() {
float x;
float y;
float angle;
float r = 200.0;
int nSegment = 24;

r = random (60, 260);
nSegment = (int) random (8, 36);

for (int i= 0; i < nSegment; i++) {
angle = i*(PI*2.0)/nSegment;
x = cX+ r*cos(angle);
y = cY+ r*sin(angle);

pushMatrix();
translate(x, y);
rotate(angle);
ellipse(0, 0, 60, 30);
popMatrix();

}

}

example 3:
array:

float cX;
float cY;

int nLayer = 30;
float[] r;
int[] nSegment;
int[] brightness;
float[] rotateRate;

void setup() {

size(600, 600);
cX = width/2.0;
cY = height/2.0;

r = new float[nLayer];
nSegment = new int[nLayer];
brightness = new int[nLayer];
rotateRate = new float[nLayer];

for (int i = 0; i< nLayer; i++) {
r[i] = random(60, 260);
nSegment[i] = (int) random(6, 60);
brightness[i] = (int) random(10, 255);
rotateRate[i] = random(-100.0, 100.0);

}

stroke(200);
noFill();
// noLoop();

}

void draw() {

background(0);
for (int i= 0; i< nLayer; i++)
drawLayer(i);

}

void drawLayer(int nth) {
float x;
float y;
float angle;

stroke(brightness[nth], brightness[nth], 100);
for (int i= 0; i < nSegment[nth]; i++) {
angle = i*(PI*2.0)/nSegment[nth];
x = cX+ r[nth]*cos(angle);
y = cY+ r[nth]*sin(angle);

pushMatrix();
translate(x, y);
rotate(angle +frameCount/rotateRate[nth]);
ellipse(0, 0, 60, 30);
popMatrix();

}

}

example 4:
centered rotate:

float cX;
float cY;

int nLayer = 30;
float[] r;
int[] nSegment;
int[] brightness;
float[] rotateRate;

void setup() {

size(600, 600);
cX = width/2.0;
cY = height/2.0;

r = new float[nLayer];
nSegment = new int[nLayer];
brightness = new int[nLayer];
rotateRate = new float[nLayer];

for (int i = 0; i< nLayer; i++) {
r[i] = random(20, 260);
nSegment[i] = (int) random(6, 60);
brightness[i] = (int) random(10, 255);
rotateRate[i] = random(-100.0, 100.0);

}

stroke(200);
noFill();
// noLoop();

}

void draw() {

background(0);
translate(cX, cY);
rotate(frameCount/150.0);
for (int i= 0; i< nLayer; i++)
drawLayer(i);

}

void drawLayer(int nth) {
float x;
float y;
float angle;

stroke(brightness[nth], brightness[nth], 100);
fill(0, brightness[nth], brightness[nth], 25);
for (int i= 0; i < nSegment[nth]; i++) {
angle = i*(PI*2.0)/nSegment[nth];
x = r[nth]*cos(angle);
y = r[nth]*sin(angle);

pushMatrix();
translate(x, y);
rotate(angle +frameCount/rotateRate[nth]);
ellipse(0, 0, 60, 30);
popMatrix();

}
}

example 5:

float cX;
float cY;

int nLayer = 30;
float[] r;
int[] nSegment;
int[] brightness;
float[] rotateRate;

void setup() {

size(600, 600);
cX = width/2.0;
cY = height/2.0;

r = new float[nLayer];
nSegment = new int[nLayer];
brightness = new int[nLayer];
rotateRate = new float[nLayer];

for (int i = 0; i< nLayer; i++) {
r[i] = random(10, 300);
nSegment[i] = (int) random(6, 60);
brightness[i] = (int) random(10, 255);
rotateRate[i] = random(-100.0, 100.0);

}

stroke(200);
noFill();
// noLoop();

}

void draw() {

background(0);
translate(cX, cY);
rotate(frameCount/map(sin(frameCount/60.0), -1.0, 1.0, -100.0, 100.0));
for (int i= 0; i< nLayer; i++)
drawLayer(i);

}

void drawLayer(int nth) {
float x;
float y;
float angle;

stroke(brightness[nth], brightness[nth], 100);
fill(0, brightness[nth], brightness[nth], 25);
for (int i= 0; i < nSegment[nth]; i++) {
angle = i*(PI*2.0)/nSegment[nth];
x = r[nth]*cos(angle);
y = r[nth]*sin(angle);

pushMatrix();
translate(x, y);
rotate(angle +frameCount/rotateRate[nth]);
ellipse(0, 0, 60, 30);
//rect(-10, -10, 20, 20);

popMatrix();

}
}

example 6:

float cX;

float cY;

int nSegment = 60;

void setup() {

size(600, 600);

cX = width/2.0;

cY = height/2.0;

stroke(200);

noFill();

background(0);

}

void draw() {

fill(0, 10);

rect(0, 0, width, height);

for (int i= 0; i< 4; i++) {

drawLeaves(18*(i+1), 80*i+sin(frameCount/40.0)*30.0);

}

void drawLeaves(int n, float r)

{

float angle;

float x;

float y;

for (int i= 0; i < n; i++) {

angle = i*(PI*2.0)/n;

x = cX+ r*cos(angle);

y = cY+ r*sin(angle);

pushMatrix();

translate(x, y);

rotate(angle);

ellipse(0, 0, 40, 20);

popMatrix();

}

example 7:

float cX;

float cY;

int nLayer = 30;

float[] r;

int[] nSegment;

int[] brightness;

float[] rotateRate;

void setup() {

size(600, 600);

cX = width/2.0;

cY = height/2.0;

r = new float[nLayer];

nSegment = new int[nLayer];

brightness = new int[nLayer];

rotateRate = new float[nLayer];

for (int i = 0; i< nLayer; i++) {

r[i] = random(60, 260);

nSegment[i] = (int) random(6, 60);

brightness[i] = (int) random(10, 255);

rotateRate[i] = random(-100.0, 100.0);

}

stroke(200);

noFill();

// noLoop();

}

void draw() {

background(0);

pushMatrix();

translate(width/2, height/2);

rotate(frameCount/50.0);

translate(-width/2, -height/2);

for (int i= 0; i< nLayer; i++)

drawLayer(i);

popMatrix();

}

void drawLayer(int nth) {

float x;

float y;

float angle;

stroke(brightness[nth], brightness[nth], 100);

for (int i= 0; i < nSegment[nth]; i++) {

angle = i*(PI*2.0)/nSegment[nth];

x = cX+ r[nth]*cos(angle);

y = cY+ r[nth]*sin(angle);

pushMatrix();

translate(x, y);

rotate(angle +frameCount/rotateRate[nth]);

ellipse(0, 0, 60, 30);

popMatrix();

}

2023年4月30日星期日

week 11. drawing mandala

Basic sample 1:

float resolution;
float radius = 100;
float circleX;
float circleY;
float offset;

void setup() {
size(700, 700);
circleX = 0;
circleY = 0;
}

void draw() {
fill(0,0,0,25);
rect(0,0,width,height);
translate(width/2, height/2);
fill(255);
noStroke();
offset++;

resolution = map(sin(offset*0.005), -1, 1, 2, 20);
// resolution = 20;

for (int i = 0; i < resolution; i++) {
float angle = map(i, 0, resolution, 0, TWO_PI);
// float waveOffset = sin(angle*circles) * 200;

float circleOffsetX = cos(angle) * (radius); //xposition
float circleOffsetY = sin(angle) * (radius); //yposition
// float circleOffsetX = cos(angle) * (radius + waveOffset); //xposition
// float circleOffsetY = sin(angle) * (radius + waveOffset); //yposition

float x = circleX + circleOffsetX;
float y = circleY + circleOffsetY;

ellipse(x, y, 10, 10);

}
}

Sample 2:

float resolution;
float radius = 100;
float circleX;
float circleY;
float circles;
float circleW;
float circleH;
float offset;

void setup() {
size(700, 700);
circleX = 0;
circleY = 0;
}

void draw() {
fill(0,0,0,25);
rect(0,0,width,height);
translate(width/2, height/2);
fill(255);
noStroke();
offset++;

resolution = map(sin(offset*0.00025), -1, 1, 11, 13);
//resolution = 50;
circles = 400;

circleW = map(sin(offset*0.05), -1, 1, 1, 8);
circleH = map(sin(offset*0.05), -1, 1, 1, 8);

for (int i = 0; i < resolution; i++) {

float scale = 200;

float waveAngle = map(i, 0, resolution, 0, TWO_PI * circles);
float waveOffset = sin(waveAngle) * scale; //scale the -1 to 1 up

float angle = map(i, 0, resolution, 0, TWO_PI * 156); //multiply for weirdness

float circleOffsetX = cos(angle) * (radius + waveOffset); //xposition
float circleOffsetY = sin(angle) * (radius + waveOffset); //yposition

float x = circleX + circleOffsetX;
float y = circleY + circleOffsetY;

ellipse(x, y, circleW, circleH);

}

}

example 3:

float resolution;
float radius = 100;
float circleX;
float circleY;
float circles;
float offset;

void setup() {
size(700, 700);
circleX = 0;
circleY = 0;
}

void draw() {
fill(0,0,0,25);
rect(0,0,width,height);
translate(width/2, height/2);
fill(255, 255, 0);
noStroke();
offset++;

resolution = map(cos(offset*0.0002), -1, 1, 2, 200);
circles = 100;

beginShape();
noFill();
for (int i = 0; i < resolution; i++) {

float scale = 400;

float waveAngle = map(i, 0, resolution, 0, TWO_PI * circles);
float waveOffset = sin(waveAngle) * scale; //scale the -1 to 1 up

float angle = map(i, 0, resolution, 0, TWO_PI * 156); //multiply for weirdness

float circleOffsetX = cos(angle) * (radius + waveOffset); //xposition
float circleOffsetY = sin(angle) * (radius + waveOffset); //yposition

float x = circleX + circleOffsetX;
float y = circleY + circleOffsetY;

stroke(255);
//line(x, y, 0, 0);
vertex(x,y);

}
endShape(CLOSE);

}

reference:
search "mandala" on
https://www.openprocessing.org/

also

https://aestheticcomputing2010.blogspot.com/2020/12/week-12-mandala-drawing-ii.html

訂閱：文章 (Atom)

aesthetic computing 美學運算

2024年3月3日星期日

week 3. repeat

Modell 5 - Granular Synthesis

2024年2月25日星期日

week 2. form and computer

Volume, by United Visual Artists, 2006

2024年2月17日星期六

week 1. introduction

設計、藝術和建築中的FORM+CODE：如演算般優雅，用寫程式的方式創造設計的無限可能

2023年5月28日星期日

week 15. images

2023年5月14日星期日

week 13. Project 2 demo & Object-Oriented Programming

2023年5月7日星期日

week 12. mandala drawing II

2023年4月30日星期日

week 11. drawing mandala

NTUST aesthetic computing

2024年3月3日 星期日

Modell 5 - Granular Synthesis

2024年2月25日 星期日

Volume, by United Visual Artists, 2006

2024年2月17日 星期六

2023年5月28日 星期日

2023年5月14日 星期日

2023年5月7日 星期日

2023年4月30日 星期日

2024年3月3日星期日

2024年2月25日星期日

2024年2月17日星期六

2023年5月28日星期日

2023年5月14日星期日

2023年5月7日星期日

2023年4月30日星期日