Link : https://preview.p5js.org/valerynfang/present/UiomL-_nX
The interactive drawing allows the users to create circle whenever the mouse is hovered on the program and if the user clicks on the program, a line will be drawn. At first, the circles made was too opaque and the line would be covered by the circles. After reading the reference, I made the circles more transparent in order to be able to see the lines. The colors were specified by the x-value using the if condition.
- In my interactive drawing, I used the variable r,g,b and make it a local variable to allow r,g,b to be referenced in any part of the code. This variable is used to indicate the colors of the circles in the code. PrevX and PrevY is used to locate the previous x and y location of the mouse. X and Y is used to locate the current x and y location of the mouse. Using X,Y,PrevX and PrevY allows me to make a line where the user clicked on the program.
- The difference between mousePressed() and mouseIsPressed() is that mousePressed is a function that execute once when user clicks on the mouse. It can also be used to find out where the mouse is clicked. mouseIsPressed() returns boolean value such as True or False. It detects if the mouse is being pressed or not. True being mouse is pressed and False being mouse is not pressed.
- The if, else if and else conditions are used to indicate which colors should be shown in the program. Every 50 points in the x direction, the color will change. It was also used to make a line if mouse is pressed and make the colorful circles if mouse isn’t pressed.