Module 5 - Digital Clean-Up Using Pen Tool

Download as pdf or txt
Download as pdf or txt
You are on page 1of 18

ANIMATION NCII – Animation 12b

Governor Pack Road, Baguio City, Philippines 2600


Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

Digital Clean-up Using pen tool

Objectives: At the end of this lesson, students shall be able to:


1) Familiarize oneself with how to activate and use the pen tool in their animation / drawing /
illustration software of choice;
2) Understand the do’s and don’ts in line quality for paperless animation;
3) Understand the process of producing digital cleaned-up drawings using the pen tool; and
4) Apply the concepts, principles, and techniques for producing digital cleaned-up drawings by
doing the clean-up of a clean keyframe using the pen tool.

Introduction
 Pen Tool / Bezier Tool
o Tool found in various animation / drawing / illustration software that allows the user to create
lines and shapes using freeform curves
 Freeform
- Lines and shapes that are not geometrically set
- Lines and shapes that are organically-created
- Usually curved
o Lines and shapes created can mimic ones found in the real world
o Raster as its format, but utilizes vector concepts
 Works as if the paths and anchor points are lines and points in a Cartesian plane,
respectively
 For most software, the final lines / shapes are rendered as raster
 Can be rendered as vector depending on the software used and the final delivery format
type (SVG usually)
o Used to create:
 Straight and curved lines
 Freeform lines
 Freeform shapes – outline only
 Freeform shapes – solid color only
 Freeform shapes – outline and color
o Foundations for:
 Preset straight lines
 Pre-made curved lines
 Pre-made / geometric shapes (rectangle, ellipse, etc.)
 Pre-made polygons (pentagon, hexagon, etc.)
 How the Pen Tool Works
o Primarily utilizes paths
 Also known as lines
 Made up of one or more straight or curved anchor points
 Can be open (lines) or closed (shapes)
o A path is created using at least two anchor points
 Used to hold the path in place
 Represented by small squares along the path
 In vector graphics, it is the main points of how the line / shape is computed for
 A path can have more than two anchor points
- Placed along the path to make a more complex curve
- The number of anchor points are limited according to how curved the path is
 The start and end anchor points are known as endpoints

Page 1 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

o There are two kinds of anchor points


 Corner points – path abruptly changes direction (A)
 Smooth points – path segments are connected as a continuous curve (B)
 The two kinds of anchor points can be used separately or in conjunction with each other to
create different lines and shapes (C)

o A path is created by:


 Creating anchor points
 Editing the anchor points to modify the curve
 A curve is usually modified by dragging the direction points
o Direction points
 Points that appear when clicking on an anchor point
 Circle dots that are attached to the anchor points
 Helps determine the direction of the curve of the path connected to the next anchor point
 Determines the limit of how much a path can curve
- Two points: Can be curved in almost any direction
- One point: Can be curved to a maximum of 90 degrees for both left and right sides
- No point: Cannot be curved anymore
o Anatomy of a path

A. Selected (solid) endpoint


B. Selected anchor point
C. Curved path segment
D. Direction line
E. Direction point
 Advantages of Pen Tool
o Takes lesser time than freehand
o Can be done by using more accessible equipment
o More consistent in terms of line thickness and quality
o Allows for reshaping even after the line has been set
o Can be resized and the quality will not suffer (vector-based)
Page 2 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

 Disadvantages of Pen Tool


o Can appear more flat than a freehand clean-up
o Requires some learning time to achieve
o Limitations with how organic the curves are
o Limited brush settings
 List of Possible Software with Equipped Pen Tool
Software Name Uses Free / Paid Platforms to be Used
Krita Animation, Free Desktop / Laptop – Windows, MacOS,
drawing, illustration Linux, Android, Chrome OS
Adobe Animate Animation Paid Desktop / Laptop – Windows, MacOS,
Linux
Adobe Flash Animation Paid Desktop / Laptop – Windows, MacOS,
Linux
Adobe Illustrator Drawing, illustration Paid Desktop / Laptop – Windows, MacOS,
Linux
Adobe Animation, Paid Desktop / Laptop – Windows, MacOS,
Photoshop drawing, illustration Linux
CorelDRAW Drawing, illustration Paid Desktop / Laptop – Windows, MacOS
Clip Studio Paint Animation, Paid Desktop / Laptop – Windows, MacOS,
drawing, illustration Linux, Android, Chrome OS
GIMP Painter Drawing, illustration Free Desktop / Laptop – Windows, MacOS,
Linux
Infinity Painter Drawing, illustration Free Mobile – Android, iOS, iPadOS
Infinity Designer Drawing, illustration Free Mobile – Android, iOS, iPadOS
Inkscape Illustration Free Desktop / Laptop – Windows, MacOS,
Linux
Medibang Paint Drawing Free Mobile – Android, iOS, iPadOS, HuaweiOS
OpenToonz Animation Free Desktop / Laptop – Windows, MacOS
Paint Tool SAI Drawing, illustration Paid Desktop / Laptop – Windows
Pen Tool SVG Illustration Free Mobile – Android
Procreate Animation, Paid Mobile – iOS, iPadOS
drawing, illustration
Retas Animation Free Desktop / Laptop – Windows, MacOS,
Linux
TVPaint Animation Paid Desktop / Laptop – Windows, MacOS,
Developpement Linux, Android, AmigaOS
o Notes and Disclaimers:
 There are a lot more software that can be used aside from the listed ones above as long as
the ‘pen tool’ in the software fulfills all of the marks the characteristics of a pen tool:
- Creates freeform lines and/or shapes
- Utilizes anchor points
 The student can use any animation / drawing / illustration software that they are most
comfortable using
 Different software can have:
- Different names for the pen tool (i.e. Bezier tool)
- Have multiple variations of the pen tool
- Different approaches to how it is activated (focusing on the clicks / taps, dragging,
holding, pressing, or any other mouse / keyboard techniques)

Page 3 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

Tools in Producing Digital Cleaned-Up Drawings Using Krita


Tools Icon Function
 Chooses the brush settings that is to be used for the Bezier
tool
Freehand Brush Tool  Not to be used for the actual clean-up
 Can also be used to redraw or erase (by turning it to the
eraser tool)
 Main tool for drawing curves
 Click the left button of the mouse (or trackpad) to indicate
Bezier Curve Tool the starting point of the curve, then click again for
consecutive points of the curve
 Can also be used to draw straight lines and closed shapes
 Draws a path, and then shape will be filled out with a
selected color and outlined with another brush
 Preview is shown that can be modified in pattern, width,
Freehand Path Tool
and color
 Recommended for a faster coloring technique that cannot
be achieved by the fill tool
 Add custom smoothing dynamics to the brush
 Gives similar smoothing results as the normal freehand brush
Dynamic Brush Tool
 Options can be changed
 Not recommended for use
 Draws individual lines
 Click the left mouse button to indicate the first endpoint,
Straight Line Tool
keep the button pressed, then drag to the second
endpoint, and release the button
 Used to create rectangle shapes on a separate vector
layer
 Can be used to also create rectangles with a solid color
Rectangle Tool
 Click and hold the left mouse button to indicate one corner
of the rectangle (usually upper left), drag to the opposite
color (lower right), and then release the button
 Used to create ellipses
 Used to create ellipses with a solid color
 Click and hold the left mouse button to indicate one corner
Ellipse Tool
of the ‘bounding rectangle’ (the rectangle where the
ellipse is placed), move the mouse to the opposite color,
and then release the button
 Draw polygons
 Click the left mouse button to indicate the starting point
Polygon Tool and successive vertices, and then double-click or press the
Enter key to connect the last vertex to the starting point
 Shift + Z undoes the last clicked point
 Polylines are drawn like Polygon Tool
Polyline Tool  The double-click indicating the end of the polyline does not
connect the last vertex to the first one
 Can be toggled on and off along with the tools mentioned
Eraser above
 Will mimic the functions of the aforementioned tool

Page 4 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

Tools in Producing Digital Cleaned-Up Drawings Using Adobe Photoshop


Tools Icon Function
 Click around an object with the Polygonal Lasso Tool to
Polygonal Lasso Tool surround it with a polygonal, straight-edged selection
outline.
 The Brush Tool is Photoshop's primary painting tool. Use it to
Brush Tool
paint brush strokes on a layer or on a layer mask.
 The Pencil Tool is another of Photoshop's painting tools. But
while the Brush Tool can paint soft-edge brush strokes, the
Pencil Tool
Pencil Tool always paints with hard edges.
 The Eraser Tool in Photoshop permanently erases pixels on a
Eraser Tool
layer. It can also be used to paint in a previous history state.
 Photoshop's Pen Tool allows you to draw extremely precise
Pen Tool
paths, vector shapes or selections.
 The Curvature Pen Tool is an easier, simplified version of the
