Drawing with Code

Brief Description and Concept: In the Creative Coding class, our first exercise is to create static computer graphics with drawing functions in p5.js. Given three instructions, we began by taking a picture of an area at home, taking objects with geometric shapes into account. Secondly, we drew a physical sketch of the photograph with basic shapes. Lastly, we re-illustrated the drawing with 2D primitive shapes in p5.js with at least three different shapes and colors.

Demo/Visual Documentation:

=

Coding:

Link: https://editor.p5js.org/ll4866/sketches/P6dQbVfi0

 

Reflection/Lessons Learned Questions: 

• Did you prefer exploratory programming, or using the reference? Why? Could you imagine a situation where you would use the other technique?
• In which ways (if any) was drawing on a piece of paper (as we did in our exercise) easier than writing the program?
• In which ways (if any) is writing the program easier than drawing on the piece of paper?

Response:

From the beginning, I have been using the reference as a basis to comprehend functions. At first, I followed the instructions on how to code objects as a basis for understanding how p5.js works. Afterward, I began exploring how each element in the script alters the resulting image.

In comparison to drawing on paper, programming requires consideration of specific instructions. In other words, drawing on paper has more freedom than coding. The reason is that humans subconsciously skip some action instructions and estimate/predict how, when, and where to follow specific actions. Meanwhile, in coding, every single script line takes a significant role in the function. One miswriting or missing symbol could mess up the whole program. Additionally, the order of objects also takes an essential factor to consider. In having different coding, the resulting image can be vastly different from the expected one. For instance, when the “fill” function is not carefully placed results in all the objects having the same color.

Reversely, programming is faster than drawing if you have the whole picture in mind. In programming, coloring and drawing only require a few words to complete. It is easier and more precise than hand drawing. Drawing by hand is illustrating an idea from feeling and imagination. Building with code is producing an image in mind with perfect shapes. Both styles have their pros and cons. Hand drawing can give objects more emotions and impressions that coding cannot. Meanwhile, constructing with code produces an accurate image of an idea.