Sketch Drawing Experience
The process of learning how to draw an image with JavaScript was a surprisingly encouraging one. After watching the Coding Train videos I was able to make a lot more shapes and follow along with the logic of the code than I thought I would be able to. I often referred to the p5.js reference page for ideas about which shapes I could make and the syntax of the code. For most shapes I was able to trouble shoot my way through.
The thing that I found the most challenging was getting used to how to define points for the line, the arc and the quad. For example, 4 points make up the quad and each point has a specific x,y location which means that you need 8 numbers to specify the shape of a quad: quad(200, 100, 340, 180, 250, 120, 230, 16);. This became confusing because I would forget which number changed which position of the quad.
Unsolved Mysteries:
How do I get the arc to rotate? At this point I used the arcs for the eyebrows on my self portrait, I originally wanted them to be facing down however, I couldn’t figure out how to change their position. I actually like the eyebrows now because the portrait looks quite confused but that was not my original intention.
I was not able to get ellipseMode(CENTER); to work for my code. When I added the line of code it would not center my ellipse. Instead I did the math to figure out what the coordinates of my ellipse should be in order for it to be centered.
ellipseMode(CENTER); IS NOT WORKING:
SELF PORTRAIT CODE:
SELF PORTRAIT:
