Kei kitamura (talk | contribs) |
Kei kitamura (talk | contribs) No edit summary |
||
| Line 4: | Line 4: | ||
[http://codepen.io/kayk5654/pen/LbjJmo Representation of the curve drawing instruction]<br> | [http://codepen.io/kayk5654/pen/LbjJmo Representation of the curve drawing instruction]<br> | ||
The drawing instruction is [[File:Drawaline.pdf|here]] | The drawing instruction is [[File:Drawaline.pdf|here]] | ||
[[Image:KK_firstcurve.png|thumb|left| | [[Image:KK_firstcurve.png|thumb|left|200px]] <br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
<br> | <br> | ||
| Line 11: | Line 11: | ||
1. [https://codepen.io/kayk5654/pen/eBpKyY random distribution function] <br> | 1. [https://codepen.io/kayk5654/pen/eBpKyY random distribution function] <br> | ||
[[Image:KK_randomness.png|thumb|left| | [[Image:KK_randomness.png|thumb|left|200px]] <br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
2. [https://codepen.io/kayk5654/pen/ZBbRXz curve controlled by randomness] <br> | 2. [https://codepen.io/kayk5654/pen/ZBbRXz curve controlled by randomness] <br> | ||
[[Image:KK_randomwalk.png|thumb|left| | [[Image:KK_randomwalk.png|thumb|left|200px]] <br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
<br> | <br> | ||
| Line 21: | Line 21: | ||
1. [https://codepen.io/kayk5654/pen/woMQZv turtle walk]<br> | 1. [https://codepen.io/kayk5654/pen/woMQZv turtle walk]<br> | ||
The curve shows the turning point of the turtle.<br> | The curve shows the turning point of the turtle.<br> | ||
[[Image:KK_turtle01.png|thumb|left| | [[Image:KK_turtle01.png|thumb|left|200px]] <br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
2. [https://codepen.io/kayk5654/pen/mOVQgo turtle walk with data]<br> | 2. [https://codepen.io/kayk5654/pen/mOVQgo turtle walk with data]<br> | ||
| Line 29: | Line 29: | ||
To test locally, you can download this project;<br> | To test locally, you can download this project;<br> | ||
[[Media:Turtle_homework_02_modified.zip]]<br> | [[Media:Turtle_homework_02_modified.zip]]<br> | ||
[[Image:KK_turtle02.png|thumb|left| | [[Image:KK_turtle02.png|thumb|left|200px]] <br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
<br> | <br> | ||
| Line 36: | Line 36: | ||
1. [https://codepen.io/kayk5654/pen/VmWEgy recursive curve]<br> | 1. [https://codepen.io/kayk5654/pen/VmWEgy recursive curve]<br> | ||
[[Image:KK_fractal01.png|thumb|left| | [[Image:KK_fractal01.png|thumb|left|200px]] <br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
2. [https://codepen.io/kayk5654/pen/ObgBda L-system]<br> | 2. [https://codepen.io/kayk5654/pen/ObgBda L-system]<br> | ||
[[Image:KK_fractal2.png|thumb|left| | [[Image:KK_fractal2.png|thumb|left|200px]] <br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
<br> | <br> | ||
| Line 49: | Line 49: | ||
Each vehicles prefer either of red, green blue lights.<br> | Each vehicles prefer either of red, green blue lights.<br> | ||
You can drag the lights by keep pressing the central point of the light.<br> | You can drag the lights by keep pressing the central point of the light.<br> | ||
[[Image:KK_breitenberg_vehicle1.png|thumb|left| | [[Image:KK_breitenberg_vehicle1.png|thumb|left|200px]] <br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
<br> | <br> | ||
| Line 62: | Line 62: | ||
You can download .zip and test on your editor locally.<br> | You can download .zip and test on your editor locally.<br> | ||
[[Media:Breitenberg_vehicle_homework_1.zip]]<br> | [[Media:Breitenberg_vehicle_homework_1.zip]]<br> | ||
[[Image:KK_breitenberg_vehicle2.png|thumb|left| | [[Image:KK_breitenberg_vehicle2.png|thumb|left|200px]] <br> | ||
<br> | <br> | ||
| Line 72: | Line 72: | ||
Needles moves continuously by the influence of the noise field.<br> | Needles moves continuously by the influence of the noise field.<br> | ||
When you drag on the needles, they create circular pattern around the mouse pointer.<br> | When you drag on the needles, they create circular pattern around the mouse pointer.<br> | ||
[[Image:KK_magnetrix.png|thumb|left| | [[Image:KK_magnetrix.png|thumb|left|200px]] <br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
<br> | <br> | ||
| Line 84: | Line 84: | ||
"drawOsci" shows waveforms of audio input from the mic of your computer<br> | "drawOsci" shows waveforms of audio input from the mic of your computer<br> | ||
Also, there are different functional sounds assigned 1 - 6 keys on your keyboard.<br> | Also, there are different functional sounds assigned 1 - 6 keys on your keyboard.<br> | ||
[[Image:KK_soundfun.png|thumb|left| | [[Image:KK_soundfun.png|thumb|left|200px]]<br> | ||
<br style="clear:both;"> | <br style="clear:both;"> | ||
<br> | <br> | ||
| Line 94: | Line 94: | ||
[[File:KK_meandering_wip2.png|200px|thumb|left]]<br> | [[File:KK_meandering_wip2.png|200px|thumb|left]]<br> | ||
[[File:KK_meandering_wip3.png|200px|thumb|left]]<br> | [[File:KK_meandering_wip3.png|200px|thumb|left]]<br> | ||
<br> | <br style="clear:both;"> | ||
<br> | <br> | ||
Reference:<br> | Reference:<br> | ||
[https://threejs.org/ three.js]<br> | [https://threejs.org/ three.js]<br> | ||
[https://github.com/spite/THREE.MeshLine THREE.Meshline]<br> | [https://github.com/spite/THREE.MeshLine THREE.Meshline]<br> | ||
Revision as of 10:25, 17 February 2017
Week 01
Representation of the curve drawing instruction
The drawing instruction is File:Drawaline.pdf
Week 03
1. random distribution function
2. curve controlled by randomness
Week 04
1. turtle walk
The curve shows the turning point of the turtle.
2. turtle walk with data
The selected background image is converted to the command which defines the direction of turtle walk.
Each pixels of the image are sampled, and the strongest one of the R, G or B is assigned as a command.
Thus, the direction of the curve reflects the dominant color factor
To test locally, you can download this project;
Media:Turtle_homework_02_modified.zip
Week 05
2. L-system
Week 06
breitenberg vehicle
Each vehicles prefer either of red, green blue lights.
You can drag the lights by keep pressing the central point of the light.
Week 07
breitenberg vehicle with custom environment
Vehicles draw streaks with brushes.
Each vehicles prefers either of dark area or bright area of their environment.
My original sketch uses external .png file as brushes.
You can download .zip and test on your editor locally.
Media:Breitenberg_vehicle_homework_1.zip
Week 10
magnetic matrix
Needles moves continuously by the influence of the noise field.
When you drag on the needles, they create circular pattern around the mouse pointer.
Week 11/12
soundfun
This sketch has 4 visualization functions.
"drawLevel" shows the loudness of the sound.
"drawWaveform" and "drawFFT" shows waveform and the result of FFT analysis.
"drawOsci" shows waveforms of audio input from the mic of your computer
Also, there are different functional sounds assigned 1 - 6 keys on your keyboard.
Semester project
Work in progress:
Reference:
three.js
THREE.Meshline