Introduction

This section describes the user interface and how to work with documents.

Interface

Keyshape uses toolbars and panels as shown below.

Tools - drawing and editing tools

Document Tabs - Home tab and a tab for each open document. The Home tab has shortcuts to recently opened documents and templates.

Toolbar - modify nodes, modify objects, snap and preview

Property Panel - set properties for selected objects

Timeline Switch - switch for Timeline, Graph, and Log panels. The Timeline displays animation keyframes, the Graph view displays value graphs and the log panel displays errors and warnings, such as compatibility issues or missing images and fonts.

Playback Controls - manage the animation time and playback

Timeline - shows keyframes for objects

Object Tree - all objects in a tree structure

Images Panel - manage bitmap images

Symbols Panel - manage symbols

Palette Panel - manage swatches

Interface Tips

Creating New Documents

The easiest way to create a new document is to select a template on the Home tab. You can also create a new document by choosing the File > New menu command.

Once you have created the document, you can adjust its dimensions, frame rate and title by choosing the File > Document Properties menu command or by selecting the document object in the Object Tree.

Opening Existing Documents

For quick access to earlier work, the Home tab lists recently opened documents. To open other documents, choose File > Open and select a file.

You can open Keyshape or SVG documents. Note that some SVG features, such as SVG filters or CSS stylesheets, are not supported.

If the document has linked images, you will be asked to allow access their folders. You can change the application Settings to allow permanent access to folders.

If the document has missing images or fonts, the Log Panel will display them. Select the log lines to see which objects are affected.

Importing SVG and Other Formats

SVG and other file formats can be imported for editing by opening them with the File > Open menu command.

By default, Keyshape supports importing SVG documents, but plugins can be used to add support for other file formats.

Saving Documents

You can save your work as a Keyshape document, which stores all the objects and embedded images in a single file.

By default, Keyshape documents are stored and compressed as standard zip archives. The file extension is .keyshape.

It is also possible to save uncompressed plain text Keyshape documents. Their file extension is .keyshapex. Plain text files are great for version control systems, third party tools, and manual tweaking but they are also larger. To reduce file size, avoid embedding images and converting text to paths.

Keyshape documents are based on the standard SVG file format with a few custom additions, like animations.

Managing Document Properties

You can modify the following document properties by selecting the document object in the Object Tree.

To resize the document and its content, select the action button in the Document Dimensions section and choose the Resize Document Content... option. A dialog opens for new dimensions. If the aspect ratio of the new size doesn't match the aspect ratio of the old size, then the Align content to option can be used to choose how the content is placed on the new document: at the start, center or the end of the document.

Panning and Zooming

There are several ways to pan the canvas:

There are multiple ways to zoom in and out: