Patatap is a website created in 2014 (previously a concert piece as far back as 2012) that uses the keyboard of the user’s computer to play corresponding sounds to each key. In addition, the developer, Jono Brandel, teamed up with Lullatone, a Japanese musical duo, to come up with fun and unique sounds for each key. What I admire most about this project is that it goes beyond a simple beat making website, it also uses animated graphics to go along with each sound and allows the user to have a synesthetic experience.
There might be an opportunity in the future to possibly add tutorials on the website for musical novices like myself, who don’t necessarily understand music as well as others. However, overall, Patatap uses color and shapes in a whimsical and entertaining way that it is able to achieve the goal of a fun and inspiring toy on the Internet that doesn’t take itself too seriously. According to Brandel’s portfolio site, he was inspired by painters such as Piet Mondrian and Wassily Kandinsky and animators Norman McLaren and Oskar Fischinger and to me that inspiration was evident in his treatment of the product.
After some digging, I was not able to find the exact information as to how Brandel made the website. However, I don’t think it’s totally off the table that Brandel was able to make Patatap with Javscript. He uses simple animations, shapes, lines, and points to construct the visual elements of the website that are involved with Javascript.
Here are some examples of beats users were able to make: