When a shape plays a sound, the points are scaled up and snap back to their original position with a spring physics calculation. Inside the WebWorker, we maintain the state of each shape in the form of a Vector object with X and Y co-ordinates for each point that is drawn as part of the shape. We handled this by moving the physics math off of the main thread into a WebWorker.

For Kandinsky however, each line is stored as a separate mesh, made up of a series of points and attached to a WebGL scene.īelow you can see a wireframe example of the resulting mesh.Ī big challenge in calculating a large number of interactive objects at once is trying to render the animations consistently at 60fps on every supported device. In regular drawing applications, the canvas is stored as pixel data and the pixels are manipulated for every stroke. Our final build uses WebGL to draw lines that are calculated and rendered on the GPU, resulting in a very smooth, dynamic and addictive experience. The second iteration used WebGL and turned lines into geometry by triangulation, which worked and was fast but gave us limited control over the look of the line. We started using HTML5 canvas to draw lines every frame, which was too slow. Check it out at Chrome Music Experiments. It was a collaboration with our friends at Google Creative Lab where we explored a bunch of different possibilities by sketching through code. This article describes the tech behind the experience. Some shapes even smile and sing back at you. Users doodle, scribble or draw on a web canvas and hit play to listen to their art work. Investigate 50+ activities which are classroom ready and access free to download, editable Microsoft, Google and Apple templates.Kandinsky lets you make music through art.Explore 100+ innovative tools aligned to the ICT capability.Discover how the Digital Learning Selector can save you time, build your capacity in using technology in the classroom and support ICT integration into your lessons.

Where: Online the EduTECH Virtual ConferenceĬost: Free! Use your EduTECH pass to access the session. Who: All NSW DoE educators with an EduTECH ticket Join us for a guided tour of the Digital Learning Selector and see why over 100,000 educators from around the world have accessed the site in 2020! See why over 100,000 teachers from around the world have accessed the Digital Learning Selector in 2020! Join the Learning Design and Development Team for a guided tour of the recently updated NSW Department of Education application available FREE to all educators world-wide

Kandinsky google lab