https://wiki.synfig.org/api.php?action=feedcontributions&user=DeanBrettle&feedformat=atomSynfig Studio :: Documentation - User contributions [en]2024-03-29T14:26:13ZUser contributionsMediaWiki 1.26.3https://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15676Anatomy of a Synfig Animation2012-04-03T18:23:02Z<p>DeanBrettle: Replaced with word-smithed version of text posted to forum by Genete</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together.<br />
<br />
Synfig files are called "documents" or simply animation source files in the wiki. Synfig can use these files to "render" the frames in an animated GIF or a video.<br />
<br />
In each Synfig document there must be at least one canvas (called the root canvas). A canvas is defined by the default width and height of the rendered frames, the default frequency for sampling the contents of the canvas when rendering (the frames per second), the animation duration (start and end times), other parameters, and a stack of layers that are combined on the canvas to render each frame.<br />
<br />
There are two types of layers: Primitive and Filters. Primitives, such as shapes and gradients, produce content based on their own parameters. Filter layers, such as blur and rotate layers, produce content based on their own parameters and on the context of the layer. The context of a layer is the rendered result of the layers that are stacked behind it.<br />
<br />
There is one special kind of layer that is called a Paste Canvas layer. It is a folder-like layer that uses the rendered result of all the layers in another canvas. The other canvas can be: <br />
* the root canvas of another document,<br />
* an internal separate canvas, called an "exported canvas", that can be used at several different places in the same document,<br />
* an exported canvas in another document, or<br />
* an "inline canvas" that takes the default definitions (dimensions, frames per second, etc.) inherited from the canvas containing the Paste Canvas layer<br />
<br />
All the layers inside the canvas held by a Paste Canvas Layer, are called children layers of the Paste Canvas layer.<br />
<br />
The Context of a layer is defined by the canvas where it lives. It is the rendered result of layers that are behind it. If the layer is a child of a Paste Canvas layer, its context is the sibling layers (i.e. other children of the same Paste Canvas layer) which are behind it.<br />
<br />
Treated as a layer, a Paste Canvas is like a "super layer". Its rendered result is based on its context, parameters, and the rendered result of its children. <br />
<br />
The layers of a canvas are used for the entire duration of the canvas. In other words, the same layers are used to render all frames. However, each layer can be animated by the animation of its parameters. The animation of a parameter is determined by a list of 'waypoints' associated with the parameter. Each waypoint defines the value of the parameter value at a certain time. Synfig automatically interpolates parameter values between waypoints.<br />
<br />
Many types of layers have a parameter called the "blend method" parameter. The blend method defines how a layer is combined with its context. The default blend method, composite, <br />
effectively places the layer in front of its context, letting the context show through only where the layer is transparent. However, there are other blend methods that do other effects like masks, shading, etc.<br />
<br />
To summarize, when Synfig renders an animation from a Synfig document it renders each frame using the layers in the root canvas and their interpolated parameter values.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15668Anatomy of a Synfig Animation2012-04-01T23:35:08Z<p>DeanBrettle: /* Summary */ Frame -> page. Simplified wording a bit.</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig canvas is a flip book with drawing instructions ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. One way to create such an animation is to draw each frame on a separate page of a book called a flip book. A viewer can see the animation by flipping through the pages of the flip book quickly.<br />
<br />
Of course, manually drawing all of the pages in a flip book takes a long time. What we'd really prefer is to simply describe how to draw the pages and have them all drawn automatically based on our instructions. Synfig Studio allows us to do that. In Synfig, the flip book with drawing instructions is called a '''canvas'''.<br />
<br />
In real life, the term "canvas" normally refers to a single flat surface. It is important to remember that in Synfig, the canvas is not just one page in the flip book -- it is the entire flip book. And the flip book has drawing instructions for Synfig to follow. <br />
<br />
Within this manual the term "canvas" is also used to refer to the window where most editing occurs. The canvas window only shows one page from the flip book at a time. Unfortunately, that can reinforce the wrong idea of the canvas being only one page. However, the canvas window also has a timeline at the bottom. Clicking on different times in the timeline shows different pages in the flip book. So the canvas window really does allow us to see all the pages in the flip book, just not at the same time. <br />
<br />
Moreover, when we draw or edit in the canvas window, we aren't only changing the page that is currently displayed. Our changes can also affect other pages. For example, if we draw a circle on a page, it is automatically drawn on all the other pages as well.<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws each page in a particular flip book according to a set of instructions. Each instruction is called a '''layer''' and these layers are arranged in a stack with the first layer/instruction at the bottom of the stack. <br />
<br />
The term '''layer''' may seem to be an odd name for an instruction, but by default many layers act like the "transparent sheets" found in other applications. For example, consider a circle layer on top of a rectangle layer. When Synfig draws these layers the result is a circle on top of a rectangle as you might expect. If you think about layers as transparent sheets, you would think about this as a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. <br />
<br />
That "transparent sheets" ideas is often sufficient, but sometimes it is useful or necessary to think about layers as instructions. When thinking about layers this way, each page starts as completely transparent, and each layer tells Synfig to do something with the page. The first instruction is the bottom most layer. In our example that is the rectangle layer. The rectangle layer's instruction is simply "draw a rectangle". The next instruction is the next higher layer in the stack, the circle layer. It says to "draw a circle". <br />
<br />
It is easy to see that drawing a rectangle and then drawing a circle will produce the same result as stacking a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. So in this case it doesn't matter whether we think of layers as instructions or transparent sheets. So how are Synfig's layers different from transparent sheets? <br />
<br />
First, although a transparent sheet could contain many shapes, a Synfig layer cannot. In Synfig, each shape is drawn by separate layer. In fact, Synfig even considers the outline and interior region of a shape to be separate shapes, so they are drawn by separate layers.<br />
<br />
Second, there are many types of layers that don't act like transparent sheets at all. These types of layers are sometimes called filter layers or effect layers. For example, a blur layer blurs the page, and a rotate layer rotates the page. Layers always act on the page as it was left by the layers lower in the stack. So a rotate layer on top of two rectangle layers will rotate the page containing the rectangles. It won't rotate each of the rectangles in place.<br />
<br />
Third, layers have '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the page has a parameter for the angle of rotation. A layer which blurs the page has a parameter for the amount to blur it. Synfig uses exactly the same stack of layers to draw on every page of a flip book. The only thing which changes from one page to another is the values of the parameters. In a later section, we'll see how Synfig Studio allows us to control what parameter values to use when it draws each page.<br />
<br />
Fourth, even shape layers don't always act like transparent sheets. Many types of layer, including shape layers, have a "blend method" parameter. To understand how it works it is easiest think about what these layers do as a two step process. First, they create a new transparent page, separate from any flipbook. For example, a circle layer creates a page with a circle on it. Next, they combine the new page with the current page through a process called '''blending'''. <br />
<br />
The blend method parameter value controls how each pixel in the current page will be changed based on the color and transparency of that pixel and the pixel at the same location in the new page. There are many blend methods to choose from. The default is the composite blend method. It effectively places the new page on top of the existing page, letting the existing page show through only where the new page is transparent. This is why shape layers act like transparent sheets by default. However, other blend methods can have very different effects. As an extreme example, the Behind blend method effectively places the new page ''under'' the existing page. So a layer with a Behind blend method will actually appear to be ''under'' all of the layers that are below it in the stack.<br />
<br />
== Paste Canvas layers allow us to create trees of layers ==<br />
<br />
There is one more way that Synfig layers are more like instructions than transparent sheets. There is a type of layer called a Paste Canvas layer that can blend a page from another flipbook (i.e. a canvas) into the current page. We can use Paste Canvas layers to build a complex canvas out of simpler canvases. Each of the simpler canvases has its own stack of layers, and the layers of a canvas only control the drawing of the pages in that canvas.<br />
<br />
For example, if we are trying to animate a person we might have six separate canvases -- one each for the right leg, left leg, right arm, left arm, torso, and head. The main canvas would have six Paste Canvas layers, each one blending in a page from one of the body part canvases. This arrangement ensures that layers in one bodypart canvas don't affect another bodypart. For example, a rotate layer at the top of the right arm canvas will only rotate the right arm.<br />
<br />
Of course, the simpler canvases can themselves contain Paste Canvas layers, resulting in a tree of nested layers. For example, the arm canvas could contain Paste Canvas layers that refer to separate canvases for the upper arm, lower arm, and hand.<br />
<br />
With Synfig Studio, we can create each branch of the layer tree by telling Synfig to '''encapsulate''' a set of layers. Encapsulating a set of layers causes Synfig to move them to a new canvas and, in their place, add a Paste Canvas layer that refers to the new canvas. In the Layers Panel, the added Paste Canvas layer can be expanded to see the layers that were encapsulated in the new canvas.<br />
<br />
Even though the layer tree may contains layers from many canvases, Synfig Studio provides a unified view that allows us to directly edit any of the layers in the tree without needing to open the canvases individually. For example, we can be directly select and edit the hand in the canvas window even though it is two layers deep in the layer tree.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
As mentioned earlier, Synfig uses exactly the same stack of layers to draw on every page of a flip book. The only thing which changes from one page to another is the values of the layer parameters. <br />
<br />
When drawing a particular page, Synfig needs to determine the values of all of the parameters for all of the layers at the page's time within the animation. If we want we can set the value directly for a particular page. This establishes a '''waypoint''' for the value at that page's time. The waypoint ensures that the parameter will have the specified value at the specified time. <br />
<br />
Of course, directly specifying the value for each page is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
We can also indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. <br />
<br />
In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a stack of layers with their time-varying parameter values, are the drawing instructions that, taken together with a flip book, make up a canvas. The time-varying parameter values are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular page determine the ways that the layers draw that page. There are many kinds of layers, including layers that draw shapes, rotate the page, or blur the page, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also Paste Canvas layers which can blend a page from a diffent canvas into the current page. These layers allow us to create a tree of layers which can be used to create complex animations.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15667Anatomy of a Synfig Animation2012-04-01T23:28:56Z<p>DeanBrettle: /* Synfig determines parameter values using waypoints, interpolation, or other parameter values */ More paragraph breaks and frame->page.</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig canvas is a flip book with drawing instructions ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. One way to create such an animation is to draw each frame on a separate page of a book called a flip book. A viewer can see the animation by flipping through the pages of the flip book quickly.<br />
<br />
Of course, manually drawing all of the pages in a flip book takes a long time. What we'd really prefer is to simply describe how to draw the pages and have them all drawn automatically based on our instructions. Synfig Studio allows us to do that. In Synfig, the flip book with drawing instructions is called a '''canvas'''.<br />
<br />
In real life, the term "canvas" normally refers to a single flat surface. It is important to remember that in Synfig, the canvas is not just one page in the flip book -- it is the entire flip book. And the flip book has drawing instructions for Synfig to follow. <br />
<br />
Within this manual the term "canvas" is also used to refer to the window where most editing occurs. The canvas window only shows one page from the flip book at a time. Unfortunately, that can reinforce the wrong idea of the canvas being only one page. However, the canvas window also has a timeline at the bottom. Clicking on different times in the timeline shows different pages in the flip book. So the canvas window really does allow us to see all the pages in the flip book, just not at the same time. <br />
<br />
Moreover, when we draw or edit in the canvas window, we aren't only changing the page that is currently displayed. Our changes can also affect other pages. For example, if we draw a circle on a page, it is automatically drawn on all the other pages as well.<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws each page in a particular flip book according to a set of instructions. Each instruction is called a '''layer''' and these layers are arranged in a stack with the first layer/instruction at the bottom of the stack. <br />
<br />
The term '''layer''' may seem to be an odd name for an instruction, but by default many layers act like the "transparent sheets" found in other applications. For example, consider a circle layer on top of a rectangle layer. When Synfig draws these layers the result is a circle on top of a rectangle as you might expect. If you think about layers as transparent sheets, you would think about this as a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. <br />
<br />
That "transparent sheets" ideas is often sufficient, but sometimes it is useful or necessary to think about layers as instructions. When thinking about layers this way, each page starts as completely transparent, and each layer tells Synfig to do something with the page. The first instruction is the bottom most layer. In our example that is the rectangle layer. The rectangle layer's instruction is simply "draw a rectangle". The next instruction is the next higher layer in the stack, the circle layer. It says to "draw a circle". <br />
<br />
It is easy to see that drawing a rectangle and then drawing a circle will produce the same result as stacking a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. So in this case it doesn't matter whether we think of layers as instructions or transparent sheets. So how are Synfig's layers different from transparent sheets? <br />
<br />
First, although a transparent sheet could contain many shapes, a Synfig layer cannot. In Synfig, each shape is drawn by separate layer. In fact, Synfig even considers the outline and interior region of a shape to be separate shapes, so they are drawn by separate layers.<br />
<br />
Second, there are many types of layers that don't act like transparent sheets at all. These types of layers are sometimes called filter layers or effect layers. For example, a blur layer blurs the page, and a rotate layer rotates the page. Layers always act on the page as it was left by the layers lower in the stack. So a rotate layer on top of two rectangle layers will rotate the page containing the rectangles. It won't rotate each of the rectangles in place.<br />
<br />
Third, layers have '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the page has a parameter for the angle of rotation. A layer which blurs the page has a parameter for the amount to blur it. Synfig uses exactly the same stack of layers to draw on every page of a flip book. The only thing which changes from one page to another is the values of the parameters. In a later section, we'll see how Synfig Studio allows us to control what parameter values to use when it draws each page.<br />
<br />
Fourth, even shape layers don't always act like transparent sheets. Many types of layer, including shape layers, have a "blend method" parameter. To understand how it works it is easiest think about what these layers do as a two step process. First, they create a new transparent page, separate from any flipbook. For example, a circle layer creates a page with a circle on it. Next, they combine the new page with the current page through a process called '''blending'''. <br />
<br />
The blend method parameter value controls how each pixel in the current page will be changed based on the color and transparency of that pixel and the pixel at the same location in the new page. There are many blend methods to choose from. The default is the composite blend method. It effectively places the new page on top of the existing page, letting the existing page show through only where the new page is transparent. This is why shape layers act like transparent sheets by default. However, other blend methods can have very different effects. As an extreme example, the Behind blend method effectively places the new page ''under'' the existing page. So a layer with a Behind blend method will actually appear to be ''under'' all of the layers that are below it in the stack.<br />
<br />
== Paste Canvas layers allow us to create trees of layers ==<br />
<br />
There is one more way that Synfig layers are more like instructions than transparent sheets. There is a type of layer called a Paste Canvas layer that can blend a page from another flipbook (i.e. a canvas) into the current page. We can use Paste Canvas layers to build a complex canvas out of simpler canvases. Each of the simpler canvases has its own stack of layers, and the layers of a canvas only control the drawing of the pages in that canvas.<br />
<br />
For example, if we are trying to animate a person we might have six separate canvases -- one each for the right leg, left leg, right arm, left arm, torso, and head. The main canvas would have six Paste Canvas layers, each one blending in a page from one of the body part canvases. This arrangement ensures that layers in one bodypart canvas don't affect another bodypart. For example, a rotate layer at the top of the right arm canvas will only rotate the right arm.<br />
<br />
Of course, the simpler canvases can themselves contain Paste Canvas layers, resulting in a tree of nested layers. For example, the arm canvas could contain Paste Canvas layers that refer to separate canvases for the upper arm, lower arm, and hand.<br />
<br />
With Synfig Studio, we can create each branch of the layer tree by telling Synfig to '''encapsulate''' a set of layers. Encapsulating a set of layers causes Synfig to move them to a new canvas and, in their place, add a Paste Canvas layer that refers to the new canvas. In the Layers Panel, the added Paste Canvas layer can be expanded to see the layers that were encapsulated in the new canvas.<br />
<br />
Even though the layer tree may contains layers from many canvases, Synfig Studio provides a unified view that allows us to directly edit any of the layers in the tree without needing to open the canvases individually. For example, we can be directly select and edit the hand in the canvas window even though it is two layers deep in the layer tree.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
As mentioned earlier, Synfig uses exactly the same stack of layers to draw on every page of a flip book. The only thing which changes from one page to another is the values of the layer parameters. <br />
<br />
When drawing a particular page, Synfig needs to determine the values of all of the parameters for all of the layers at the page's time within the animation. If we want we can set the value directly for a particular page. This establishes a '''waypoint''' for the value at that page's time. The waypoint ensures that the parameter will have the specified value at the specified time. <br />
<br />
Of course, directly specifying the value for each page is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
We can also indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. <br />
<br />
In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, are the drawing instructions that taken together with a flip book containing some number of pages make up a canvas. The time-varying parameter values are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15666Anatomy of a Synfig Animation2012-04-01T23:20:25Z<p>DeanBrettle: /* Synfig draws frames according to instructions called layers */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig canvas is a flip book with drawing instructions ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. One way to create such an animation is to draw each frame on a separate page of a book called a flip book. A viewer can see the animation by flipping through the pages of the flip book quickly.<br />
<br />
Of course, manually drawing all of the pages in a flip book takes a long time. What we'd really prefer is to simply describe how to draw the pages and have them all drawn automatically based on our instructions. Synfig Studio allows us to do that. In Synfig, the flip book with drawing instructions is called a '''canvas'''.<br />
<br />
In real life, the term "canvas" normally refers to a single flat surface. It is important to remember that in Synfig, the canvas is not just one page in the flip book -- it is the entire flip book. And the flip book has drawing instructions for Synfig to follow. <br />
<br />
Within this manual the term "canvas" is also used to refer to the window where most editing occurs. The canvas window only shows one page from the flip book at a time. Unfortunately, that can reinforce the wrong idea of the canvas being only one page. However, the canvas window also has a timeline at the bottom. Clicking on different times in the timeline shows different pages in the flip book. So the canvas window really does allow us to see all the pages in the flip book, just not at the same time. <br />
<br />
Moreover, when we draw or edit in the canvas window, we aren't only changing the page that is currently displayed. Our changes can also affect other pages. For example, if we draw a circle on a page, it is automatically drawn on all the other pages as well.<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws each page in a particular flip book according to a set of instructions. Each instruction is called a '''layer''' and these layers are arranged in a stack with the first layer/instruction at the bottom of the stack. <br />
<br />
The term '''layer''' may seem to be an odd name for an instruction, but by default many layers act like the "transparent sheets" found in other applications. For example, consider a circle layer on top of a rectangle layer. When Synfig draws these layers the result is a circle on top of a rectangle as you might expect. If you think about layers as transparent sheets, you would think about this as a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. <br />
<br />
That "transparent sheets" ideas is often sufficient, but sometimes it is useful or necessary to think about layers as instructions. When thinking about layers this way, each page starts as completely transparent, and each layer tells Synfig to do something with the page. The first instruction is the bottom most layer. In our example that is the rectangle layer. The rectangle layer's instruction is simply "draw a rectangle". The next instruction is the next higher layer in the stack, the circle layer. It says to "draw a circle". <br />
<br />
It is easy to see that drawing a rectangle and then drawing a circle will produce the same result as stacking a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. So in this case it doesn't matter whether we think of layers as instructions or transparent sheets. So how are Synfig's layers different from transparent sheets? <br />
<br />
First, although a transparent sheet could contain many shapes, a Synfig layer cannot. In Synfig, each shape is drawn by separate layer. In fact, Synfig even considers the outline and interior region of a shape to be separate shapes, so they are drawn by separate layers.<br />
<br />
Second, there are many types of layers that don't act like transparent sheets at all. These types of layers are sometimes called filter layers or effect layers. For example, a blur layer blurs the page, and a rotate layer rotates the page. Layers always act on the page as it was left by the layers lower in the stack. So a rotate layer on top of two rectangle layers will rotate the page containing the rectangles. It won't rotate each of the rectangles in place.<br />
<br />
Third, layers have '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the page has a parameter for the angle of rotation. A layer which blurs the page has a parameter for the amount to blur it. Synfig uses exactly the same stack of layers to draw on every page of a flip book. The only thing which changes from one page to another is the values of the parameters. In a later section, we'll see how Synfig Studio allows us to control what parameter values to use when it draws each page.<br />
<br />
Fourth, even shape layers don't always act like transparent sheets. Many types of layer, including shape layers, have a "blend method" parameter. To understand how it works it is easiest think about what these layers do as a two step process. First, they create a new transparent page, separate from any flipbook. For example, a circle layer creates a page with a circle on it. Next, they combine the new page with the current page through a process called '''blending'''. <br />
<br />
The blend method parameter value controls how each pixel in the current page will be changed based on the color and transparency of that pixel and the pixel at the same location in the new page. There are many blend methods to choose from. The default is the composite blend method. It effectively places the new page on top of the existing page, letting the existing page show through only where the new page is transparent. This is why shape layers act like transparent sheets by default. However, other blend methods can have very different effects. As an extreme example, the Behind blend method effectively places the new page ''under'' the existing page. So a layer with a Behind blend method will actually appear to be ''under'' all of the layers that are below it in the stack.<br />
<br />
== Paste Canvas layers allow us to create trees of layers ==<br />
<br />
There is one more way that Synfig layers are more like instructions than transparent sheets. There is a type of layer called a Paste Canvas layer that can blend a page from another flipbook (i.e. a canvas) into the current page. We can use Paste Canvas layers to build a complex canvas out of simpler canvases. Each of the simpler canvases has its own stack of layers, and the layers of a canvas only control the drawing of the pages in that canvas.<br />
<br />
For example, if we are trying to animate a person we might have six separate canvases -- one each for the right leg, left leg, right arm, left arm, torso, and head. The main canvas would have six Paste Canvas layers, each one blending in a page from one of the body part canvases. This arrangement ensures that layers in one bodypart canvas don't affect another bodypart. For example, a rotate layer at the top of the right arm canvas will only rotate the right arm.<br />
<br />
Of course, the simpler canvases can themselves contain Paste Canvas layers, resulting in a tree of nested layers. For example, the arm canvas could contain Paste Canvas layers that refer to separate canvases for the upper arm, lower arm, and hand.<br />
<br />
With Synfig Studio, we can create each branch of the layer tree by telling Synfig to '''encapsulate''' a set of layers. Encapsulating a set of layers causes Synfig to move them to a new canvas and, in their place, add a Paste Canvas layer that refers to the new canvas. In the Layers Panel, the added Paste Canvas layer can be expanded to see the layers that were encapsulated in the new canvas.<br />
<br />
Even though the layer tree may contains layers from many canvases, Synfig Studio provides a unified view that allows us to directly edit any of the layers in the tree without needing to open the canvases individually. For example, we can be directly select and edit the hand in the canvas window even though it is two layers deep in the layer tree.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, are the drawing instructions that taken together with a flip book containing some number of pages make up a canvas. The time-varying parameter values are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15665Anatomy of a Synfig Animation2012-04-01T22:54:54Z<p>DeanBrettle: /* Paste Canvas layers allow trees of layers to be constructed */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig canvas is a flip book with drawing instructions ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. One way to create such an animation is to draw each frame on a separate page of a book called a flip book. A viewer can see the animation by flipping through the pages of the flip book quickly.<br />
<br />
Of course, manually drawing all of the pages in a flip book takes a long time. What we'd really prefer is to simply describe how to draw the pages and have them all drawn automatically based on our instructions. Synfig Studio allows us to do that. In Synfig, the flip book with drawing instructions is called a '''canvas'''.<br />
<br />
In real life, the term "canvas" normally refers to a single flat surface. It is important to remember that in Synfig, the canvas is not just one page in the flip book -- it is the entire flip book. And the flip book has drawing instructions for Synfig to follow. <br />
<br />
Within this manual the term "canvas" is also used to refer to the window where most editing occurs. The canvas window only shows one page from the flip book at a time. Unfortunately, that can reinforce the wrong idea of the canvas being only one page. However, the canvas window also has a timeline at the bottom. Clicking on different times in the timeline shows different pages in the flip book. So the canvas window really does allow us to see all the pages in the flip book, just not at the same time. <br />
<br />
Moreover, when we draw or edit in the canvas window, we aren't only changing the page that is currently displayed. Our changes can also affect other pages. For example, if we draw a circle on a page, it is automatically drawn on all the other pages as well.<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws each page in a particular flip book according to a set of instructions. Each instruction is called a '''layer''' and these layers are arranged in a stack with the first layer/instruction at the bottom of the stack. <br />
<br />
The term '''layer''' may seem to be an odd name for an instruction, but by default many layers act like the "transparent sheets" found in other applications. For example, consider a circle layer on top of a rectangle layer. When Synfig draws these layers the result is a circle on top of a rectangle as you might expect. If you think about layers as transparent sheets, you would think about this as a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. <br />
<br />
That "transparent sheets" ideas is often sufficient, but sometimes it is useful or necessary to think about layers as instructions. When thinking about layers this way, each page starts as completely transparent, and each layer tells Synfig to do something with the page. The first instruction is the bottom most layer. In our example that is the rectangle layer. The rectangle layer's instruction is simply "draw a rectangle". The next instruction is the next higher layer in the stack, the circle layer. It says to "draw a circle". <br />
<br />
It is easy to see that drawing a rectangle and then drawing a circle will produce the same result as stacking a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. So in this case it doesn't matter whether we think of layers as instructions or transparent sheets. So how are Synfig's layers different from transparent sheets? <br />
<br />
First, although a transparent sheet could contain many shapes, a Synfig layer can not. In Synfig, each shape is drawn by separate layer. In fact, Synfig even considers the outline and interior region of a shape to be separate shapes, so they are drawn by separate layers.<br />
<br />
Second, there are many types of layers that don't act like transparent sheets at all. These types of layers are sometimes called filter layers or effect layers. For example, a blur layer blurs the page, and a rotate layer rotates the page. Layers always act on the page as it was left by the layers lower in the stack. So a rotate layer on top of two rectangle layers will rotate the page containing the rectangles. It won't rotate each of the rectangles in place.<br />
<br />
Third, layers have '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the page has a parameter for the angle of rotation. A layer which blurs the page has a parameter for the amount to blur it. As we'll see in the next section, we can control what value Synfig should use for these parameters when it draws each page.<br />
<br />
Fourth, even shape layers don't always act like transparent sheets. Many types of layer, including shape layers, have a "blend method" parameter. To understand how it works it is easiest think about what these layers do as a two step process. First, they create a new transparent page, separate from any flipbook. For example, a circle layer creates a page with a circle on it. Next, they combine the new page with the current page through a process called '''blending'''. <br />
<br />
The blend method parameter value controls how each pixel in the current page will be changed based on the color and transparency of that pixel and the pixel at the same location in the new page. There are many blend methods to choose from. The default is the composite blend method. It effectively places the new page on top of the existing page, letting the existing page show through only where the new page is transparent. This is why shape layers act like transparent sheets by default. However, other blend methods can have very different effects. As an extreme example, the Behind blend method effectively places the new page ''under'' the existing page. So a layer with a Behind blend method will actually appear to be ''under'' all of the layers that are below it in the stack.<br />
<br />
== Paste Canvas layers allow us to create trees of layers ==<br />
<br />
There is one more way that Synfig layers are more like instructions than transparent sheets. There is a type of layer called a Paste Canvas layer that can blend a page from another flipbook (i.e. a canvas) into the current page. We can use Paste Canvas layers to build a complex canvas out of simpler canvases. Each of the simpler canvases has its own stack of layers, and the layers of a canvas only control the drawing of the pages in that canvas.<br />
<br />
For example, if we are trying to animate a person we might have six separate canvases -- one each for the right leg, left leg, right arm, left arm, torso, and head. The main canvas would have six Paste Canvas layers, each one blending in a page from one of the body part canvases. This arrangement ensures that layers in one bodypart canvas don't affect another bodypart. For example, a rotate layer at the top of the right arm canvas will only rotate the right arm.<br />
<br />
Of course, the simpler canvases can themselves contain Paste Canvas layers, resulting in a tree of nested layers. For example, the arm canvas could contain Paste Canvas layers that refer to separate canvases for the upper arm, lower arm, and hand.<br />
<br />
With Synfig Studio, we can create each branch of the layer tree by telling Synfig to '''encapsulate''' a set of layers. Encapsulating a set of layers causes Synfig to move them to a new canvas and, in their place, add a Paste Canvas layer that refers to the new canvas. In the Layers Panel, the added Paste Canvas layer can be expanded to see the layers that were encapsulated in the new canvas.<br />
<br />
Even though the layer tree may contains layers from many canvases, Synfig Studio provides a unified view that allows us to directly edit any of the layers in the tree without needing to open the canvases individually. For example, we can be directly select and edit the hand in the canvas window even though it is two layers deep in the layer tree.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, are the drawing instructions that taken together with a flip book containing some number of pages make up a canvas. The time-varying parameter values are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15664Anatomy of a Synfig Animation2012-04-01T22:54:22Z<p>DeanBrettle: /* Paste Canvas layers allow canvases to be combined */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig canvas is a flip book with drawing instructions ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. One way to create such an animation is to draw each frame on a separate page of a book called a flip book. A viewer can see the animation by flipping through the pages of the flip book quickly.<br />
<br />
Of course, manually drawing all of the pages in a flip book takes a long time. What we'd really prefer is to simply describe how to draw the pages and have them all drawn automatically based on our instructions. Synfig Studio allows us to do that. In Synfig, the flip book with drawing instructions is called a '''canvas'''.<br />
<br />
In real life, the term "canvas" normally refers to a single flat surface. It is important to remember that in Synfig, the canvas is not just one page in the flip book -- it is the entire flip book. And the flip book has drawing instructions for Synfig to follow. <br />
<br />
Within this manual the term "canvas" is also used to refer to the window where most editing occurs. The canvas window only shows one page from the flip book at a time. Unfortunately, that can reinforce the wrong idea of the canvas being only one page. However, the canvas window also has a timeline at the bottom. Clicking on different times in the timeline shows different pages in the flip book. So the canvas window really does allow us to see all the pages in the flip book, just not at the same time. <br />
<br />
Moreover, when we draw or edit in the canvas window, we aren't only changing the page that is currently displayed. Our changes can also affect other pages. For example, if we draw a circle on a page, it is automatically drawn on all the other pages as well.<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws each page in a particular flip book according to a set of instructions. Each instruction is called a '''layer''' and these layers are arranged in a stack with the first layer/instruction at the bottom of the stack. <br />
<br />
The term '''layer''' may seem to be an odd name for an instruction, but by default many layers act like the "transparent sheets" found in other applications. For example, consider a circle layer on top of a rectangle layer. When Synfig draws these layers the result is a circle on top of a rectangle as you might expect. If you think about layers as transparent sheets, you would think about this as a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. <br />
<br />
That "transparent sheets" ideas is often sufficient, but sometimes it is useful or necessary to think about layers as instructions. When thinking about layers this way, each page starts as completely transparent, and each layer tells Synfig to do something with the page. The first instruction is the bottom most layer. In our example that is the rectangle layer. The rectangle layer's instruction is simply "draw a rectangle". The next instruction is the next higher layer in the stack, the circle layer. It says to "draw a circle". <br />
<br />
It is easy to see that drawing a rectangle and then drawing a circle will produce the same result as stacking a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. So in this case it doesn't matter whether we think of layers as instructions or transparent sheets. So how are Synfig's layers different from transparent sheets? <br />
<br />
First, although a transparent sheet could contain many shapes, a Synfig layer can not. In Synfig, each shape is drawn by separate layer. In fact, Synfig even considers the outline and interior region of a shape to be separate shapes, so they are drawn by separate layers.<br />
<br />
Second, there are many types of layers that don't act like transparent sheets at all. These types of layers are sometimes called filter layers or effect layers. For example, a blur layer blurs the page, and a rotate layer rotates the page. Layers always act on the page as it was left by the layers lower in the stack. So a rotate layer on top of two rectangle layers will rotate the page containing the rectangles. It won't rotate each of the rectangles in place.<br />
<br />
Third, layers have '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the page has a parameter for the angle of rotation. A layer which blurs the page has a parameter for the amount to blur it. As we'll see in the next section, we can control what value Synfig should use for these parameters when it draws each page.<br />
<br />
Fourth, even shape layers don't always act like transparent sheets. Many types of layer, including shape layers, have a "blend method" parameter. To understand how it works it is easiest think about what these layers do as a two step process. First, they create a new transparent page, separate from any flipbook. For example, a circle layer creates a page with a circle on it. Next, they combine the new page with the current page through a process called '''blending'''. <br />
<br />
The blend method parameter value controls how each pixel in the current page will be changed based on the color and transparency of that pixel and the pixel at the same location in the new page. There are many blend methods to choose from. The default is the composite blend method. It effectively places the new page on top of the existing page, letting the existing page show through only where the new page is transparent. This is why shape layers act like transparent sheets by default. However, other blend methods can have very different effects. As an extreme example, the Behind blend method effectively places the new page ''under'' the existing page. So a layer with a Behind blend method will actually appear to be ''under'' all of the layers that are below it in the stack.<br />
<br />
== Paste Canvas layers allow trees of layers to be constructed ==<br />
<br />
There is one more way that Synfig layers are more like instructions than transparent sheets. There is a type of layer called a Paste Canvas layer that can blend a page from another flipbook (i.e. a canvas) into the current page. We can use Paste Canvas layers to build a complex canvas out of simpler canvases. Each of the simpler canvases has its own stack of layers, and the layers of a canvas only control the drawing of the pages in that canvas.<br />
<br />
For example, if we are trying to animate a person we might have six separate canvases -- one each for the right leg, left leg, right arm, left arm, torso, and head. The main canvas would have six Paste Canvas layers, each one blending in a page from one of the body part canvases. This arrangement ensures that layers in one bodypart canvas don't affect another bodypart. For example, a rotate layer at the top of the right arm canvas will only rotate the right arm.<br />
<br />
Of course, the simpler canvases can themselves contain Paste Canvas layers, resulting in a tree of nested layers. For example, the arm canvas could contain Paste Canvas layers that refer to separate canvases for the upper arm, lower arm, and hand.<br />
<br />
With Synfig Studio, we can create each branch of the layer tree by telling Synfig to '''encapsulate''' a set of layers. Encapsulating a set of layers causes Synfig to move them to a new canvas and, in their place, add a Paste Canvas layer that refers to the new canvas. In the Layers Panel, the added Paste Canvas layer can be expanded to see the layers that were encapsulated in the new canvas.<br />
<br />
Even though the layer tree may contains layers from many canvases, Synfig Studio provides a unified view that allows us to directly edit any of the layers in the tree without needing to open the canvases individually. For example, we can be directly select and edit the hand in the canvas window even though it is two layers deep in the layer tree.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, are the drawing instructions that taken together with a flip book containing some number of pages make up a canvas. The time-varying parameter values are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15663Anatomy of a Synfig Animation2012-04-01T22:52:23Z<p>DeanBrettle: /* Synfig draws frames according to instructions called layers */ Added section on Paste Canvas layers</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig canvas is a flip book with drawing instructions ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. One way to create such an animation is to draw each frame on a separate page of a book called a flip book. A viewer can see the animation by flipping through the pages of the flip book quickly.<br />
<br />
Of course, manually drawing all of the pages in a flip book takes a long time. What we'd really prefer is to simply describe how to draw the pages and have them all drawn automatically based on our instructions. Synfig Studio allows us to do that. In Synfig, the flip book with drawing instructions is called a '''canvas'''.<br />
<br />
In real life, the term "canvas" normally refers to a single flat surface. It is important to remember that in Synfig, the canvas is not just one page in the flip book -- it is the entire flip book. And the flip book has drawing instructions for Synfig to follow. <br />
<br />
Within this manual the term "canvas" is also used to refer to the window where most editing occurs. The canvas window only shows one page from the flip book at a time. Unfortunately, that can reinforce the wrong idea of the canvas being only one page. However, the canvas window also has a timeline at the bottom. Clicking on different times in the timeline shows different pages in the flip book. So the canvas window really does allow us to see all the pages in the flip book, just not at the same time. <br />
<br />
Moreover, when we draw or edit in the canvas window, we aren't only changing the page that is currently displayed. Our changes can also affect other pages. For example, if we draw a circle on a page, it is automatically drawn on all the other pages as well.<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws each page in a particular flip book according to a set of instructions. Each instruction is called a '''layer''' and these layers are arranged in a stack with the first layer/instruction at the bottom of the stack. <br />
<br />
The term '''layer''' may seem to be an odd name for an instruction, but by default many layers act like the "transparent sheets" found in other applications. For example, consider a circle layer on top of a rectangle layer. When Synfig draws these layers the result is a circle on top of a rectangle as you might expect. If you think about layers as transparent sheets, you would think about this as a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. <br />
<br />
That "transparent sheets" ideas is often sufficient, but sometimes it is useful or necessary to think about layers as instructions. When thinking about layers this way, each page starts as completely transparent, and each layer tells Synfig to do something with the page. The first instruction is the bottom most layer. In our example that is the rectangle layer. The rectangle layer's instruction is simply "draw a rectangle". The next instruction is the next higher layer in the stack, the circle layer. It says to "draw a circle". <br />
<br />
It is easy to see that drawing a rectangle and then drawing a circle will produce the same result as stacking a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. So in this case it doesn't matter whether we think of layers as instructions or transparent sheets. So how are Synfig's layers different from transparent sheets? <br />
<br />
First, although a transparent sheet could contain many shapes, a Synfig layer can not. In Synfig, each shape is drawn by separate layer. In fact, Synfig even considers the outline and interior region of a shape to be separate shapes, so they are drawn by separate layers.<br />
<br />
Second, there are many types of layers that don't act like transparent sheets at all. These types of layers are sometimes called filter layers or effect layers. For example, a blur layer blurs the page, and a rotate layer rotates the page. Layers always act on the page as it was left by the layers lower in the stack. So a rotate layer on top of two rectangle layers will rotate the page containing the rectangles. It won't rotate each of the rectangles in place.<br />
<br />
Third, layers have '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the page has a parameter for the angle of rotation. A layer which blurs the page has a parameter for the amount to blur it. As we'll see in the next section, we can control what value Synfig should use for these parameters when it draws each page.<br />
<br />
Fourth, even shape layers don't always act like transparent sheets. Many types of layer, including shape layers, have a "blend method" parameter. To understand how it works it is easiest think about what these layers do as a two step process. First, they create a new transparent page, separate from any flipbook. For example, a circle layer creates a page with a circle on it. Next, they combine the new page with the current page through a process called '''blending'''. <br />
<br />
The blend method parameter value controls how each pixel in the current page will be changed based on the color and transparency of that pixel and the pixel at the same location in the new page. There are many blend methods to choose from. The default is the composite blend method. It effectively places the new page on top of the existing page, letting the existing page show through only where the new page is transparent. This is why shape layers act like transparent sheets by default. However, other blend methods can have very different effects. As an extreme example, the Behind blend method effectively places the new page ''under'' the existing page. So a layer with a Behind blend method will actually appear to be ''under'' all of the layers that are below it in the stack.<br />
<br />
== Paste Canvas layers allow canvases to be combined ==<br />
<br />
There is one more way that Synfig layers are more like instructions than transparent sheets. There is a type of layer called a Paste Canvas layer that can blend a page from another flipbook (i.e. a canvas) into the current page. We can use Paste Canvas layers to build a complex canvas out of simpler canvases. Each of the simpler canvases has its own stack of layers, and the layers of a canvas only control the drawing of the pages in that canvas.<br />
<br />
For example, if we are trying to animate a person we might have six separate canvases -- one each for the right leg, left leg, right arm, left arm, torso, and head. The main canvas would have six Paste Canvas layers, each one blending in a page from one of the body part canvases. This arrangement ensures that layers in one bodypart canvas don't affect another bodypart. For example, a rotate layer at the top of the right arm canvas will only rotate the right arm.<br />
<br />
Of course, the simpler canvases can themselves contain Paste Canvas layers, resulting in a tree of nested layers. For example, the arm canvas could contain Paste Canvas layers that refer to separate canvases for the upper arm, lower arm, and hand.<br />
<br />
With Synfig Studio, we can create each branch of the layer tree by telling Synfig to '''encapsulate''' a set of layers. Encapsulating a set of layers causes Synfig to move them to a new canvas and, in their place, add a Paste Canvas layer that refers to the new canvas. In the Layers Panel, the added Paste Canvas layer can be expanded to see the layers that were encapsulated in the new canvas.<br />
<br />
Even though the layer tree may contains layers from many canvases, Synfig Studio provides a unified view that allows us to directly edit any of the layers in the tree without needing to open the canvases individually. For example, we can be directly select and edit the hand in the canvas window even though it is two layers deep in the layer tree.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, are the drawing instructions that taken together with a flip book containing some number of pages make up a canvas. The time-varying parameter values are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15661Anatomy of a Synfig Animation2012-04-01T08:19:31Z<p>DeanBrettle: /* Synfig draws frames according to instructions called layers */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig canvas is a flip book with drawing instructions ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. One way to create such an animation is to draw each frame on a separate page of a book called a flip book. A viewer can see the animation by flipping through the pages of the flip book quickly.<br />
<br />
Of course, manually drawing all of the pages in a flip book takes a long time. What we'd really prefer is to simply describe how to draw the pages and have them all drawn automatically based on our instructions. Synfig Studio allows us to do that. In Synfig, the flip book with drawing instructions is called a '''canvas'''.<br />
<br />
In real life, the term "canvas" normally refers to a single flat surface. It is important to remember that in Synfig, the canvas is not just one page in the flip book -- it is the entire flip book. And the flip book has drawing instructions for Synfig to follow. <br />
<br />
Within this manual the term "canvas" is also used to refer to the window where most editing occurs. The canvas window only shows one page from the flip book at a time. Unfortunately, that can reinforce the wrong idea of the canvas being only one page. However, the canvas window also has a timeline at the bottom. Clicking on different times in the timeline shows different pages in the flip book. So the canvas window really does allow us to see all the pages in the flip book, just not at the same time. <br />
<br />
Moreover, when we draw or edit in the canvas window, we aren't only changing the page that is currently displayed. Our changes can also affect other pages. For example, if we draw a circle on a page, it is automatically drawn on all the other pages as well.<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws each page in a particular flip book according to a set of instructions. Each instruction is called a '''layer''' and these layers are arranged in a stack with the first layer/instruction at the bottom of the stack. <br />
<br />
The term '''layer''' may seem to be an odd name for an instruction, but by default many layers act like the "transparent sheets" found in other applications. For example, consider a circle layer on top of a rectangle layer. When Synfig draws these layers the result is a circle on top of a rectangle as you might expect. If you think about layers as transparent sheets, you would think about this as a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. <br />
<br />
That "transparent sheets" ideas is often sufficient, but sometimes it is useful or necessary to think about layers as instructions. When thinking about layers this way, each page starts as completely transparent, and each layer tells Synfig to do something with the page. The first instruction is the bottom most layer. In our example that is the rectangle layer. The rectangle layer's instruction is simply "draw a rectangle". The next instruction is the next higher layer in the stack, the circle layer. It says to "draw a circle". <br />
<br />
It is easy to see that drawing a rectangle and then drawing a circle will produce the same result as stacking a transparent sheet containing a circle on top of a transparent sheet containing a rectangle. So in this case it doesn't matter whether we think of layers as instructions or transparent sheets. So how are Synfig's layers different from transparent sheets? <br />
<br />
First, although a transparent sheet could contain many shapes, a Synfig layer can not. In Synfig, each shape is drawn by separate layer. In fact, Synfig even considers the outline and interior region of a shape to be separate shapes, so they are drawn by separate layers.<br />
<br />
Second, there are many types of layers that don't act like transparent sheets at all. These types of layers are sometimes called filter layers or effect layers. For example, a blur layer blurs the page, and a rotate layer rotates the page. Layers always act on the page as it was left by the layers lower in the stack. So a rotate layer on top of two rectangle layers will rotate the page containing the rectangles. It won't rotate each of the rectangles in place.<br />
<br />
Third, layers have '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the page has a parameter for the angle of rotation. A layer which blurs the page has a parameter for the amount to blur it. As we'll see in the next section, we can control what value Synfig should use for these parameters when it draws each page.<br />
<br />
Fourth, even shape layers don't always act like transparent sheets. Many types of layer, including shape layers, have a "blend method" parameter. To understand how it works it is easiest think about what these layers do as a two step process. First, they create a new transparent page, separate from any flipbook. For example, a circle layer creates a page with a circle on it. Next, they combine the new page with the current page through a process called '''blending'''. <br />
<br />
The blend method parameter value controls how each pixel in the current page will be changed based on the color and transparency of that pixel and the pixel at the same location in the new page. There are many blend methods to choose from. The default is the composite blend method. It effectively places the new page on top of the existing page, letting the existing page show through only where the new page is transparent. This is why shape layers act like transparent sheets by default. However, other blend methods can have very different effects. As an extreme example, the Behind blend method effectively places the new page ''under'' the existing page. So a layer with a Behind blend method will actually appear to be ''under'' all of the layers that are below it in the stack.<br />
<br />
There is one more way that Synfig layers are more like instructions than transparent sheets. There is a type of layer that can blend a page from another flipbook (i.e. canvase) into the current page. There are parameters for which which canvas to use and how to determine which page to use. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, are the drawing instructions that taken together with a flip book containing some number of pages make up a canvas. The time-varying parameter values are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15660Anatomy of a Synfig Animation2012-03-31T23:50:14Z<p>DeanBrettle: Describe canvas as a "flip book with drawing instructions".</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig canvas is a flip book with drawing instructions ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. One way to create such an animation is to draw each frame on a separate page of a book called a flip book. A viewer can see the animation by flipping through the pages of the flip book quickly.<br />
<br />
Of course, manually drawing all of the pages in a flip book takes a long time. What we'd really prefer is to simply describe how to draw the pages and have them all drawn automatically based on our instructions. Synfig Studio allows us to do that. In Synfig, the flip book with drawing instructions is called a '''canvas'''.<br />
<br />
In real life, the term "canvas" normally refers to a single flat surface. It is important to remember that in Synfig, the canvas is not just one page in the flip book -- it is the entire flip book. And the flip book has drawing instructions for Synfig to follow. <br />
<br />
Within this manual the term "canvas" is also used to refer to the window where most editing occurs. The canvas window only shows one page from the flip book at a time. Unfortunately, that can reinforce the wrong idea of the canvas being only one page. However, the canvas window also has a timeline at the bottom. Clicking on different times in the timeline shows different pages in the flip book. So the canvas window really does allow us to see all the pages in the flip book, just not at the same time. <br />
<br />
Moreover, when we draw or edit in the canvas window, we aren't only changing the page that is currently displayed. Our changes can also affect other pages. For example, if we draw a circle on a page, it is automatically drawn on all the other pages as well.<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, are the drawing instructions that taken together with a flip book containing some number of pages make up a canvas. The time-varying parameter values are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15656Anatomy of a Synfig Animation2012-03-30T19:58:17Z<p>DeanBrettle: Fixed nav.</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Category:Manual|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to describe how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation description is called a '''canvas'''. A canvas describes when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called '''keyframes'''), and most importantly how Synfig should draw a frame.<br />
<br />
{{Note|Note|The term "canvas" is also used to refer to the window in Synfig Studio where most editing occurs. Luckily, it is usually clear whether the term is referring to the animation description itself or the main window used to edit it.}}<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, together make up a Synfig animation which is called a canvas. The animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15655Anatomy of a Synfig Animation2012-03-30T19:56:34Z<p>DeanBrettle: Added to manual</p>
<hr />
<div><!-- Page info --><br />
{{Title|Anatomy of a Synfig Animation}}<br />
{{Navigation|Doc:Overview|Doc:Getting Started}}<br />
[[Category:Manual]]<br />
[[Category:Unverified]]<br />
<!-- Page info end --><br />
<br />
{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to describe how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation description is called a '''canvas'''. A canvas describes when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called '''keyframes'''), and most importantly how Synfig should draw a frame.<br />
<br />
{{Note|Note|The term "canvas" is also used to refer to the window in Synfig Studio where most editing occurs. Luckily, it is usually clear whether the term is referring to the animation description itself or the main window used to edit it.}}<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, together make up a Synfig animation which is called a canvas. The animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15652Anatomy of a Synfig Animation2012-03-30T18:16:29Z<p>DeanBrettle: Added warning about possible inaccuracies.</p>
<hr />
<div>{{Note|Note|'''This page is still in draft form and might contain significant errors.'''}}<br />
== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to describe how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation description is called a '''canvas'''. A canvas describes when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called '''keyframes'''), and most importantly how Synfig should draw a frame.<br />
<br />
{{Note|Note|The term "canvas" is also used to refer to the window in Synfig Studio where most editing occurs. Luckily, it is usually clear whether the term is referring to the animation description itself or the main window used to edit it.}}<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, together make up a Synfig animation which is called a canvas. The animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15636Anatomy of a Synfig Animation2012-03-30T01:51:15Z<p>DeanBrettle: /* A Synfig animation is called a canvas */</p>
<hr />
<div>== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to describe how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation description is called a '''canvas'''. A canvas describes when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called '''keyframes'''), and most importantly how Synfig should draw a frame.<br />
<br />
{{Note|Note|The term "canvas" is also used to refer to the window in Synfig Studio where most editing occurs. Luckily, it is usually clear whether the term is referring to the animation description itself or the main window used to edit it.}}<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, together make up a Synfig animation which is called a canvas. The animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15635Anatomy of a Synfig Animation2012-03-30T01:50:21Z<p>DeanBrettle: /* A Synfig animation is called a canvas */ specify -> describe</p>
<hr />
<div>== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to describe how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation description is called a '''canvas'''. A canvas describes when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called '''keyframes'''), and most importantly how Synfig should draw a frame.<br />
<br />
{{Note|Note|The term "canvas" is also used to refer to the window in Synfig Studio where most editing occurs. Luckily, it is usually clear whether the term is referring to the animation itself or the main window used to edit it.}}<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, together make up a Synfig animation which is called a canvas. The animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15634Anatomy of a Synfig Animation2012-03-30T01:00:01Z<p>DeanBrettle: /* Summary */ Reordered sentences.</p>
<hr />
<div>== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a '''canvas'''. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called '''keyframes'''), and most importantly how Synfig should draw a frame.<br />
<br />
{{Note|Note|The term "canvas" is also used to refer to the window in Synfig Studio where most editing occurs. Luckily, it is usually clear whether the term is referring to the animation itself or the main window used to edit it.}}<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, a list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, together make up a Synfig animation which is called a canvas. The animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. These layers allow simple animations to be combined into very complex ones.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15633Anatomy of a Synfig Animation2012-03-30T00:54:07Z<p>DeanBrettle: /* A Synfig animation is called a canvas */ Noted use of term canvas to refer to the Canvas Window.</p>
<hr />
<div>== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a '''canvas'''. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called '''keyframes'''), and most importantly how Synfig should draw a frame.<br />
<br />
{{Note|Note|The term "canvas" is also used to refer to the window in Synfig Studio where most editing occurs. Luckily, it is usually clear whether the term is referring to the animation itself or the main window used to edit it.}}<br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, an animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. A list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, together make up a canvas, or Synfig animation.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15604Anatomy of a Synfig Animation2012-03-29T07:33:05Z<p>DeanBrettle: Reworded last sentence</p>
<hr />
<div>== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a '''canvas'''. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called '''keyframes'''), and most importantly how Synfig should draw a frame. <br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, an animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. A list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, together make up a canvas, or Synfig animation.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15603Anatomy of a Synfig Animation2012-03-29T07:28:16Z<p>DeanBrettle: Bolded key terms</p>
<hr />
<div>== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a '''canvas'''. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called '''keyframes'''), and most importantly how Synfig should draw a frame. <br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a '''layer'''. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's '''parameters'''. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called '''blending'''. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a '''waypoint''' for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig '''interpolate''' the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Summary ==<br />
<br />
To summarize, an animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. A list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, specifies an animation. In Synfig, this animation specification is called a canvas.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15602Anatomy of a Synfig Animation2012-03-29T07:23:07Z<p>DeanBrettle: </p>
<hr />
<div>== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a canvas. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called keyframes), and most importantly how Synfig should draw a frame. <br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a layer. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's parameters. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called blending. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a waypoint for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig interpolate the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Conclusion ==<br />
<br />
To summarize, an animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. A list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, specifies an animation. In Synfig, this animation specification is called a canvas.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15601Anatomy of a Synfig Animation2012-03-29T07:20:36Z<p>DeanBrettle: More clarifications and added section headings</p>
<hr />
<div>== Introduction ==<br />
<br />
Before attempting to use Synfig Studio to create an animation, it is worthwhile to get a basic understanding of what a Synfig animation is, the names of its various parts, and how the parts fit together. This page attempts to provide that knowledge. It is quite possible to learn to use Synfig Studio effectively without reading this page, but the information here will hopefully prevent confusion or incorrect assumptions, especially concerning the meanings of terms like canvas and layer.<br />
<br />
== A Synfig animation is called a canvas ==<br />
<br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a canvas. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called keyframes), and most importantly how Synfig should draw or render a frame. <br />
<br />
== Synfig draws frames according to instructions called layers ==<br />
<br />
Synfig draws all frames in a particular animation according to the same list of instructions. Each instruction is called a layer. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's parameters. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called blending. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
== Synfig determines parameter values using waypoints, interpolation, or other parameter values ==<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a waypoint for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig interpolate the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
== Conclusion ==<br />
<br />
To summarize, an animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. A list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, specifies an animation. In Synfig, this animation specification is called a canvas.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15599Anatomy of a Synfig Animation2012-03-29T06:42:21Z<p>DeanBrettle: Various revisions based on feedback from family members.</p>
<hr />
<div><!-- TODO: Add an intro paragraph --><br />
An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a canvas. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called keyframes), and most importantly how to draw a frame. <br />
<br />
<!-- Unclear which aspects are user-controlled vs program controlled. Avoid using we? --><br />
All frames in a particular animation are drawn according to the same list of instructions. Each instruction is called a layer. A frame starts as a transparent image and each layer changes the frame's image in some way. A layer might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's parameters. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the list of points that a curve goes through. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called blending. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blend methods to choose from but the default is the composite blend method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter value controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a waypoint for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig interpolate the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this occurs automatically when drawing a shape with the Draw tool. Drawing a single shape can create two layers, an outline layer which draws the outline of the shape and a region layer which fills the interior of the shape. The points which the outline of the shape goes through are parameters of both layers and they are normally linked to each other so that changing one will also change the other. Other values can be shared between parameters in a similar way through a process called Exporting and Connecting. In more advanced scenarios, a parameter can be one of many types of computed parameters. Computed parameters calculate their values based on one or more other parameter values.<br />
<br />
To summarize, an animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and blend that frame into the the current frame. A list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, specifies an animation. In Synfig, this animation specification is called a canvas.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15596Anatomy of a Synfig Animation2012-03-29T05:28:51Z<p>DeanBrettle: it's vs its...</p>
<hr />
<div>An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a canvas. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called keyframes), and most importantly how to draw a frame. <br />
<br />
We specify how to draw a frame using a list of steps called layers. A frame starts as a transparent image. Each layer/step changes the frame's image in some way. It might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's parameters. Each type of layer has its own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the position of the list of control points of a curve. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called blending. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blending methods to choose from but the most commonly used is the composite blending method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has its own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a waypoint for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig interpolate the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this is linked control points. For example, when we draw a shape with the Draw tool, it can create an outline layer and a region layer and link the control points for the outline to the control points for the region so that changing one will also change the other. We can achieve a similar effect with other parameters through a process called Exporting and Connecting. For even more advanced control over parameter values, we can convert a parameter to be one of many types of computed parameters. This will cause Synfig to compute the parameter value based on one or more other parameter values.<br />
<br />
To summarize, an animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and use it when creating the current frame. A list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, specifies an animation. In Synfig, this animation specification is called a canvas.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15593Anatomy of a Synfig Animation2012-03-29T00:55:12Z<p>DeanBrettle: Rearranged a couple paragraphs about layers and replaced reference to Bline tool with a reference to the Draw tool for clarity.</p>
<hr />
<div>An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a canvas. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called keyframes), and most importantly how to draw a frame. <br />
<br />
We specify how to draw a frame using a list of steps called layers. A frame starts as a transparent image. Each layer/step changes the frame's image in some way. It might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's parameters. Each type of layer has it's own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the position of the list of control points of a curve. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then combined with the existing image to create the modified image through a process called blending. The blend method parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blending methods to choose from but the most commonly used is the composite blending method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter controls how much the existing image should show through the new image.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and blends it with the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has it's own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a waypoint for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig interpolate the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this is linked control points. For example, when we draw a shape with the Draw tool, it can create an outline layer and a region layer and link the control points for the outline to the control points for the region so that changing one will also change the other. We can achieve a similar effect with other parameters through a process called Exporting and Connecting. For even more advanced control over parameter values, we can convert a parameter to be one of many types of computed parameters. This will cause Synfig to compute the parameter value based on one or more other parameter values.<br />
<br />
To summarize, an animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and use it when creating the current frame. A list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, specifies an animation. In Synfig, this animation specification is called a canvas.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Anatomy_of_a_Synfig_Animation&diff=15592Anatomy of a Synfig Animation2012-03-29T00:37:07Z<p>DeanBrettle: An initial attempt to summarize my knowledge after reading the existing documentation and experimenting a bit</p>
<hr />
<div>An animation is a sequence of images or "frames" that are displayed to the viewer in quick succession to create the illusion of smooth motion. Synfig Studio allows us to specify how all of the frames should be drawn without requiring us to manually draw each individual frame. Within Synfig, this animation specification is called a canvas. A canvas specifies when the animation starts and ends, how many frames should be drawn each second (i.e the framerate), the width and height of the frames, which frames we want to most directly control (called keyframes), and most importantly how to draw a frame. <br />
<br />
We specify how to draw a frame using a list of steps called layers. A frame starts as a transparent image. Each layer/step changes the frame's image in some way. It might add a shape to the image, rotate or blur the entire image, or even combine it with a frame from some other animation. How the image is changed by a layer is controlled by the values of the layer's parameters. Each type of layer has it's own set of parameters. Layers which draw shapes have parameters such as the center and radius of a circle or the position of the list of control points of a curve. A layer which rotates the image has a parameter for the angle of rotation. A layer which blurs the image has a parameter for the amount to blur it.<br />
<br />
One of the most powerful types of layers, the Pasted Canvas or Inline Canvas layer, creates a frame from another animation and uses it to modify the existing image in the current animation. There are parameters for which animation specification (i.e. canvas) to use and how to determine which frame to draw. Since each canvas has it's own list of layers, these kinds of layers can be used to build more complex animations from simpler ones.<br />
<br />
Many types of layers modify the existing image by first creating a new separate image. This new image is then "blended" with the existing image to create the modified image. The "blend method" parameter value controls how each pixel in the existing image will be changed based on the color and transparency of that pixel and the pixel at the same location in the new image. There are many blending methods to choose from but the most commonly used is the composite blending method. It effectively places the new image on top of the existing image, letting the existing image show through only where the new image is transparent. The amount parameter value controls the amount of blending to do. For example, when using the composite blend method the amount parameter controls how much the existing image should show through the new image.<br />
<br />
When drawing a particular frame, Synfig needs to determine the values of all of the parameters for all of the layers at the frame's time within the animation. If we want we can set the value directly for a particular frame. This establishes a waypoint for the value at that frame's time. The waypoint ensures that the parameter will have the specified value at the specified time. Of course, directly specifying the value for each frame is not practical. To avoid this, we can let Synfig interpolate the value based on the surrounding waypoints. There are a variety of interpolation methods from which to choose. The default interpolation method causes the parameter value to pass smoothly through the waypoints. <br />
<br />
Parameter values can also be specified in more advanced ways. We can indicate that a parameter value should always be the same as some other parameter value. The most common example of this is linked control points. For example, when we draw a shape with the Bline tool, it can create an outline layer and a region layer and link the control points for the outline to the control points for the region so that changing one will also change the other. We can achieve a similar effect with other parameters through a process called Exporting and Connecting. For even more advanced control over parameter values, we can convert a parameter to be one of many types of computed parameters. This will cause Synfig to compute the parameter value based on one or more other parameter values.<br />
<br />
To summarize, an animation is controlled by time-varying parameter values which are interpolated between waypoints or computed from other parameter values. The values of the parameters for a particular frame determine the ways that the layers create the image for that frame, one step at a time. There are many kinds of layers, including layers that draw shapes on the image, rotate the image, or blur the image, and parameter values control things like the position and colors of shapes, and the amount an image is rotated or blurred. There are also layers called Inline Canvas or Pasted Canvas layers which can create a frame in a different animation and use it when creating the current frame. A list of layers with their time-varying parameter values, along with information such as frame size, framerate, and the times of keyframes, specifies an animation. In Synfig, this animation specification is called a canvas.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Twirl_Layer&diff=15569Twirl Layer2012-03-28T06:15:53Z<p>DeanBrettle: </p>
<hr />
<div><!-- Page info --><br />
{{Title|Twirl Layer}}<br />
{{Category|Layers}}<br />
<!-- Page info end --><br />
<br />
{{l|Image:Layer_distortion_twirl_icon.png|64px}}<br />
<br />
== About Twirl Layers==<br />
<br />
FIXME!!!<br />
<br />
<br />
==Parameters of Twirl Layers==<br />
<br />
The parameters of the twirl layers are:<br />
<br />
{|border="0" align="left" style="border-collapse" cellpadding="3" cellspacing="0" <br />
|-style="background:#silver"<br />
|'''Name'''||'''Value'''||'''Type''' <br />
|-style="background:#"<br />
||{{l|Image:Type_vector_icon.png|16px}} Origin<br />
||0.00000u,0.000000u<br />
||vector<br />
<br />
|-style="background:#eeeeee"<br />
||{{l|Image:Type_real_icon.png|16px}} Radius<br />
||1.00000u<br />
||real<br />
<br />
|-style="background:#"<br />
||{{l|Image:Type_angle_icon.png|16px}} Rotations<br />
||0.00<br />
||angle<br />
<br />
|-style="background:#eeeeee"<br />
||{{l|Image:Type_bool_icon.png|16px}} Distort Inside<br />
||<br />
{| style="width:16px; height:16px" border="1"<br />
|- <br />
|}<br />
||bool<br />
<br />
|-style="background:#"<br />
||{{l|Image:Type_bool_icon.png|16px}} Distort Outside<br />
||<br />
{| style="width:16px; height:16px" border="1"<br />
|- <br />
|}<br />
||bool<br />
<br />
|}</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Duplicate_Layer&diff=15567Duplicate Layer2012-03-28T05:57:06Z<p>DeanBrettle: /* The Index Paramter */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Duplicate Layer}}<br />
{{Category|Layers}}<br />
<!-- Page info end --><br />
<br />
{{l|Image:Layer_other_duplicate_icon.png|64px}}<br />
<br />
== About Duplicate Layer ==<br />
<br />
The 'Duplicate' layer makes multiple copies of the layers under it in real time.<br />
<br />
The Duplicate layer works like a loop over the content below it and provides a changing variable to that content. This variable (the exported Index) can now be used (Connected) within that content.<br />
<br />
== Parameters of Duplicate Layer ==<br />
<br />
The parameters of the Duplicate Layers are:<br />
{|border="0" align="left" style="border-collapse" cellpadding="3" cellspacing="0" <br />
|-style="background:silver"<br />
|'''Name'''||'''Value'''||'''Type''' <br />
|-<br />
||{{l|Image:Real_icon.png|16px}} {{l|Z Depth Parameter|Z Depth}}<br />
||0.000000<br />
||real<br />
|-style="background:#eeeeee"<br />
||{{l|Image:Real_icon.png|16px}} {{l|Amount Parameter|Amount}}<br />
||1.000000<br />
||real<br />
|-<br />
||{{l|Image:Integer_icon.png|16px}} {{l|Blend Method|Blend Method}}<br />
||Composite<br />
||integer<br />
|-style="background:#eeeeee"<br />
||{{l|Image:Real_icon.png|16px}} Index {{l|Image:Valuenode_icon.png|16px}}<br />
||3.000000<br />
||Duplicate<br />
|}<br />
<br />
<br /><br /><br /><br /><br /><br /><br /><br />
<br />
=== The Index Parameter ===<br />
<br />
The "Index" is automatically exported. This is the only ValueNode that will change from one copy to the next. This exported value can then be selected in the Children dialog and Connected to the parameter(s) in the layer under the duplicate dialog which should change in the copies.<br />
<br />
The "Index" parameter has 3 sub-parameters, "From", "To", and "Step". The value of the exported "Index" parameter varies from the value of "From" to the value of "To" in steps of size "Step".<br />
<br />
"From" can be higher or lower than "To". It doesn't matter whether "Step" is positive or negative. The steps will be in the direction from "From" to "To".<br />
<br />
The duplicated layers are placed in the layer stack in order, so that those corresponding to the "From" value will appear lower down (i.e. least visible with normal composite blend mode) than those corresponding to the "To" value (most visible).<br />
<br />
== Known Problems ==<br />
<br />
* The Duplicate Layer doesn't do anything about bounding boxes. Doing so could help to speed up rendering when the duplicated layers are outside the visible area. It's not clear how useful or possible this would be. To calculate its bounding box, the duplicate layer would need to loop through all values of Index to get the underlying bounding boxes and union them together. Maybe it's worth doing anyway.<br />
<br />
* Editing a Bline below a dup layer becomes very difficult while a recent edit is still being rendered, because the Bline ducks move around as the render runs (if the duplications are at different positions or scale). I tried using the same mutex around the Duplicate ValueNode's operator() method as is used in the Duplicate Layer's code, but it lead to [http://dooglus.rincevent.net/random/deadlock.txt a deadlock].<br />
<br />
=== Recently Fixed Problems (please test) ===<br />
<br />
* Cloning a duplicate layer and having one above the other (rather than having them each inside a disjoint PasteCanvas) causes Synfig to hang, since the same ValueNode will be used for the Index parameter in each of them. [ fixed in r1277 ]<br />
<br />
* It shouldn't be possible to Disconnect the Index param in the duplicate layer, but it is. [ fixed in r1278 ]<br />
<br />
* It shouldn't be possible to Convert the Index param from Duplicate to any other type, but it is. [ fixed in r1279 ]<br />
<br />
* It shouldn't be possible to Disconnect a Duplicate ValueNode using the Children dialog, but it is. [ fixed in r1280 ]<br />
<br />
* It shouldn't be possible to Convert a Duplicate ValueNode to any other type using the Children dialog, but it is. [fixed in r1281 ]<br />
<br />
* It shouldn't be possible to Connect any ValueNode from the Children dialog to the Index param of a Duplicate layer, but it is. [ fixed in r1282 ]<br />
<br />
* Maybe it would be helpful to Auto-Export the Index parameter to give the user less work to do. It can always be renamed to something memorable later. [ added in r1283 ]<br />
<br />
* Automatic export of the Index parameter works for new layers, but not for cloned layers (copy/paste or right-click > duplicate). [ fixed in r1286 ]<br />
<br />
* The Add and Subtract ValueNodes won't allow the linking of the Duplicate layer's Index to their LHS and RHS if they are converted from a Time parameter. [ fixed in r1299 (for add) and r1330 (for subtract) ]<br />
<br />
* The layer doesn't seem to work well with PasteCanvas' parameters. Duplicating a PasteCanvas and linking the Index to its position or time offset doesn't have any effect. [ fixed in r1331 ]<br />
<br />
* Rendering the Duplicate layer modifies the Index parameter. Studio renders the Navigator dialog's thumbnail and the main canvas at the same time. These two renders can interfere with each other, since they don't use a mutex to protect the read/write of the Index parameter. [ fixed in r1358 ]</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Command:Link_to_Spline&diff=15558Command:Link to Spline2012-03-27T23:32:28Z<p>DeanBrettle: Grammar edits</p>
<hr />
<div>Generally if you want some vertex to be attached to some point on another BLine, you need to create a vertex at that point on the target BLine. That increases the complexity of your image and has a drawback - you cannot move the attached vertex along the BLine.<br />
<br />
The Link to BLine feature provides an easy way to attach a vertex of a BLine to another BLine without the creation of an additional vertex. The vertex becomes "stuck" to the BLine and can be moved along it.<br />
<br />
== Linking ==<br />
<br />
# Select the bline you want to link and target bline<br />
# Select the duck you want to link to target bline. It could be <br />
## bline vertex duck <br />
## bline tangent duck<br />
## or real duck<br />
# Right click on the target bline (not the bline vertex!) and select "Link to BLine"<br />
[[File:Link_to_Bline.png]]<br />
## if selected vertex duck, it placed on bline at position where clicked<br />
## if selected tangent duck, it links with bline tangent at click position<br />
## if selected real duck, it links with bline width at click position<br />
<br />
:NOTE: At step 2 you can select bline vertex, tangent and real ducks at the same time to link their values to the values on the same position of target bline.<br />
<br />
== Inverse Duck Manipulation ==<br />
<br />
It is possible to change linked duck position along bline simply by dragging it.<br />
If you linked the tangent and width ducks too, you will notice what they are changing their values according the values of bline.<br />
<br />
You may also specify the offset of the tangent and width ducks simply by dragging them. I.e. making tangent 90 degrees to bline will keep that offset at any point of bline.<br />
<br />
See also: {{l|Following_a_BLine}} tutorial.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Sets_Panel&diff=15557Sets Panel2012-03-27T20:37:19Z<p>DeanBrettle: </p>
<hr />
<div><!-- Page info --><br />
{{Title|Groups Panel}}<br />
{{Category|Panels}}<br />
{{Category|Synfig-0.63.04}}<br />
<!-- Page info end --><br />
{{l|Image:Group_icon.png|64px}}<br />
<br />
<br />
{{l|Image:Groups_panel.png|right}}<br />
Suppose you have several shapes that you want to treat the same but they're scattered throughout your project, encapsulated on different layers. Rather than expanding each {{l|Paste Canvas|inline canvas}} and individually selecting them each time you want to edit them, you can use Groups. To add some layers to group select them in the {{l|Layers Panel}}, right click, and choose {{Literal|Add to Group}}. It will prompt you for a Group name. Type a name for a new, or existing group and click {{Literal|OK}}. <br />
<br />
Now you can select that group and animate all those layers together (for instance, change all their amounts, or move their origins).<br />
<br />
Current interaction with groups and grouped layers in Groups Panel can be described in following terms:<br />
<br />
* Double click over a Group icon selects all the grouped layers in the Layers Panel. '''It allows a multiple selection of scattered layers with just one double click'''. Notice that double click does not highlight the grouped layers in the Group Panel.<br />
* Double click over a grouped layer icon selects that layer on the Layers Panel and unselects all others. <br />
* Double click holding {{Shortcut|ctrl}} key over a Group or a grouped layer icon adds the selection to the current one at the Layers Panel.<br />
* Double click over group or layer name allows to rename.<br />
* Clicking the checkbox on the left of layer icon will deactivate the layer in the Layers Panel.<br />
* Clicking the checkbox near the group icon will deactivate all layers inside of this group.<br />
* A layer in a group can be moved to any other group (empty or not).<br />
* If the group is empty it can't be activated and won't be saved.<br />
* Single left or right click over a Group makes it selected. You can use it to enable the {{Literal|Remove Group}} button. <br />
* Single left click over a grouped layer selects the grouped layer. You can select multiple layers if you click holding {{Shortcut|ctrl}} or {{Shortcut|shift}} key, but the effect on subsequent commands only affect the layer that you right-click on.<br />
<br />
<br />
Single right click over a grouped layer pops up the context menu with the same elements as you have for each layer in the {{L|Layers Panel}}:<br />
* {{Literal|Select All Children}}: This menu entry appears only if the grouped layer is a paste canvas. The behavior is the same as in the Layers Panel - all layers inside of the Paste Canvas layer are selected.<br />
* {{Literal|Add Layers to Group}}: Displays a dialog to enter a Group name and moves the select layer to the new group. Only works for the layer below the cursor when multiple selection is done.<br />
* {{Literal|Remove Layers from a Group}}: Removes the selected layer from the group. Only one layer at a time can be removed. Even if multiple layers are selected only the layer below the cursor when right clicking is removed.<br />
* {{Literal|Duplicate layer}}: Works the same as duplicate layer from the Layers Panel and also add the duplicated layer to the current Group. It works partially because you cannot duplicate multiple layers as in the Layers Panel. It only acts over the layer you did the right click. The selection is ignored.<br />
* {{Literal|Encapsulate}}: It works the same as the Encapsulate Layers from the Layers Panel but only affects to the layer where the right click is done.<br />
* {{Literal|Remove Layer}}: It works the same as the Remove Layers from the Layers Panel but only affects to the layer where the right click is done.<br />
* {{Literal|Set Layer Description}}: Displays a dialog for renaming the layer.<br />
* {{Literal|Raise Layer / Lower Layer}}: Does the same than in the Layers Panel. It doesn't modify the position in the grouped layer in the Group but the position in the Layers Panel hierarchy is modified as expected. <br />
<br />
Notice, that a layer can only belong to one Group at a time. Adding a layer to a Group when it's already in previous group will remove it from the previous group.<br />
<br />
<u>Groups can be nested</u>. You can make nested groups one of the following ways:<br />
<br />
* by adding a layer to a group with a name containing dot as separator: "parent.child"<br />
* by dragging a group inside other group<br />
<br />
The contents of the nested groups is selected when you double-click the parent group icon. Depending on what group level you click you can select more or less layers.<br />
<br />
{{l|Image:groups_panel_nested_groups.png|center|thumb}}<br />
<br />
For example making a double click on the 'All' Group will select Rotations and Images grouped layers in once double click.<br />
<br />
Regarding to the buttons:<br />
<br />
* {{Literal|Add New Group}} button adds empty deactivated group.<br />
* {{Literal|Remove Group}} button removes selected group. If the group contains other groups they are not recursively deleted, only the first child level of layers.<br />
<br />
<br />
<u>Also Groups scope is the current edited Canvas</u>. That means that only the grouped layers that belong to the current Canvas being edited are show in the Group dialog. It also means that Groups are File/Canvas dependent. It means that a layer can only belong to a group defined in its exported canvas scope. For example, if there are two canvases where B is the root one and A is a pasted one inside B, then a layer that belongs to exported canvas A can belong only to Groups defined at canvas A scope. Although you can select the layer from the outer root canvas (B) you cannot group it into any group defined at B scope. You can also have groups with the same name in different file/canvas scope. If a layer is dragged out from a pasted canvas and it belongs to a group, the group name is dragged out also.<br />
<br />
{{l|Image:groups_panel_exported_canvas_group.png|center}}<br />
<br />
See the {{l|Talk:Groups_Dialog|talk area}} for more info.<br />
<br />
----<br />
<br />
Here are shown some examples of what can be done using groups for a complex file:<br />
<br />
{| border = "2" align="center" style="" cellpadding="3" cellspacing="4" <br />
|-<br />
| '''Samples''' || '''Groups''' || '''Effects after double click on the highlighted Group'''<br />
|-<br />
|Sample1 || {{l|Image:Groups_sample1.png|center}} || {{l|Image:Groups_sample1_doubleclick_effect.png|center|thumb}}<br />
|-<br />
| <br />
|-<br />
|Sample2 || {{l|Image:Groups_sample2.png|center}} || {{l|Image:Groups_sample2_doubleclick_effect.png|center|thumb}}<br />
|}</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Sets_Panel&diff=15556Sets Panel2012-03-27T20:32:55Z<p>DeanBrettle: </p>
<hr />
<div><!-- Page info --><br />
{{Title|Groups Panel}}<br />
{{Category|Panels}}<br />
{{Category|Synfig-0.63.04}}<br />
<!-- Page info end --><br />
{{l|Image:Group_icon.png|64px}}<br />
<br />
<br />
{{l|Image:Groups_panel.png|right}}<br />
Suppose you have several shapes that you want to treat the same but they're scattered throughout your project, encapsulated on different layers. Rather than expanding each {{l|Paste Canvas|inline canvas}} and individually selecting them each time you want to edit them, you can use Groups. To add some layers to group select them in the {{l|Layers Panel}}, right click, and choose {{Literal|Add to Group}}. It will prompt you for a Group name. Type a name for a new, or existing group and click {{Literal|OK}}. <br />
<br />
Now you can select that group and animate all those layers together (for instance, change all their amounts, or move their origins).<br />
<br />
Current interaction with groups and grouped layers in Groups Panel can be described in following terms:<br />
<br />
* Double click over a Group icon selects all the grouped layers in the Layers Panel. '''It allows a multiple selection of scattered layers with just one double click'''. Notice that double click does not highlight the grouped layers in the Group Panel.<br />
* Double click over a grouped layer icon selects that layer on the Layers Panel and unselects all others. <br />
* Double click holding {{Shortcut|ctrl}} key over a Group or a grouped layer icon adds the selection to the current one at the Layers Panel.<br />
* Double click over group or layer name allows to rename.<br />
* Clicking the checkbox on the left of layer icon will deactivate the layer in the Layers Panel.<br />
* Clicking the checkbox near the group icon will deactivate all layers inside of this group.<br />
* A layer in a group can be moved to any other group (empty or not).<br />
* If the group is empty it can't be activated and won't be saved.<br />
* Single left or right click over a Group makes it selected. You can use it to enable the {{Literal|Remove Group}} button. <br />
* Single left click over a grouped layer selects the grouped layer. You can select multiple layers if you click holding {{Shortcut|ctrl}} or {{Shortcut|shift}} key, but the effect on subsequent commands only affect the layer that you right-click on.<br />
<br />
<br />
Single right click over a grouped layer pops up the context menu with the same elements as you have for each layer in the {{L|Layers Panel}}:<br />
* {{Literal|Select All Children}}: This menu entry appears only if the grouped layer is a paste canvas. The behavior is the same as in the Layers Panel - all layers inside of the Paste Canvas layer are selected.<br />
* {{Literal|Add Layers to Group}}: Displays a dialog to enter a Group name and moves the select layer to the new group. Only works for the layer below the cursor when multiple selection is done.<br />
* {{Literal|Remove Layers from a Group}}: Removes the selected layer from the group. Only one layer at a time can be removed. Even if multiple layers are selected only the layer below the cursor when right clicking is removed.<br />
* {{Literal|Duplicate layer}}: Works the same as duplicate layer from the Layers Panel and also add the duplicated layer to the current Group. It works partially because you cannot duplicate multiple layers as in the Layers Panel. It only acts over the layer you did the right click. The selection is ignored.<br />
* {{Literal|Encapsulate}}: It works the same as the Encapsulate Layers from the Layers Panel but only affects to the layer where the right click is done.<br />
* {{Literal|Remove Layer}}: It works the same as the Remove Layers from the Layers Panel but only affects to the layer where the right click is done.<br />
* {{Literal|Set Layer Description}}: Displays a dialog for renaming the layer.<br />
* {{Literal|Raise Layer / Lower Layer}}: Does the same than in the Layers Panel. It doesn't modify the position in the grouped layer in the Group but the position in the Layers Panel hierarchy is modified as expected. <br />
<br />
Notice, that a layer can only belong to one Group at a time. Adding a layer to a Group when it's already in previous group will remove it from the previous group.<br />
<br />
<u>Groups can be nested</u>. You can make nested groups one of the following ways:<br />
<br />
* by adding a layer to a group with a name containing dot as separator: "parent.child"<br />
* by dragging a group inside other group<br />
<br />
The contents of the nested groups is selected when you double-click the parent group icon. Depending on what group level you click you can select more or less layers.<br />
<br />
{{l|Image:groups_panel_nested_groups.png|center|thumb}}<br />
<br />
For example making a double click on the 'All' Group will select Rotations and Images grouped layers in once double click.<br />
<br />
Regarding to the buttons:<br />
<br />
* {{Literal|Add New Group}} button adds empty deactivated group.<br />
* {{Literal|Remove Group}} button removes selected group. If the group contains other groups they are not recursively deleted, only the first child level of layers.<br />
<br />
<br />
<u>Also Groups scope is the current edited Canvas</u>. That means that only the grouped layers that belong to the current Canvas being edited are show in the Group dialog. It also means that Groups are File/Canvas dependent. It means that a layer can only belong to a group defined in its exported canvas scope. For example: there are two canvases B is the root one and A is a pasted one inside B. Then a layer that belongs to exported canvas A can belong only to Groups defined at canvas A scope. Although you can select the layer from the outer root canvas (B) you cannot group it into any group defined at B scope. You can also have groups with same name in different file/canvas scope. If a layer is dragged out from a pasted canvas and it belongs to a group, the group name is dragged out also.<br />
<br />
{{l|Image:groups_panel_exported_canvas_group.png|center}}<br />
<br />
See the {{l|Talk:Groups_Dialog|talk area}} for more info.<br />
<br />
----<br />
<br />
Here are shown some examples of what can be done using groups for a complex file:<br />
<br />
{| border = "2" align="center" style="" cellpadding="3" cellspacing="4" <br />
|-<br />
| '''Samples''' || '''Groups''' || '''Effects after double click on the highlighted Group'''<br />
|-<br />
|Sample1 || {{l|Image:Groups_sample1.png|center}} || {{l|Image:Groups_sample1_doubleclick_effect.png|center|thumb}}<br />
|-<br />
| <br />
|-<br />
|Sample2 || {{l|Image:Groups_sample2.png|center}} || {{l|Image:Groups_sample2_doubleclick_effect.png|center|thumb}}<br />
|}</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Doc:Basic_Masking&diff=15555Doc:Basic Masking2012-03-27T20:25:57Z<p>DeanBrettle: /* About masking */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Basic masking}}<br />
{{Category|Manual}}<br />
{{Category|Tutorials}}<br />
{{Category|Tutorials Basic}}<br />
<!-- Page info end --><br />
<br />
'''This tutorial gives you an overview of how masking can be done in Synfig.'''<br />
<br />
== About masking ==<br />
Sometimes you want your characters to go behind objects, a building in the background for instance.<br />
If you create your background in Synfig you can probably just place the character behind the object in your layer stack but if your background is an image you need to do this by masking.<br />
<br />
This tutorial will show you two basic ways of masking; hiding and revealing.<br />
<br />
== Hiding ==<br />
In this masking mode everything covered by the mask shape is hidden.<br/><br />
{{l|Image:Masking_tut_img_01.png}}<br/><br />
• create a mask shape and place it above the elements you want to mask, either within the same paste canvas or above it and then encapsulating the mask and elements together.<br/><br />
{{l|Image:Masking_tut_img_02.png}}<br/><br />
• set the blend method of the mask to "Alpha Over".<br/><br />
• Everything below the mask shape will now be hidden.<br/><br />
{{l|Image:Hiding_mask.png}}<br/><br />
<br />
== Revealing ==<br />
A revealing mask can be achieved by two different approaches using different blend modes.<br />
<br />
== Revealing mask method 1. ==<br />
• Create a masking shape and place it below the elements you want to mask.<br/><br />
{{l|Image:Masking_tut_img_04.png}}<br/><br />
• Set the blend method of the elements you want to mask (robot layer in this case) to "Straight Onto". You can only use this method on one layer at a time so if you have several objects you need to encapsulate those into one paste canvas.<br/><br />
• Everything above the mask will be visible, everything outside will be hidden.<br/><br />
{{l|Image:Revealing_mask_1.png}}<br/><br />
<br />
== Revealing mask method 2. ==<br />
This mask method is similar to the hiding mask and a bit more flexible than revealing method 1 in that you don't have to encapsulate everything that should be masked. This mask reveals everything below it, no matter how many layers.<br/><br />
{{l|Image:Masking_tut_img_07.png}}<br/><br />
• Create a mask shape above the objects you want to mask.<br/><br />
• Tick the "Invert" option of the mask.<br/><br />
• Set blend method of mask to "Alpha Over". Everything below the mask shape will be visible and the rest is masked off.<br/><br />
• You can encapsule the mask and the objects that should be masked. Anything outside of this encapsule is not masked so leave the background outside in this example.<br/><br />
{{l|Image:Revealing_mask_2.png}}<br/><br />
<br />
Download [[Media:Synfig_masking_tutorial_files.zip|tutorial files]].</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Spline_Tool&diff=15554Spline Tool2012-03-27T19:46:26Z<p>DeanBrettle: /* Options */</p>
<hr />
<div><!-- Page info --><br />
{{Title|BLine Tool}}<br />
{{Category|Tools}}<br />
<!-- Page info end --><br />
<br />
{{l|Image:Bline_icon.png|64px}} <span style="font-size:150%">'''ALT-B'''</span><br />
<br />
<br />
==Introduction==<br />
<br />
{{l|BLine|Blines}} are the most used object in any normal animation done with Synfig, and the Bline tool allows you to create them.<br />
<br />
==Usage==<br />
<br />
The Bline tool button puts you in a create Bline mode. To leave that mode just select another tool from the toolbox.<br />
It is easy to use this tool:<br />
<br />
* Single click creates new vertices. Tangent value is set to (0,0) and the vertex becomes a sharp corner.<br />
* Click and drag creates new vertices and allows the modification of the tangent value at that vertex. Extending the tangent smooths the corners.<br />
* Each new vertex is attached to the previous by a Bezier spline defined by the vertices's position and it's tangents. <br />
* The BLine is created sequentially; One vertex follows another.<br />
* The end point of the previous Bezier arc guides the next arc created until you close it. The next created BLine will be independent of the previously created BLine. <br />
* You can tweak the newly created vertices by clicking on ducks and dragging them. <br />
* You can also right click on a vertex duck or a tangent duck and it will provide a context menu:<br />
** For tangent ducks: "Split tangents" will split the tangent so that you can independently modify the arch of an end point of a beizer curve. "Merge tangents" will merge the independent tangents so that you can align the arches of the end points of two connecting beizer curves.<br />
** For vertex ducks: "Loop Bline" or "UnLoop Bline" (depending on if it is already looped or not) allows you to close or open the bline. "Delete vertex" allows you to delete the vertex.<br />
* You can also right click in the middle of a beizer curve. "Insert vertex" allows insertion of a vertex (and set its tangents intelligently according to the neighboring vertices' values) where you clicked.<br />
<br />
To finish the Bline:<br />
# Select other tool.<br />
# Or click on the gear button of the Tool Options panel.<br />
<br />
To clear out the working Bline, press the "Esc" button.<br />
<br />
==Options==<br />
<br />
This tool has the following options:<br />
<br />
{{l|Image:Tool_Options.png}}<br />
<br />
* BLine layer name. The name of the Bline that you will create is set by the text input box. In this case it is "Bline141". This input text will parse the end of the string if any integer number is found, increasing that number for the next time you create other Bline. If not number is found it adds a three digit number for the next Bline created.<br />
* Outline check box. If checked it creates an {{l|Outline Layer}}.<br />
* Fill check box. If checked it creates a {{l|Region Layer}}.<br />
* Plant check box. If checked it creates a {{l|Plant Layer}}.<br />
* Gradient check box. If checked it creates a {{l|Curve Gradient Layer|Curved Gradient}}.<br />
* Link Offsets check box. If enabled it links the {{l|Offset Parameter}} for the Plant, Region or Outline if two of them (or all them) are checked. <br />
* Auto Export check box. If checked it automatically exports the {{l|Vertices Parameter| Vertices parameter}} (that's a {{l|BLine|BLine}} type parameter)<br />
* Feather numerical input field. There you set the {{l|Feather Parameter|feather parameter}} of the Region Layer or Outline Layer created.<br />
<br />
==Other sources of information==<br />
<br />
See this {{l|Video Tutorials|video tutorial}} to see it in action.<br />
<br />
Read {{l|Doc:Creating Shapes}} which talks a little about the BLine tool.<br />
<br />
Read {{l|Bline Speed}} which explains about variations in the Amount parameter of BLines.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Doc:Flower_Animation&diff=15553Doc:Flower Animation2012-03-27T19:18:42Z<p>DeanBrettle: /* Next Steps */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Animating Shapes}}<br />
{{Navigation|Category:Manual|Doc:Interface}}<br />
{{Category|Tutorials}}<br />
{{Category|Tutorials Intermediate}}<br />
{{Category|Updated}}<br />
<!-- Page info end --><br />
<br />
== Basic settings ==<br />
<br />
In this tutorial we will learn how to create a simple animation of a growing flower using [[Doc:Creating Shapes|BLines]].<br />
<br />
[[Image:flower_0.png|right|frame]] Start Synfig Studio &mdash; a new animation will be created. If you already have Synfig Studio started, select {{c|File|New}} in the toolbox.<br />
<br />
First, we need to create a gradient for a background. Click on the outline and fill colors in the toolbox to select the colors our gradient will have. You can also directly edit the gradient by clicking the gradient line in the toolbox.<br />
<br />
Select the Gradient Tool and drag your cursor vertically across the canvas to fill it with the gradient.<br />
<br />
Next, select the BLine Tool and in the Tool Options Panel, make sure that only {{Literal|Create Region BLine}} is checked. In the toolbox, set the fill color to green. Draw a kind of triangle with the BLine tool. To close the shape after drawing the 3 vertices, right click on the first vertex and choose {{Literal|Loop BLine}}.<br />
<br />
Now that the trace of the form is closed, you can generate the proper form by selecting another tool or by pressing the button with the gear icon at the bottom of the Tool Options Panel.<br />
<br />
[[Image:FlowerTutorialCanvas1.png|center|frame]]<br />
<br />
This will be the base of the stem. You can tweak the tangent handles (red dots) a bit to make a rounder triangle. With the {{l|Transform Tool}}, right-click on each vertex and select {{Literal|Split Tangents}}, so the tangent handles of each vertex can be moved separately. <br />
We're done with the basic settings.<br />
<br />
[[Image:FlowerTutorialCanvas2.png|center|frame]]<br />
<br />
== Animate the stem ==<br />
<br />
In the Canvas Menu, select the {{l|Caret|caret menu}} icon in the upper left hand corner, where the rulers intersect, and then select {{c|Edit|Properties}}. Go to the Time tab, set the {{Literal|End time}} to {{Literal|6s}} and click OK button.<br />
<br />
Click at the beginning of the timetrack ({{Literal|0f}}), then, in the {{l|Keyframes Panel}} (the one with a key icon) click the button with a "+" icon (add a new keyframe).<br />
{{l|Keyframe|Keyframes}} allow us to ''settle down'' the scene; i.e. on a keyframe, every element of the scene will have all its properties remembered.<br />
Click again on the timetrack, at {{Literal|4.5s}}.<br />
Press the green circle at the bottom right of the canvas (or whatever icon you have there, depending on your icon theme) to switch to the {{l|Animate Editing Mode}} (the circle is now red).<br />
<br />
With the {{l|Transform Tool}}, select the green sprout, and move the upper vertex up to make a stem. <br />
You can play with the vertex handles to bend the shape a bit if you want.<br />
<br />
[[Image:FlowerTutorialCanvas3.png|center|frame]]<br />
<br />
While you are still at {{Literal|4.5s}}, right-click on the stem border, close to the top, and choose {{Literal|Insert Item (smart)}}. Do the same on the other side of the stem. Right click on those new points and choose {{Literal|Split Tangents}}. Then try to make a shape that looks like the one on the image, to create the flower bud.<br />
<br />
[[Image:FlowerTutorialCanvas4.png|center|frame]]<br />
<br />
Now if you click on {{Literal|2s}} (for example), you'll see that the shape of the bud is slightly visible, even if the sprout is rather small, and even if the bud ducks are invisible. <br />
<br />
[[Image:FlowerTutorialCanvas5.png|center|frame]]<br />
<br />
{{<br />
Note|Note|Due to a bug introduced in 0.63.02, the {{Literal|Insert Item (smart)}} won't produce a correct "Off" point at the previous keyframe (at 0s). You have to move the time cursor to 0f and right click each vertex and select {{Literal|Set Active Point Off}} .<br />
{{DevNotesBegin}}<br />
This bug is fixed in the upcoming release (0.63.05).<br />
{{DevNotesEnd}}<br />
}}<br />
<br />
Let's say we want the bud to appear only at 3.5s, and be full size at 4.5s. <br />
<br />
Click on {{Literal|3.5s}} on the timetrack. Now take a look at the {{Literal|Params}} and {{Literal|Timetrack}} panels at the bottom. You'll see that each parameter in the Params Panel matches a row in the Timetrack Panel. The last parameter is the vertices list. Click on the small arrow on the left to unfold the list. You should see something like this:<br />
<br />
[[Image:FlowerTutorialTimetrackParamsPanels6.png|center|frame]]<br />
<br />
Each big green dot (or {{l|waypoints|waypoint}}) stands for a recorded value (here the vertices positions were recorded at 0f with the keyframe, and at 4s when we moved some vertices or vertices handles). The two vertices we added to make the bud are marked at {{Literal|DYN}} (dynamic). Right-click on them in the params list, and select "Mark Activepoint as Off".<br />
<br />
The panel should now look like this, the grayed part being the part where the bud vertices have no effect on the stem. <br />
<br />
[[Image:FlowerTutorial-7-WaypointsActivepointsOff.png|center|frame]]<br />
<br />
For example if you click on {{Literal|2s}} or even {{Literal|3s}} now, the bud shape is not visible. It starts to appear only a little after 3.5s. <br />
<br />
However, the shape of the stem may not look very nice during its growth between 0 and 4s. Make sure you're still in Animate Edit Mode, and tweak the shape at various moments in time, to get something you like. <br />
<br />
The animation of the stem is now finished, but it still lacks the petals. <br />
You can watch a preview of your animation: Go to {{c|File|Preview}}, validate, wait for the preview to be generated, and watch. <br />
<br />
{{Note|Note|Previews are often pixelated and blurry, but the final render will be clean-cut. Higher quality previews are obtainable by using higher values for 'Zoom' and 'Frames per second' in the preview dialog window.}}<br />
<br />
== Adding the petals ==<br />
<br />
Now leave the {{Literal|Animate Editing Mode}} by clicking on the red circle at the right bottom of the canvas.<br />
<br />
Change the fill color to pink, and create a petal with the BLine Tool. You'll notice that the green {{l|duck|duck}} that allows easy movement of a shape is at the center of the canvas. Select all the vertices of the petal with {{Shortcut|Ctrl|a}} and move them close to the green duck (with the Transform Tool), as shown.<br />
<br />
[[Image:FlowerTutorial-8.png|center|frame]]<br />
<br />
Then drag the green duck very close to the top of the bud. Hit {{Shortcut|Ctrl|a}} again to select all vertices of the petal and tweak it a bit with Rotate Tool. Also, in the {{l|Layers Panel}} select the petal layer and put it '''under''' the stem layer.<br />
Click on the petal to select it, then ctrl-click on the stem. Both objects should be selected. <br />
<br />
Now click on the vertex at the top of the stem and ctrl-click on the green duck of the petal (both should appear in a lighter color, as they are selected). Then right-click on the stem top vertex, and select {{Literal|Link}}. The petal will move a bit as the green duck is snapped on the stem vertex.<br />
<br />
[[Image:FlowerTutorial-9.png|center|frame]]<br />
<br />
Now that there's a link between the petal and the top of the stem, when the top of the stem moves, the petal will follow the move. (And if the green duck of the petal moves, the top of the stem will move, but we don't want to do that here.)<br />
<br />
On the Layers Panel, select the newly created Petal layer and duplicate it (with the third button, on the bottom of the Layers Panel). On the canvas, press {{Shortcut|Ctrl|A}} to select all the vertices of the duplicated petal, and move them a little, so the petals are no longer overlaid. (Don't move the green duck, just the orange ones). Repeat the process several time, to get something looking like this image.<br />
<br />
[[Image:FlowerTutorial-10.png|center|frame]]<br />
<br />
Note that the duplicated petals are also linked to the stem.<br />
If you go back to the first keyframe, you'll see that the petals are visible.<br />
We don't want that. We want the petals to appear and bloom almost at the end of the growth.<br />
<br />
== Hiding the petals ==<br />
<br />
<!-- This part is maybe the most clumsy one. I guess there may be an easier way to manage this step, and if I find it, I'll update the tutorial ;) --><br />
<br />
Let's say we want the petals to appear a little after 4 seconds in the animation, and be full size at 5 seconds, instead of being visible and full size all the time.<br />
<br />
Switch to {{Literal|Animate Editing Mode}} again by clicking on the green circle at the bottom right of the canvas. But if we will go to {{Literal|4s}} and modify them, then they also change at {{Literal|5s}}. Because the shape/position of the petals is not fixated at this moment of time by any waypoints or keyframes. That means that we need a keyframe at {{Literal|5s}}. On the timetrack, click to place the cursor at 5 seconds. On the {{l|Keyframes Panel}}, click on "+" to add a new keyframe.<br />
<br />
Now click on {{literal|4s}}, and on the Layers Panel, select all the petals layers (with ctrl+click), then press {{Shortcut|Ctrl|A}} to select all the petals vertices. Scale them down with the {{l|Scale Tool}}, and move them, so they are hidden by the stem, as shown.<br />
<br />
[[Image:FlowerTutorial-11.png|center|frame]]<br />
<br />
From 4s to 5s, the petals will now appear and bloom. But notice that we have a keyframe at 0s which also remembers petals shape. That makes the problem &mdash; the petals are still visible from the first keyframe to the 4s keyframe.<br />
We could either make the petals tiny and hidden tweaking their size on every frame from 0s to 4s, or we could make them invisible on this interval.<br />
<br />
Let's choose the second solution. To make things easier, we are going to {{l|encapsulate|encapsulate}} the petal layers into an {{l|Paste Canvas|Inline Canvas}}. With all the petal layers selected, right-click on them on the Layers Panel and select {{Literal|Encapsulate}}. You can rename the layers to <br />
make things more understandable.<br />
<br />
[[Image:FlowerTutorial-12.png|center|frame]]<br />
<br />
Select the "Petals" inline canvas and jump to the first keyframe. In the Param tabs, set the {{Literal|Amount}} value to {{Literal|0}}. The petals are now invisible on that keyframe.<br />
Note that two waypoints were added in front of the {{Literal|Amount}} parameter, one at 0s and the other at 5s. Drag the 5s waypoint to 4s, so that the opacity of the petals will be 1 at 4s. <br />
<br />
[[Image:FlowerTutorial-13.png|center|frame]]<br />
<br />
There is still one problem left: from 0s to 4s, the opacity of the petals slowly increases, making the petals visible when they shouldn't. To solve this, we will change the Amount interpolation method. Right click on the Amount waypoint at 0f, and select {{Literal|Edit}}. A new dialog will appear, in which you can choose the In and Out interpolation. Set the Out Interpolation to {{Literal|Constant}}.<br />
<br />
[[Image:FlowerTutorial-14.png|center|frame]]<br />
<br />
{{Note|Tip|You can also change waypoint Out interpolation by right-clicking on it and selecting {{c|Out|Constant}}.}}<br />
This means that ''after'' that waypoint, the Amount value will remain constant, until another waypoint is encountered. So from 0f to 4s the Amount value will be equal to 0, and at 4s it will suddenly changed to 1, and make the petals visible, as expected. Alternatively, we could have achieved the same effect by setting the In Interpolation of the waypoint at 4s to {{Literal|Constant}}.<br />
<br />
Notice how (half of) the waypoint changes from a green circle (meaning smooth animation of the amount parameter) to a red step (meaning that the amount parameter is suddenly stepped).<br />
<br />
Now you're done.<br />
The stem grows for 4.5 seconds and then stays still the last 1.5 seconds.<br />
The petals are hidden until 4 seconds, and then grow quickly between 4 and 5 seconds, and stay still the last 1 second too.<br />
<br />
Click on {{c|File|Render}} to render your animation. Select any format you want, and ensure that {{Literal|Use current frame}} option is unchecked (otherwise, one frame only will be rendered).<br />
<br />
== Next Steps == <br />
<br />
This is the end of the introductory tutorials. From here you can take a look at the {{l|Doc:Interface|Interface}} page, or continue reading or doing the rest of {{l|Category:Tutorials|Tutorials}}. The {{l|Category:Manual|Manual}} gives you a list of the available articles to read for a more complete understanding of Synfig.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Doc:Flower_Animation&diff=15549Doc:Flower Animation2012-03-27T18:33:29Z<p>DeanBrettle: /* Animate the stem */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Animating Shapes}}<br />
{{Navigation|Category:Manual|Doc:Interface}}<br />
{{Category|Tutorials}}<br />
{{Category|Tutorials Intermediate}}<br />
{{Category|Updated}}<br />
<!-- Page info end --><br />
<br />
== Basic settings ==<br />
<br />
In this tutorial we will learn how to create a simple animation of a growing flower using [[Doc:Creating Shapes|BLines]].<br />
<br />
[[Image:flower_0.png|right|frame]] Start Synfig Studio &mdash; a new animation will be created. If you already have Synfig Studio started, select {{c|File|New}} in the toolbox.<br />
<br />
First, we need to create a gradient for a background. Click on the outline and fill colors in the toolbox to select the colors our gradient will have. You can also directly edit the gradient by clicking the gradient line in the toolbox.<br />
<br />
Select the Gradient Tool and drag your cursor vertically across the canvas to fill it with the gradient.<br />
<br />
Next, select the BLine Tool and in the Tool Options Panel, make sure that only {{Literal|Create Region BLine}} is checked. In the toolbox, set the fill color to green. Draw a kind of triangle with the BLine tool. To close the shape after drawing the 3 vertices, right click on the first vertex and choose {{Literal|Loop BLine}}.<br />
<br />
Now that the trace of the form is closed, you can generate the proper form by selecting another tool or by pressing the button with the gear icon at the bottom of the Tool Options Panel.<br />
<br />
[[Image:FlowerTutorialCanvas1.png|center|frame]]<br />
<br />
This will be the base of the stem. You can tweak the tangent handles (red dots) a bit to make a rounder triangle. With the {{l|Transform Tool}}, right-click on each vertex and select {{Literal|Split Tangents}}, so the tangent handles of each vertex can be moved separately. <br />
We're done with the basic settings.<br />
<br />
[[Image:FlowerTutorialCanvas2.png|center|frame]]<br />
<br />
== Animate the stem ==<br />
<br />
In the Canvas Menu, select the {{l|Caret|caret menu}} icon in the upper left hand corner, where the rulers intersect, and then select {{c|Edit|Properties}}. Go to the Time tab, set the {{Literal|End time}} to {{Literal|6s}} and click OK button.<br />
<br />
Click at the beginning of the timetrack ({{Literal|0f}}), then, in the {{l|Keyframes Panel}} (the one with a key icon) click the button with a "+" icon (add a new keyframe).<br />
{{l|Keyframe|Keyframes}} allow us to ''settle down'' the scene; i.e. on a keyframe, every element of the scene will have all its properties remembered.<br />
Click again on the timetrack, at {{Literal|4.5s}}.<br />
Press the green circle at the bottom right of the canvas (or whatever icon you have there, depending on your icon theme) to switch to the {{l|Animate Editing Mode}} (the circle is now red).<br />
<br />
With the {{l|Transform Tool}}, select the green sprout, and move the upper vertex up to make a stem. <br />
You can play with the vertex handles to bend the shape a bit if you want.<br />
<br />
[[Image:FlowerTutorialCanvas3.png|center|frame]]<br />
<br />
While you are still at {{Literal|4.5s}}, right-click on the stem border, close to the top, and choose {{Literal|Insert Item (smart)}}. Do the same on the other side of the stem. Right click on those new points and choose {{Literal|Split Tangents}}. Then try to make a shape that looks like the one on the image, to create the flower bud.<br />
<br />
[[Image:FlowerTutorialCanvas4.png|center|frame]]<br />
<br />
Now if you click on {{Literal|2s}} (for example), you'll see that the shape of the bud is slightly visible, even if the sprout is rather small, and even if the bud ducks are invisible. <br />
<br />
[[Image:FlowerTutorialCanvas5.png|center|frame]]<br />
<br />
{{<br />
Note|Note|Due to a bug introduced in 0.63.02, the {{Literal|Insert Item (smart)}} won't produce a correct "Off" point at the previous keyframe (at 0s). You have to move the time cursor to 0f and right click each vertex and select {{Literal|Set Active Point Off}} .<br />
{{DevNotesBegin}}<br />
This bug is fixed in the upcoming release (0.63.05).<br />
{{DevNotesEnd}}<br />
}}<br />
<br />
Let's say we want the bud to appear only at 3.5s, and be full size at 4.5s. <br />
<br />
Click on {{Literal|3.5s}} on the timetrack. Now take a look at the {{Literal|Params}} and {{Literal|Timetrack}} panels at the bottom. You'll see that each parameter in the Params Panel matches a row in the Timetrack Panel. The last parameter is the vertices list. Click on the small arrow on the left to unfold the list. You should see something like this:<br />
<br />
[[Image:FlowerTutorialTimetrackParamsPanels6.png|center|frame]]<br />
<br />
Each big green dot (or {{l|waypoints|waypoint}}) stands for a recorded value (here the vertices positions were recorded at 0f with the keyframe, and at 4s when we moved some vertices or vertices handles). The two vertices we added to make the bud are marked at {{Literal|DYN}} (dynamic). Right-click on them in the params list, and select "Mark Activepoint as Off".<br />
<br />
The panel should now look like this, the grayed part being the part where the bud vertices have no effect on the stem. <br />
<br />
[[Image:FlowerTutorial-7-WaypointsActivepointsOff.png|center|frame]]<br />
<br />
For example if you click on {{Literal|2s}} or even {{Literal|3s}} now, the bud shape is not visible. It starts to appear only a little after 3.5s. <br />
<br />
However, the shape of the stem may not look very nice during its growth between 0 and 4s. Make sure you're still in Animate Edit Mode, and tweak the shape at various moments in time, to get something you like. <br />
<br />
The animation of the stem is now finished, but it still lacks the petals. <br />
You can watch a preview of your animation: Go to {{c|File|Preview}}, validate, wait for the preview to be generated, and watch. <br />
<br />
{{Note|Note|Previews are often pixelated and blurry, but the final render will be clean-cut. Higher quality previews are obtainable by using higher values for 'Zoom' and 'Frames per second' in the preview dialog window.}}<br />
<br />
== Adding the petals ==<br />
<br />
Now leave the {{Literal|Animate Editing Mode}} by clicking on the red circle at the right bottom of the canvas.<br />
<br />
Change the fill color to pink, and create a petal with the BLine Tool. You'll notice that the green {{l|duck|duck}} that allows easy movement of a shape is at the center of the canvas. Select all the vertices of the petal with {{Shortcut|Ctrl|a}} and move them close to the green duck (with the Transform Tool), as shown.<br />
<br />
[[Image:FlowerTutorial-8.png|center|frame]]<br />
<br />
Then drag the green duck very close to the top of the bud. Hit {{Shortcut|Ctrl|a}} again to select all vertices of the petal and tweak it a bit with Rotate Tool. Also, in the {{l|Layers Panel}} select the petal layer and put it '''under''' the stem layer.<br />
Click on the petal to select it, then ctrl-click on the stem. Both objects should be selected. <br />
<br />
Now click on the vertex at the top of the stem and ctrl-click on the green duck of the petal (both should appear in a lighter color, as they are selected). Then right-click on the stem top vertex, and select {{Literal|Link}}. The petal will move a bit as the green duck is snapped on the stem vertex.<br />
<br />
[[Image:FlowerTutorial-9.png|center|frame]]<br />
<br />
Now that there's a link between the petal and the top of the stem, when the top of the stem moves, the petal will follow the move. (And if the green duck of the petal moves, the top of the stem will move, but we don't want to do that here.)<br />
<br />
On the Layers Panel, select the newly created Petal layer and duplicate it (with the third button, on the bottom of the Layers Panel). On the canvas, press {{Shortcut|Ctrl|A}} to select all the vertices of the duplicated petal, and move them a little, so the petals are no longer overlaid. (Don't move the green duck, just the orange ones). Repeat the process several time, to get something looking like this image.<br />
<br />
[[Image:FlowerTutorial-10.png|center|frame]]<br />
<br />
Note that the duplicated petals are also linked to the stem.<br />
If you go back to the first keyframe, you'll see that the petals are visible.<br />
We don't want that. We want the petals to appear and bloom almost at the end of the growth.<br />
<br />
== Hiding the petals ==<br />
<br />
<!-- This part is maybe the most clumsy one. I guess there may be an easier way to manage this step, and if I find it, I'll update the tutorial ;) --><br />
<br />
Let's say we want the petals to appear a little after 4 seconds in the animation, and be full size at 5 seconds, instead of being visible and full size all the time.<br />
<br />
Switch to {{Literal|Animate Editing Mode}} again by clicking on the green circle at the bottom right of the canvas. But if we will go to {{Literal|4s}} and modify them, then they also change at {{Literal|5s}}. Because the shape/position of the petals is not fixated at this moment of time by any waypoints or keyframes. That means that we need a keyframe at {{Literal|5s}}. On the timetrack, click to place the cursor at 5 seconds. On the {{l|Keyframes Panel}}, click on "+" to add a new keyframe.<br />
<br />
Now click on {{literal|4s}}, and on the Layers Panel, select all the petals layers (with ctrl+click), then press {{Shortcut|Ctrl|A}} to select all the petals vertices. Scale them down with the {{l|Scale Tool}}, and move them, so they are hidden by the stem, as shown.<br />
<br />
[[Image:FlowerTutorial-11.png|center|frame]]<br />
<br />
From 4s to 5s, the petals will now appear and bloom. But notice that we have a keyframe at 0s which also remembers petals shape. That makes the problem &mdash; the petals are still visible from the first keyframe to the 4s keyframe.<br />
We could either make the petals tiny and hidden tweaking their size on every frame from 0s to 4s, or we could make them invisible on this interval.<br />
<br />
Let's choose the second solution. To make things easier, we are going to {{l|encapsulate|encapsulate}} the petal layers into an {{l|Paste Canvas|Inline Canvas}}. With all the petal layers selected, right-click on them on the Layers Panel and select {{Literal|Encapsulate}}. You can rename the layers to <br />
make things more understandable.<br />
<br />
[[Image:FlowerTutorial-12.png|center|frame]]<br />
<br />
Select the "Petals" inline canvas and jump to the first keyframe. In the Param tabs, set the {{Literal|Amount}} value to {{Literal|0}}. The petals are now invisible on that keyframe.<br />
Note that two waypoints were added in front of the {{Literal|Amount}} parameter, one at 0s and the other at 5s. Drag the 5s waypoint to 4s, so that the opacity of the petals will be 1 at 4s. <br />
<br />
[[Image:FlowerTutorial-13.png|center|frame]]<br />
<br />
There is still one problem left: from 0s to 4s, the opacity of the petals slowly increases, making the petals visible when they shouldn't. To solve this, we will change the Amount interpolation method. Right click on the Amount waypoint at 0f, and select {{Literal|Edit}}. A new dialog will appear, in which you can choose the In and Out interpolation. Set the Out Interpolation to {{Literal|Constant}}.<br />
<br />
[[Image:FlowerTutorial-14.png|center|frame]]<br />
<br />
{{Note|Tip|You can also change waypoint Out interpolation by right-clicking on it and selecting {{c|Out|Constant}}.}}<br />
This means that ''after'' that waypoint, the Amount value will remain constant, until another waypoint is encountered. So from 0f to 4s the Amount value will be equal to 0, and at 4s it will suddenly changed to 1, and make the petals visible, as expected. Alternatively, we could have achieved the same effect by setting the In Interpolation of the waypoint at 4s to {{Literal|Constant}}.<br />
<br />
Notice how (half of) the waypoint changes from a green circle (meaning smooth animation of the amount parameter) to a red step (meaning that the amount parameter is suddenly stepped).<br />
<br />
Now you're done.<br />
The stem grows for 4.5 seconds and then stays still the last 1.5 seconds.<br />
The petals are hidden until 4 seconds, and then grow quickly between 4 and 5 seconds, and stay still the last 1 second too.<br />
<br />
Click on {{c|File|Render}} to render your animation. Select any format you want, and ensure that {{Literal|Use current frame}} option is unchecked (otherwise, one frame only will be rendered).<br />
<br />
== Next Steps == <br />
<br />
This is the end of the introduction tutorials from here you can take a look to the {{l|Doc:Interface|Interface}} page, or continue reading or doing the rest of {{l|Category:Tutorials|Tutorials}}. The {{l|Category:Manual|Manual}} gives you a list of the available articles to read for a whole learning of Synfig.</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Doc:Creating_Shapes&diff=15548Doc:Creating Shapes2012-03-27T18:00:37Z<p>DeanBrettle: /* Using tablet to draw shapes */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Creating Shapes}}<br />
{{Category|Manual}}<br />
{{Category|Tutorials}}<br />
{{Category|Tutorials Basic}}<br />
{{Category|Updated}}<br />
{{Navigation|Category:Manual|Doc:Flower Animation}}<br />
<!-- Page info end --><br />
<br />
<br />
== Introduction ==<br />
<br />
Basic primitives such as circles or rectangles are all great, but they are pretty much geometrically inflexible. What about creating more complex shapes? To do this, we use the BLine Tool.<br />
<br />
== BLine Tool ==<br />
<br />
In Synfig, the construct for describing shapes is called a BLine. This is roughly analogous to a "path" in other programs, except that it is strictly a [https://en.wikipedia.org/wiki/Cubic_Hermite_spline cubic hermite spline].<br />
<br />
[[Image:Toolbox Reset Colors Button.png|right|frame|Reset Colors button in the Toolbox]] Before we start with the BLine tutorial, let's look at some additional notes on how Synfig works. When you click on the {{l|BLine Tool}}, you will see that the ducks from your currently selected object (if there was one) will disappear, but the layer(s) will still remain selected in the {{l|Layers Panel}}. This is normal. Anything you create with the BLine Tool will be inserted above the currently selected layer. Keep in mind that if you want to insert a shape somewhere, you should select where you want to insert it before you go into the BLine Tool &mdash; changing the selection afterward will automatically swap you back to the Transform Tool. <br />
<br />
Now, go ahead and click on the {{Literal|Reset Colors}} button in the lower left corner of the FG/BG color widget in the {{l|Toolbox|toolbox}}. This will reset us back to the default black and white. Also, set the {{l|New Layer Defaults#Default Line Width|default line width}} to something nice and thick &mdash; 10pt should do the trick.<br />
<br />
After you switched to BLine tool, take a look at the {{l|Tool Options Panel|Tool Options Panel}}. Make sure that only {{Literal|Create Region BLine}}, {{Literal|Create Outline BLine}} and {{Literal|Link Origins}} are checked. <br />
<br />
Clicking with your mouse in the canvas will place vertices. While you are placing a vertex, you can drag out its tangent by dragging the mouse. Do this over and over, and you construct a BLine.<br />
<br />
Keep in mind, however, that during this construction, there is nothing stopping you from just moving it if you don't like where you placed a vertex or a tangent. Honest! If you want to remove a vertex, right click on it and select {{Literal|Delete Vertex}}. Want to split the tangents? Right click on the tangent and hit {{Literal|Split Tangents}}. Want to loop the BLine? Right click on the first vertex and select {{Literal|Loop BLine}}. <br />
<br />
[[Image:Creating-shapes-2-bline-construction.png|center|frame]]<br />
<br />
When you are finished placing vertices, you must exit construction mode in order to actually create the BLine layer(s); there are 2 ways to do this:<br />
#Switch to another tool.<br />
#Press the {{Literal|Create}} button at the bottom of the Tool Options Panel (it's the icon that looks like a gear).<br />
For now, just go ahead and switch to the {{l|Transform Tool}}, because we are done with the BLine Tool.<br />
<br />
[[Image:Creating-shapes-3-bline-region-outline.png|center|frame]]<br />
<br />
== Editing BLines ==<br />
<br />
Ok, we now have a nice pretty white region with a thick black outline. Since we checked {{Literal|Create Region BLine}} and {{Literal|Create Outline BLine}} in previous steps, you'll notice that there are two layers that we have created &mdash; the {{l|Outline Layer|Outline}} and the {{l|Region Layer|Region}} in the Layers Panel. Despite the fact that they are two separate layers, their vertices parameter has already been {{l|Linking|linked}} &mdash; so you can select either one and move its ducks around and the other one will also change.<br />
<br />
If you want to manipulate the vertices ''after'' you have created the layers, it is very easy to do so. Just click on one of the layers and have at it. If you want to remove a vertex, right click on it and hit {{Literal|Remove Item (smart)}}. Want to insert a point somewhere? Right click on the segment where you want to insert something and hit {{Literal|Insert item (smart)}}.<br />
<br />
This may appear to be leading to a mess of layers. And yes, if you aren't using the software properly, that is exactly what you will get. But there is a way to make this more sane. As mentioned in the {{l|Doc:Adding Layers|previous tutorial}}, you can {{l|encapsulate|encapsulate}} layers into hierarchy.<br />
<br />
One quick thing to mention before I finish up. You can change the width of an outline at each vertex. You do this by selecting the outline layer (NOTE: you must select the Outline Layer, the Region Layer has no width data) and tweaking with the width ducks. By default, these are masked. To show them, press {{Shortcut|alt|5}} or click {{Literal|Toggle width ducks}} button at the top of the canvas window (the fifth one from the left). Repeat to hide them again. You can also see other things to mask via the {{l|Canvas Menu Caret}}: {{c|View|Show/Hide Ducks}}.<br />
<br />
== Using tablet to draw shapes ==<br />
<br />
If you have a [http://en.wikipedia.org/wiki/Graphics_tablet graphic tablet] you can use Draw Tool to create BLines.<br />
<br />
Synfig Studio supports pressure sensitivity, but you need to configure it first. Go to {{c|File|Input Devices...}} from toolbox menu. In the Input dialog find your tablet's stylus device and set its mode to {{Literal|Screen}}. Click {{Literal|Save}} and then {{Literal|Close}}.<br />
<br />
Now grab your stylus, create a new file and click on the Draw Tool button in the toolbox. Set the default line width value to be big enough &mdash; say, 15pt &mdash; otherwise you will not notice any pressure sensitivity effect. Choose brown as the default fill color.<br />
<br />
{{Note|Note|Steps above should be done with the stylus of your tablet, not the mouse. Synfig Studio remembers settings for each input device independently. That's why if you set those options with your mouse device they will not have any effect when you switch to stylus.}}<br />
In the Tool Options Panel, make sure that you have the same options as shown on the screenshot below.<br />
<br />
[[Image:DrawToolOptions.png|center|frame]]<br />
<br />
Now let's draw some thing like a curvy mountain background. Start drawing a line from the left border to the middle of the canvas. Try to vary your stylus pressure while you are drawing. Stop near the center of the canvas. This is your first line. Notice the new outline layer created in the Layers Panel.<br />
<br />
[[Image:Creating-shapes-4-draw.png|center|frame]]<br />
<br />
Point your stylus at the last duck of your new BLine and continue drawing to the right border of the canvas. When you finish, look at the Layers Panel again. There's still only one outline layer. Synfig Studio is smart enough to figure out that you don't need a new outline layer and properly extends the last one. You can extend the BLine from both ends, but if you start drawing from any other place of the canvas a new outline layer will be created. Though your first line will remain selected and nothing stops you from extending it later.<br />
<br />
Back to our artwork. In the Tool Panel hit the button with the bucket icon to fill the outline we just created. A region layer will appear at the top of the layer we are working with. Select the outline layer and press the {{Literal|Raise Layer}} button in the layers panel to put the outline layer on top of the region.<br />
<br />
[[Image:Creating-shapes-5-draw.png|center|frame]]<br />
<br />
Extend a line from both sides down to the corners of the canvas to make the fill appear at the bottom. Great.<br />
<br />
[[Image:Creating-shapes-6-draw.png|center|frame]]<br />
<br />
Go ahead and add a few more lines on top of the filled area to give it a mountain-like look. If brown ducks are in your way, you can hide them by clicking the {{Literal|Toggle vertex ducks}} button at the top of the canvas window (the second one from the left).<br />
<br />
[[Image:Creating-shapes-7-draw.png|center|frame]]<br />
<br />
{{<br />
Note|Warning!|Don't use {{Shortcut|Alt|2}} shortcut to turn off visibility of vertex ducks while you using Draw Tool. There's a bug that will cause Synfig Studio to hang.{{DevNotesBegin}}<br />
This bug is fixed in the upcoming release (0.63.00).<br />
{{DevNotesEnd}}<br />
}}<br />
<br />
<br />
Draw tool is great for drawing complex shapes, but you end up with a bunch of ducks, which are hard to manipulate with the Transform Tool in the way we described above. There are two solutions here.<br />
<br />
First, you can increase the {{Literal|Smooth}} value in the Tool Options Dialog while using Draw Tool. That will reduce the count of vertices produced at drawing time, but will make your shape less detailed. <br />
<br />
Second, you can use Smooth Move Tool to deform an existing shape. Go for it and click the Smooth Move Tool button in the toolbox. The trick about this tool is that it affects ''selected ducks only''. Press and hold your left mouse button in an empty place of the canvas. Drag to create a selection box. Release the mouse button when you are done. Or just hit {{Shortcut|Ctrl|a}} to select all ducks. Now you can deform the selected segments of BLines. You can change the size of the influence area by tweaking {{Literal|Radius}} in the Tool Options Panel.<br />
<br />
What about outline width? There is a Width Tool for that purpose. It is designed for increasing or decreasing the width of a line much like you would with a pencil on paper. Click the Width Tool button in the toolbox, move your stylus over the line you want to change, press and move the cursor back and forth along the line, like you are scratching something. The width of the outline will be increased at the places where you moved the cursor. If you want to decrease the width, just hold "Ctrl" while scratching. Easy!<br />
<br />
If you don't want Width Ducks to be displayed, during usage of the Width Tool, just turn them off by pressing the {{Literal|Toggle width ducks}} button at the top of the canvas window.<br />
<br />
{{<br />
Note|Warning!|Don't use {{Shortcut|Alt|5}} shortcut to turn off visibility of width ducks while you using Width Tool. There's a bug that will cause Synfig Studio to hang.<br />
{{DevNotesBegin}}<br />
This bug is fixed in the upcoming release (0.63.00).<br />
{{DevNotesEnd}}<br />
}}<br />
<br />
== Other ways to create BLines ==<br />
<br />
Is that all? Not yet. You can use Circle, Rectangle, Star and Polygon tools to create BLines too. Just check the {{Literal|Create Outline BLine}} and {{Literal|Create Region BLine}} options in the Tool Options Panel when using those tools. <br />
<br />
Creating geometric primitive as BLine gives you a better control over it's shape and look. For example, if you want a deformed star, then you can use the Star Tool to create it as outline and region BLines and then use the Transform Tool to deform it.<br />
<br />
Now you are ready for the {{L|Doc:Flower Animation|last tutorial}} in this section. Hang on!</div>DeanBrettlehttps://wiki.synfig.org/index.php?title=Doc:Adding_Layers&diff=15547Doc:Adding Layers2012-03-27T17:16:22Z<p>DeanBrettle: /* Introduction */</p>
<hr />
<div><!-- Page info --><br />
{{Title|Adding Layers}}<br />
{{Navigation|Category:Manual|Doc:Creating_Shapes}}<br />
[[Category:Manual]]<br />
[[Category:Tutorials]]<br />
[[Category:Tutorials Basic]]<br />
[[Category:Updated]]<br />
<!-- Page info end --><br />
<br />
== Introduction ==<br />
<br />
In the {{l|Doc:Animation_Basics|previous tutorial}}, you made your first simple animation by changing the attributes of primitive objects, such as: position, color, and size. These simple types, however, are seldom sufficient to create advanced characters and objects. To do so, Synfig uses {{l|Layer|layers}}. They are similar to layers used in other drawing applications in that they are used to separate different elements of an image.<br />
<br />
However, Synfig's layers are different from layers in other programs in at least two aspects:<br />
# Every object, element, and effect gets its own layer. There are not layers of multiple primitives or multiple effects.<br />
# The up to down layer combination allows you to use upper layers to change the behavior (or look) of underlying layers. Those are called effect layers or filter layers.<br />
<br />
As you will see, layers are an extremely important aspect of Synfig, much more so than most graphics programs. Understanding the concept of layers is an important part in understanding how Synfig works.<br />
<br />
== Combining layers ==<br />
<br />
So let's look at a simple example of how we can combine two layers to create a gradient effect on a rectangle.<br />
<br />
Create a new file with 0 duration. There's no need to bother with a timeline at this point. Next, create a simple rectangle with the Rectangle Tool. <br />
<br />
[[Image:Adding-layers-tutorial-1.png|frame|center]]<br />
<br />
Pick the {{l|Gradient Tool|Gradient Tool}} from the {{l|Category:Toolbox|Toolbox}}, press the left mouse button on the canvas, drag to change the gradient direction and release the button when you are done. You should note that another layer was added in the {{l|Layers Panel}} called '''Gradient'''. This is nothing special. <br />
<br />
[[Image:Adding-layers-tutorial-2.png|frame|center]]<br />
<br />
{{Note|Note|If you see no gradient but just a plain color, that means that you probably just clicked on the canvas without dragging your mouse. To fix that pick the {{l|Transform Tool|Transform Tool}}, click into the canvas to activate the gradient's ducks. You need to grab the one you see and move it a bit until a gradient appears.}}<br />
You now have a gradient, but it is not what you wanted: it spreads across the whole canvas. The goal was to have a gradient in the rectangle. So, let's fix this now.<br />
<br />
In the {{l|Layers Panel}}, select both the gradient and the rectangle layer. Then, right-click and select {{Literal|Encapsulate}} from the menu. The view of your Layers Panel should change now, showing a small box called {{l|Paste Canvas|Inline Canvas}} with an arrow in front. By clicking on the arrow you can expand the inline canvas to see its contents, your previous two layers: the gradient and the rectangle.<br />
<br />
[[Image:Adding-layers-tutorial-3.png|frame|center]]<br />
<br />
You can treat this layer like any other layer &mdash; move it around, duplicate it, copy and paste it. If you want to change the name of it to something more descriptive, just select the layer in the layer tab and click on its label. Then you just edit it in place. You can do this for ANY layer, and are strongly encouraged to do so.<br />
<br />
== Using locality ==<br />
However, there is still a problem: the gradient still covers the whole canvas although we wanted it to be restricted on the rectangle. To do so, activate the gradient layer in the Layers Panel. Now go to the {{l|Params Panel}} (by default it resides in the bottom window), and search for the attribute called {{Literal|Blend Method}}. Double-click the entry and select {{Literal|Onto}} from the drop-down menu.<br />
<br />
[[Image:Adding-layers-tutorial-4.png|frame|center]]<br />
<br />
The gradient should now be restricted to the rectangle. Congratulations! You just made your first effect by interacting layers with Synfig.<br />
<br />
[[Image:Adding-layers-tutorial-5.png|frame|center]]<br />
<br />
If only for the additional organization, encapsulating layers into inline canvases dramatically improves the ease of use of Synfig Studio. But lots of programs can do this. The concept of ''scope'' as just demonstrated sets Synfig apart from other programs with layer hierarchies. The key point is that a layer can '''only''' modify the data that it gets from '''directly below''' it. In other words, if you were to throw a {{l|Blur Layer}} on top of the layers inside the {{l|Paste Canvas|inline canvas}} we created, it would just blur them &mdash; anything under the inline canvas would not be blurred! Let's try it.<br />
<br />
== Using layers to modify other layers==<br />
Make sure you have the Inline Canvas layer selected and create two red {{l|Circle Tool|circles}}. They will appear on top of the Inline Canvas. Select the Inline Canvas layer and use the {{Literal|Raise Layer}} button in the Layers Panel to place it on top of the circles.<br />
<br />
[[Image:Adding-layers-tutorial-6-raise-layer.png|center|frame]]<br />
<br />
Now our inline canvas layer (with rectangle and gradient) is in front of those two circles.<br />
<br />
[[Image:Adding-layers-tutorial-7.png|center|frame]]<br />
<br />
Expand the inline canvas to show its contents, and select the top layer inside of it (should be the gradient layer). This is where we want to insert the new layer. Create another circle filled with a black color. The black circle layer will be created over the gradient layer inside the inline canvas.<br />
<br />
[[Image:Adding-layers-tutorial-8.png|center|frame]]<br />
<br />
Now, right click on the black circle layer in the Layers Panel and a popup menu will appear. The first item in that popup is {{Literal|New Layer}}. Inside of the {{Literal|New Layer}} menu, you'll see several categories of layers you could create, but what we want is a blur, so go to the Blurs category and select the {{Literal|Blur}} layer (so that would be {{c|New Layer|Blurs|Blur}}).<br />
<br />
[[Image:Adding-layers-tutorial-10-composite-blur.png|center|frame]]<br />
<br />
Well, it blurred... but something is not quite right &mdash; the outside edge of the contents of the inline canvas is still sharp. It is doing this because the blend method of the blur defaulted to {{Literal|Composite}} (you can change the {{l|New Layer Defaults#Default Blend Method|default blend method}} for new layers from the {{l|New Layer Defaults}} section of the Toolbox). What we want is a blend method of {{Literal|Straight}}. Just select the blur layer, and change the Blend Method to {{Literal|Straight}} in the Params Panel.<br />
<br />
{{Note|Note|In the Synfig version {{Literal|0.62.02}}, the blend method for newly created blur layers is {{Literal|Straight}} if the default blend method in the Toolbox is set to {{Literal|By Layer Default}}.}}<br />
[[Image:Adding-layers-tutorial-11.png|frame|center]]<br />
<br />
Ok, now we have all of the contents of the inline canvas blurred, but everything under it is sharp! This is because the effect of the Blur Layer over the underlying layers is limited to the scope of the Inline Canvas because the Blur layer is inside it.<br />
<br />
== Digging further... ==<br />
<br />
If you care to look into Synfig's main menu under {{c|Layer|New Layer}} you will note quite a lot of different possibilities for making layers. Several of them sound rather unusual, like {{c|Transform|Rotate}} for example. You can use this to add new attributes to your objects. And just like other, basic attributes in the {{L|Doc:Animation Basics|previous animation tutorial}}, you can change them to be different on certain {{L|Keyframe|keyframes}}. Synfig will take care of interpolating the steps in between.<br />
<br />
For example, you could create a {{L|Doc:Creating Shapes|shape}} and add a {{L|Rotate Layer}} over it. Combine this with the lesson learned in the {{L|Doc:Animation Basics|last tutorial}} and you will obtain a rotating effect. This technique is used for the creation of {{L|Doc:Cut-out Animation}}.<br />
<br />
Let's continue digging further on {{l|Doc:Creating Shapes|shapes creation}}.</div>DeanBrettle