Curvature Pen Tool
Pen Tool.
Add Anchor Point  Use the Add Anchor Point Tool to add additional anchor
Tool points along a path.
Delete Anchor Point  Click on an existing anchor point along a path with the
Tool Delete Anchor Point Tool to remove the point.
 On a path, click on a smooth anchor point with the
Convert Point Tool Convert Point Tool to convert it to a corner point. Click a
corner point to convert it to a smooth point.
 The Rectangle Tool draws rectangular vector shapes, paths
or pixel shapes. Press and hold Shift as you drag to force
Rectangle Tool
the shape into a perfect square.
 The Rounded Rectangle Tool is similar to the standard
Rounded Rectangle
Rectangle Tool but draws the shapes with rounded corners.
Tool
Press and hold Shift to draw a square with rounded corners.
 The Ellipse Tool draws elliptical vector shapes, paths or pixel
Ellipse Tool shapes. Press and hold Shift as you drag to draw a circle.
 The Polygon Tool draws polygonal, straight-edged vector
Polygon Tool shapes, paths or pixel shapes. Use the "Sides" option in the
Options Bar to set the number of sides.
 The Line Tool draws straight lines, either as shapes or paths.
Line Tool The "Weight" option in the Options Bar controls the width of
the line.

Do’s and Don’ts in Digital Line Quality


 Use Proper Clean-Up Technique
o There are two main approaches on how to do clean-up: freehand or the pen tool
o Utilize the proper clean-up tool that is prescribed by the animation studio, or the trainer,
regardless of your personal preference
o This would allow consistency between all other frames and make them look like it was created
by only one individual
o Not doing so would make your own frames stand out and remove the viewer from the
immersion

Page 5 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

 Brush Settings
