The Basics

The main control panel is home to most critical and commonly used controls for the application. From left to right; Undo, Redo, New (from template), New (blank), Save, Open Item Library (Saves and templates), Export, Open Settings Menu, Open Image Library, Manage Data Sources

The shape control panel contains most editing options for the individual parts of a diagram. From left to right; Edit Text (if any), Edit Shape, Copy Shape, Pick default shape (from item library), Add Shape, Add Shape (Connect Left), Add Shape (Connect Right), Add Shape (Connect Up), Add Shape (Connect Down),Clear Selection, Move to Front (z - index), Move Forward, Move Backward, Move to Back, Delete Shape

The camera control panel lets you move around the screen (alternatively you can drag and hold anywhere in the background) or set/return to the centre points of your diagrams. From left to right; Navigate Left, Right, Up, Down, Zoom In, Zoom Out, Zoom Reset, Return to Centre Point, Set Centre Point.

The publication control allows you to manage your published creations and preview your current creation in Publisher mode. From left to right; Open the publication editor menu, preview your creation, manage data sources (spreadsheets) for this creation.

The group control allows you to group and ungroup shape collections for easier management. From left to right; Toggle multi select mode, Create Group from selection, Split selected group.

The link control allows for the editing, adding and deletion of links to assist with swift diagram creation. From left to right; Toggle the ability to edit the links by selecting them, Show the edit link menu, Add a link by choosing two shapes, Choose defaults for newly created links.

One of the first thing you may wish to do, is customise the appearance of your workspace. Background colour as well as the appearance of gridlines can be controlled by accessing the settings menu...

... and altering fields in the General Settings sections. Other options allow you to show or hide control panels or control how to work with your Google Account (if you choose to use it).

You can choose the type of shape that is added by either picking one from the item library or by, essentially, copying and pasting an existing shape. To add a new shape of whatever type is currently selected click the "add shape" button on the Shape control panel

Unless you have already selected a different type, a new standard text box will be added to your diagram.

Clicking this shape will select it and surround it with the selector box.

By clicking and dragging the bottom corner of the selection box you can resize the shape. How it behaves depends on the settings of the internal components. For this default shape. The background graphic will resize as the shape is resized. The text will retain a central position and wrap over multiple lines. These behaviours can be changed.

To do so, click the "Edit Shape" button

In the shape editor, click the "Add Internal" button. This will show an additional menu with a dropdown box. From this dropdown choose the component type and confirm your selection

With the component you wish to delete selected, press the delete button and then confirm your decision when prompted.

With the component you wish to edit selected, press the edit button. This will open a new menu depending on the type of component selected, specifics for each type can be found in the sections below.

As an alternative to adding a new component you can select one to duplicate. This will create an exact copy allowing swifter and more convenient further customisation.

Choosing to edit a graphical component will show the the following menu

The basic types are; Rectangle, Rounded Rectangle, Star and Ellipse

Several basic shape types can be selected, with each yielding different "dimension" settings.

Editing images offers similar options to graphics, allowing the image to be resized with the shape or to allow varying transparency levels. One notable difference is the option to either "Tile" or "Scale" an image.

Alternatively you can view your images and upload new ones via the image browser, accessed from the main control panel.

The control panel has two commands; the first allows a image to be uploaded from your file system. The second allows you to add an image from Google Drive. The extra options that come with using your Google Account are discussed in more detail in later topics.

There are effectively four parts to the Text editing menu. Font Settings; gives the usual options found in document editing. Graphic Settings; allows users to set the outline and fill colour of each letter. Text Settings; determines how the text will behave within a shape. Finally the text input itself.

Text can also be dynamically linked to a spreadsheet range through this menu. Details on how to use spreadsheets from Google Drive can be found in later topics.

There are several variations of methods to add content to your creation. The simplest is to use the "Add New Shape Button" (Or press Ctrl and v). This will add a copy of the currently selected template.

This template can be changed by picking a new one from the object library, or by pressing the "Copy selected shape button" (Or press Ctrl and c) while an existing shape is selected

You can pick templates, or use your own creations as templates, by accessing the object library.

There are a number of filters available to allow users to narrow the selection, either by type or by function. Each individual object has either two or three commands.

Linked shapes are integral to several types of diagram and Mindmatters supports a number of ways to customise and maintain shape links. Rather than adding individual shapes to the diagram, directionally linked shapes can be added from the link control panel. Whichever shape template is currently active, will be added to a selected shape with a pre-made link.

By default links can be selected and edited with the Link Editor Menu

In many instances, it might be appropriate to alter the default link settings for any given diagram. To do so click the Set Link Defaults button on the Link Editor Control Panel

There are three other options available from the Link Editor Control Panel. With the first, you can toggle link editing on and off. When turned off this prevents the direct selection of links. This is useful on a crowded screen or to select smaller shapes. By default link selection is on.

Clicking edit links will show a list of all links contained in your diagram, as well as the ability to edit or delete them.

You can also add links to existing shapes. First, select the shape that is to serve as the link's "parent". Select "Add Link". This will cause all controls to disappear. Next select the shape that is to serve as the link's "child". This will generate a new link (click the red cross to cancel).

You can use the zoom controls to zoom in and out or reset the zoom level. Zoom levels can also be controlled for interactive creations and you can use presentation areas to automatically scale content to different device and screen sizes. This is is discussed in greater detail in later topics.

Like elements within a shape it is possible to change the display order of shapes themselves.

Mindmatters supports file storage in Google Drive for those who sign in with their Google Account but by default newly created diagrams are saved locally in your browser. Every time you press "Save" on the Main Control Panel, your diagram will be updated in either case and a message will inform you when that update is complete.

You can export a saved file by clicking the "Export" button. This will take you to the export page, containing an image preview of your creation.

From here you can either download a .PNG image file or a .JSON text file. Alternatively you can export either of these types to Google Drive.