Last week, I launched my latest personal project, Material Interaction. The project was inspired by Google’s launch of Material Design in 2014 and my initial encounter with the Material Design Principles Postcards at a Google I/O Happy Hour event. Upon first viewing the postcards, I noted that while the design was visually striking and playful, it lacked interactive and animation elements. In response, I created this website to bring these elements to life.

The project was developed over a four-day period, and initially, it was designed to work only on Webkit-supported browsers such as Chrome and Safari. However, due to popular demand, I have updated the website to support other modern browsers, with Firefox being a particularly notable addition. The canvas drawing performance on Firefox is not as smooth as in other browsers, which is why I have made a small circle area for the FFF’s Bokeh section and it might be slow with a shadow effect on this website.

Material Interaction aims to showcase interactive experiences for Google’s Material Design Principles and was created using HTML5 and CSS3. The website is fully responsive and works well on mobile and tablet devices.