Archive for the ‘Tips & Tricks’ Category

Sunday, January 6th, 2008

Stealing from yourself

One of the key advantages to using Flash as my illustration platform is that I can easily steal from myself. Take the example of Harry Kruger, NASA bigshot:

Harry Kruger

Harry is a character by Neil Ma from the Uberworld Play By eMail (PBeM) shared universe I’m involved with. Take special note of Harry’s face, because I chopped it up and put its pieces into the HeroMachine expansion.

I created the original set of facial features in HM2 by drawing the eyes, noses, mouths, eyebrows, and ears all separately. As a result, they don’t always look great put together. So with the Expansion, I took pre-existing faces (either from photo reference or from prior illustrations I’d done, like Harry) and cut up the individual features. That way, when they’re put together, you come out with a pleasing whole that fits. As an added bonus, they still look good mixed and matched, too, which is always nice.

This sort of thing is much more widespread than I think most people realize. It’s not a bad thing to recycle artwork you’ve used before, and having your originals available in a digital format (especially a lossless vector format) makes it that much easier. I’ve even duplicated entire figures as background elements for a different illustration, saving a ton of time and making the final result that much better.

So if you’re going to steal, kids, steal from yourself!

(Harry Kruger character © Neil Ma.)

Saturday, January 5th, 2008

Text Insignia

Did you know you can type in your own letters in a variety of fonts to use as a logo for your HeroMachine character? After picking the body style you want, choose the “Insignia” component, then the “Text” genre of items. By default they all say “ABC”, but if you click on the actual item on the character, your cursor turns into a text-selection i-beam. Delete the default ABC and type in whatever you like, from numbers to letters.

On the UGO HeroMachine forums, for example, “monkeykid12″ has chosen a text font from the “Expansion1″ genre and created “High Five“, who probably won’t be a guest on an anti-drug “After School Special” any time soon, but who does look pretty neat:

High Five

It helps to choose a non-white color for the Insignia before selecting the font item to make it easier to see. Now get out there and make some heroes!

Friday, December 21st, 2007

Cool Character: Spectre

Over on the UGO Forums, “thedoompixel” has a thread showing off some characters he’s made. One in particular jumped out at me and I thought you might enjoy seeing what he’s done:

Spectre

One of the things I like about this character is the way he’s made the “skin” component completely transparent, allowing the clothing items to take the weight of giving the figure form. I also like the clean and simple color palette, with just the eyes in a bold red against black and white. This is a really innovative design, an excellent example of “less is more”. You don’t have to load your character down with an item from every single component, sometimes (usually!) it’s better to rely on a few simple choices to carry the narrative forward.

There are several other characters in that thread that are well worth your time, so head on over and take a gander when you get a chance.

Well done, thedoompixel!

Friday, December 14th, 2007

Tutorial: The Power of Layers

You don’t have to know how to draw to create characters with the HeroMachine, but there’s still nothing like making your very own custom illustrations. So from time to time, I’ll be posting suggestions on how you can use your computer to do just that.

Before I start, I wanted to say a brief word about the tools you’ll need. At a basic minimum you’ll need a computer (duh) and some software to draw in. I use Flash because I like its organic feel, plus the fact that it outputs vector art means I can give my client an image at literally any size they want, from a small web graphic to a giant mural, and it’ll always look sharp. I also use a Wacom Graphire 4″x5″ pen tablet for the actual drawing. It lets me vary the thickness of the line just like I was inking with a brush, but you can just use your mouse if that’s what you have. For software, I’ll be using Flash MX throughout this tutorial.

And now, on to our first lesson — layers!

(more…)

Wednesday, December 5th, 2007

Expansion Load Character String

I thought it might be handy to have a ready-to-go character string you can just paste into the “Load” box to load up all of the Expansion genres at once instead of having to hunt and peck for them.

2.5*m1*ExpansionSet*Hair:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,23,
Eyebrows:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,21,Eyes:Expansion1,
fraBlank,FFFFFF,FFFFFF,100,100,20,Nose:Expansion1,fraBlank,FFFFFF,
FFFFFF,100,100,27,Mouth:Expansion1,fraBlank,FFFFFF,FFFFFF,100,
100,18,Beard:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,26,
Ears:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,19,Skin:Expansion1,
fraBlank,FFFFFF,FFFFFF,100,100,6,Mask:Expansion1,fraBlank,FFFFFF,
FFFFFF,100,100,22,Headgear:Expansion1,fraBlank,FFFFFF,FFFFFF,100,
100,29,Undershirt:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,7,
Overshirt:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,8,Coat:Expansion1,
fraBlank,FFFFFF,FFFFFF,100,100,25,RightGlove:Expansion1,fraBlank,FFFFFF,
FFFFFF,100,100,17,LeftGlove:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,
16,Insignia:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,9,
Neckwear:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,24,Belt:Expansion1,
fraBlank,FFFFFF,FFFFFF,100,100,15,Leggings:Expansion1,fraBlank,FFFFFF,
FFFFFF,100,100,10,Overleggings:Expansion1,fraBlank,FFFFFF,FFFFFF,100,
100,11,Pants:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,14,
RightFoot:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,13,
LeftFoot:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,12,Back:Expansion1,
fraBlank,FFFFFF,FFFFFF,100,100,3,Wings:Expansion1,fraBlank,FFFFFF,
FFFFFF,100,100,4,Tail:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,5,
Aura:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,2,Companion:Expansion1,
fraBlank,FFFFFF,FFFFFF,100,100,31,Background:Expansion1,fraBlank,
FFFFFF,FFFFFF,100,100,1,RightHand:,fraBlank,FFFFFF,FFFFFF,100,
100,30,LeftHand:Expansion1,fraBlank,FFFFFF,FFFFFF,100,100,28,#

To use it:

  1. Copy the text string above (starting with 2 and ending with #);
  2. Open HeroMachine 2 Online Edition;
  3. Click on the “Load” button (the one that looks like a folder);
  4. Right-Click in the big white window, and choose “Paste” from the flyout menu;
  5. Click “Load” at the bottom of that window.

The first male body should load, then all of the Expansion genres, and you’ll be good to go. If you want to load the first (athletic) female body with all the expansion items, change the 2.1*m1* at the beginning of the string to 2.1*f1*. For the second (dwarf) male figure with all expansion items, change 2.1*m1* to 2.1*m2*.

Wednesday, December 5th, 2007

Tip: Color Selection

If you are using HeroMachine 2 Desktop Edition, holding down the SHIFT key and clicking on a color paints the opposite color area of the item. In other words, if “Color 1″ is active in the color box, holding down SHIFT and clicking on a color will make that the active “Color 2″, and vice versa. This does not currently work in the online version (I’m not sure why) but is functional in the Desktop Edition.

HM2 Color Selection

Even though Color 1 is highlighted (and set to white), by holding down the SHIFT key I can set Color 2 to light blue. This saves having to mouse up to the top and toggling the color area.

Friday, November 30th, 2007

Digital Illustration

I use a Wacom graphic tablet to draw all of the items in the HeroMachine. It cuts development time dramatically, and allows me to combine the art production and code development into one application. I don’t think I could ever go back to a pure pen and ink on paper method of drawing at this point, I’m lost to the dark side.

Anyway, I thought you might be interested in seeing a demonstration of how, in general, you can go from a neat photograph of something to a finished digital pen and ink illustration like those found in the program. There’s no sound, just a visual — my auditory skills haven’t quite caught up to the times yet.