- TVPAINT
Contents
1. 1 N These icons add one or several exposures into the current instance H These icons delete one or several exposures into the current instance Eag These icons convert an exposure into an instance by keeping its contain or by clearing it s This icon recomputes several similar instances to create only one instance with several exposures 6 28 The steps to create animated graphics The Animator Panel This button has pratically the same role than the previous one except it allow you to define a range This feature is really useful for people who made their storyboard on a different software and want to work then with TVPaint Animation Import your storyboard as a video format and use the tolerance range to recompute the instances with a similar content Final result Miscellaneous Be These two buttons enable the use of a virtual stack in which you will store the current image with the first button This image may then be used by simply pressing the second button Note on the one hand that the last image added to the stack is always the first to be removed and on the other hand that the number of images stored in this virtual stack depends on the hard drive space available The classical tools of the animator Rotate workspace This a sum up of the informations from lesson 3 When working with pencil and paper you often have to rotate the page in order to touch up the lines drawn This is also p2. 765 4 32 C 234567 8 910 Clip Time Line O am New I E w Z _ 1 1 6 1 1 1 1 jit 1 1 1 1 16 1 1 1 1 je 1 aE E n A a a E DNE Kid i 2 2 1o O Ea 4 4 4 Color E 1 T 2 3 This animation contains 3 instances and needs inbetweens between the first instance and the second one Break the instance thanks to the key Del or thanks to that icon fA in order to create a clear instance between the two instances Then open the light table s panel and activate it on your layer see the screenshot in order to see by transparency your previous image and your next image Thanks to the Light Table start to quickly draw the inbetween Coul Instance sja gt B cou ii E Ej ee Kid T a oO Ts 00 5 F Color j16 A A jal As you can see the light table has gray square under each image s slider and because there is a black triangle under the current image Click on a gray square when you want to select and move an image before or after the current one For example if you click on the square of the image after the current one the square will be activated a 0 and a green HUD will appear The HUD allows you to move the display in order to The steps to create animated graphics 6 33 The classical tools of the animator for example trace the head check the leg s length etc When you move the display the HUD becomes red If you want to move another image click on anoth
3. sze Je Top vi Iwa 2 spe Wicd 65 Ga Lo ord gt HLS I New Tl Merge Auto Ei 2 see digi Arr iraa iraka hice ek ere errrerts hehe arr tic B O v LF1Def000 a lt gt E A 2 2 a 2 D by x MH222 7 Fie T T E RRRA F1 28 PDP i Color MB timecode 00 00 00 01 e Add annotations with the Pencil tool and with different colors 6 36 The steps to create animated graphics The classical tools of the animator szel Je Color wv Bl Time Code 00 00 00 24 Iopa T oojo 2 Ee SI AA Grao e H ElNew Merge vjaworit vizi D OO LF1Def000 vB 2277 ia tal ala Co UW gpi ae algal als oe With the Faux Fixe feature 50 exposure cells have been added to the project so the annotations don t correspond anymore to the animation ojoo No problem A Size Tw v g2 2 pep AA Giao sa H SjNew zlwerge zjanari ziz DO Y LF1Def000 sisi Color v Time code JN a gla alaala el select the Slice tool above the 24th frames cut it and move the right part of the TimeLine Notes to the corresponding frame Mark In 00 00 00 01 Display VIE j jl Glo 11 00 00 4 0 iol a lt u un m u gt gt re 22000 d eem MNENE 00 00 00 01 Play your animation and your TimeLine Notes will be displayed during the playback over the project errors
4. When I played back to see my progress noticed went way too fast had about 8 seconds of footage but 3 of those seconds were useless because of the speed So that s not a TVPaint issue that s a timing issue TVPaint or any other software can t make your timing too fast or too slow that s all based on the decisions you make when you are animating As you gain more experience animating you ll have a better understanding of timing and spacing but at this point you need to expect to do a lot of experimenting and there will be times where you play back the animation and realize that you have to reshoot it because you captured too few or too many frames In some cases if an action looks too fast when played back on single frames On 1 s you could slow it down by extending each frame so it is exposed for two frames On 2 s Please see the TVPaint User Manual Lesson 4 Temporal management of layers and Lesson 6 The steps to create animation particularly the section discussing the Animator Panel cont CEEE E cere Er ome http CELE CELE i H The Animator Panel has many useful shortcut buttons including one under the Exposure Tab that is labeled as 1 This allows you to extend the timing of any frame or set of frames by adding an extra frame of exposure to each existing frame on the timeline So let s say you discover that you have a section of animaton 72 frames long 3 seconds that looks way too fast on
5. Floodfill the character without Gap closer z Afichage v E A 6 O 100 00 EE ee O IR Kid 100 00 0 Sans Titre 1 Floodfill the character with Gap closer X gt Afichage EA G O 100 00 30 000 y Pt Sortie fo 6 40 The steps to create animated graphics The inking process The Auto Pick Color option Finally you have noticed that there is also a box called Auto pick color This option will save a great deal of time as it allows you when checked to pick a color when you click and to place it when you release the button Combined with a Light table which only displays the previous frame you may pick the color from the previous frame and place it in your current frame 68 Light Table Filling Shape None x Instance x Bin v L None x Color v iE i Smooth gt opacity 100 007 Source Above A Fill Color amp Density v Gap Closer b 4 gt Expana i o Range v Auto Pick Color V Gradient Bouro Brush Wrapping p Width Stretch 4 Height Stretch 4 Opacity Mapping al i a New s Jonaz fj 4Running Kid Y reee 100 ie g 27 29 31 33 E i S a a es _ a rr i 20 21 22 23 24 25 2 27 28 29 30 31 32 3 Color 29 fj colors ve Q gt b j is js lallo A 7 g a F x js EX tae dee aa aaa a oe a
6. You will find a little dot on the top right corner in that part of the timeline If you click on it you will lock the timeline for notes in order to avoid any mistakes or JAIRA nS The steps to create animated graphics 6 37 The inking process The inking process The floodfill tool Our running kid is drawn on an animation layer We will now fill in the background with the Floodfill tool S DON 4 ii Color amp Density Once the Floodfill tool has been selected various options are proposed in the Filling shape panel shown opposite The color modes were discussed in lesson 2 and 7 The Smooth Opacity Gradient and Opacity mapping options were discussed in lesson 3 The Custom brush option was introduced in lesson 4 and will be fully explained in lesson 7 Oo a d o k Ta We will therefore only take a closer look at the second section of the Filling shape panel When using the traditional Fill option you choose a pixel in the current project window and then click on it We refer to this pixel as the origin pixel The Fill option changes the color of neighboring pixels until it is prevented from progressing by the border pixels Source Layer T Fill Color amp Density Gap Claser 0 dh Epanoo e Range i The options indicated above allow you to choose the type of pixels to be used as a barrier for the Floodfill function i e pixels which will not be modif
7. gt Exposure gt Remove all Exposures option removes all the exposure cells in the current instance Only the head of the instance will be kept Remove All Exposures gc You can also use buttons from the Animator Panel that will be explained later Es If several instances are selected and the Remove all Exposures option is used all the exposure cells from the selected instances will be removed And the selection will be stretched on the heads of the modified instances Delete Selected images In the previous part the function only applies on the exposure cells and now the question is how to remove heads To do so just select the delete option in the contextual menu of the layer or the appropriate button in the animator panel 6 20 The steps to create animated graphics Working with instances Insertimages Duplicate Images Delete Selected Images b Confirm It s always possible to delete exposure cells by this way Deleting the exposure cells of an instance will make all the images of the layer move to the left The head of your instance stay the same Deleting the head cell of the first instance of the current layer will make all the images of the layer move to the left but will Keep the containing of the instance Deleting the head cell of an instance in the middle of the layer will also make all the images of the layer move to the left but will keep the containing of the ins
8. m u gt gt r 25 000 Mark Out f t iz I Z Whether you draw or erase don t forget that the rotative drawing disk can help amp you work with more precision Once the sketch with orange and blue colors is finished use the black pencil to clean up the drawing Q f gt i JO q e lt FEl le O E Display 2 114 Se 00 00 4 arkin 4 Flip ta sa an gt m u gt gt r 25 000 v Mark 0 5 Now use the blue cross icon you now have deleted the blue construction lines of the arms only the black lines of the arms are now visible The orange and black areas of the image head and legs are still visible PE gt h gt Display x Sle 100 00 In Alo Flip rae sa an om m u mer 25 000 v Mark out 0 D _ When you use the two colors blue and orange to draw it is easier to choose whether part of the image should be erased or kept If you use now the orange cross icon only the black lines will stay on the screen The sketch is more precise than at the beginning 6 6 The steps to create animated graphics Working directly with TVPaint Animation At t
9. Working with hand made drawings Import an images sequence You may choose to create the images for your future cartoon either traditionally on paper with PEG holes see below or more directly in TVPaint Animation TVPaint Animation works with Twain standard scanners in Windows and Linux The File gt Twain gt Select option is used to choose the scanner you intend using The File gt Twain gt Acquire option displays the Twain interface of you scanner in order to begin working with the latter On Mac OS X TVPaint Animation works with ICA standard scanners Use the File gt ICA gt Acquire option to display the acquisition interface A Pay attention 64 bits versions of TVPaint Animation do not always support scanners EF If you could not scan directly into TVPaint Animation scan your images from the software provided with your scanner and save your images as an image sequence B image001 image002 etc To import that sequence drag and drop the first image from that sequence into TVPaint Animation Think in uncheck Single image in the import panel and all your sequence will be imported More information lesson 5 In this way when you scan a set of images you may either import these images directly after the current animation layer or in a new animation layer or simply in a new project B amp ij Running Kid F 100 Ea F Color v Mw viv viviviv E C C Color Y 6 2
10. above the number 5 to the right of the zero is selected and its slider is set in the center of the scale This means that the fifth frame after the current frame will be visible with medium opacity The second popup provides some options on the displayed images Mode Instance _ The light table can be apply on the frames before and after the current Hode Eana one or on the instance heads or on the bookmarked images Mode Bookmark Mode Image Mark _ The Front option allows to display the light table images in front of the current image Seon The All and None options allow to display all the images of the light table or no images Activate All Inactivate All _ The Link option avoids having to move each slider individually by linking them to one another Link Sliders The bin popup provides all the standard functions to load save custom light tables gc The number O enables or disables the light table its slider manages the w global opacity of the table A The Out of Pegs feature The Out of Pegs feature allows you to move images coming after or before the current image in order to make easier the inbetweens This feature is situated in the Light Table and does not modify the final render of your animation even when you play it 6 32 The steps to create animated graphics The classical tools of the animator Here is an animation with a running character Coul instance Sp v B cou
11. example opposite a green shape is drawn with an airbrush on a transparent surface with a checker background The floodfill option applied in the center of the circle with the color blue provides the image results shown below fill color and opacity expand 0 in all cases below range 0 range 50 range 100 range 200 range 255 Progressively it is noted that the tolerance to border pixels becomes less and less The Expand option increases the size of the floodfill area to the number of pixels of your choice This enables you to limit the number of border pixels The steps to create animated graphics 6 39 The inking process For example you draw a green line with the airbrush A left click with the Floodfill tool and the color blue and you will obtain the following results Floodfill color and opacity range 0 in all cases below expand 0 expand 5 expand 10 expand 15 expand 20 expand 25 expand 30 expand 40 Combine the two options Expand and Range to avoid the result indicated below left and to obtain the result below right The Gap option allows you to avoid overspills when you try to fill a surface which is not completely closed Low values are used in the case of small gaps whereas high values are used for larger gaps it Image with a gap lt gt Afichage m EA G1O 100 00 4 Oe Kid 100 00 0 Sans Titre 1 5
12. on the right side of the timeline see below Timeline S contextual menu ETTEI Before transferring the layers from one project to another always ensure the resolution is correct otherwise your images may be distorted Use the Peg holes registration Pegs are little holes made in paper sheets to hold them together on a peg bar in order to draw and animate If you want to scan an animation made on paper and use a scanner with feeder you will notice your sheets are not stabilized and so when playing the animation the result is really unpleasant To fix this problem TVPaint Animation contains a tool named Peg holes registration The peg holes registration is a very useful option to quickly and efficiently scan animations made on paper In fact this option realigns the animation thanks to the peg holes To use this function just open the Window gt Tools gt Peg holes registration A little window like this will appear Peg Width T Feg Height hi set Peg Fositions Into this window you can configure the peg hole s size height and width To see the peg holes on your workspace please click on Set pegs position 6 10 The steps to create animated graphics Managing the images of an animation layer Place the two red rectangles above the original peg holes Modify their size to precise the alignment By the way you can choose any image from your animation to set the peg
13. very practical when cropping your animations due to badly LockAspect defined edges see example below Width o The variables Start X and Start Y are used to define the top left hand Height 240 corner of the rectangular area whereas the next two variables adjust Reset the Width and Height Lock aspect retains the current width height ratio You can also use the HUD to edit the area to crop before cropping after cropping The steps to create animated graphics 6 3 Working with hand made drawings Clean up the sequence Once the drawing has been scanned it is possible to Delete white or gray pixels to imitate the use of a true animation overlay this operation is necessary for later coloring as well as for use with a background To obtain this result use the feature Basic scan cleaner available in the Image gt Modify menu specially designed to accomplish the two aforementioned operations in a few clicks You can also use the FX Color gt Scan Cleaner if the parameters of the Basic scan cleaner does not fit to you FX stack will be discussed in lesson 10 Once all drawings have been scanned many users wish to delete add or duplicate images Sometimes they also have to transfer complete images or layers from one project to another It is this traditional and yet vital aspect that we will now examine in more detail Flip an image It is possible to flip your images around the horizontal vertical o
14. with the left tab 6 22 The steps to create animated graphics Working with instances 2 jo 12 Original layer to be stretched to the 4 onal gt 0 4 4 es m es A Be ich without interpolation 12 L 2 L L 0 2 4 Bi E OOO IEA Stretch with interpolation 2 4 5 10 C 10 E g je je Repeat Loop Repeat Ping Pong 12 m AAAA 4A AA ALAS Repeat Hoia 0 z C i C E F E 10 z m A Repeat Exposure T 2 12 7 C a5 a E i C Add empty Instances E E 4 B 10 o E Ss 4 B 10 E 4 8 10 O Ladd 4 E B 10 2 Om A FF Aad empty Exposures 0 4 E B 10 12 Shrink an Animation layer isi aii Itis also possible to reduce the number of images in a layer using an Shrink analog method interpolate Click and slide to the left on the encircled tab below to call up the panel shown opposite The example below gives you an idea of the effects produced by the various options The original layer which will be contracted in time Move the tab to the left Option Shrink without interpolation Option Shrink with interpolation Option Cut images With interpolation the numbers 1 2 3 are mixed in the same image the numbers 4 5 6 in the next then 7 8 9 etc Without interpolation the intermediary images between images 1 4 7 and 10 are deleted The steps to create animated g
15. 1 s select all those frames on the timeline then just click the 1 button on the Animator Panel and it will automatically put those frames on double frame exposures On 2 s which will slow down the action That s a simple fix and it may work but it also might now make the action look a bit too slow at certain points so you my need to change some of the frames back to single frame exposures so your timing would be a combination of 1 s and 2 s OR sometimes you just have to chalk it up to experience grit your teeth and start over if the simple fix of extending the existing frames doesn t work to fix the timing To make your life alittle easier Lesson 6 from the TVP 10 manual is attached www tvpaint com v2 content article downloads manual ph Lesson 6 The steps to create animations In this lesson you will Learn one by one the various stages involved in the creation of an animation using this application Scan cleaner light table rotative drawing disk and inking options will be introduced Use the Animator Panel Use the scan and print options of the software Learn how to use instances Study the notes over an animation The steps to create animations Introduction The aim of this section is to sum up the various steps involved in creating a cartoon using TVPaint Animation and to deal with frequently asked questions Some steps will be explained in more detail when studying the corresponding effects
16. Cells or Exposures i The tail of our instance is the little handle head exposure cells ending the Instance which you can drag to adjust the number of Exposure Cells Above the Head you will find a handle named the sprocket The sprocket allows you to adjust the number of exposure cells without change the global timing of the layer The number of Cells in an instance is displayed on the top right corner of the nstance The steps to create animated graphics 6 13 Working with instances The content of the cells Whatever the size of the instance could be the exposure cells are an accurate reproduction of the head cell At the first sight all the cells of the instance have then the same content You should however take into account that all the cells of an instance do not have the same function Indeed if a modification of the head cell has a repercussion on the exposure cells it s clearly not the same if you decide to modify an exposure cell directly Splitting an Instance into two smaller Instances Once an exposure cell is modified the current instance is broken into two smaller instances For example opposite our instance contain the letter A Modifying the third exposure cell by deleting the letter A and drawing the letter B will create two different instances the first one containing the letter A the second containing the letter B We will then see the following images when p
17. QTVP 10 crashed when played the tvpp file to see what the animation looked like What went wrong also the animation looked too fast why was it too fast was using TVPaint and was doing very well until the 3rd second When played back to see my progress noticed it went way too fast had about 8 seconds of footage but 3 of those seconds were useless because of the speed didn t know how to correct this and after trying a few different ways TVPaint crashed and lost my work I did try saving it before but it was a bit confusing Chantal A Hi Chantal Shift S is the keyboard short cut for Save OR go to File Men gt Save The first thing you should do upon opening any new TVPaint project or any other software is to NAME and SAVE the project then periodically SAVE it again So for example when you start your Module 2 project open a new TVPaint project immediately go to the File Menu gt Save Project As and give the project a name in this case it would be 2 1 Paz tvpp Have a designated folder on your computer called My TVP Projects or something like that where you save your original tvpp files Now continue to animate your project would recommend you SAVE the project every 5 10 minutes as you are working Just get in the habit of constantly hitting the Shift S keys which are the keyboard shortcut for Save You can also Save by going to the File Menu gt Save Next issue About this
18. The steps to create animated graphics Working with hand made drawings Inversely it is also possible to print the content of a project The File gt Configure printer option displays the options available on your printer The File gt Print option opens a new window At the top of this window you will find the name of your printer The Setup button displays the options available on your printer stu an mA snes The Single tab opposite is used to print the current image Scale 20 You may adjust the size and position of your image on the future sheet of paper using the click and slide function as well as the Scale field The Center button places your drawing in the center of your future sheet of paper The Anim tab offers the possibility to print several images of your csa o animation merged layers on the same sheet of paper __Center_ In addition to the image size and position setting options you may i Choose the number of rows for your images el Display the position of each image on the timeline Choose every second third fourth etc image in the Steps field The two buttons in the bottom right hand corner of the panel are used to scroll through the various pages to be printed Crop a project The Crop tool is used to define a rectangular area in the current project and to transform the content of this area including all layers Sele into a new project Staty 120 This is
19. a n e J v 5 20 21 22 23 24 25 26 28 30 31 32 33 g Color e TTET EREEREER Ere Color v 2 Fill inside Another way to fill your drawings does exist through filled shapes just like Filled stroke This option is called Fill inside The steps to create animated graphics 6 41 The inking process This feature allows you to quickly fill a drawing zone It is really useful especially when you want to fill a complex drawing with a lot of little stroke like the drawing below made with a pencil tool By creating a new layer below the Drawing layer and by choosing some parameters of Filled stroke we will have then the possibility to fill all the drawing the red HUD visible in the image below Couleur and so fill inside the drawing very quickly The feature proposed are very similar to the ones met in the flood fill tool Only ths function Include lines is a little different This option allow you to include or not the lines in the colorisation Below you will see an example of colorisation without the lines 6 42 The steps to create animated graphics The inking process Create shadows Once you have finished coloring your running kid you may add shadows to the latter using the toonshading effects discussed in lesson 13 toonshading toonshading Drop Shadow To finish the animation Camera movements Now that your running kid is animated it is possible t
20. ages at the ends of the animation A first instance is created in the middle of the layer Two new instances are created for the inbetweens The instances are moved and resized Two last instances are created for the last inbetweens 6 16 The steps to create animated graphics Working with instances The Faux Fixe feature By default all the images in the exposure cells are the same by Set Frame Repeat definition they are only a link on the head image Insert Images Duplicate Images However this feature allows to use the previous images of an instance Delete Image in its exposure cells Faux Fixe This option is really useful in particular when a character stops moving but whose the lines still shake a graphical aspect very appreciated by Rename instance traditional animators Image Marks This is made possible by the option Faux Fixe Value available in the timeline s contextual menu That value is applied on the wished exposure cell you cannot use that value on the instance s head select All Let s see an example of the behavior of this feature Let s say we want to repeat elements from that animation on the last instance on the the third exposure cell In this feature the value represents how many previous images will be repeated in the exposure cells of the last instance from the exposure cell of your choice in the present case the third one n our exa
21. can also copy cut or paste an image selection respectively with the shortcuts Ctrl C Ctrl X and Ctrl V use Cmd instead of Ctrl if you are a Mac user Insert or delete one or several instances A right click on the timeline opens a contextual menu which allows you to insert instances this function has been already explained in lesson 4 after the current image You can also use those buttons En N from the Animator Panel to add instances more information about that panel further images inserted from image 18 To delete several images think at first in doing a selection then press the key Del be careful Bk Sp does not delete the images but clear their contain You can also delete them from the contextual timeline menu do not forget to confirm A menu and in the Animator Panel O _ The nsert Duplicate Delete images options are also available in the Image main w The steps to create animated graphics 6 9 Managing the images of an animation layer Cut Copy Paste layers The method used to cut copy and paste an image or animation layer from one project to another is the same as that used for images To select several layers simply left click on these layers while pressing the Ctrl or Shift keys as explained in lesson 3 The layers selected then appear in yellow The layer s contextual menu is located in the left section of the timeline the timeline s contextual menu is
22. e Time Line window all the layers of the color can be selected Let s imagine we have selected the two layers below which yellow enlightened We are currently located on the fourth image of the timeline If we stretch the instance on the Edges layer by moving its tail the corresponding instance on the Colors layer will be stretched in the same way 6 24 The steps to create animated graphics Working with instances 100 F Color ol eed eed eee el eel tl eee ceed If you stretch the Edges layer by moving the right tab the Colors layer will be stretched in the same way we have chosen here to add suas al images Te a COE Cs A a 3 e i New aVOOz 12 14 16 18 MEM Maa Coor v E bo Color v If you move the Sprocket to adjust your instances durations g Color ITa EA EA Raa ae coor v E Bo 100 Tz F Color E ea JEA Raa Color v i 7 Color The Recompute Exposures option This option of the Layer main menu will try to transform the images of the current layer into heads or exposures cells This option will only work if there are several identical images in your layer The steps to create animated graphics 6 25 The Animator Panel The Animator Panel We have not yet discussed these panels which appear in the right panel bin when the program is started Th
23. e between the different parts of the instances easier To navigate between several instances it is possible to use he shortcuts Page up and Page Down or Ctrl left arrow and Ctrl right arrow on your keyboard or click on these icons PP in the remote to go to previous instance and go to next instance 6 18 The steps to create animated graphics Working with instances Go to Next Instance The layer s beginning or end are also easily accessible via these icons or the shortcuts N also called Home and End of your keyboard la Color al ac lt Original position l Go to end il in the remote respectively back and fro 7 As we Saw in lesson 4 you can use the shortcut H and J to flip your animation hs O Add Exposure cells in an instance With the Image gt Exposure gt Add Exposure option it s possible to add a new exposure in the current instance ii Add Exposure The steps to create animated graphics 6 19 Working with instances Remove Exposure cells from an instance Two different options are available to remove exposure cells from an instance The Image gt Exposure gt Remove Exposure option removes one exposure cell in the current instance Remove Exposure The Image
24. e image The first eraser is small The second eraser is bigger and smoother I 2L Two supplementary Sketch panels are available the first one is Sketch Panel H gt Red orange is replaced by red and the second one is Sketch Panel RGB It contains 3 colors red green blue and the black These both panels can be found in Windows gt Custom panels Now let s study how to draw and clean a sketch step by step Firstly erase the content of the current project or open a new project window Use the blue and the orange pencils to rough out your drawing The two colors orange and blue can help you to differentiate the portions of the image here the head and the legs are in orange the arms are in blue v isplay xel le 100 00 4 o E nej gt a G ly g g a ja 4 Vie ja i 7 7 a a S If you need to do so use the two erasers at your disposal to refine on our image In the example below the first eraser was used on the head of the character the second eraser was used on the arms the colored eraser will only delete the corresponding colors The steps to create animated graphics 6 5 Working directly with TVPaint Animation kamma qa i I e gt Display v E Glo 100 00 4 arkin S Flip tea sa an gt
25. er image s square for example image after the current one Be SPN Ree Coul v instance Bin v Mi cou E New T aS ee E o Kid E gt 00 F Color E When an image is moved the 0 stays in order to remind you there was a change When you moved all your images you simply have to choose your drawing tool and complete your memmy m inbetween If you want to reset the display click on on the black triangle under the current image s slider in order to open this little pop up menu on the right Link all will allow you to move and resize all your out of pegs positions in once and Reset will clear all the positions You can also remove individually the out of pegs with a right click Then you will be fere to finish your drawing properly Coul instance sP Bin v B cou 7654232 1 0 1 2 345 67 8 910 Clin R E New wwe i ee i a E a Funning Kid z pua Gaia F Color 6 34 The steps to create animated graphics The classical tools of the animator The Timeline Notes The Timeline Notes was created in order to provide the animator with a way to add graphical annotations and notes to its animation It is a tool to make its work easier The Timeline Notes is accessible in the Timeline window and looks like this 3iz 1 50 4 gt Top eS om AUntitled 1 On the screenshot you can see that the Timeline Notes is divided into two
26. er of exposure cells in each instance SA If you need a quick preview of the animation when drawing it is advised to use the S Flip Book option see lesson 4 for more details Once this task is finished we can break the four existing instances in order to draw the first inbetweens the inbetweens are drawn in blue for more readability only the head cells into account please read the Light Table section further in this a You can use the Light Table option to help you during the drawing process It will take 8 lesson Now we can break move and resize again the existing instances in order to draw the second series of inbetweens Below you will find the beginning of the resulting timeline The steps to create animated graphics 6 15 Working with instances O At any moment of this process you can by only a few mouse clicks change the number of cells of your instances and then improve the whole timing of the animation Continue the process by breaking again the existing instances and by adding inbetweens Stop it once you are satisfied with your animation SA pes To finish here is a quick overview of the steps which were R4 needed to create the animation from the first to the second key image AR ASS The blue below shows where the last instance was broken j z ie split into two instances Here are the two key im
27. ey comprise a wide variety of functions which will help you save a great deal of time when you start to get the hang of using the program You will have noticed that many of the functions already discussed are present in the Animator Panel It was however important for us to start by explaining the fundamentals of the program before introducing you to some shortcuts Everything in relation with the creation or modification of custom panels will be discussed in lesson 7 and 19 Amongst these you will find the possibility to add images before or after the current image split a layer after the current image delete an image or layer convert an image layer into an animation layer and vice versa define bookmarks add delete etc Now we are going to take a closer look at these functions The first thing you will notice is that the panel is sub divided into several sections Clip Layer Instance Exposure and Misc Clip Eel al These icons justify all layers from a clip on the left or on the right This icon selects all layers from the clip m ii This icon moves the layers forward in the way to make a layer begins when the previous one is finished 6 26 The steps to create animated graphics The Animator Panel mann E This icon splits a layer in two after the current frame The old part left stays on the current layer and clip the other part right will be created into another layer into another clip n
28. ges of a layer with a simple click and slide of the left mouse button under the timeline icons The selected images are then marked in ee see below 6 Current Image T zj z 5 6 EE It is therefore possible to duplicate or delete all selected images in the same way as described above Then click again on the selected images and hold the click selected images will become pink and will indicate that you can move them in the timeline If you move your selection in an empty space you will remove its presence from its original place and move it somewhere else If needed the previous instance will be stretched automatically 12 T I I ECCERI Move TETT 6 8 The steps to create animated graphics Managing the images of an animation layer To duplicate your images selection into the same layer in order to repeat it further in your animation for example you just have to hold your click and press Ctrl You can also duplicate your selection to another layer by dropping it to the layer above or below the layer has to be created before E I pE O l5 ir A Be careful If you put your selection s copy above an image sequence your selection will overwrite the images Ne nil ee To avoid any incident press Shift to insert your selection between two images GS without overwriting them You
29. his state of the process you can stop here or continue to have a better result We have turned here the lines into orange by using the orange flask icon It is still possible to add some lines or to clean the image with the erasers e el gt Display E 2 Me 00 00 0 Markin 6 Flip tes au mm e e pes 25 000 7 Mark Out i 0 EN Now we can delete the orange and blue construction lines The image is not rough anymore if it is not the case you can return to the previous steps The steps to create animated graphics 6 7 Working directly with TVPaint Animation O cy ark In mo p ida aa an om a apii rte ooo v eeN This method is not the only one that can be used with the Sketch panel you can g use three colors in a different way or you can use only two colors d h Some artists uses one color for the characters and another color for the background landscape It should be easy for you to adapt the Sketch panel to your workflow Managing the images of an animation layer Move and duplicate one or several images To move one or several images select at first the images you want It is possible to select several consecutive ima
30. holes registration the layer will be entirely re aligned Working with instances Introduction The steps to create animated graphics 6 11 Working with instances In traditional paper animation the animators are often using the following method First the key images are drawn The purpose is to get a handle on the global movement on the required number of images on the timing to schedule etc In the example opposite the kid is running from the left to the right of the screen Two key images are 1 drawn The second step is to locate and draw the most important frames In our example this is when the kid is jumping the two feet are not on the floor Finally the inbetween pictures are added To begin an image is drawn between each picture 2 already visible on the timeline After this new inbetweens are added among the previous one this usually helps a lot to obtain a good quality of animation in other words a smooth flow of movement The subdivisions are repeated until the animator is satisfied of the rendering 3 CS tot te ISAS bed LARAN 4 Ss es final This simple process needs some successive subdivisions along the animation layer of the timeline That s not always easy because the images duplication creation or copy are not always convenient to use Adjusting the timing of the whole animation usually needs to duplica
31. i This icon creates bookmarks AIA With these icons you can circulate between bookmarks SAX a are storyboard elements They will be discussed about lesson 9 Layer 5 ea This icon selects the entire layer Fa This icon deletes the current layer xX2 X2 Ea These icons duplicate the current layer by keeping its contain green or by emptying it white Flee These icons split in two the layer after the current frame left or join together two selected layers right Instance is This icons selects the entire instance This icon deletes the current instance This icon erases the current instance s head EJ x2 This icon duplicates the current instance Fx This icon applies special effects from the FX Stacks and recompute the instances The steps to create animated graphics 6 27 The Animator Panel This icon adds a Faux fixe loop animation TD These icons add a new instance before left or after right the current frame GN eN These icons add as much as instances you need before left or after right the current frame If you remember well you have the possibility to name an instance Thanks to this button you can apply the same contain than the current instance to all instances using the same name For example let s take this example below where several instances with the same name are repeated in the timeline This icon select the current exposure P
32. ical tool as it is also possible to display all frames after the current frame in time and for a given layer If you configure your light table as indicated below choose the gradient option in the popup menu on the right hand side of the Light Table panel the frames after the current frame in time are displayed in a colored gradient with more or less opacity depending on their position in relation to the current frame TIT Now that you understand how this tool works let s go back and take a closer look at its control panel The steps to create animated graphics 6 31 The classical tools of the animator The two popup menu allows you to display the images after and before the current image with their original colors a color or a gradient of your choice The two colored boxes near those popup menus allow you to select the colors on the screen or a gradient in a preset list to view the frames before and after the current frame The use of colors in this viewing mode is not mandatory If you wish to keep the original image colors select the option none See below a r ska Table Lumineuse i e Instance Bin r B cou 1098 7 6 5 4 3 2 1 iii HTT H PILLE E hA yi ai E D bb Li The sliders are used to manage the opacity level of frames displayed The numbers are used to select the frames to be displayed For example in the panels shown as an example
33. ied after choosing this option Depending on your choice made in the Fill popup menu the pixels considered to be barrier pixels will be those with a different color from the original pixel color a different density a different color and density a different luminosity a color identical to the B color Opposite the border pixels in black and the color dispersion from the origin pixel in blue Depending on your choice in the Source popup menu the pixels considered to be barrier pixels are located on the current layer by default on all layers behind the current layer on all layers in front of the current layer on all layers displayed on the screen It is therefore possible to color our running kid on a layer independent of its contours 6 38 The steps to create animated graphics The inking process Let s take a look at the timeline below in this case the white pixels are transparent following a clean up of the animated footage Lo _ a Go to the coloring layer located behind the Running Kid layer and choose the layer placed in_ front_of the current layer to color the running kid in the coloring layer using the outline of the Running Kid layer It is then possible to obtain the following result 4 ins ae The Range option enables you to numerically adjust the tolerance threshold for the aforementioned criteria Fill shape menu For
34. laying the sequence AAAB DB The option mage gt Instances gt Auto Break Instance is available in the main menu When it is not checked the exposure cell which is modified won t create a new instance The new image will be copied in the head of the instance position you want to split the instance and select the Image gt Instances gt Break s It is also possible to force the splitting of an instance Place the current image at the F Instance option How to use the Instances for animating Now let s study a new example In our animation the elephant falls from the top of the screen then gets up and finally leaves the screen by walking to the left p N ANS Qang INY Zy AN IS S NN fe Og VAAN y i J SY r f Z ND f A L DY a MA E ay E RY e We o LA C r AT EP wy A 7 1 gt 2 2 gt 3 3 gt 4 We can already and easily distinguish four key images from which the inbetweens will be drawn Let s re use the method introduced earlier in this lesson but with image instances First create a new animation layer and duplicate the current frame three time You must have four empty instances on the timeline We need then to draw the four key images in each instance 6 14 The steps to create animated graphics Working with instances Just after this operation you can adjust the timing by choosing the appropriate numb
35. mple we want to repeat the previous exposure cells the instance s head and the three previous instances so 12 images The third exposure cell contains a blue circle the sixth one will contain a red rectangle etc and this repetition will loop as long as the instance will have exposure cells The Faux Fixe Value set to 12 images You can also set different behaviors than Repeat such as Ping Pong and Random Ping Pong The steps to create animated graphics 6 17 Working with instances Random How to change the line s color 2a RA You can use the option opposite in the layers stack in order to draw only on the e 9 existing pixels of your image It allows for example to change the colors of your drawings 9 5 52 54 Vin R5 RN RN Vn d ES E E E Only the layer with that option enable will be affected Erase the content of an image instance Using the erase button Ed of the main panel on the head cell of an instance erases its content Using the erase button x of the main panel on an exposure cell of an instance always breaks the instance into two smaller instances Using the erase button x of the main panel on several cells and or instances turns each cell into an empty single instance Navigate in the layer Some options are available in the Image gt Exposure menu to make the way to navigat
36. o add a scenery behind him and to add camera movement see below Two effects will help you with this Keyframer and Multiplane camera go to lessons 15 and 16 for details of these effects Add music The graphic design side of your project is now complete If you wish you may now add a sound track in order to give it that final touch Read lesson 8 for more details about this subject ine Clip XSheet p MASTER Ea a 01 intro mp3 Iani E is O T 1 A Deae een e ea she T E i ell lt a L m e aaa as Be nw e VOBz __________ _ iiZ he on a ee m y ee elles le E ARunning Kid F ee ole R S The steps to create animated graphics 6 43
37. ossible with TVPaint Animation thanks to the workspace rotation function This is done by left clicking on the button illustrated opposite in the current project window and then moving the mouse y Afichage v el 100 00 4 Ft Entr e can a aa an gt m a me a Pt Sortie The steps to create animated graphics 6 29 The classical tools of the animator ol pos It is possible to play your animation with a tilted workspace Note that workspace rotation always takes place from the center of your project window If necessary you may use the bottom and right hand sliders of your project window to position the latter see opposite y e Afichage v Lele amp 100 00 4 Pt Entr e si a lt a au gt m u gt gt mei 25 000 Pt Sortie Ss la ih P 1i Ca Cs alsa alt a a aa N fo Show Grid Show Guides Show Stencil While the workspace is rotated it becomes visible in the form of an show Paper animation disk If you do not need this function it may be disabled in Sh TERS aiad delr the Display popup menu of the current project chow Safe Area Show Field Chart show Animator Field Show Animator Disk Show Camera Animation artists who prefer to use the Animator fields may use the same menu to select this option see below Show Timeline Notes y Afichage elil ele A Ft Entr e 4 Ola m
38. parts a left and a right one All the options of the Timeline Notes are available in the left part The right part is dedicated to the drawing annotations By default you can directly draw on the right part with a blue pencil The options part We can see that there are 3 sub sections in this part It holds the main tools of the TimeLine Notes feature Most of the tools available here look a lot like the tools of the Sketch panel studied at the beginning of this lesson OI The three colored circles allow you to change the color with which the annotations will be drawn The five options underneath change the current tool type The Pencil tool icon allows you to draw annotations with the color of the icon as if you had a real pencils 2 The Color Eraser tool allows you to erase only the color that is displayed on the icon The Tint tool icon allows you to paint any pre existing annotations into the current color You can turn any line blue red or black x This action deletes all the annotations of the current color and leaves the other colors intact S This action allows you to turn the TimeLine Notes into blue red or black color All the annotations will be colorized with the current color The steps to create animated graphics 6 35 The classical tools of the animator A g Remember that the Undo u and the Redo Shift u actions are available in the TimeLine Notes E4 The Eraser tool com
39. pletely erases the annotations independently of their color It has the same functionality than the Color Eraser tool e but without taking care of the line color x The Clear All action simply erases all the annotations in the TimeLine Notes SI The Slice tool allows to split the TimeLine Notes into two parts Select the tool click on the position you want splitting and drag the right part of the TimeLine Notes where you want The Move tool moves all the TimeLine Notes Just click on the right side and drag it Now let s say a word on the option in the third sub section oip Je _ The Grid slider value enables discreet gray vertical lines on the TimeLine Notes This value represents the number of image between each vertical line The aim of this option is that the animator can clearly see to what images his annotations correspond Finally the first sub section holds 2 options Sepso Je None v _ The Size slider sel allows to change the size of the different pencils which are used Each and C4 stores its own value pencil bs _ The functionality of the popup is really interesting It allows you to play all the TimeLine Notes over the project when it is played in real time This option can draw the TimeLine Notes at different positions and sizes over the project Examples Now that all these options have been studied let s see an example with the elephant project Time Line Sheet Projects
40. r both axes Original image Horizontal flip Vertical flip Horizontal and Vertical flip To do this simply use the main menu options Image gt Modify gt Flip Horizontally Vertically or Both an image or the selected images 6 4 The steps to create animated graphics Working directly with TVPaint Animation Working directly with TVPaint Animation The Sketch panel The Sketch panel comprises some useful preset tools which will allow you to create and clean sketches as if you were drawing by hand The Sketch panel tools are designed for users who work with both computer and graphic tablet and who want to keep their old drawing tools habits pencil eraser Here is a detailed description of the panel The pencil icons allow you to draw sketches as if you had real I pencils Three colors are available black orange and blue The blue and orange pencils draw with Behind mode though the le black pencil draw in Color mode 9 A 2 The paintbrush icons allow you to paint any pre existing line into the color You can turn any line blue orange or black Ls saa 24 The flask icons allow you to turn your image into blue orange or black The first series of erasers allow to erase only the color that is displayed on the icon The cross icons delete the color s orange blue orange and blue black while leaving the other colors intact The eraser icons allow to erase a portion of th
41. raphics 6 23 Working with instances It is possible to shrink a layer from the left by repeating the operation described above with the left tab Pre and Post behavior l Mone Repeat Did you notice the small triangles on either side Ping Pong of the layers Hold A left click on the triangles offers you access to the options regarding pre and post behavior of the layers Let s take the case of post behavior as an example pre behavior works in the same way You may choose between the options None Repeat PingPong the last option only applies to animation layers Hold These options have the same effect as those offered when stretching a layer However in the present case the layer is not stretched and the post behavior will be taken into account until the end of the animation wA EON These options are also present in the contextual menu of the layer How to use several layers at the same time If you use instances when working it could be sometimes helpful to use several layers at the same time for instance if you want to stretch a drawing and its colors RENE You can select one layer by using the left mouse button on its main P Select Layer d thumbnail lf you want to select more than one layer you can use the ctrl key and Cut Layer select the needed layers by using the same method Of course you can also use the layers contextual menu And by right clicking on the colored boxes in th
42. ta a a m up gt 25000 Pt Sortie jo jo Using the light table The light table is a familiar tool to cartoon and animation artists It simplifies drawing of the current image by offering a tone down view of the images before and after the current image 6 30 The steps to create animated graphics The classical tools of the animator a onoga To activate the light table click on this icon on the wanted layer If you click on the light bulb icon Y in the menu panel or via the Windows a main menu 5 4 2 sss mtatatatata Load the animation Running Kid 2 and display only the current layer Start by choosing the co or option in the popup menu on the left hand side of the Light table panel to display all frames in front of the current frame in the color indicated default color red Then disable all the frames behind the current frame that you do not want to see by clicking on the corresponding frame number Go to the frame in the center of the animation To enable the light table in your layer click on the LT icon in this layer The following image will appear in the current project window The frames in our animation layer which precede the current frame are displayed on the screen The frames closest to the current frame in time are the most visible and those furthest away in time are the most transparent The light table is an extremely pract
43. tance Merge layers We already saw in lesson 3 how to merge image layers It is not really different if you decide to merge animation layers with instances You can use the merge menu of the timeline or drag n drop a layer on another layer TVPaint Animation will always try to create instances in the merged layer The steps to create animated graphics 6 21 Working with instances JD mF es Opposite four layers ee A B C and D are going to be merged we used the option Merge all Layers N The resulting layer uses the instances system The empty space between the two original layers is replaced by an empty instance Stretch a layer We have described how to increase the number of images of a layer by inserting some new exposure cells in the instances There are however other methods to increase the number of images in a layer Click and slide to the right on the tab encircled in black see below to call up the panel shown opposite creaseLayer Length stretch interpolate Ea Repeat Add Empty Exposures Apply Cancel The example next page gives you an idea of the effects produced by the various options Interpolation is nothing but a fade effect computed and applied by TVPaint Animation to fill the intermediary images which will be inserted between the original images A I E It is possible to stretch a layer to the left by repeating the operation 3 described above
44. te and or delete some frames and can be time consuming That is the reason why the use of the images instances is clearly advised What is an Instance L An instance is simply an image in an animation layer an image whose lm duration can be adjusted Each instance in the timeline has now two small squares which allows bA to use this feature The one at the bottom on the right is for stretching the duration of the current instance To do so simply click on this little S handle it becomes yellow and move it as shown opposite You have just increased the duration of the current image Any image of an animation layer is considered as an instance Of course if you stretch an instance the following instances will shift back 6 12 The steps to create animated graphics Working with instances Gc aar e LA ik Extend Exposure Cells without Ctrl key If you pull on the left your instance will decrease to the head s instance the first image You will notice another square on your instances on the left at the top this time This handle allows you to stretch an instance without modifying the total duration of your animation Some vocabulary Here is the name of each new element visible on screen Opposite we have an Instance containing instance four Cells The first cell is called Head Cell or more simply Head sprocket The following cells when existing are called Exposure
Download Pdf Manuals
Related Search