Differences

This shows you the differences between two versions of the page.

--- tupi_animation_module [2017/01/09 18:16] – maefloresta
+++ tupi_animation_module [2017/03/11 23:22] (current) – external edit 127.0.0.1
@@ Line 3: / Line 3: @@
 ;#;
 =====Animation Module=====
 ====Introduction====
-This is the module where you design every frame of your animation projects. From here, you will draw every part, every line of your characters and scenarios as you are adding the frames that compose your story.
+This is the module where you design every frame of your animation projects. From here, you will draw every detail of your characters and scenarios as you are adding new frames to the timeline of your story. In other words, we could say that this is where the magic happens.
 {{ wiki:tupi_animation_module.png }}
@@ Line 13: / Line 14: @@
 **Tip:** To switch to the Animation module from other module tabs, use the shortcut **Ctrl+1**.
-In the previous section, we described the general components of Tupi's interface. Now let's go in deep into the Animation module, starting from the elements inside the Animation tab:
+In the previous section, we described the general components of Tupi's interface. Now let's go in deep into the Animation module, starting from the elements inside the Animation tab.
-The Animation tab is formed by a clean canvas (1) in the center (think of it as a paper sheet if you wish), that's the drawing area specifically where frames are created. This canvas is surrounded by two rulers (2) at top border and at left border.
+====The Animation Tab====
-Additionally, the Animation tab contains two toolbars: one at top (3) containing a set of edition tools and one at left (4) full of drawing and miscellaneous utilities. At right, there is a properties panel (5) containing features related to the selected tool from the left toolbar. And finally, at bottom, you will see a toolbar (6) with several controls related to the canvas behavior.
+The Animation tab is formed by a clean canvas **(1)** in the center (think of it as a paper sheet if you wish), that's the drawing area specifically where frames are created. This canvas is surrounded by two rulers **(2)** at top border and at left border.
+Additionally, the Animation tab contains two toolbars: one at top **(3)** containing a set of edition tools and one at left **(4)** full of drawing and miscellaneous utilities. At right, there is a properties panel **(5)** containing features related to the selected tool from the left toolbar. And finally, at bottom, you will see a toolbar **(6)** with several controls related to the canvas behavior.
 {{ wiki:tupi_animation_diagram.png }}
@@ Line 26: / Line 29: @@
 This toolbar includes several utilities:
-    * The control to switch from Frames, Static Background and Dynamic modes.
+    * The control to switch from Frames, Static Background and Dynamic modes. This modes allows you to work on specific levels of your animation: i.e. draw the background (dynamic and/or static) or to focus on the objects or characters you are animating from your frames, depending on the mode you choose.
-    * Drawing edit tools like Do, Undo, Copy, Paste, Cut and Delete.
+    * Edit tools for drawing actions like Do, Undo, Copy, Paste, Cut and Delete.
     * Onion skin tools to enable previous and next frames over the drawing canvas and to set the onion skin opacity level.
-{{ wiki:animation_top_toolbar.png }}
+{{ wiki:animation_top_toolbar_reference.png }}
 ;#;
 **Fig 14**. Animation Tab Top Toolbar
@@ Line 39: / Line 43: @@
 This toolbar includes all the drawing/painting resources: Pencil, Ink tool, Polyline, Primitive tools (Rectangle, Ellipse, Line), Object Selection, Node Selection, Fill tools, Tweening tools and a complementary set of Miscellaneous tools (Export frame as Image, Storyboard settings, Camera and Papagayo lip-sync files).
-{{ wiki:animation_left_toolbar.png }}
+{{ wiki:animation_left_toolbar_reference.png }}
 ;#;
 **Fig 15**. Animation Tab Left Toolbar
@@ Line 46: / Line 50: @@
 ===Animation Tab Bottom Toolbar===
-This toolbar includes several controls and utilities related to the canvas behavior like: Grid, Zoom, Canvas Rotation, Full Screen mode and some status displays (Current Pen Color, Background Color, Current Tool).
+This toolbar includes several controls and utilities related to the canvas behavior like: Reset Position, Grid, Zoom, Canvas Rotation, Full Screen mode and some status displays (Current Pen Color, Background Color, Current Tool).
-{{ wiki:animation_bottom_toolbar.png }}
+{{ wiki:animation_bottom_toolbar_reference.png }}
 ;#;
 **Fig 16**. Animation Tab Bottom Toolbar
 ;#;
 -----
-Ok, now...
+====Tupi Sidebars====
+Ok, now let's review the panels located at Tupi's sidebars outside the Animation Tab and their relationship with the Animation module.
 {{ wiki:tupi_animation_panels_reference.png }}
+;#;
+**Fig 17**. Tupi Sidebar Resources
+;#;
 ====Left Sidebar====
@@ Line 61: / Line 69: @@
 ===- Color Palette===
-As its name implies, this is the panel where we choose the color that we want for our drawing regardless of the shape or form that we are going to trace. It is important to note that while not modifying the current color, absolutely everything drawn keeps the same color, until you select a different one for the next shape.
+Every application related to graphics has a component to deal with color settings, an interface where you can set the color you want to use for the lines, the fill and the background of your animation projects. From the color palette, you can update the value of the color you want to use (including its transparency level), independently of which component of your scene you were illustrating.
-{{ ColorPalleteZoom_en.png }} {{ ColorPallete_en.png }}
+{{ wiki:color_palette_reference.png }}
 ;#;
