Individual fade of two structures

p5.js Libraries
1

Hi there,

In the project (link below) I would like to add some functionality:

https://editor.p5js.org/byxx/sketches/pGtCNkcq

The green and red structure should be able to be faded in and out individually

Case1: During the red structure is visible, the green structure is faded in and out
Case2: Vice versa

This all should happen to be synchronized to the beat counts.

My main problem: At the moment it seems to be impossible to keep one structure visible as the other one is animated independently…

I guess there will be some refactoring necessary later on
But it is not the first step now, as I think it is close to become functional, working with the code here so far.

Thanks for your time and patience

1 Like
2

My advice is to start a new sketch to understand just this problem, apart from the complexity of your bigger project. Use a red circle and a green circle. Ignore the grids and symbols and backgrounds and data.

Notice that you need to be able to manipulate red or green independently. In theory, you could have 2 structures or 100 – you need to loop over the structures you have, choose what it should be doing, and draw it – each independently.