Project #1
Lost and Found
1.1 Coffee Grinder created by using P5.js View the Code
Description
This is a coffee grinder that Kevin Lin lost before.
Here is the description from him:
A manual coffee grinder. It has a wooden base as the lower half, a metal upper half. You can separate them, it has room inside for coffee powder. On the top of the grinder, there is a thin metal handle with a wooden knob at its end.
Design Process
I broke down the coffee grinder into smaller shape like rectangle and cicrle. I drawed it on the paper, and adjusted the size to match how I pictured in my head before.

1.2 Hand-Drew Coffee Grinder

1.3 Hand Written Pseudocode:
Reflection
Partner's Description
Kevin depicted the coffee grinder with simple and direct description. He captured and describe the most essencial part of the object and describe them in a 3D dimension. Although I did not approach the image as 3D in my drawing, but I did have a really vivid image in my mind. As a result, I was able to quickly form a 2D primitive drawing on my canvas.
Drawing & Pseudocode
When I draw the coffee grinder on the my paper, I form it with really simple shape and straight-line to have a overall feeling of this object. And then, I imagined the color of each part in my mind before heading to the pseudocode. I originally wanted to add texture to the image, but I failed to apply it at the end. Hope I will be able to figure it out in close future.
Differencces between Drawing & Coding
The pseudocode was deveoped based on my drawing logic, which is drawing the shape
and filling the color. In actual coding process, the logic is a little bit different
from the order that we are drawing in an actual physical world. In coding, I need to
set the color for the shape and line before "drawing" on canvas. After careful consideration,
the coding logic is also making sense, because, in real world, we may also need to
pick the color and the size of the pen before drawing the stoke on paper. Although the major
difference is that we have choice to fill in the color of our pictures after finishing the
shape, but the computer seems don't. In P5.js, we need to decide the color and size before
actually "drawing" it. As a result, I took sometimes to understand the computer's logic on drawing,
before I actually did the actual coding.
On the other hand, the position adjustments on digital canvas also consumed a
lot of time. When I drew on paper, I could simply connect one shape's side with another
without doing any mathmatical caculation. When I coded using P5.js, I needed to try and
error in order to locate the ideal position for each shape. Since the circle and rectangle
shape starting point is different, I need to pay extra attention on this situation when I
typed down the starting X,Y point in my code.
Last but not least, the hand-drew picture is more like a random sketch, but the
drawing, that happened in digital platform, is more like a static line combination with
perfect allignment and shape. As a result, the digital version coffee grinder is more
visiually appealing and united compared to the hand-drew version.
Credits
This project was created based on the drawing from my CC Lab partner Kevin Lin, and creating the object using P5.js Editor on a digital canvas.