Creative Coding Lab | Mini Project #1

Project Title: Bed Sketch. 

 

The concept of this project is to draw a sketch of the scene around me and turn it into a computer painting created by my own code. As a beginner in programming, I took a picture of my dorm full of squares and rectangles to become familiar with creating 2D shapes.

Final Draft

Click here to see my code and the result:

https://editor.p5js.org/GwangunKim/sketches/Opqi43fIZ 

Progress

This is the photo and the sketch of my dorm. 

 

 

 

 

 

 

 

 

 

 

And this is the first code that I made. It lacks an order or comments about what kind of shapes I am making. It was fine at the beginning, but when the number of shapes increased I sometimes lost the location where I wanted to add some new forms. 

 

 

 

 

 

 

 

 

Thus, I commented on every shape that I created to make the entire code look clear. 

 

 

 

 

 

 

 

 

Additionally, as the painting looks flat and monotonous, I added some light and shade to make it look more like three-dimensional. See the result:

 

 

 

 

 

 

 

 

 

It looks better, but the strokes of the shadow make the painting somewhat awkward. Thus, I used the noStroke() function to erase the strokes at first, but the result came out like this: 

 

 

 

 

 

 

 

 

What I intended to do was just erase only the strokes of shadow, so I surfed the references and learned the use of push and pop functions. Then, the final result came out like this:

 

This is the final version.

Reflection/Lessons Learned

 

Exploratory programming or References?

To create shapes through exploratory programming, although it improved the understanding of using the function by taking steps one by one, it took a long time. Also, references on the website made me realize there are simple ways to create polygons such as vertex() and curveVertex() functions, not just overusing 2D primitives. Therefore, I believe properly utilizing exploratory programming and references is the most efficient way for encoding. 

 

Drawing a sketch or Writing a code?

Drawing on a piece of paper, we do not need to find coordinates to start a point of one shape. There is less limitation in creating something such as lines, shapes, and structures. However, when putting some colors on them, writing a code is more time-efficient and accurate. For instance, I used “Digital Color Meter”, a program of Macintosh, and it helped me to find the exact color of my room with a specific color range(RGB).   

Leave a Reply

Your email address will not be published. Required fields are marked *