Overview of shape layers, paths, and vector graphics

1. About vector graphics and raster images

Vector graphics consist of lines and curves defined by mathematical objects called vectors, which describe images based on their geometric characteristics. Examples of vector graphic elements in the software include mask paths, shapes of shape layers, and text of text layers.

A raster image (sometimes called a bitmap image) uses a rectangular grid of picture elements (pixels) to represent the image. Each pixel is assigned a specific position and color value. Video footage and many other types of images imported into the software are raster images.

Vector graphics maintain sharp edges and do not lose detail when resizing because they are independent of resolution. This resolution irrelevance makes vector graphics a good choice for visual elements such as logos and will be used in various sizes.

   Example of a vector graphic at different levels of magnification.

Raster images each consist of a fixed number of pixels, and are therefore resolution-dependent. Raster images can lose detail and appear jagged (pixelated) if they are scaled up.

   Example of a vector graphic at different levels of magnification.

2. About paths

Some features of the software, including masks and shapes, depend on the concept of paths. Tools and techniques for creating and editing various paths that overlap, but each type of path has its own unique aspects.

A path consists of segments and vertices. Segments are the lines or curves that connect vertices. Vertices define where each segment of a path starts and ends.

You change the shape of a path by dragging its vertices, the direction handles at the end of the direction lines (or tangents) of each vertex, or the path segment itself.

As a path exits a vertex, the angle and length of the outgoing direction line for that vertex determine the path. As the path approaches the next vertex, the path is less influenced by the outgoing direction line of the previous vertex and more influenced by the incoming direction line of the next vertex.

   Components of a path

A. Selected vertex B. Selected vertex C. Unselected vertex D. Curved path segment E. Direction line (tangent) F. Direction handle

Paths can have two kinds of vertices: corner points and smooth points. At a smooth point, path segments are connected as a smooth curve; the incoming and outgoing direction lines are on the same line. At a corner point, a path abruptly changes direction; the incoming and outgoing direction lines are on different lines. You can draw a path using any combination of corner and smooth points. If you draw the wrong kind of point, you can change it later.

   Points on a path

A. Four corner points B. Four smooth points C. Combination of corner and smooth points

When you move a direction line for a smooth point, the curves on both sides of the point adjust simultaneously. By contrast, when you move a direction line on a corner point, only the curve on the same side of the point as the direction line is adjusted.

   Adjusting the direction lines on a smooth point (left) and a corner point (right)

Note : When moving the direction line of a smooth point, you can turn off the buttons that move at the same time and individually adjust the curve on the same side of the point as the direction line.

A path can either be open or closed. An open path has a beginning point that is not the same as its end point; for example, a straight line is an open path. A closed path is continuous and has no beginning or end; for example, a circle is a closed path.

You can draw paths in the default general geometry, including polygons, ellipses, and stars, or you can use the Pen tool to draw arbitrary paths. The path drawn with the Pen tool is a manual Bezier path or a rotated Bezier path. The main difference between a rotated Bezier curve and a manual Bezier path is that the direction line of the rotated Bezier path is automatically calculated, making it easier and faster to draw the path.

When drawing a shape path on a shape layer using the default shape (rectangle, rounded rectangle, ellipse, polygon, or star), you can create one of two types of paths: parametric shape path or Bezier shape path .

3. About shapes and shape layers

Shape layers contain vector graphics objects called shapes. By default, a shape consists of a path, a stroke, and a fill. (See Time-remapping.)

You can create a shape layer by drawing with the default shape and the pen tool.

Shape paths have two varieties: parametric shape paths and Bezier shape paths. Parametric shape paths are defined numerically, by properties that you can modify and animate after drawing, in the Timeline panel. Bezier shape paths are defined by a collection of vertices (path points) and segments that you can modify in the Composition panel. You work with Bezier shape paths in the same way that you work with mask paths. All mask paths are Bezier paths.

You can modify the shape path by applying a path operation.