Tiffany Kitty has a teardrop

I made a quick animation using a drawing I made yesterday with Photoshop. The animation is done in Toon Boom Studio. Photoshop was just acting strange so I went with TBS then it was acting stupid, so I restarted it, a few times, and it eventually worked. The result is below, with no audio added yet. When I'm ready to make a few kitty sound effects, I'll try to add them. I've not tried that in TBS yet, so it's a good opportunity to familiarize myself with those tools; Photoshop requires audio to be produced elsewhere, then imported, which is a pain in the butt for a simple project like this.

Let me know if you like my kitty drawing too. It took about 4 hours to complete the whole drawing with Photoshop and a Wacom tablet, but it turned out exactly as I pictured it in my head for a change, including the slightly dramatic lighting.




Ok...now I don't like how YouTube replaces my video at the end with a bunch of thumbnails...so I slowed it down so you can be sure to see the final speech bubble. Sorry for confusion, but YouTube doesn't have a quick way to replace a video once it's uploaded.

My first HTML5 animation was a success, now visible on Youtube and my website

After some experimenting with the capabilities of Hype 2 on the Mac, I came up with a short animation about Christmas and cats that I have shared on Youtube at http://youtu.be/ITsWH0Rzigc and on my website www.patiostudioproductions.biz. Full audio is only included in the website version, because exporting to video doesn't seem to include audio.

Let me know what you think, there or here in the comments.

Here's the YouTube version, but it's better to see the website version because it utilizes the audio files and original HTML and graphics files.

Now that I know Hype 2 works well, and is very easy to use, I am excited to come up with more compelling stories. I can justify putting time into complete cartoon or line art illustrations, with suitable components to be animated with HTML5 and Javascript. For my samples, I am planning to make a few educational and entertainment pieces. My college and university studies offer lots of enjoyable subjects to choose from, that I'll try to show in a funny or unique (but compelling) way. For entertainment, I have a few cartoon characters that I draw frequently and would love to portray in animated stories. Not to mention promotional animations for my own and others' websites.

It's exciting, especially after I decided Madefire's online animated comic book creation tool seemed to have an unnecessarily dark and mysterious learning curve. My project there failed three times, and I say that's the end of that!

Madefire out...Hype 2 in. Plus, Hype 2 creates HTML5 assets ready for FTP upload. I've never used an FTP client before, but on short notice, and strong desire to show off my Christmas cat and tree animation, I figured it out (using FileZilla) and it worked perfectly. The first and only thing you'll see on my 'practice' website space (www.patiostudioproductions.biz) is that cat and tree animation!

Educational video graphics sample in progress

It's already been a few weeks since I studied an intense intro to motion graphics. I gathered some footage to practice with and decided on an educational roadside ecology lesson, that takes me back to college when I learned a lot about Garry Oak trees.

This project ate up my time today, in addition to going for a long walk in Swan Lake park that resulted in getting drenched during a moderate rain spell.

It's about 10:00pm and I'm still a bit damp feeling from that walk, while I work on my Garry Oak video clips.

I'm busily creating new samples of my recent interests like animation and motion graphics. This video may not need motion elements, because it's already filled with short segments of different features of trees, and I'm not adding any cartoon characters...or maybe I should!

It's all good practice. Adding and/or animating elements in a video, such as text overlays, requires a sense of timing and generally a sense of usefulness. I've decided that the audience for this sample video is 10-12 year olds. I don't have quick and easy access to lots of terminology about ecological and biological features of trees; college was a long time ago and I don't remember the specifics. 

A little animation may draw attention, without overpowering or dominating the visuals of the trees themselves. I'm most interested in practicing with the pen and brush tools to see if I can produce a line that connects the terms to the tree in an animated fashion. 

Luckily, with practice, the techniques I learned in the tutorial (off lynda.com) are getting easier and more precise, and they tie in nicely to basic graphic design principles I've also studied in the past, which keep me from going overboard with animation (hopefully).

I'm sure you readers will let me know if anything looks wrong!

Some screen shots from the action while making animated characters the past few days

I've uploaded the samples of a few recent simple character animations to YouTube, and wanted to show off some screen shots too, so you know what the Toon Boom interface is like. Some conversations online make it difficult to choose among Toon Boom Studio and products like Flash and Anime Studio Debut. I personally didn't like Anime Studio, and have never used Flash so I can't comment on any comparison yet.

Here's a hint at what working with Toon Boom Studio animation software is like. First, a character with bones and "zones of influence":

A character following a "motion path":

Adjusting with cut-out animation tool:

And some screen shots of the interface while working with my stick figure:

'Zones of influence' for bones are visible; not sure what they do yet!

Leg 'bone' selected and can be rotated about the hip attachment point

Motion path with keyframes along the line spanning 5 seconds, at 12frames/sec

Timeline shows several layers are created to enable motion of each limb

The tricky part of using sophisticated animation software, it seems, is to use the right tool for each task, and select the right layer and timeline position every time, before making an adjustment. One suggestion to Toon Boom already: make icons bigger!!! It's very difficult to tell which view is selected, between Drawing View, Camera View, and the side & top views.

