Tutorial Title
       by Your Name : 9 December 1984

This tutorial guide should, hopefully, provide a good framework for how your tutorial should be structured, etc. It is highly recommended that you read every portion of this because the information contained is important. Even the smallest, insignificant sentence has some dark, mysterious meaning!

Ensure your tutorial has a good introduction. If your introduction is interesting, your readers will be more interested in reading further. There is no better way to lose your audience than to dull them in the first few lines.

If your tutorial is a special effect, image effect, etc. you may want to provide a nice example of what your tutorial will help create:

[ an example of what you will create ]

Here is How
The following steps will explain what this tutorial will be trying to explain.

  1. Make your steps easy to follow.

  2. Never leave steps out. What may be obvious to you may be foreign to others.

  3. Include pictures and screenshots of any step that you find will be useful:

[ provide a short phrase about what in that should interest the reader ]

  1. Feel free to elaborate, but don't make your steps entire paragraphs. You can explain the rationale behind some of the things you did later in other sections.

  2. Ensure that your images are crisp (not blurry) and do not contain extra irrelevant sections. For example, if you are interested in showing a picture of a check box, don't paste the entire application window along with it.

  3. If you need some guidance on how a tutorial should be structured, feel free to browse the tutorials on the site. They should give you an idea on what caliber of tutorials are accepted.

  4. Should your tutorial run multiple pages (which is great btw), make sure to use the following Next Page and Previous Page graphics:

  1. For displaying code, go to the following URL and use the really nifty code converter senocular created: http://www.kirupa.com/..../formatcode/index.php
     
    The following code was generated by copying and pasting into the above link. The CSS stylesheet used on the kirupa.com site contains all of the necessary details to get the code to display properly.

filename = ["vibration.swf", "circular.swf", "random_movement.swf"];
path = "http://www.kirupa.com/developer/actionscript/animation/";
i = filename.length;
k = Math.floor(Math.random()*i);
loadMovie(path+filename[k], movieTarget);
  1. Try to ensure that all of your content fits comfortably within this cell. Anything wider and the content will be cropped or modified - thus delaying the time it will take for your tutorial to get on the site.

  2. Don't forget to update your name and the date this tutorial was written below the title toward the top of the page.

  3. To get a tutorial added to the site, simply contact me or any other mod with a link or attachment of your tutorial, and the tutorial will be added if it is good enough.

  4. Not all tutorials get accepted, so don't feel bad if your tutorial misses the cut. Keep trying - never give up. We try to be fair, and we will offer you some short comments on how you can improve your tutorial.

  5. On a final note, remember that the CSS file for this tutorial and other tutorials is located here: http://www.kirupa.com/text/kirupa_2004.css

  6. On the real final note (the above was just to trick you!), you can find a collection of all the icons and graphics used on this at the following URL: http://www.kirupa.com/resources/image_list.htm

 
Note
If there is something important that you would like to say, feel free to put it in a Note table. If you just tell me that some text will be a note, I can get it formatted into a table. You don't have to worry about that.

Also, ensure that you provide me with your tutorial's TITLE, one sentence description, and any keywords that your tutorial should be indexed under.

Extra Sections
A good tutorial will also explain why the animation works the way it does. It helps give the user a review of what he or she has accomplished and how that knowledge can be applied to other areas of design. If your tutorial uses ActionScript, you should provide an explanation as to what each line or section of code accomplishes.

You should always try to provide a source file for your readers to download. For example, a downloadable ZIP version of this HTML file can be found by clicking the following link:

Download ZIP

Finally, you may want to have your closing remarks include something about posting on the kirupaForum for help. Also, to show the reader that we are all fun people, you should close your tutorials with your name and a smiley/pixel person/etc. along with a link to your site if you want to.

Cheers!

Kirupa Chinnathambi
kirupa.MIT