Tableau Consultant @ The Information Lab.... this is my personal blog.

Tim Ngwena

Animated speed drawing: university of york

I've always liked the speed drawing technique especially after I watched RSA's series of animated videos. The animations are great. They animate compelling speeches adding animation that delivers a message efficiently whilst keeping you engaged by also stimulating your visual senses. It's a brilliant bit of creativity.


Lets have a go

So how hard can it be ? ultimately there's never one way of doing something, in my mind I thought a massive whiteboard, skills with a camera and some planning would have done it. That's how the technique works in most cases, just Google 'speed drawing' and 'whiteboard' together and you'll find an array of methods. However, we took a different approach centered around the illustrator and the fact that we were all working on the project remotely. Even now, the entire team that worked on this hasn't met. Hugo had a great vision for how the animation was going to come together and given some information about my skill levels in post production, he got to work.

The topic ?

I was in a fortunate position to have worked on a project at the University of York, tasked to streamline the way content is delivered to students before they start their studies. the key challenge being the information need being exceptionally high for students before they arrive but not enough bandwidth in the channels we had to get the information through effectively. most topics translated nicely into a web page with some guidance around procedures and process but when it came to explaining how the University worked and where students fitted in, most solutions fell well short of being engaging, and we had taken the view that if it wasn;t going to be interesting and consumed in an effective way we wouldn't include. that's when we explored a range of solutions and settled on video. In essence I suggested we had a go at essentially replicating the style of the RSA animate videos.

How it worked.

Hugo sketched some styles and examples whilst the script and overall production was overseen by the remainder of the team. We went through five versions of the script. That involved trying out the first section of the animation in full ( a 30 seconds clip). Hugo was hand-drawing sketches importing them into Flash CS6 ( formerly Macromdeida Flash) and then animating them by using the timeline and animation effects there. This had two advantages. The sketches were converted to a vector format so we could scale and animate freely without loosing quality and it allowed Hugo to include a sound track to make sure his animation was in time. Once all 9 sections of animation was complete, it was exported to the Flash .swf format and then imported to Adobe Premier Pro CS6. Once here, my job was to essentially piece it together. I had done the sound recordings earlier on in the process, my technique rather amateur. Essentially an iPad with a sound recorder app set to the best quality, iPad placed on a pillow to reduce echo and several takes of each section to make sure tone and audio quality was OK. Once complete, they were edited in Adobe Audition to clean them up and amplify the sound a little. the work flow in adobe software meant that i could edit items straight off the timeline without having to take them out and place them back in. i know Premier Pro CS6 isn't the industry standard but for the way I work and my basic experience, I really welcome how easy it is to move files around from one program to the next.

Closed captioning.

This was a lot less painful than I thought. I thought I was going to have to find or buy software to do this but as it turns out, You Tube takes the pain out of this process. We had a script so we just took that and followed the guidelines on how to make it transcript friendly uploaded it with the video and YouTube did the rest. It uses a clever speech recognition system and some basic instructions you add to the clip to get the timing of the captions right. Once it's done that it then allows you to download a closed caption file with time codes and everything properly marked.

Speed Drawing: Conclusion

Flash and Premier Pro don't get on. I spent the best part of 2 days tweaking and optimising sections of the video to get to a point where I could get an export out of Premier Pro that didn't have a rendering issue or scrambled sound. In the end, that involved generating jpeg files for any still shot in the video, screen recording a section rendered in Flash CS6 at 1080p, saving it as an MP4 and then importing it back into Premier Pro to get round a section of the flash file that played fine straight off the desktop but caused the rendering process to crash.

All that said, that was the first time at this techniques and you have to allow for these things especially if you have no budget and have never used some of the software together to understand their limitations. Al in all pleased with the outcome, we'll be carrying out focus groups once term has started to measure how effective this and the other streamlined content has been.