More stick figures; looking for tutorials to optimize Photoshop animation for 2D characters

I made a few more stick figure animations today, shown below. They were fun, and I'll continue to apply my cartoon-drawing dreams to Photoshop as my preferred animation tool until I can find a good reason to take on an animation software (and all its necessary learning) such as Toon Boom. I also have Blender installed for free 3D animation experiments, so I'm not bored yet.

I would like to be able to do rigging, rather than relying on Photoshop's puppet warp tool for doing character movements. Still, I think puppet warp forces me to really pay attention to gestures and biomechanics (both are personal interests in terms of their related sciences and social sciences), so I'll enjoy the experience.

So far I'm relying on 3D animation literature (old textbooks, and software-specific tutorials) to learn the concepts of keyframes and tweening that I'm using for the stick figure animations. Animated logos are so much easier - Photoshop's tools are designed for manipulating those quite nicely. It's just a little harder when your graphic is a character drawn with the paintbrush tool and a Wacom tablet.

With the tools I've got, I think there's no reason my next animation session couldn't include my cat cartoon characters. After a bunch of that drawing practice, I may want to move into a pro animation software and possibly the 3D side too, perhaps starting with Blender (free).

My choices are open to nudging by clients who may need specific animation and video effects that one software or another excels at. Of course, I'm not just drawing for fun. I want to do animated or semi-animated videos for other peoples' promotions, events, or stories.

Tell me what you think of these ones, and any suggestions you have for a logical next software to try out. Keep in mind I can't afford or justify spending $2,000 or more, for professional versions like Toon Boom or Maya.

Version 2 of stick figure:

And version 3, with more frames and 'tweening':

Ok...I didn't like the ghosty effect in version 3, so I made a version 4 with shorter frame duration and no 'tweens':

Photoshop animation experiment worked - stick figure and tweening

I've gotten a lot of ideas for simple animations lately, mostly involving cats, no surprise. I heard many times that the video tools in Photoshop also work for single frames and the "tween" feature fills in between the frames to make them appear animated.

I wanted to be sure at least basic animation could be done with the Photoshop I already own, so I created 4 frames with the brush tool then looked at them in the video timeline. At first I couldn't figure out how to animate them, and fill in frames between their poses. After some pasting and fiddling with features I learned in a video editing tutorial recently, a few seconds worth of animation and tweening appeared.

I'm not sure why the ghost effect appears but I'm pretty sure it can be turned off. I have some other projects on the go that need to be finished so this was the result without too much fuss (maybe an hour's worth of trying different arrangements and tools):

As you can see, Photoshop does indeed allow quick and dirty animation to be done. I'll be a lot happier when I grasp the video and animation tools better. My goal is to add animated line art and possibly whole characters to my video projects. This is why I've been practicing watercolour, pastel, and charcoal drawing, and practicing with my new Wacom tablet. I like the idea of splicing or pasting in different hand-made effects into digital modern video recordings (websites too), to create an engaging story.

I enjoy making art, of course, but animation for websites and videos is the real application I want to excel at, for making modern low-budget but invigorating short promotional videos for non-profit agencies or sports teams, and similar.

As soon as my skill evolves, I'll be sure to share the news and examples here and on my YouTube channel.

New ink and pastel image done: You're Watching?

I've been busy organizing my website and learning some new HTML skills the past few weeks. Normally, I would like to post on my blog more frequently.

New cat drawing: You're Watching?

You're Watching? by Heidi Bada

So this drawing was done with some self-imposed pressure. Also I was a little unhappy with recent efforts at drawing the image in my head of a cat being interrupted while cleaning its paw.

Here it is, in pastel and ink. I think this time I captured the eye properly, to show that she is perturbed while being watched.

Prints will be available soon from my FineArtAmerica and Society6 galleries. Of course, this original is for sale too!

Website Project

Now the other thing I've been working on, the standalone website, started out as a venue to show off my HTML skills. However, it quickly became a goal for me to show off my illustrations in a comic book format. Then it was not so much comics necessarily, but just any storytelling goal using a website and modern HTML and companion tools.

I'm now taking a different direction with my website project, studying successful websites and figuring out what makes a good story in websites. I don't have anything up and running on my website to share yet, but rest assured this blog will be plastered with it when I've got at least a few illustrations in place.

My goal is to use ordinary webspace to demonstrate illustration as a storytelling tool, in both animated and static forms. Could be for entertainment, but more likely advertising and product demonstration. I love working with video as well, so the trio of illustration, animation, and video combined in a webspace creates a fun environment for me to work in. I'll want to create the images and the interaction/animation functions for custom projects, ideally.

It turned out that self-directed comic book sharing on comic book sites is a difficult way to get noticed and get feedback I need, regarding engagement of viewers and the qualities of my characters and storylines.

Using a website of my own, I can at least share my work, get more HTML experience, and get direct feedback from friends and fans.

My animation style was originally inspired by some Madefire comics I found using my iPad in the app store. I like how animation is minimal, and simply enhances the storyline (usually).

There you have it: a commercial application of illustration that is quite exciting and delightfully unpredictable as technology changes. Sounds good to me.