o Follow the brush settings that is prescribed by the animation studio or trainer
o Some basic brush settings are as follows:
 Type – basic or ink
 Color – black (#000000 or R-0 G-0 B-0) or colors nearer to black (dark gray, brown, blue)
 Opacity – 100%
 Hardness – 100%
 Flow – 100%
 Texture – none
 Pressure sensitivity – none
 Spacing – 1.00
 Smoothing – midpoint to highest setting
 Size – 2 to 10 pixels, depending on the distance from camera and size
 Line Variation
o It is recommended to have varying line thicknesses according to the location of the clean-up
 Thicker lines – main outline, prominent parts of the character (head, upper body, etc.)
 Thinner lines – everything else, details
o This is because digital clean-up tends to look flat, so having different line thicknesses would
make it look more lively and dynamic
o Have at least two different line thicknesses, but the number may increase (up to around four)
 Use Center of the Redrawn Line
o Aim to place the endpoints at the center of the thickness of the redrawn line
o Prevent from placing the endpoints near the sides
o This is to make sure that the redrawn line and the clean-up line are as similar as possible

 Follow Curve
o Aim to follow the curve of the redrawn line as accurately as possible
o However, it is possible to stray a bit if it shall benefit the final line
o If the redrawn clean-up line is confusing, then there might be a necessity to further tighten up
the lines to make it as clean as possible

Page 6 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

 One Stroke Path Per Line


o Ensure that the lines would only have one stroke path
o This is to prevent any choppy lines and minimize erasing / repairing later on
o If not possible, one can break up the line at least as possible, while ensuring that the next
endpoint should match perfectly with the previous endpoint

 Prevent Opening Lines


o Prevent any opening lines that are placed within the lines itself, or usually placed at the
corners
o This can be repaired by either:
 Redoing the line again
 Connecting the line with another pen tool stroke, then erase neatly any overshooting lines
 Connecting the line with freehand clean-up techniques, then erase neatly any
overshooting lines
o This is because it would allow the color to bleed out later on (when using the fill / paint bucket
tool)

 Prevent Straight Lines


o Characters are usually organic in nature, and thus are created through curved lines
o Try to curve any straight lines that may be seen
o Having straight lines could also make the character less organic, less dynamic, and more flat
o This can be ignored if the straight line is placed on the design or if it is an inorganic object
 Overshoot If Necessary, Then Erase
o If needed, overshoot the line rather than using short strokes
 Curve cannot be achieved without a longer line
 Having difficulty creating a closed corner
 Connecting a line to create a longer line
o When erasing:
 Use a small sized-eraser (around 1-5 pixels)
 Cleanly erase the overshooting lines, almost down to the size of a pixel
o This technique, however, must be prevented; it would be better to undo the entire line
Page 7 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

Steps in Digital Clean-Up Using Bezier Tool (Krita)


 Open the redrawn rough keyframe drawing. Analyze and do more redrawing if necessary.

 Decrease the opacity of the rough keyframe drawing layer.

 Create a new layer for the clean-up.

 Add a new layer for the clean-up.

 Click on the Bezier Curve Tool.

Page 8 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

 Choose the necessary brush settings.

 Change the opacity to 100%; the brush size to the size dictated by the studio (in this example, 7px
for the outline, 5px for the details).

 Ensure that the redrawing layer is locked to prevent anything from being redrawn accidentally
when doing the clean-up.

 To draw a straight line:


o Click the left mouse button for the first endpoint
o Hover mouse towards the end of the line
o Click towards the next corner to create another point
o In straight lines, there is no actual limit to the number of endpoints that can be created since
the curving will not limit the type of line that can be created
o When finished, press the Enter key.

Page 9 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

 Drawing curved lines (hollow):


o Click on the left mouse button for the first endpoint
o Hover mouse towards the end of the curved line
o Click and hold to create another point
o Drag the mouse to change the line direction using the direction point:
 Dragging it towards the left / right makes it less curved
 Dragging it upwards / downwards makes it more curved
o Release hold once the curve has been created
 How much endpoints can be created from one curve is limited by the number of previous
curves and how curved they are.
o Hover towards the next point if possible
o If not anymore, press the Enter key

 Drawing curved lines (deep):


o Click on the left mouse button for the first endpoint
o Hover mouse towards the bottommost part of the curved line
o Click and hold to create another point
o Drag the mouse to change the line direction using the direction point
o As can be seen, for deeper curves, it is quite difficult to trace it to the other endpoint; thus, it is
necessary to create another stroke path
o Release hold once the curve has been created. Press the Enter key

Page 10 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

o At the end of the first line, click the left mouse button to create the second endpoint; ensure
that this endpoint is matched to the endpoint of the first one as cleanly as possible

o Do the same steps when creating a curved line. Once finished; press the Enter key
o Go back to the brush tool and turn it into a small eraser
o Erase any overshooting lines down to the pixel

 Other settings:
o Right mouse button / Right click – undo the last added point
o Del key – removes the currently selected control point from the curve
o Enter key / Double click (left mouse button) – finish the line / add stroke
o Ctrl + left mouse button (hold) – move the entire curve to a different position
o Ctrl + dragging – pushes the direction points (or handles) both ways
o Alt key – creates a sharp corner
o Shift key – makes a handle at the end of the curve
 Other notes:
o Start by drawing the thicker lines (outlines) first, then change the brush size only to do the
clean-up for the details
o Creating a closed shape while using the Bezier tool will automatically add the stroke / line to
the shape (i.e. mouth, eyebrows)
o Use the rectangle, ellipse, or polygon tool to create pre-made shapes (i.e. eyeballs)
 Progress (head only):

Page 11 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

Steps in Digital Clean-Up Using Pen Tool (Adobe Photoshop)


 Prepare the necessary steps similar to the one in Krita:
o Do necessary analysis and redrawing
o Decrease opacity for redrawn / rough keyframe drawing layer; no need to lock – just ensure
that the layer will not be drawn on
o Create a new layer for the clean-up
o Establish proper brush settings using the Brush tool
 Create a curved line similar to the one in Krita:
o Use the left mouse button to click on the first endpoint
o Hover the mouse to the location of the next endpoint, preferably the end of the curved line
o Click then hold using the left mouse button to create another point
o While holding, drag the mouse to change the direction points, and thus the curve itself
 Dragging it towards the left / right makes it less curved
 Dragging it upwards / downwards makes it more curved
o Release the hold to create the stroke line
o Hover towards the next point if possible to create another curved line

 Right click along the stroke path to open a list of options. Click on “Stroke Path…”

 Select the “Brush” as the tool and make sure the “Simulate pressure” checkbox is unchecked.
Click on “OK”.

Page 12 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

 The path will then be added a line according to the specifications of the brush.

 Right click once more on the stroke path. Select “Delete path”.

 Result:

 Important: Write the frame label, time chart, and production information (if necessary); no need
to add the special instructions. Hide (do not delete) the rough keyframe drawing layers.

Page 13 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

Tips for Digital Clean-Up Using the Pen Tool


 Redraw the render to fix the pose, facial expression, and modelling.
 Clean any unnecessary lines to make sure that you are able to understand what are needed and
to lessen confusion during clean-up.
 Practice using the pen tool of the software / application you are using before actually using it on
the rough keyframe drawing.
o Different software / application may have different ways, techniques, and keyboard shortcuts
for using the pen tool, so knowing them beforehand is essential.
o Look for official documentation if possible. If not, then use online tutorials to see how it works.
 Position the Pen tool where you want the curve to begin, and hold down the mouse button. The
first anchor point appears, and the Pen tool pointer changes to an arrowhead.

 Drag to set the slope of the curve segment you’re creating, and then release the mouse button.
In general, extend the direction line about one third of the distance to the next anchor point you
plan to draw.
o If the distance of the line is too long, then zoom out the canvas to see it better.
 Position the Pen tool where you want the curve segment to end, and do one of the following:
o To create a C‑shaped curve, drag in a direction opposite to the previous direction line. Then
release the mouse button.

o To create an S‑shaped curve, drag in the same direction as the previous direction line. Then
release the mouse button.

 It is better to undo something rather than to clean it up using the eraser.

Page 14 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

References:
 Adobe. (n.d.). Draw with the Pen tools, Offical Adobe Help. Retrieved from
https://helpx.adobe.com/photoshop/using/drawing-pen-tools.html
 George. (n.d.). Job 1 – Clean-Up Artist, TAFE NSW Sydney eLearning Moodle. Retrieved from
https://sielearning.tafensw.edu.au/toolboxes/Animation/jobs/job1/ca/j1_ca_pr.pdf
 George. (n.d.). Studio Tour – Clean-Up Artist, TAFE NSW Sydney eLearning Moodle. Retrieved
from https://sielearning.tafensw.edu.au/toolboxes/Animation/tour/ca/s_ca_pr.pdf
 Krita. (n.d.). Tools in Krita: Official Documentation. Retrieved from
https://docs.krita.org/en/reference_manual/tools/path.html
 Krita. (n.d.). Line Art Tips with Krita: Official Documentation. Retrieved from
https://www.davidrevoy.com/article261/line-art-tips-with-krita
 Patterson, S. (n.d.). Photoshop Tool and Toolbar Overview, PhotoshopEssentials.com.
Retrieved from https://www.photoshopessentials.com/basics/photoshop-tools-toolbar-
overview/
 Technical Education and Skills Development Authority (2018 February 27). Training Regulations
for Animation NCII – Version 02. Quezon City
 UW-IT. (n.d.). The Pen Tool, Information Technology – University of Washington. Retrieved from
https://itconnect.uw.edu/learn/workshops/online-tutorials/graphics-and-design-
workshops/adobe-cs/illustrator/pen-tool/

ACTIVITY 5: Clean-Up of Keyframe 3


Instructions: Using the redrawn frame from your Module 4 (A13), do the digital clean-up using pen
tool only.
 Important: Do not use freehand clean-up. The only freehand that must be done is erasing.
 Included in this module is two model sheets (full-body turnaround and facial expressions) and
the cleaned-up keyframe A10 for reference.
 You are required to use paperless animation for this activity. For those who cannot use digital
animation by any means, please follow the instructions placed at the very last page of this
document.
 Document dimensions are the following:
o Dimensions: 2550px x 1625px
o Resolution: 96 dpi
 The line to be used is a standard line with no pressure sensitivity. Details of the brush settings are
as follows:
o Type: basic round, digital, ink, or something similar
o Color: black only (#000000 or R=0 G=0 B=0)
o Size: outline – 7px; details – 5px
o Opacity, Hardness, and Flow: 100%
o Texture: none
o Pressure sensitivity, Jitter: none
 Hide any rough keyframe drawing layers; only the cleaned-up line must be visible.
 Please follow procedures in record keeping and quality control.
 Submit the output in image file format (JPEG, PNG, GIF) only.
How to Submit:
 File extension type must be .jpg, .png, or .gif.
 File name: LastName, FirstName – ICT Ani 12_ - Module 5 Activity
Submission Channels:
 Canvas K-12 LMS (Assignments)

Page 15 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

Rubric:
Line Quality Do’s and Don’ts in Creating a Record Keeping Procedures
Line and Quality Control
20 (excellent) – Output was 20 (excellent) – Output follows 10 (excellent) – All production
created using a digital pen the prescribed brush settings; information necessary are
tool; proper line thicknesses has no overlapping or opening present; naming convention of
and other brush settings were lines; final line is clean with no the file name and proper file
utilized; clean-up upholds the visible erasures; there is less type were followed
integrity of the action and than five mistakes within the
expression entire output
16 (above average) – Output 16 (above average) – Output 8 (above average) –
was created using a digital pen follows the prescribed brush Production information are
tool; proper line thicknesses settings; has little overlapping mostly present and
and other brush settings were or opening lines; final line is unnecessary information may
mostly utilized; clean-up was clean with some visible be present; naming convention
able to maintain the integrity of erasures; there is less than ten of the file name and proper file
the action and expression mistakes within the entire type were followed
output
12 (satisfactory) – Output was 12 (satisfactory) – Output 6 (satisfactory) – Production
created using a digital pen mostly follows the prescribed information are mostly present,
tool; proper line thicknesses brush settings; has some and some unnecessary
and other brush settings were overlapping or opening lines; information is present; naming
utilized but had significant final line is mostly clean with convention of the file name
changes; clean-up did not some visible erasures; there is and proper file type may have
maintain the integrity of the less than fifteen mistakes within been followed
action and expression the entire output
8 (fair) – Output was not 8 (fair) – Output mostly does 4 (fair) – Some production
created using a digital pen not follow the prescribed brush information are present and
tool; most brush settings were settings; has multiple unnecessary information is
not followed according to the overlapping or opening lines; present; naming convention of
prescriptions of the trainer; final line is quite messy with the file name or proper file type
clean-up downgraded the multiple visible erasures; there is were not followed
rough attitude of the action less than twenty mistakes within
and expression the entire output
4 (needs improvement) – There 4 (needs improvement) – There 2 (needs improvement) – No
is a need to relearn and is a need to relearn and production information is
understand the prospects of understand the entirety of the present; naming convention of
proper line quality as none of do’s and don’ts in creating a the file name and proper file
the guidelines prescribed were digital clean-up line as it is not type were not followed
followed followed within the output

Page 16 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

References: (Link: https://imgur.com/a/pUuJwAm)

Page 17 of 18
ANIMATION NCII – Animation 12b
Governor Pack Road, Baguio City, Philippines 2600
Tel. Nos.: (+6374) 442-3316, 442-8220; 444-2786;
442-2564; 442-8219; 442-8256; Fax No.: 442-6268 Grade Level/Section: ICT Ani 12 A, B, C, and D
Email: [email protected]; Website: www.uc-bcf.edu.ph

MODULE 5 – Ani12b Subject Teacher: Lovely Jenn A. Reformado

For traditional clean-up users:


 Note: This instruction set are for the students who do not have the means to do the clean-up
activity digitally. The following are some conditions and circumstances, but not limited to:
o No devices that would allow to do digital clean-up (desktop, laptop, smartphone, and
tablet)
o No internet connection that allows to download the necessary software
 You are still required to do the digital clean-up if, but not limited to:
o Using a smartphone only (could still use alternative applications)
o Did the module 4 activity traditionally, but have the means to do it digitally
o Do not have a mouse, drawing tablet, or stylus (trackpad / finger would work well)
o Little to no initial proficiency in using the pen tool
 Do the clean-up line on a separate ½ short bond paper (8.5” x 5.5”)
o Follow the do’s and don’ts of creating a line and traditional line quality based on Module 4
from Animation 12a (Clean-Up Proper)
o Continue to follow the procedures for record keeping and quality control
o Take a clear photo and submit as such (JPEG, PNG, GIF only)
 On top of that, please answer the following questions within 2-3 sentences:
o What is your reason why you are not able to do the activity digitally? (this question will not
be graded, but validates the reason for the alternative activity)
o How do you differentiate the process of cleaning-up rough sketches using a pre-defined
pen tools over free hand brushes?
o As a future animator in the clean-up department, you were given a task to digitally clean-
up specific rough drawings within a limited amount of time. However, you noticed that the
software available in your workspace are not the ones you are using. How are you going to
cope up with this situation?
 For the questions, submit them by writing the questions and your answers on a piece of paper
and then taking a clear photo.
Alternative Criteria:
Criteria Description Score
Questions The two questions are within 2-3 sentences; properly answers the
question based on what was learned as well as their own
20
understanding and interpretation; answers are to the point (each
question is 10 points each)
Do’s and Don’ts Output follows the prescribed pencil thickness and darkness; has no
in Creating a Line overlapping or opening lines; there are no wriggly lines; final line is 20
clean with no erasures
Record Keeping All production information necessary are present; naming convention
Procedures and of the file name and proper file type were followed 10
Quality Control
Total 50

Page 18 of 18

You might also like