ICA Art Rules case study
The ICA, Institute of Contemporary Art, has been at the forefront of arts for decades. It was finding difficulties keeping up with today’s social media age and needed to be part of the online art conversation. We (SapientNitro, London) built a platform to encourage people to challenge what art means.
My role in this project was mainly in the rendering and animations of the art rules. Tech used includes: Ruby on Rails (RoR), HAML, Heroku, Github, SASS, CSS3 animations and Javascript Box2d 2D physics.
The major challenge in this project was to achieve fast animations on tablet devices. The performance on desktops and laptops was fine. I had to explore different ways of rendering the circles with the physics, mostly with canvas or DOM elements and CSS3.
In the end, due to the full-screen nature of the animations, I decided to use DOM elements and apply real-time CSS3 transformations (hardware accelerated) to animate the circles. I used Box2d to calculate the physics for the attraction forces, collisions and pushing the colliding circles around when resizing one of them.
The mouse wheel and the swipe events in touch devices were used as circle generators. The user could scroll left and right to move all the circles and generate new ones. As soon as the circles were out of the screen, they died and a new one was created on the other side of the screen. So, in a way, it was sort of generative art :-) I enjoyed working on this project, as I love arts and creative stuff and it was also quite challenging (because Box2d with DOM elements was unexplored territory for me and the rest of the team). It was also my first project in SapientNitro, so it helped me to create a good reputation around me.
Featured on:
