Course review

I am glad to be here to learn the processing and arduino program in this semester. I was not familiar with this new subject that I never learned before. I thought it should be very difficult to me, but it not that hard as long as I have to take lots of efforts to understand the whole things.

I think I learned a lot from this class. Like how to write a program to make a picture more active and vivid just like making a Flash player animation. I am kind of impressed by the performance of the processing program. It is really useful to deal with those pictures to make them have various effects.

Especially, I prefer the project task most. I feel somehow amazing about the arduino mechanism, because it can connect with processing program to achieve the desired performance. I face a lot of difficulties to initiate our project at the beginning, but fortunately our teacher helps me a lot. I am deeply appreciated his kindness and patience. I am pleased with the way of teacher's instruction. The pdf file also provides sufficient information that involved in the practices. It indeed helps me a lot during the exercise.

I consider that exercise is much more helpful than having a test for better learning about this course. I can learn much more from that. Although I only take this course for one semester, at least I have an overview about processing and arduino program.

HW12- Arduino Piano Show

Processing Project Design --- Vicky & Silvia

HW7-Some Cases Studies

HW07-1: Coordinate system translation

In this exercise, I got a picture about how to use translate() and rotate() functions. It's quite useful to perform translation of the shape to the desired position. When I was working on this practice, I drew three rectangles with diverse colors and rotating angles by applying rotate(angle) syntax. Then, the most important thing that I need to notice is the effects of rotation are cumulative. I also found that while I using rotate() after a translate() will generate a different effect than the reverse. After I finished the work, I have earned more experience about transforming shape to any position.

HW07-2: Easing Motion

To continue the previous exercise, this time I just need to rotate those three rectangles by introducing a variable "easing". Then, I made the rotate(angle) function multiplied by a "easing" value which will increase every time by means of adding "easing++" command. So that these rectangles can start to rotate. After this assignment is done, I also use frameRate() syntax to control the rate of rotation. In the beginning, I was thinking that it must be a tough task, but after the easing variable comes out, everything go along in the right direction.

HW6-Image Animating Application

HW06:

http://icac.no-ip.org/silvia/HW06/applet/

This practice is respecting the application of buttons which would generate specific effects by carrying out some syntaxes. In this case, we introduce a couple of variables to be declared in advance. Then, I placed the simple loop code in each if-else statement to execuate those effects which are including minimize, maximize, fadein, horizontal and vertical moving the picture. After those assignments are done, the picture can start to move by clicking on the buttons. This time, I think it's more complicated than before. Because there are many buttons need to be designed and how to figure out setting the exactly right code in there is a kind of tough task.

HW5-Image Applications

HW05

http://icac.no-ip.org/silvia/HW05/applet/


Continuing last week work, I start to work on the application to buttons by using processing program. It's not so tough to create buttons, the most complicated thing is to arrange the limitation of those buttons. To complete this work, if-else statement is available to use. Namely, I only have to think about the conditions of each "if" statement to deal with the buttons which we can change pictures every time by clicking it. After setting out all the if statements, then the work is done. Now, I can click buttons to change the loading pictures in order since I make both front and back pictures start from the first one. "If" statement is kind of useful to accomplish this task and it seems to be the utilization of C language. And it's out of my expectation that we can perform those drawing by using C language. But actually, it indeed make it!

HW4- Text & Image

HW04-1:

http://icac.no-ip.org/silvia/Silvia_96160552_HW04/HW_04_1/applet/

To continue using drawing board which I have done last week, at this time I start to import font file which has been installed in the computer to display texts. In order to complete this task, I can use loadFont() syntax to load the font. Once the font is generated, I can show characters to the screen by using text() syntax. About text() syntax, all I need to fix is to find out the proper coordinate of X and Y to put the characters in a specific location of rectangles. In addition, textSize() is also available to modify the size of font. Moreover, if I want to save what I have drawn on the board to a file, the save() function is accessible to use. It's pretty much astonishing when my drawing is certainly saved. So far, I have accomplished most of things on my drawing board. I got plenty of experiences in doing processing program and it indeed interesting than I thought.

