Difference between revisions of "Erin Ashenhurst"
(→Assignments) |
(→Project 3) |
||
(58 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
==Assignments == | ==Assignments == | ||
− | === Assignment | + | === Assignment 4 === |
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_4/ Painting the Narrative: new + improved] ''Use a widget set of sliders, menus, and buttons to control the display.'' | ||
+ | |||
+ | === Assignment 3 === | ||
+ | |||
+ | * [http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_3/01/ A3-01] | ||
+ | Create a subclass of PImage that implements a: mosaic( int blockSize ) method. | ||
+ | The blockSize parameter specifies how big the mosaic block is (e.g. blockSize = 4 would mean the mosaic block size is 4 pixels by 4 pixels). The mosaic method should replace each block of pixels in the image (e.g. if blockSize = 4, each block of 4 by 4 pixels) with the average color value of the pixels in that block. Look at the Pixelate->Mosaic filter in photoshop for an example of what this image operation does. Demonstrate your new class by drawing an image with several different block sizes. | ||
+ | <br><br> | ||
+ | |||
+ | http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_3/01/A3-01.jpg | ||
+ | <br> | ||
+ | <br> | ||
+ | |||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_3/02/ A3-02 ] | ||
+ | Write a small app that demonstrates kinetic text. Your app should allow the user to type something and move the text around in some way while they type. For example, the user might type text on a line, but slowly the words or letters start drifting apart, or perhaps the line starts bending, or the words and letters flutter to the bottom of the screen, etc. Of course you shouldn't exactly copy any of the typographic in Processing or that you find on the web (though using such examples for inspiration, as a place to start modifying code, etc. is fine). | ||
+ | <br><br> | ||
− | + | http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_3/02/A3b.jpg | |
− | + | <br> | |
− | + | <br> | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
=== Assignment 2 === | === Assignment 2 === | ||
− | === Assignment | + | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_01/ A2-01]''Using beginShape() and endShape(), create a composition with five or more vertices.'' |
− | + | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_02/ A2-02]''Using beginShape() and endShape(), create a composition with ten or more vertices.'' | |
− | + | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_03/ A2-03]''Create an image different from A2-02, but using the same vertex data.'' | |
− | + | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_04/ A2-04]''Write a function with one parameter and demonstrate it visually.'' | |
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_05/ A2-05]''Write a function for drawing triangles and visually demonstrate its flexibility.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_06/ A2-06]''Write a function with three or more parameters and visually demonstrate its flexibility.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_07/ A2-07]''Create a dynamic animation using the cos() function as a generator for motion.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_08/ A2-08]''Create a dynamic animation using the cos() and sin() function as a generator for motion.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_09/ A2-09]''Move two visual elements across the screen using the random() function as a generator of movement. Give each element a unique nonlinear motion.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_10/ A2-10]''Create an event that begins when the mouse is pressed and ends when the mouse is released.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_11/ A2-11]''Create a responsive image that behaves differently when the mouse is moving and the mouse is dragging.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_12/ A2-12]''Create a button that changes the color of the background when it is clicked.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_13/ A2-13]''Program your moving elements from A2-09 but use classes to represent the two visual elements.'' | ||
+ | |||
+ | ::'''A2-01 thru A2-13 Due: Tuesday October 6''' | ||
+ | |||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_2/a2_14/ A2-14]''Create a subclass of one of the asteroids classes that adds a new capability. Some examples of what you could do: create a subclass of Rocket (or ArmedRocket) that shoots flame when the thrusters are fired and/or plays a sound when thrusters are fired, create a subclass of Asteroid that know when it's been hit (instead of doing this test in loop()), create a subclass of Asteroid that splits into two smaller Asteroids when it's hit.'' | ||
+ | |||
+ | ::'''A2-14 Due: Thursday October 8''' | ||
+ | |||
+ | === Assignment 1 === | ||
+ | |||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_01/ A1-01]''Draw three lines.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_02/ A1-02]''Draw five lines.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_03/ A1-03]''Draw three ellipses.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_04/ A1-04]''Control the position of two lines with one variable.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_05/ A1-05]''Control the position and size of two lines with two variables.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_06/ A1-06]''Control the properties of two shapes with two variables.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_07/ A1-07]''Create a simple, regular pattern with six lines.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_08/ A1-08]''Program your pattern from Assignment 1-07 using while().'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_09/ A1-09]''Draw a layered form with two new loops.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_10/ A1-10]''Redo Assignment 1-05 using mouseX and mouseY as the variables.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_11/ A1-11]''Draw two visual elements that each move in relation to the mouse in a different way.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_12/ A1-12]''Draw three visual elements that each move in relation to the mouse in a different way.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_13/ A1-13]''Move a visual element across the screen. When it disappears off the edge, move it back into the frame.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_14/ A1-14]''Draw a visual element that moves in relation to the mouse, but with a different relation when the mouse is pressed.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_15/ A1-15]''Using if and else, make the mouse perform different actions when in different parts of the window.'' | ||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_1/a1_16/ A1-16]''Develop a kinetic image which responds to the mouse.'' | ||
==Projects == | ==Projects == | ||
+ | |||
+ | === Project 3 === | ||
+ | |||
+ | PART 1: | ||
+ | |||
+ | * I plan to deliver an interactive visual art project. The user is provided with buttons and sliders to reveal hidden layers, and change how portions of images blend together. By allowing the user to play within the content, I am inviting them to investigate how meaning is created through the juxtaposition of visual elements. | ||
+ | |||
+ | * I'm hoping to use the 'controlP5' library to build an interface that can control a variety of 'blend()' modes and trigger alpha masks. The visual will be constructed out of photographs/drawing from my own work. | ||
+ | |||
+ | * First, I will establish what source material to use, and how elements can collaborate through blend modes (i.e. screen, multiply, subtract etc.). Simultaneously, I will select buttons/sliders from the library that can be given functions for the user to explore. | ||
+ | |||
+ | * In phase II of the project, I will wish really, really hard for magical programming pixies to spin my project into gold for me overnight... If they fail to materialize, I will attempt to program it myself from the knowledge I've gained through our past assignments/projects. I'm confident I can construct the project I'm envisioning, although it's complexity may be affected by any obstacles I encounter in the programming process. | ||
+ | <br> | ||
+ | |||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/project_3/ Play with the final project!] | ||
+ | |||
+ | |||
+ | http://www.sfu.ca/~eashenhu/courses/iat_800/screen_slices.jpg | ||
+ | |||
+ | === Project 2 === | ||
+ | |||
+ | Proposal: Painting the Narrative | ||
+ | |||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/project_2/IAT800project2_ex.jpg an example] | ||
+ | |||
+ | My project will start with an image of two people. There is a sentence above them containing key words that are different colours in relation to emotional content (i.e. 'angry' = red). The user can click on the key works and their mouse will take on the colour of the word. Moving the mouse allows the user to paint with the colour, while clicking the mouse will draw punctuation characters (i.e. 'angry' = red, and '!'). The user can use the emotional content of the sentence to colour and punctuate the scene. | ||
+ | |||
+ | *[http://www.sfu.ca/~eashenhu/courses/iat_800/project_2/applet_2/ Project 2: Painting the Narrative] | ||
+ | |||
+ | <br> | ||
+ | |||
+ | http://www.sfu.ca/~eashenhu/courses/iat_800/project_2/paint.jpg | ||
+ | <br> | ||
+ | <br> | ||
=== Project 1 === | === Project 1 === | ||
− | + | *[http://www.sfu.ca/~eashenhu/courses/iat_800/project_1/ Insomnia! ] ''Display the progress of time in a non-traditional way.'' | |
− | + | <br> | |
− | + | http://www.sfu.ca/~eashenhu/courses/iat_800/project_1/insomnia.jpg | |
− | + | <br> | |
− |
Latest revision as of 23:51, 10 December 2009
Contents
Assignments
Assignment 4
- Painting the Narrative: new + improved Use a widget set of sliders, menus, and buttons to control the display.
Assignment 3
Create a subclass of PImage that implements a: mosaic( int blockSize ) method.
The blockSize parameter specifies how big the mosaic block is (e.g. blockSize = 4 would mean the mosaic block size is 4 pixels by 4 pixels). The mosaic method should replace each block of pixels in the image (e.g. if blockSize = 4, each block of 4 by 4 pixels) with the average color value of the pixels in that block. Look at the Pixelate->Mosaic filter in photoshop for an example of what this image operation does. Demonstrate your new class by drawing an image with several different block sizes.
http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_3/01/A3-01.jpg
Write a small app that demonstrates kinetic text. Your app should allow the user to type something and move the text around in some way while they type. For example, the user might type text on a line, but slowly the words or letters start drifting apart, or perhaps the line starts bending, or the words and letters flutter to the bottom of the screen, etc. Of course you shouldn't exactly copy any of the typographic in Processing or that you find on the web (though using such examples for inspiration, as a place to start modifying code, etc. is fine).
http://www.sfu.ca/~eashenhu/courses/iat_800/assignment_3/02/A3b.jpg
Assignment 2
- A2-01Using beginShape() and endShape(), create a composition with five or more vertices.
- A2-02Using beginShape() and endShape(), create a composition with ten or more vertices.
- A2-03Create an image different from A2-02, but using the same vertex data.
- A2-04Write a function with one parameter and demonstrate it visually.
- A2-05Write a function for drawing triangles and visually demonstrate its flexibility.
- A2-06Write a function with three or more parameters and visually demonstrate its flexibility.
- A2-07Create a dynamic animation using the cos() function as a generator for motion.
- A2-08Create a dynamic animation using the cos() and sin() function as a generator for motion.
- A2-09Move two visual elements across the screen using the random() function as a generator of movement. Give each element a unique nonlinear motion.
- A2-10Create an event that begins when the mouse is pressed and ends when the mouse is released.
- A2-11Create a responsive image that behaves differently when the mouse is moving and the mouse is dragging.
- A2-12Create a button that changes the color of the background when it is clicked.
- A2-13Program your moving elements from A2-09 but use classes to represent the two visual elements.
- A2-01 thru A2-13 Due: Tuesday October 6
- A2-14Create a subclass of one of the asteroids classes that adds a new capability. Some examples of what you could do: create a subclass of Rocket (or ArmedRocket) that shoots flame when the thrusters are fired and/or plays a sound when thrusters are fired, create a subclass of Asteroid that know when it's been hit (instead of doing this test in loop()), create a subclass of Asteroid that splits into two smaller Asteroids when it's hit.
- A2-14 Due: Thursday October 8
Assignment 1
- A1-01Draw three lines.
- A1-02Draw five lines.
- A1-03Draw three ellipses.
- A1-04Control the position of two lines with one variable.
- A1-05Control the position and size of two lines with two variables.
- A1-06Control the properties of two shapes with two variables.
- A1-07Create a simple, regular pattern with six lines.
- A1-08Program your pattern from Assignment 1-07 using while().
- A1-09Draw a layered form with two new loops.
- A1-10Redo Assignment 1-05 using mouseX and mouseY as the variables.
- A1-11Draw two visual elements that each move in relation to the mouse in a different way.
- A1-12Draw three visual elements that each move in relation to the mouse in a different way.
- A1-13Move a visual element across the screen. When it disappears off the edge, move it back into the frame.
- A1-14Draw a visual element that moves in relation to the mouse, but with a different relation when the mouse is pressed.
- A1-15Using if and else, make the mouse perform different actions when in different parts of the window.
- A1-16Develop a kinetic image which responds to the mouse.
Projects
Project 3
PART 1:
- I plan to deliver an interactive visual art project. The user is provided with buttons and sliders to reveal hidden layers, and change how portions of images blend together. By allowing the user to play within the content, I am inviting them to investigate how meaning is created through the juxtaposition of visual elements.
- I'm hoping to use the 'controlP5' library to build an interface that can control a variety of 'blend()' modes and trigger alpha masks. The visual will be constructed out of photographs/drawing from my own work.
- First, I will establish what source material to use, and how elements can collaborate through blend modes (i.e. screen, multiply, subtract etc.). Simultaneously, I will select buttons/sliders from the library that can be given functions for the user to explore.
- In phase II of the project, I will wish really, really hard for magical programming pixies to spin my project into gold for me overnight... If they fail to materialize, I will attempt to program it myself from the knowledge I've gained through our past assignments/projects. I'm confident I can construct the project I'm envisioning, although it's complexity may be affected by any obstacles I encounter in the programming process.
http://www.sfu.ca/~eashenhu/courses/iat_800/screen_slices.jpg
Project 2
Proposal: Painting the Narrative
My project will start with an image of two people. There is a sentence above them containing key words that are different colours in relation to emotional content (i.e. 'angry' = red). The user can click on the key works and their mouse will take on the colour of the word. Moving the mouse allows the user to paint with the colour, while clicking the mouse will draw punctuation characters (i.e. 'angry' = red, and '!'). The user can use the emotional content of the sentence to colour and punctuate the scene.
http://www.sfu.ca/~eashenhu/courses/iat_800/project_2/paint.jpg
Project 1
- Insomnia! Display the progress of time in a non-traditional way.
http://www.sfu.ca/~eashenhu/courses/iat_800/project_1/insomnia.jpg