Web animations with flair
Working with an award-winning cartoonist and animator
Throughout my career, I’ve been lucky to work and interact with people who are smart, creative and passionate about what they do. Most recently, I’ve gotten to collaborate with Rachel Nabors, award-winning cartoonist and web animation designer and developer when we got to feature her story Alice in Videoland: Designing an interactive HTML5 storybook in the December issue of Inspire magazine. Be sure to check out the iPad version which presents Rachel’s work in a visually compelling and interactive format.
Alice in Videoland, story and design assets solely created by Rachel, was a fun project for me because it shows not only a final project that is visually rich and engaging, but you get to see some of her early sketches when ‘Alice’ was in the idea stage. In this article, Rachel breaks down her process so we can see how Alice and her friends came to life (virtually anyway). In addition to the early hand-drawn sketches and notes, Rachel shows how she used various tools to bring Alice to the world of digital publishing.
Most recently, I’ve called upon Rachel when I have had some great written articles that were in need of some beautiful graphics to complete the composition. I thought I would help by providing some ideas for themes she could put together. Quickly, and delicately, she would come back with something that blew my original idea away. Okay, so, I’ll leave the design to the experts.
Rachel has recently started Tin Magpie, an interactive agency in which Rachel will get to focus more on the type of work she really wants to do. You can check out her Infinite Canvas Screencast series in which she shares some of her insights. Or, you can follow Tin Magpie on Twitter for more frequent bursts of inspiration.
If you’d like to get started designing interactive animations for the web with some animation programs, checkout these tutorials on getting started with Edge Animate CC and Flash Professional CC. Now, with the latest version of Flash Professional CC, you can create HTML5 Canvas animation projects.
About the header image
I took this picture while on a trip with my husband throughout Italy after working a long stint throughout Europe when I was an Adobe LiveCycle Trainer in another lifetime. Venice was, of course, beautiful and unique with its meandering canals throughout the old city. I only wish my pictures could do it justice. The original photo was a bit overexposed and the vibrant colors looked washed out. So, I thought I’d check out using adjustment layers by starting with the basics as described in this Introducing adjustment layers tutorial. I added adjustment layers to tweak the curves, brightness, exposure and brightness/contrast. I think it is better, but I am also seeing that I can learn the tools but still not have the artists’ eye to distinguish the nuances that might make a nice photo a great one. Any feedback from some photography lovers and pros out there is much appreciated.