Elemental Powers AR

​

This project combines P5.js generated special effects with ML5 poseNet to allow the user to “wield” magical power from nature.

​

Everyone has dreamt of wielding magical powers at some point in their lives. From Frozen to World of Warcraft, popular culture is full of fantasies about magic that is derived from natural elements. In this project, I’m aiming to help people realize their dreams about magic with p5.js and ML5 poseNet.

​

Using particle systems and noise algorithms, I have generated simulations for four natural elements: fire, water, earth, and wind. The water, fire, and earth elements are represented by particle systems of different colors. The wind element is represented by a compilation of ellipses that resembles a whirlwind.

​

Using ML5’s poseNet model, I was able to superimpose each of these elements onto the user’s hand. To give the user more control, I added a DOM element at the bottom, so the user can choose to display fire, water, earth, wind, or no effect.