Question: This is in Javascript using the P5 library Using the draw() function, create a sketch that changes over time! This sketch can take one of

This is in Javascript using the P5 library

Using the draw() function, create a sketch that changes over time! This sketch can take one of two directions;

You can create a character of some sort (similar to last week) that moves

You can create an abstract image that changes over time.

Remember, the key to creating a dynamic sketch is to have function arguments that change overtime, between subsequent iterations of the draw() loop.

Specs:

This sketch should include (all of these):

Obvious change over time (animation).

This means that the meat of your work will be in the draw() function.

You will need to use the setup() function to setup your sketch. This includes;

createCanvas()

Your sketch should leverage variables to store data, alter data, and pass data around.

Remember, you use the var keyword to define a variable symbolic name.

Remember, variable naming conventions and style guides.

w3schools variable tutorial

multi-word conventions

Pay attention to scope.

i.e. where you define a variable and how it is used.

Remember, variables defined outside of setup() and draw() are available globally.

Variables defined in scope and draw are only available to the function they are in.

Variables defined inside draw() will be reset every loop.

i.e. The following will result in the value 2 every time;

draw(){ let incrementingNumber = 1; incrementingNumber = incrementingNumber + 1; } 

Your sketch should include, 1 element that changes over time, independently of the mouse (i.e. use variable math).

Your sketch should include, 1 element controlled by the mouse.

mouseX

mouseY

Your sketch should include, 1 element that is in relation to the canvas size.

You will need to use the width and/or height environment variables to do this.

Step by Step Solution

There are 3 Steps involved in it

1 Expert Approved Answer
Step: 1 Unlock blur-text-image
Question Has Been Solved by an Expert!

Get step-by-step solutions from verified subject matter experts

Step: 2 Unlock
Step: 3 Unlock

Students Have Also Explored These Related Databases Questions!