Main Menu


Sponsored Links

  


  
  

Tutorial - Simple Character Creation

We are going to create a very simple character with only one part and two decals in this topic

We are going to create a simple butterfly character. You should draw 2 pictures of a butterfly. One with wings up and one with wings down. The size of these 2 pictures must be identical and butterfly's body should be located at the same place in these pictures. You can use Inkscape to draw the pictures or any other editor which support SVG, EMF, PNG or GIF files. If you use a raster format (PNG or GIF) your editor must support transparent pixels. You can draw your own picture or just download our examples:
 

  1. Save your pictures as "C:\\ButterflyCharacter\\butterfly1.svg" and "C:\ButterflyCharacter\\butterfly2.svg"
  2. Determine the dimension of your pictures. The dimension of our sample pictures are (300,300).
  3. Determine the origin coordinates of your pictures. Please keep in mind that origin is calculated relative to left upper corner. Some editors, including Inkscape, display the coordinates relative to left bottom corner. If you do not care about origin then you can use (0,0). We are going to use center of the butterfly's body as origin. For our example it is located at (175,145)
  4. Write the following script:
    class Butterfly : public ICharacter
    {
        public:
            
            Part Body;
    
            Butterfly () : ICharacter ()
            {
                // these are dimensions of our images and the origin coordinates
                Register ( 300, 300, 175, 145 ); 
    
                // this is the coordinates of the part (zeros in our case)
                // and coordinates of the part origin (the same as character origin in our case)
                // if you do not care about origin you can use all zeros
                RegisterPart ( Body, "C:\\ButterflyCharacter\\butterfly1.svg", 0, 0, 175, 145 );
    
                // we want to register one additional decal
                Body.RegisterDecal ( "WINGS_DOWN", "C:\\ButterflyCharacter\\butterfly2.svg" );
            }
    };
    
  5. Basically we are done with the character. But we may want to add a method to make our butterfly flying. Something like this:
            ...
            void FliesTo ( double dX, double dY, double dDuration, double dFlapDuration = 1 )
            {
                SetPos ( GetX (), GetY () ); // to fix initial coordinates in your movie
                double dStartTime = GetTime ();
    
                for ( int i=0; i<dDuration/dFlapDuration; i++ )
                {
                    SetTime ( dStartTime + i * dFlapDuration );
                    Body.SetDecal ( "WINGS_DOWN");                  
    
                    SetTime ( dStartTime + i * dFlapDuration + dFlapDuration / 2 );
                    Body.SetDecal ( "DEFAULT");                  
                }
    
                SetPos ( dX, dY ); // to fix ending coordinates in your movie
            }
            ...
    
  6. Lets compile all together and to a test. Compile and preview the following script:
    class Butterfly : public ICharacter
    {
        public:
            
            Part Body;
    
            Butterfly () : ICharacter ()
            {
                // these are dimensions of our images and the origin coordinates
                Register ( 300, 300, 175, 145 ); 
    
                // this is the coordinates of the part (zeros in our case)
                // and coordinates of the part origin (the same as character origin in our case)
                // if you do not care about origin you can use all zeros
                RegisterPart ( Body, "C:\\ButterflyCharacter\\butterfly1.svg", 0, 0, 175, 145 );
    
                // we want to register one additional decal
                Body.RegisterDecal ( "WINGS_DOWN", "C:\\ButterflyCharacter\\butterfly2.svg" );
            }
    
            void FliesTo ( double dX, double dY, double dDuration, double dFlapDuration = 1 )
            {
                SetPos ( GetX (), GetY () ); // to fix initial coordinates in your movie
                double dStartTime = GetTime ();
    
                for ( int i=0; i<dDuration/dFlapDuration; i++ )
                {
                    SetTime ( dStartTime + i * dFlapDuration );
                    Body.SetDecal ( "WINGS_DOWN");                  
    
                    SetTime ( dStartTime + i * dFlapDuration + dFlapDuration / 2 );
                    Body.SetDecal ( "DEFAULT");                  
                }
    
                SetPos ( dX, dY ); // to fix ending coordinates in your movie
            }
    };
    
    void Scene1 ()
    {
        Image Back ( "backgrounds/landscape.svg" );
        Back.SetVisible ();
        Butterfly MyButterfly;
        MyButterfly.SetVisible ();
        MyButterfly.SetPos ( 300, 100 );
        MyButterfly.FliesTo ( -300, 100, 5 );
    }
    

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