scene implementation

[two-ticks]

We can use event triggers for scenes. For example this sketch uses space bar for scene switching https://editor.p5js.org/radium.scientist/sketches/g7oDq0M87

we can use all these possibilities

• event triggered animations (issue #1 )
• event triggered scenes
• can define a driving parameter like time for long scenes where event triggering can be tedious

we can decide how to implement scenes and how to add individual animations to the scene

[JithinKS97]

One another thing that we need to take care of is whether we should have multiple scenes within the same sketch side by side. This is something that is seen frequently in 3blue1brown videos. Maybe we can think of abstracting the whole scene with its own position and scaling?

I'm not complicating, but it would be good if we think about all these scenarios.

[nickmcintyre]

@JithinKS97 I like that idea. What do you think about using createGraphics?

[JithinKS97]

@nickmcintyre Wow this is cool, I never knew about this function. This is something that we can use if this doesn't have any other limitations.

[two-ticks]

example

I tried implementing scene with createElement. I called sub-plots or sub-scene as group (div).

We can change scale or translate these groups (div).

group = createGroup(waveEquationText, graph, waveTeX);

group.remove();

group.scale(0.5);

• also solves issues related to overflow of elements outside canvas
• universal timeline of animation

I took definition of scene as environment or setting for example garden is one scene and inside home is another scene.

branch (morphing and scene): https://github.com/two-ticks/p5.teach.js/tree/morphing

@JithinKS97 @nickmcintyre