Programming language: Java for Processing

A3 (30 marks) Focus: Using Variables to Control Animation Q1. (+15) Create a program that animates the creation of shapes similar to the ones below: Example 1 Example 2 Example 3 Animation: mp4, gif Animation: mp4, git Animation: mp4,gif Download the starter code and then complete the missing code in order to create the above animations. The basic idea is as follows (see the diagrams below): Draw a line in each new frame without clearing the previous frames. The start and end points of the line should constantly move along the circumference of two circles located at the sketch center. Use circle equations: x = r cos 8 and y = r sine to determine the position of the points Animate the angle for the two points at different speeds. ( .) ya) frame 1 frame 2 frame o Marking Guide: mark breakdown is shown in the starter code OUTER R Q2. [+5) Add more code to your design in order to also animate the color of the line. A sample output is shown below. Hint: use HSB color mode. -480 Bone The EPL 553 en Marking Guide: +4 for assigning rainbow colors to the lines as in the screenshot. +1 for not overusing one color over the others. That is, when your reach the end of the color spectrum, you should start all over again, i.e. color1 color2 ... color255 color 1 color 2 etc Q3. (+10) Write code the results in this animation: mp4 or gif. Follow these steps: a. Create a still design first. Note that you will need to transform the coordinates to properly produce the required design. b. Identify the attributes that need to be animated. In this example, you will need to animate (1) the coordinates UBC scale and angle, and (2) the transparency of all items. C. Create a variable for each attribute you want to animate. In this example, you will have exactly three variables for scale, angle, and transparency. d. Replace that attributes' values with the variables. e. Slightly modify that variables at the end of each frame. Marking Guide: This question is worth 20 marks distributed as follows: +2 for correct design. +2 for correct transformation +6 for animating 3 attributes: scale, angle, and transparency (+2 each) A3 (30 marks) Focus: Using Variables to Control Animation Q1. (+15) Create a program that animates the creation of shapes similar to the ones below: Example 1 Example 2 Example 3 Animation: mp4, gif Animation: mp4, git Animation: mp4,gif Download the starter code and then complete the missing code in order to create the above animations. The basic idea is as follows (see the diagrams below): Draw a line in each new frame without clearing the previous frames. The start and end points of the line should constantly move along the circumference of two circles located at the sketch center. Use circle equations: x = r cos 8 and y = r sine to determine the position of the points Animate the angle for the two points at different speeds. ( .) ya) frame 1 frame 2 frame o Marking Guide: mark breakdown is shown in the starter code OUTER R Q2. [+5) Add more code to your design in order to also animate the color of the line. A sample output is shown below. Hint: use HSB color mode. -480 Bone The EPL 553 en Marking Guide: +4 for assigning rainbow colors to the lines as in the screenshot. +1 for not overusing one color over the others. That is, when your reach the end of the color spectrum, you should start all over again, i.e. color1 color2 ... color255 color 1 color 2 etc Q3. (+10) Write code the results in this animation: mp4 or gif. Follow these steps: a. Create a still design first. Note that you will need to transform the coordinates to properly produce the required design. b. Identify the attributes that need to be animated. In this example, you will need to animate (1) the coordinates UBC scale and angle, and (2) the transparency of all items. C. Create a variable for each attribute you want to animate. In this example, you will have exactly three variables for scale, angle, and transparency. d. Replace that attributes' values with the variables. e. Slightly modify that variables at the end of each frame. Marking Guide: This question is worth 20 marks distributed as follows: +2 for correct design. +2 for correct transformation +6 for animating 3 attributes: scale, angle, and transparency (+2 each)