Main Menu


Sponsored Links

  


  
  

Tutorial - Simple Character Modification

This tutorial topic will show you how you can make simple small modifications to standard characters from our online library. In 99% cases people just want to make characters using pictures of themselves or their friends. You can easily do this with Web Cartoon Maker using a simple trick described in this tutorial.

You already know that every character part may have decals. These are usually standard decals. For example Mouth usually have the following standard decals: "DEFAULT", "SPEAK_M", "SPEAK_E", "SPEAK_A", "SPEAK_O" and "SPEAK_W". You can add a new decal using RegisterDecal () method. Web Cartoon Maker allows you to use pictures from your hard drive or internet to be used as decals. In most cases it is sufficient just to change the "DEFAULT" Head decal to a picture from your hard drive. Please keep in mind that all methods which have names beginning from word "Register" must be called immediately after character declaration (or in constructors as will be explained later). You cannot call RegisterDecal () or any other registration method in the middle of your script or this may cause unpredictable results.

We are going to modify character Boy with a customized Head decal.

  1. This step is optional but recommended. We recommend you to see the sources of character Boy. You can do this when browsing online characters library. Just click "Download sources" link. You will need to unzip files. To be able to view and edit SVG files you may want to install a great free open source third party tool called Inkscape. You may want to look on file called "head.svg". You should draw your customized head picture. If you downloaded sources of character Boy then you can just modify "head.svg" but it may not be easy because SVG is a vector format. Alternatively you can draw a head picture in a raster graphics editor with possibility to save PNG or GIF files with transparent pixels. You can use a third party freeware tool called Paint.NET and cut and paste your friend's head out of a photo. It would be perfect if your picture have the same size as "head.svg". It would be also great if you can wash eyes and mouth out because we are going to use Boy's mouth and eyes. You basically should draw something like this head of George Washington with washed out eyes and mouth:
  2. Save this picture on you hard drive as "c:\\yourhead.png". You can save the above picture of George Washington's head if you do not have time to create your own. Write the following script, compile and preview it
    #include <boy.h>
    
    void Scene1 ()
    {
        Boy CustomBoy;
        CustomBoy.Head.RegisterDecal ( "MYDECAL", "c:\\yourhead.png" );
        CustomBoy.Head.SetDecal ( "MYDECAL" );
        CustomBoy.SetVisible ();
    }
    
  3. Does it look good? Almost. But it is probably not well placed and eyes and mouth may be out of place. Lets move everything a little bit:
    #include <boy.h>
    
    void Scene1 ()
    {
        Boy CustomBoy;
        CustomBoy.Head.RegisterDecal ( "MYDECAL", "c:\\yourhead.png" );
        CustomBoy.Head.SetDecal ( "MYDECAL" );
        CustomBoy.Head.SetShift ( 1, 1 );
        CustomBoy.RightEye.SetShift ( 3, 0 );
        CustomBoy.LeftEye.SetShift ( 12, 2 );
        CustomBoy.Mouth.SetShift ( 4, 0 );
        CustomBoy.SetVisible ();
    }
    
  4. Does it look good now? You suppose to say yes :-). At the end of this tutorial topic lets compile a small demo of our modified character:
    #include <boy.h>
    
    void Scene1 ()
    {
        Image Back ( "backgrounds/justland.svg" );
        Back.SetVisible ();
    
        Image Capitol ( "buildings/capitol.svg" );
        Capitol.SetScale (1.4);
        Capitol.SetVisible ();
    
        Boy CustomBoy;
        CustomBoy.Head.RegisterDecal ( "MYDECAL", "c:\\yourhead.png" );
        CustomBoy.Head.SetDecal ( "MYDECAL" );
        CustomBoy.Head.SetShift ( 1, 1 );
        CustomBoy.RightEye.SetShift ( 3, 0 );
        CustomBoy.LeftEye.SetShift ( 12, 2 );
        CustomBoy.Mouth.SetShift ( 4, 0 );
        CustomBoy.SetVisible ();
    
        CustomBoy.SetPos ( 300, 290 );
        CustomBoy.GoesTo ( -300, 290, 5 );
    
        SetTime (1);
        CustomBoy.Winks ();
    
        SetTime (2);
        CustomBoy.Winks ();
    
        SetTime (3);
        CustomBoy.Winks ();
    
        SetTime (4);
        CustomBoy.Winks ();
    
        SetTime (5);
        CustomBoy.Winks ();
    }
    

previous topic next topic

  
News

New Tales Animator Video by Alan Sturgess

Alan Sturgess shared an excellent video he made using Tales Animator! You can still download Tales Animator here. Unfortunately it is only available for Wi

...

Simple Online Character Designer

There is a prototype of simple online character designer available HERE. It is only a prototype, it does not contain many pieces yet but it can already generat

...

Book is updated

Now our book "Web Cartoon Maker: A Fun Way to Learn C++" is fully in synch with WCM 1.5! It is available for download and online reading HERE.

...

Web Cartoon Maker 1.5 is here!

Web Cartoon Maker 1.5 is finally here! You can download it HERE! Here is what was updated in version 1.5: Web Cartoon Maker Desktop Edition is now fully standal

...

read more news...


Poll