Peer Work (Classwork Oct 24th)

color square

For the peer work, I teamed up with Brandon. During the duration of the class, Brandon and I agreed to try to accomplish code that can get done in time while the codes we are both explaining to each other is understandable enough to make it work.

So for the two programs, the goal was to try to fit in with Google’s Material Design color scheme while having both programs interactable.

For the first program, Brandon was directing and the driver while I was the scribe.
Brandon wanted to accomplish displaying a square in the middle of the screen while being able to set up statements for the interactivity part and global variables.

The difficulty with the first program was setting up the statement for the interaction. The problem was getting the locations correct inside of the square of being able to detect when to change the square’s color when the canvas detects the mouse cursor. After tweaking with the location coordinates of mouseX and mouseY, the detection worked out in the right places of the square of the canvas. Another thing that was worked on was getting three color complements fill with each other while aligning with Material Design’s color scheme. By using colors that fit with the scheme and contrasting each color one by one, they all worked out really nailing the Material Design look.

falling square

For the second program as the work required, Brandon and I switched role. This time I was the driver and directing while Brandon was scribing.

In this program, I still wanted to keep going for the Material Design look. In comparison to the previous one, decided to have a square falling down off the canvas through vertically while being able to move the mouse to add the interactivity.
The main focus for this program was setting up class and object. Whenever the canvas detects the mouse cursor moving left or right inside the display, the mouseX inside rect allows the square to follow the cursor while it is falling down.