Prev Up Next
Quick Overview User's Guide Configuration

Concepts

To use the full potential of Sketch, it is important to know some fundamental concepts, such as the various kinds of objects that make up a drawing and their relationship. This section introduces these concepts and the terminology needed to talk about them. This terminology is also used in the menus, the status bar and other parts of Sketch's user interface.

Object Types

Sketch has two fundamentally different kinds of objects: primitives and compound objects.

Primitives

Primitives are the basic building blocks of a drawing. They are the ones that actually leave marks on the paper. Among this kind of object are the rectangle, the bézier curve (which also serves as a polygon or even as a straight line) and text object.

Most primitives can have fill properties and line properties. Properties are discussed in more detail below.

Compound Objects

Compound objects group several primitives or other compound objects together into one object. As such, compound objects are invisible, but the primitives contained in them are not. Therefore, compound objects are mainly interesting for editing purposes.

It is often convenient to group the primitives that form a distinctive part of a drawing together into a group. For instance, in the sample file flags.sk each of the flags is a group of several primitives (often just a few rectangles as many of the flags consist of some stripes). Whenever you click on one of the flags the whole group is selected not just the rectangle you clicked on. Thus, most of the time the group is manipulated as a whole (there are ways to work on the parts of a group without ungrouping them first, but that is an advanced topic).

There are some compound objects that behave in a special way. The only example at the moment is the BlendGroup. This group consists of two (or more) control objects and a number of objects that are linear interpolations of the control objects. When you edit one of the control objects all interpolated objects are updated automatically.

Structure of a Drawing

A drawing consists of primitives organized in compound objects. The entire drawing itself, the document, is a compound object that contains all the others.

When speaking about the objects contained in a compound object, it's convenient to use the terms parent and child. The compound object is the parent of the object it contains, the contained objects are the compound object's children.

The objects are always drawn in the same order with the objects drawn later obscuring the ones drawn earlier in case of overlap. One might also say that some objects lie on top of each other and that objects are drawn from bottom to top. This is the model we usually use and the reason for menu items such as "Move To Top".

The order in which the objects are drawn changes only when the user explicitly chooses a command that does so. Moving an object around or changing the fill properties does not change this order.

Layers

The top-level compound object, the document, is always divided into layers. Layers are the only kind of children a document can have and the parent of a layer will always be a document.

This means that normal objects such as primitives or other types of compound objects are never contained directly in the document object but are always, directly or indirectly, contained in a layer.

The layer is a special compound object with some special attributes. These attributes control whether its children are visible or not.

Properties

Primitives can have properties that define how they are drawn.

Fill properties define how the area defined by a primitive is drawn. Often this is just a single color, but Sketch offers some more variety in the form of patterns.

Line properties define how the lines of a primitive are drawn. The most important line properties are probably color, width and dashes.

A primitive can usually have both, fill and line properties, but there is no need for a primitive to have any properties. You might just want to draw the outline but not the interior of a rectangle, for instance.

Some types of primitives even cannot have fill or line properties. An image object for instance has neither fill nor line properties and a text object doesn't have a line attribute (currently at least) but has an attribute that defines its font.

As an advanced feature, Sketch offers dynamic properties. These allow you to define logical properties to use instead of physical properties. Whenever you change the definition of a dynamic attribute, all objects that use that attribute are automatically updated. This is similar to logical markup versus physical markup in LaTeX or SGML.

Fill Properties

Fill Properties define how the area of a primitive is filled.

The simplest case is just a single color that fills the area uniformly. Sketch offers more variety than that, though, in the form of patterns. A single color is then viewed as a very simple type of pattern.

A primitive may have empty fill properties or, phrased differently, no fill properties. In this case the area of the primitive is not changed all and the objects below the primitive are not obscured. Only its line is still drawn if it has line properties.

Patterns

Sketch currently offers three kinds of pattern: solid, gradient and hatching pattern.

Solid

This is the simplest pattern: Just a single color that uniformly fills the area.

Gradient

A gradient is the interpolation between two or more colors. A gradient pattern can be either linear, radial or conical.

Linear Gradient Conical Gradient Radial Gradient

Hatching

Line Properties

A primitive may either have no line properties (which means that only its area is filled if it has an area and nonempty fill properties) or one of each of the following properties:

Pattern

Currently, this can only be a solid color or the empty pattern. An empty pattern means that no line is drawn. Future extensions will probably allow arbitrary patterns.

Width

The line width. A width of zero means that the thinnest possible line is drawn.

Dashes

Whether to draw a solid line or a dashed line. A line can have arbitrary dash patterns.

Dash patterns are represented by a list of numbers such as "5.0, 2.0, 1.0, 2.0". This list describes a pattern of a drawn segment of 5 units long, followed by a gap of 2 units, followed by a drawn segment of 1 unit and finally a gap of 2 units, after which the sequence starts over. The unit used is the line width. This means that a thicker line has longer dashes and gaps.

Join Style

.

Cap Style

.

Arrow Heads

.

Font

Dynamic Properties


Quick Overview User's Guide Configuration
Prev Up Next