HW04-2:

http://icac.no-ip.org/silvia/Silvia_96160552_HW04/HW_04_2/applet/

Finally, we can showcase everyone's marvelous works by loading images to match back and front pictures randomly. It comes out a variety of results that really attractive to me. It's really amusing when I saw the outcome.

HW3- Interaction with mouse

HW03-1:

http://icac.no-ip.org/silvia//Silvia_96160552_HW03_1/applet/

In this exercise, I am more familiar with the for-loop function. However, I got stuck in the problem which we have to make the circles moved while moving the cursor at the same time. I have no idea about doing this in the beginning. Fortunately, I can use mouseX and mouseY to deal with this task. All I need to know is to calculate the center of the display window which is (400, 300). While the mouse start moving, mouseX and mouseY values are 0, then I can use println(mouseX+" "+mouseY) to see where the exact position of moving cursor. Finally, I can define specific values to divide mouseX coordinate and mouseY coordinate respectively to make the eyes move around with cursor. I think "mouseX and mouseY " is fantastic because it makes picture move and it looks like more vivid than it used to be.

HW03-2:

http://icac.no-ip.org/silvia//Silvia_96160552_HW03_2/applet/

Respecting this case, I think everything is ok for me. The only
thing I need to memorize is the difference between setup() and
draw() functions. The commands in setup() will only execute
once not like draw() can be redid and renewed again. That's
what I learned from my mistakes. After that, I use one more code
"mousePressed == true" in "if" statement which means after
mouse clicked on the display window the following code will be
executed. Once I can draw a line,then I have to find out the X
coordinate and Y coordinate of each rectangle. So that, I can
define the values to limit the movement of mouseX and mouseY
in the rectangles. Afterward, I am able to change the weight of
strokes and even colors by using strokeWeight() and stroke()
functions. That's the way of what I have done last week. It was a
really fabulous experience that I am able to use processing
program to generate a drawing board which is closely similar to
the basic application of paint tool.

HW2-Repetition

HW02-1

(a)

(b)

HW02-2

HW02-3

In the fist exercise, I've learned how to use loop function to generate 100 rectangles with random colors, positions, and sizes. In the beginning, I thought that it must be a tough task to command each rectangle with random conditions. Afterward I finally figured out how to collocate random() function with rect() and fill() functions which we have known from last week lecture. I found that random() function is really useful while creating any graphs in random way.

The second one, I think the chanllage is to generate random rectangles in evey second which means the pitcure will rechange constantly. I think it's interesting and it seems like a flash. Even though I have no idea about how to make it change in every second. Then, I found the frameRate() syntax which can order this mission. Another one that really drew my attention is setup() and draw() function. In order to declare frameRate() syntax, I need a setup() function to define this condition. In the end, I also can use draw() to define the generation of rectangles which have been completed in the previous exercise.

About the third one, what I have learned is to use two for loops creating diverse pictures. Nesting for loops can be appllied in color, size, and position. It's really a practical syntax that can make program more concise.

The last one, all I have to do is to find out the coordinate of the center of the circle. So that I can define two values x and y which represent x axis and y axis. Then, I can declare the values of x and y condition in the for loops functions. In addition, I used setup() to define background color and the size of picture. I also used draw() to declare for loops functions, fill(), and ellipse(). Finally, I used paint tool to find the specific vaules of RGB for the colors of background and three circles. In that way, I can simulate the picture completely. All I have learned is using for loops function. It really helps a lot in simulating pictures.

HW1

using paint tool

original pic download from internet

using processing program

I think it's a brand-new course for us. I have never learned it before. During the class, I've known a little bit concepts of processing, and I found it a useful tool that can make our simulating work more easier and quicker. Because when I used the paint tool to simulate the picture, I encountered a great difficulty in drawing a curve so that make my simulation looks like totally differdent from the original one. I'm sorry about that! But, afterward the processing program finally solve this problem. In addition, I found that the processing is using different programming language from others that we have learned, and I think it will be helpful to simulate mcuh more complicated pictures in a accurate way. I look forward to learning much more about processing and get lots of fun from this class.