Level: Small project
GitHub Repository: -


What is "p5.js"?

p5.js is a JavaScript library that simplifies the process of creating graphics and interactive content for the web. I wanted to use it as an alternative to Processing since I thought it would be easier to run on GitHub Pages. This way the user experience is more interactive, rather than the Churro project. This kind of saves time as well because it relieves me from the duty of recording gifs and ensuring they are appropriately synchronized.

A killer whale that follows your mouse.

This is by far one of the projects I looked forward to the most, as it is simple yet entertaining. The idea consisted in bringing the Whale Get Low Vine to my webpage so that I could play with it as much as I wanted.

It must also be stated that the visual textures from the killer whale were extracted the Scratch project: https://scratch.mit.edu/projects/16795490. Another cool alternative is: https://openprocessing.org/sketch/495901/.

Instructions:

  • Movement: Move your mouse around the screen.
  • Backward: Press 'b' to switch between front and rear view.
  • Transparency: Press 'a' to switch between transparent and opaque whale.

Note:

If the visualization lags on Mozilla Firefox Firefox Logo, try reloading the page or clicking here for a full-screen one. It should perform without issues on other explorers.