-**Fig 17**. Colors Palette
+**Fig 18**. Color Palette
-;#;
-**Tip:** Note that in addition to using flat colors, you can also use gradients, ie, combinations of colors that blend gradually on the same figure as in the following example, where the gradient starts at a green light and ends in black:
-{{ GradientExample_en.png }}
-;#;
-**Fig 18**. Gradient Example
 ;#;
 ===- Pen Properties===
-The "Pen" tool in our context is the type of tool you use to draw. You may want to think about the pen as the type of tip you're going to use for your pencil. This panel allows you to modify characteristics of the boom, it's thickness, type of edges and the endings of the strokes and the continuity of the line (for example, you can make plot points, if you wish).
+This panel allows you to modify the brush settings of drawing tools, specifically their contour brush. Among the parameters you can set from here are: thickness, type of stroke edges, line's pattern (dashes, dots, etc) and line's texture.
-{{ PenPropertiesZoom_en.png }} {{ PenProperties_en.png }}
+{{ wiki:pen_properties_reference.png }}
 ;#;
 **Fig 19**. Pen Properties
 ;#;
-===- Object Library===
+===- Library===
-The function of this component is to allow you to store a copy of those figures or images that are part of our project and we want to reuse in other frames of the same animation or other project. This resource is useful in animation where you know that some of the components that you draw will appear again and again in further scenes.
+Think of this panel as a repository of visual and audio objects. Depending on the animation technique you were using, the Library is a very handy resource to handle, copy and reuse graphic objects (PNG, JPG, GIF, SVG). As in real movies, animation projects use to require a lot of props, i.e: the body parts of a character for cut-out animation, background objects, etc. The library panel is the warehouse where you store all these assets, so you can import them and use them in any frame, any time.
-{{ ObjectLibraryZoom_en.png }} {{ ObjectLibrary_en.png }}
+{{ wiki:library_panel_reference.png }}
 ;#;
-**Fig 20**. Objects Library
+**Fig 20**. Library
 ;#;
-====4. Right Sidebar====
+====Right Sidebar====
 ===- Scenes Manager===
-¿Do you know what is a scene? Let's give a simple definition: think about a movie or a TV commercial, have you notice the they are composed of many small fragments sorted in a special way that tells an story? These fragments use to be recognized easily because the camera position or your view point of the story changes.
+This panel is a basic interface to create, remove and rename the scenes of your animation project. Usually, the goal of the scenes manager is related to large productions where there's a team and a hierarchy of specific roles: animators, illustrators, directors, etc. From this panel, the director uses to review and to approve the scenes. For small projects, this panel can be used to watch and organize the scenes, in case you were using more than one.
-Understanding this concept, it's easier to describe this component: using this panel we can create and remove every one of the scenes that we want to include in our animation project.
-**Tip:** Before you start your animation project, it's very important to list all the scenes you want to create and define the sequence you want for them. Pay attention to the advises given in the section "First the first!" of our basic example.
+{{ wiki:scene_manager_reference.png }}
-{{ ScenesManager_en.png }} {{ ScenesManagerZoom_en.png }}
 ;#;
 **Fig 21**. Scenes Manager
@@ Line 109: / Line 107: @@
 ===- Exposure Sheet===
-The ''Exposure Sheet'' is a vital resource to illustrate each of the "moments" that are part of your animation. Through it, you can add or delete new frames and new layers to each of your scenes. In addition, this panel have the control to select the frames you want to edit in the ''Workspace'' from a single click. This functionality combined with the option of ''Onion Skin'' feature in ''Editing Panel'' will offer the necessary elements to make your animations look fluid. This will be much easier to understand, after you review the example of the next chapter.
+Think of this panel as a spreadsheet where columns are layers, and every cell in a row is a frame. The goal of this interface is to provide a visual guide of your animation timeline in a vertical way, so you can design the structure of your animation by creating and editing layers and frames from top to bottom as time advances toward down.
-{{ ExposureSheet_en.png }} {{ ExposureSheetZoom_en.png }}
+{{ wiki:exposure_sheet_reference.png }}
 ;#;
 **Fig 22**. Exposure Sheet
 ;#;
-====5. Bottom Bar====
+====Bottom Barside====
-===- Time Line===
+===- Timeline===
-This component is one of the most emblematic in the world of digital animation and is the most popular among animation software. It performs functions similar to those in ''Exposure Sheet'', with the difference that this component can preview your animation. For <b>Tupi</b>, this component is still under development but we hope to have ready in future releases.
+This panel is one of the most emblematic interface components in the world of digital animation and the most popular among 2D animation software tools. In fact, it's the current standard for managing frames and layers along the animation process for digital artists. Think of it as the horizontal version of the Exposure Sheet panel, almost same features, but much more popular.
-{{ TimeLine_en.png }} {{ TimeLineZoom_en.png }}
+{{ wiki:timeline_reference.png }}
 ;#;
-**Fig 23**. Time Line
+**Fig 23**. Timeline
 ;#;
+Now, let's move to the next tab. It's time to study the [[tupi_player_module|Player Module]].
 ;#;
 [[basic_manual#Animation Module|Back to Basic Manual]]
 ;#;