Kristina You is a multidisciplinary designer based in New York, NY and a recent graduate from the ITP Program at NYU. Her practice focuses on UI/UX, interaction design, print design, and brand development.


︎︎︎Introduction to Computational Media

Week 7 Exercise





Practice Questions 


1.Draw an ellipse (or circle) at the position of the mouse and shift the background color from black to white as you move the mouse from left to right






2.Write a program that draws or paints something on the canvas every time you move the mouse, and when you click the mouse, change the color of the brush to a random color.





3.Write a program that implements this rollover. In other words, if the mouse is over the circle, the circle changes color.






4.Recreate this image with a for loop. If you need to, review your code in Week 4’s exercises.






5.Recreate this image with a nested loop. What shape is repeating? HINT: Try drawing one column or one row first with a loop. Then add a second, nested loop.






6.Draw a face / flower / something (different from Week 5’s exercise), and then create a drawFace( ) / drawFlower( ) / drawSomething( ) function that takes in arguments (aka parameters) for the location, size, color, etc. to draw your face / flower / something several times on the canvas.





7.Use the starter code to write a program that implements the example sketch in the link. First, draw the first word from the words array on the canvas. And everytime when the mouse is pressed, draw the next word from the array of words. Use a variable called, index, to represent the index of each word in the array. Finally, if the index equals the length of the array, make index 0 again.






8.Complete Question 3 of ICM Quiz 5: Object and Arrays (scroll down). Use the starter code to write a program that implements the example sketch in the link.

Step 1: Create a Bubble class, and make a single



Step 2: Use a for loop to create an array of 100 bubble objects with the class you created.





9.Use the starter code to write a program that implements the example sketch in the link. When the mouse is dragged, create a new bubble object at the mouseX, mouseY position, and add it to the bubbles array. If there are more than 20 bubbles, delete the first bubble object in the bubbles array. Use the push( ) and splice( ) methods to add and remove objects from an array.





10.Use the starter code to write a program that implements the above sketch. Create a function called, clicked( ), for bubble objects to check if the mouse is on the bubble. If yes, change the color of this bubble.





11.Use the starter code to create an HTML element that is a button. Attach a function to the button's mousePressed( ) event; this is called a callback function. In the callback function, set a random background color.





12.Use the starter code to create an HTML element that is a slider that controls the size of an ellipse.






13.Write a short blog post reflecting on this week's practice questions and the topics from the first half of the semester:

What do you feel confident about?

-At this point, I definitely feel confident in many of the concepts that we have gone over multiple times such as for loops, creating an array,  and creating my own functions. I think I feel confident enough in the material we have covered so far to go further with the projects and assignments in the future. 

What would you like to practice more?

-I definitely would like to get more practice in concepts that we learned recently such as creating buttons, sliders, and using multiple combinations of functions in one sketch because those are the ones that I tend to struggle with and usually have a difficult time solving the errors that occur. For example, I did struggle with #5 of this assignment with using nested loops.

Is there anything else that you would like to learn more about, including and beyond our weekly topics so far?

-I do really enjoy learning new examples of ways to implement the materials that we have covered so far and I think that the most helpful part is when we learn new material in class and repeat them through exercises in different circumstances. It really helps the concept become engrained and makes more sense as I become more accustomed to each function. 





















︎︎︎ BACK TO ITP BLOG



Last Updated:  April 9, 2023
kristinayou00@gmail.com