Our brief for the ‘Let a Bear Sh!t in the Woods’ campaign was very clear and the creative solution was a walk in the park. However, the technical scope was open – it was up to us to find and recommend the right solution to achieve Animals Asia’s goals, a solution which was completely cross-browser and cross-device compatible.
My role of our Developer was to enable the campaign to spread effortlessly across social media, maintaining the humour and charm of the creative concept and the animation as it did so. The project is intended to be the first step for Animals Asia supporters, they are not already engaged with the organisation, and therefore are unlikely to be tolerant of technical glitches or delays – we wanted to deliver maximum pledges and donations without any barriers to taking part.
Flash would at one time have been the language of choice for this kind of animation and would be more flexible and faster to program in some elements but it doesn’t deliver on the compatibility. The HTML5 stack on its own would be onerous to program a complex set of interactions like this. Our solution was a combination of HTML5 and external tools like Edge Animate. This also allowed us to cater for different browsers and their idiosyncrasies.
Close collaboration with our Designers made sure that the technical limitations of HTML5 weren’t visible to the end user – for example, the animation loops until you interact with the page – e.g. to donate – and with careful consideration to looping, timing and positioning we ensured that the graphics didn’t ‘jump’ when you transition between the two.
The animation is customised to the user’s name which also required some thought, first in design to cope with any (feasible) name. To enable sharing of customised pages across social networks I would usually create a database token that referenced the customised data, then attach the token to the url when sharing it. The token could also be used to create short urls. However, these options couldn’t be supported by the clients’ CMS as we didn’t have a database to store the customised data in. Instead we attached the data directly to the final url.