The Coke Storyteller app let users create a unique animated story based on their summer plans. Asking the question 'Who are you sharing a Coke with this summer...' users could add up to 3 friends via Facebook connectivity and freely type what they were getting up to - 'Going to a music festival in Spain', 'Snowboarding in New Zealand'. The app would match keywords entered to elements from a huge toolkit to create a personal animated pop-up story which could then be shared via Facebook or via a unique URL.
Animations were created by breaking apart the original illustrations into individual pieces, re-drawing missing parts and rigging them together.
Creating the animations in Flash allowed for a fast workflow and some great results from the base of the static illustrations.
Using keywords we match animation, illustration and scenery to your entry.
Friends were added via Facebook connectivity.
Skydivers loading sequence.
Your custom animation unfolding (with the skydivers landing in the background)
The Coke Storyteller app let users create a unique animated story based on their summer plans. Asking the question 'Who are you sharing a Coke with this summer...' users could add up to 3 friends via Facebook connectivity and freely type what they were getting up to - 'Going to a music festival in Spain', 'Snowboarding in New Zealand'. The app would match keywords entered to elements from a huge toolkit to create a personal animated pop-up story which could then be shared via Facebook or via a unique URL.
Illustrators Serge Seidlitz and Ceyln Brazier sketched over 800 elements between them for our scene creator. Using a combination of CSS, keyframe and skeletal animation, hundreds of characters and scenery items were brought to life. Studio ILoveDust contributed keyframe animations for the toolkit.
The app aimed to be device agnostic and after experimenting with SVG and Canvas we used a combination of CSS3, sprite sheets, HTML5 and Javascript for a unified experience across desktops, tablets and mobile.
I designed the interface for the app and created over a hundred animations of varying complexity using a mixture of techniques. I took character stills and separated arms from torsos, noses from faces and layered, nested and rigged parts, redrawing sections that were missing. Tweening, stretching, rotating and skewing a little bit of life into the multitude looping characters.
Illustrators Serge Seidlitz and Ceyln Brazier sketched over 800 elements between them for our scene creator. Using a combination of CSS, keyframe and skeletal animation, hundreds of characters and scenery items were brought to life. Studio ILoveDust contributed keyframe animations for the toolkit.
The app aimed to be device agnostic and after experimenting with SVG and Canvas we used a combination of CSS3, sprite sheets, HTML5 and Javascript for a unified experience across desktops, tablets and mobile.
I designed the interface for the app and created over a hundred animations of varying complexity using a mixture of techniques. I took character stills and separated arms from torsos, noses from faces and layered, nested and rigged parts, redrawing sections that were missing. Tweening, stretching, rotating and skewing a little bit of life into the multitude looping characters.
