[ICM] Week 02 : Plain Weaving Generator

ICM

I said before my blog post, because of  my personal curiosity of weaving process, I wanted to create a weaving generator using P5.js. I had to start with the plain weave style.

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-09-22-%e1%84%8b%e1%85%a9%e1%84%8c%e1%85%a5%e1%86%ab-12-20-35

I drew horizontal lines at first and drew vertical lines that consisted of short lines

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-09-22-%e1%84%8b%e1%85%a9%e1%84%8c%e1%85%a5%e1%86%ab-12-23-00

And I change the numbers to variables.

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-09-22-%e1%84%8b%e1%85%a9%e1%84%8c%e1%85%a5%e1%86%ab-12-55-41

Control different thickness of threads and density

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-09-22-%e1%84%8b%e1%85%a9%e1%84%8c%e1%85%a5%e1%86%ab-1-26-08

Changing each vertical, horizontal thread thickness

< Plain Weaving Generator V1 >

Adding animation, and mouseDragged, mousePressed functions.

– Drag : zoom & resize each vertical, horizontal thread thickness and density

– click : change horizontal thread color / restart animation

– move : changing vertical thread color

 

*** Actually I wanted to add shadows of each thread, but I could not make it meet the pace of the starting animation.

One Comment

  1. Pingback: [ICM] Week 02 : Plain Weaving Generator – Keunjung Bae' blog

Leave a Reply

Your email address will not be published.