Welcome to OmniGraffle 2.1 for iOS!

That’s right folks, we said OmniGraffle 2.1 for iOS! Since we last met, your friends at The Omni Group have been busy working on Universal versions for all of our apps. If you have an iPhone, iPad, iPad mini, or iPod touch (5th Generation) that runs iOS 8 or higher, then your day just got a zillion times better.

When Apple introduced the iPhone 6 and iPhone 6 Plus, we knew it was finally time to bring all of our iOS apps to the larger iPhone screens. OmniGraffle 2.1 for iOS has been optimized for iOS 8 and is packed with a ton of new goodies, including:

• Point Editing Tools—We’ve added a new set of tools for editing the points of a shape. To use the Point Editing Tools, first select a shape or line on the Canvas, and then tap in the bottom toolbar. This makes it much easier to drag existing points, add points, and remove points from an object.
• The Loupe—While you might be tempted to think this has something to do with Apple’s main campus (or a bearded man’s blog), think again. The Loupe appears beneath your finger whenever you touch the screen of your iOS device. Use this new tool to align objects or connect lines with pixel-perfect precision.
• Fill Effects and Filters—We’ve brought OmniGraffle 6.1 for Mac’s Fill Effects and Filters over to OmniGraffle 2.1 for iOS.

And finally, there’s a new place in Omni’s family: Stenciltown. Stenciltown is where you can safely find and download new stencils for use with OmniGraffle.

Created with love,

The Omni Group

How This Documentation is Organized

This wonderful manual that you have before you (either in OmniGraffle itself, online, or in iBooks on your Mac or iOS device—or both) has been assembled in such a way that you’re provided with a complete tour of OmniGraffle.

You’ll start out with an overview of OmniGraffle’s interface. Don’t skip over this chapter, as you’ll find many nuggets of information and fine details about OmniGraffle that you might otherwise miss. And, if you do decide to skip this chapter and later find yourself wondering, “Hey, what’s that doohickey do?”, you can always come back here to discover what it’s all about.

To help guide you through the documentation and better learn all the things you need to know about OmniGraffle, here’s a list of all of the chapters in this book:

Chapter 1, Adding a Cloud Account

Whether you’ve just started using OmniGraffle for iOS, or if you’ve been using it alongside OmniGraffle for Mac, it’s important for you to keep a backup of your illustrations and diagrams in the cloud. OmniGraffle uses our own cloud service to synchronize files with your free Omni Sync Server account or to another WebDAV server of your choosing. Once synchronized, you can access the things you draw in OmniGraffle on your iPad over on your iPhone, or on your Mac (if you’ve purchased OmniGraffle for Mac). It’s pretty cool; you should check it out.

This first chapter walks you through the process of setting up a cloud account in OmniGraffle for iOS and discusses how get the best performance out of Omni Sync Server.

Chapter 2, Using the Document Browser

Since OmniGraffle is a document-based application, you’ll need a way to manage the documents on your devices. This chapter provides an overview of the Document Browser, which is what you use to manage the files you create in OmniGraffle.

Chapter 3, Using OmniGraffle on iOS

The first chapter dives right in and gives you a top-down overview of OmniGraffle’s user interface. You’ll learn about the differences of using OmniGraffle on large- and small-screened iOS devices, and get a close look at all of the tools available to you. Nothing too deep; just the basics to get you rolling.

Chapter 4, Using the Inspectors

Once you’ve learned about the Tools, you can use the Inspectors to examine the things you draw and modify their properties. Chapter 3 also examines the Stencils built into OmniGraffle and introduces you to Stenciltown.

Chapter 5, Drawing Basics

Here you’ll learn some of the basic ways to draw and create objects on the canvas. You will learn how to create, select, resize, and move shapes, how to group and ungroup objects, how to connect objects with lines—including how to adjust the connecting lines and endpoints—and how to add color to your objects using the Fill inspector.

Chapter 6, Getting Help

There’s no shame in admitting that you need help. In fact, that’s what we’re here for. If you ever get stuck when working on something in OmniGraffle, or if you have a problem with the app’s license, or you just want to tell our Support Humans and the DocWranglers what an awesome job they’re doing, feel free to get in touch. This chapter points you to all of the resources we have available: Support Humans, Support Articles, Videos, and Documentation.

Using This Book

One of the beauties of having OmniGraffle’s documentation available in electronic form is that it’s always available whenever you need it. We have put all of the documentation on our website where it can be searched and bookmarked. And we’re continuing the ongoing trend of creating EPUB versions of the documentation and making them freely available on the iBooks Store.

What’s New in OmniGraffle 2 for iOS

OmniGraffle 2 has new and re-designed features to make drawing and graffling even easier. If you’ve been a long-time OmniGraffle user, it won’t take long before you notice some changes.

Some new features you’ll find in OmniGraffle 2 include (but certainly aren’t limited to):

• In-App Purchase—Several Pro features, such as Visio® support, shape combinations, tables, and more, have been moved into an In-App Purchase bundle.
• Stencil Searching—You can now search for user-submitted stencils at our own repository: Stenciltown.
• User Interface—Interface changes have been made to bring OmniGraffle up to date with iOS 8. A new Canvases sidebar has been added, as well as the ability to hide interface controls completely.
• Shape Combinations (Pro)—Combine two or more objects on the Canvas to create custom shapes. (This is included with the Pro In-App Purchase.)
• Visio Support (Pro)—Import and export illustrations and diagrams for Microsoft® Visio®, including Visio 2013. (This is included with the Pro In-App Purchase.)
• OmniOutliner Support—Import and Export support for OmniOutliner files.
• Inspectors—New fill, stroke, and shadow styles have been added.
• AirDrop—Easily AirDrop files between iOS 8 and OS X Yosemite (v10.10) clients.
• Drawing Tools—Manipulate vertex points on shapes with the Freehand Tool, and convert them to Bézier points.
• Templates—When you create a new document, you are presented with a list of available templates which you can start from. Easily turn an existing document into a template or create one from scratch.
• Folders—Have a lot of illustrations and diagrams on your iPad? Organize them with folders, and if you’re syncing with OmniPresence, the same folders and files are visible on your Mac.

These new features, combined with file synchronization with OmniPresence and Omni Sync Server, make this an incredible update worthy of a whole number.

Tell Us What You Think

We’re constantly working on updates for our documentation. Whether it’s CSS work, correcting the occasional typo (yeah, they do sometimes slip through), or adding details or clarification for a specific feature based on something we’ve heard from a customer, we’re always trying to make our documentation better and more useful for you.

If you have any specific comments you’d like to send us about the documentation, please do. You can drop us an email message via our Support queue, or you can ping us on Twitter; we’re @OmniWranglers.

Finally, we’d like to thank you for taking the time to read the docs.

Adding a Cloud Account

By default, OmniGraffle stores files locally on your iOS device. As mentioned in Managing Files with the Document Browser, your files are saved in the Local Documents folder on the device. But now that OmniGraffle works across iOS devices, you should consider storing your files in the cloud. When you do, your files are accessible on your iPad, iPhone, iPod touch (5th Generation), and also on your Mac if you use OmniGraffle there, too.

Creating an Omni Sync Server Account

If you plan to use Omni Sync Server with OmniGraffle, you will need to set up a free account if you don’t already have one. You can create a free Omni Sync Server account online at:

For Omni Sync Server Accounts

If you have an Omni Sync Server account, follow these steps to configure a cloud account:

For WebDAV Server Accounts

On the Account Info screen that appears, follow these steps:

Monitoring OmniPresence

When you have configured OmniGraffle to use either type of cloud account (Omni Sync Server or WebDAV), you’ll notice an OmniPresence icon in the toolbar.

Deleting a Cloud Account

To remove an account, tap Edit; a delete handle appears to the left of the account name. If you tap the delete handle, the account name slides to the left and a Delete button appears on the right edge; tap that to delete the account.

Managing Files with the Document Browser

In developer circles, OmniGraffle is known as what’s called a document-based application, which in non-nerdy language means: “This app creates and manages files.” And as a file-creating application, we need to provide a way for you to manage and organize your files. We call this the Document Browser.

Getting Acquainted with the Document Browser

When you first open OmniGraffle, you’re taken to the Locations screen which is the place you go to access all of your documents. There is a Local Documents folder, which we’ve preloaded with some sample OmniGraffle files that you can use as inspiration for the documents you’ll create.

Doing More with Your Files

The Document Browser isn’t just about sorting files and organizing templates; it offers so much more. When you have chosen a folder in which to create a new file or open an existing file, you’ll notice that the navigation bar at the top of the screen gains a few more options.

Sharing Files and Creating Templates

Every now and then you’ll find the need to share some document you’ve created in OmniGraffle with someone else. But all of the files are on your iPad, how are you going to do this?

Creating Subfolders

To help you better organize your files, you can also move files to other folders or create subfolders that contain similar documents. Tap Select, and then choose the file (or files) you would like to move. Tap in the Action Bar to move a file to another folder, or to create a new subfolder containing the selected files.

Moving Files Between Folders

Once you get the hang of creating subfolders, you should be well on your way to devising ways to better organize your OmniGraffle files. Website wireframes here, iOS app wireframes there, and so on.

Copying Files

You may not need to copy files all that often, but when you do, the Document Browser can help you with that, too. From the Locations screen, select the folder that contains the file you’d like to copy, and then follow these steps:

Taking Out the Trash

Every now and then, you’ll find that it’s time to do a little housecleaning in OmniGraffle. Your early attempts at drawing with Bézier curves has just been lying around taking up space, so it’s time to dump that file into the trash and purge it from your device forever (or from your synced Cloud Account, if you have one of those configured).

Using OmniGraffle on iOS

To make OmniGraffle usable across Apple’s oeuvre of iOS devices, we’ve had to make some big UI changes between OmniGraffle v2 and v2.1. The purpose of this chapter is to show you how we have adapted the Universal release of OmniGraffle for iOS.

With OmniGraffle for iOS, there are essentially two classes of screen size to consider: large (iPad, iPad mini, and iPhone 6 Plus), and small (iPhone 6 and below, and iPod touch). The two places where you’ll notice the biggest difference between large and small screens are:

• When you are in a document and working with the Drawing Tools
• When accessing the Contents sidebar

Using OmniGraffle on Large Screens

When using OmniGraffle on large-screened devices, such as the iPad or iPhone 6 Plus, you’ll find that we have taken full advantage of all that space.

Notice that the Document Toolbar is located above the Canvas, the Canvases sidebar is on the left of the Canvas, and that all of the Drawing Tools are located beneath the Canvas. The only real difference you should notice between using OmniGraffle on iPad vs iPhone 6 Plus is that the screen on the iPhone 6 Plus isn’t as tall.

To hide the Canvases sidebar, tap in the Document Toolbar; the sidebar goes into hiding, giving you full access to the entire canvas.

Tap to bring the Canvases sidebar back onto the screen.

Using OmniGraffle on Small Screens

When using OmniGraffle on small-screened devices, such as the iPhone 6 or iPod touch, you’ll find that we’ve had to make some slight changes to the user interface.

For starters, you’ll notice that both the Canvases sidebar and the Drawing Tools are hidden from view.

To access the Canvases screen, tap in the Document toolbar at the top of the screen. When you do, the Canvases screen slides up, giving you access to everything you would expect to find in the sidebar on a larger screen. Tap Done in the upper-right corner of the screen to return to your Canvas.

To access the Drawing Tools, tap at the lower-right corner of the screen. When you do, the Drawing Tools slide up along the right side of the screen. Tap to select a tool, or double-tap to make a tool “sticky” so you can use it repeatedly.

Now that you have a good handle on where OmniGraffle differs between screen sizes, it’s time to examine some of the more common features in the interface:

• Above the Canvas is the Document Toolbar.
• Beneath the Canvas are the Drawing Tools.
• To the left (or sliding up as another view on smaller screens) is the Canvases sidebar.

Each of these are discussed in the remainder of this chapter. Now might be a good time to grab your favorite iOS device, open up OmniGraffle, and follow along as we cruise through the rest of the UI.

Using the Document Toolbar

The Document toolbar is found above the Canvas and contains most everything you need to use OmniGraffle:

The buttons and doo-dads in the toolbar include:

1. Tap Documents to close the file you’re working on and return to the Document Browser.

2. Tap to undo the last change; touch and hold to Redo.

3. Tap to synchronize files with a cloud account. (See Adding a Cloud Account.)

4. Double-tap the Document Title to change the name of the file you’re working on.

5. Tap to show and hide the Canvases Sidebar.

6. Tap to make style and property adjustments to the current selection or Canvas.

Using the Drawing Tools

Whenever you want to draw some sort of object on the Canvas—which is pretty much the whole point of using OmniGraffle—you will use the Drawing Tools. As noted earlier, the Drawing Tools are available beneath the Canvas on large-screened iOS devices. To access the Drawing Tools on small-screened iOS devices, just tap . There are five basic buttons in the Drawing Tools bar:

The tools are as follows:

1. Stencils — Tap to choose a stencil to drag to the Canvas. You can search through your available stencils, or search Online for any OmniGraffle stencils hosted on Stenciltown, our free stencil repository.

2. The Selection tool is used to select, move, and resize objects on the Canvas.

3. The Shape tool is used to draw shapes (circles, squares, and so on) on the Canvas.

4. The Freehand tool is used to draw freely on the Canvas. Tap anywhere on the Canvas and drag your finger around to create your own shapes. If the end of the drawing nears the beginning, OmniGraffle will close the shape.

5. The Line tool is used to either connect two objects together with a line, or to draw a free-standing line on the Canvas. If you begin or end your line on a shape, the line automatically attaches to that shape.

6. The Text tool is used to add a text label to objects and lines, or anywhere on the Canvas. Tap an existing label to edit; double-tap to select a word.

The tool buttons take on a different look, depending on whether the tool is inactive, selected, or sticky:

• A tool is inactive when it has a white background:

  

• A tool is selected (or in-use) when it has a light green background:

  

• A tool is sticky when it has a dark green background:

  

  Tools become sticky, or persistent, when you tap its button twice.

When you select the Shape, Freehand, Line, or Text tool, you’ll notice that another button appears to the left of the button. This is known as the tool preview button, because it shows you exactly the type of thing you’re about to draw.

Pressing a tool’s preview button pops open an Info window which reveals details about that tool’s preset options, shows a list of Favorites which you can choose from, and also shows things of that type On This Canvas. You can also create a Custom Style from this window.

Go ahead and try this out:

1. Tap twice; your toolbar should appear as follows:

   

2. Tap the tool preview button to examine the styles, choose another shape, or create a custom style for the shape.

   

3. Tap the circle object under Favorites. You’ll notice that the tool preview button changes to display the circle.

   

Take some time to try out the remaining tools to see which options are available in their respective Info windows.

Using the Point Editing Tool

New in OmniGraffle v2.1 is the Point Editing Tool. You use the Point Editing tool to add, remove and select the points of an object.

Everything you draw in OmniGraffle consists of points. A line, for example, has two points: a start and an end point. A square has four points; one at each corner. The Point Editing Tool gives you the ability to take any object and turn it into something really amazing.

To use the Point Editing Tool, first select an object on the Canvas and then tap in the Drawing Tools bar.

After tapping the Point Editing Tool, you’ll notice that three more buttons appear in the Drawing Tools bar; these are the Add, Remove, and Point Selection tools.

• Point Selection — Tap to select this tool, and then tap and drag a point on an object to distort its shape. (The Point Selection tool is selected by default whenever you tap the Point Editing Tool.

  
  

• Add Point — Tap to highlight this tool, and then tap anywhere on an object’s outline to add a point.

  
  

• Remove Point — Tap to highlight this tool, and then tap a point to remove it from the object.

  
  

When you have finished using the Point Editing Tool, tap Done to continue your work.

The Canvases Sidebar

The Canvases sidebar contains information about your canvases, their layers, the objects that exist on those layers, and the styles applied to groups of objects.

To open and close the Canvases sidebar, tap in the Document toolbar. If you have used OmniGraffle 6 for Mac, you’ll notice that the sidebars look quite similar.

To view and manage your Canvases:

1. Tap Canvases at the top of the sidebar to view your Canvas list.

   

2. To start working on a canvas, select the canvas in the list with a tap.

3. To create a new canvas, tap New Canvas at the bottom of the sidebar.

4. To duplicate the selected canvas, touch and hold on the Canvas name, and then tap Duplicate in the contextual menu.

   

5. To rearrange, delete, or rename the Canvases and layers, tap Edit. Tap the red circles on the left to delete a Canvas or Layer, and use the handles on the right to rearrange them. To edit a Canvas or Layer’s name, double-tap in the name field to select all of the text, and then enter something new. Tap Done when you’ve finished making changes.

   

Working with Layers

Each Canvas starts out with one layer. To add new layers, first select a Canvas’s layer and then tap New Layer at the bottom-left of the sidebar. To work on a particular layer, tap to select the layer you’d like to work on.

To work on a specific layer, tap the layer name in the list. You’ll notice a series of icons to the left of each layer name; let’s run through these:

1. A pencil indicates that the selected layer is editable. If the pencil has a slash through it, that layer is not editable, either because it is locked or its visibility is turned off.

2. To share a layer across multiple canvases, tap the shared layer button; tap again to turn off sharing.

3. To show or hide a layer, tap the layer visibility button. If the eye has a slash through it, that means the layer isn’t visible.

4. Tap the lock to lock or unlock a layer. Locked layers cannot be edited or changed, whereas anything goes with an unlocked layer.

If you need to rearrange or delete layers, tap Edit at the bottom-right of the sidebar. Layers are stacked upon one another on the Canvas—if two layers have overlapping objects, the layer at the top of the list obscures the objects on layers below it in the list.

As with the Canvas, each layer contains its own set of objects. To see everything that’s on a particular layer, first select the layer in the Canvases list, and then tap List at the top of the sidebar to view and manage its objects:

1. To select an object on that layer, tap the object in the list.

2. To delete layer elements, tap the red circle on the left and then tap Delete. If you accidentally tap the red circle but don’t want to delete that object, tap anywhere else in the sidebar.

3. To rearrange layer objects, tap the handle on the right and drag up or down in the list.

4. Tap Styles at the top of the sidebar to filter and select objects by style on the selected layer.

   

   Each style of object has a representation of the object and a pair of numbers. The first number is how many objects you have selected which match that style; the second number is how many objects of that style exist on the canvas.

   Along the bottom of the Styles list, you’ll see a grouping of filter buttons. Use these buttons to control which object styles/types are displayed in the list above. Tap a filter to select all objects that match it. You can then tap to select and modify that grouping of layer objects.

   A white filter button indicates that objects related to that filter are not included; green buttons indicate inclusion. Compounding filters returns objects matching all filters:

   • Tap the fill button to include or exclude objects on the selected layer with with a fill.

   • Tap the stroke button to include or exclude objects on the selected layer with a stroke.

   • Tap the shape button to include or exclude objects on the selected layer of a specified shape.

   • Tap the shadow button to include or exclude objects on the selected layer with a shadow.

   • Tap text button to include or exclude text objects on the selected layer.

Keep these filters in mind for when you need to apply changes to a certain grouping of objects. For example, changing all of the text from Helvetica to Gill Sans, or changing the fill color for all round objects on the layer.

Using the Inspectors

You use the Inspectors to change the style attributes for the objects on the Canvas, or set the properties of the Canvas itself. To access the Inspectors, tap in the Document toolbar.

The Info window has two sections:

• Selected Objects—This section displays the Inspectors that you can use on the selected object(s).

• Canvas—This section displays the Inspectors that are specific to the Canvas alone. Each inspector contains two or more panes, for such things as adding a fill to an object or setting a background image for the illustration you’re working on.

Making Changes to the Canvas

A canvas is a space where you create and manipulate your shapes and other objects. You start off with just one canvas, but you can add as many as you like in the Contents sidebar.

The Canvas section has five different inspectors:

• Canvas Size
• Background
• Units & Scale
• Grid
• Diagram Layout

And if you have purchased the upgrade to OmniGraffle Pro, there is a sixth inspector—Notes. Each of these inspectors are covered in the sections that follow.

Adjusting the Canvas Size

The canvas attributes section has the following elements:

Canvas Name

Change the name of the canvas.

Width

Adjust the width of the canvas.

Height

Adjust the height of the canvas.

Auto-size Canvas

Enable and disable to automatically adjust the canvas size should your shapes go beyond the existing boundaries.

Print on one page

Fit the canvas to the page if its orientation or size differ from the default when printing.

100% Zoom

Choose the display standard that suits your device and task. A canvas measured in screen pixels will render much larger on a non-Retina device; a canvas measured in Apple points will render at equal size across devices; and a canvas measured in PostScript points will match real-world measurements (WYSIWYG).

Coloring the Background of a Canvas

Use the Background inspector to set a background color for the Canvas:

Type

Tap Type to change the style of the background color, choosing from Solid (the default for all included templates), Linear Gradient, Radial Gradient, Double Linear Gradient, Double Radial Gradient, Stipple, Squiggle, Plastic, and Marker. When you select one of the different types, the inspector changes slightly so you can fine-tune background to get the effect you’re after.

Solid Color

Tap Solid Color to choose a solid background color. You can use the defaults in the color palette, or use the HSB, RGB, and Gray slider controls to create custom colors.

Setting the Unit Size and Scaling Options

Tap Units & Scale to choose the unit of measure you’d like to use to describe object dimensions, grid lines, the canvas size, and so on.

Defining Grid Properties

Grid options include:

Snap to grid

Turn this on to show (and have shapes stick to) the gridlines; turn this off and the shapes move fluidly.

Major Grid

Tap the buttons to increase or decrease the grid size; tap the text to type a size.

Minor Grid

Increase or decrease the number of minor steps between major grid lines.

Smart guides

Enable or disable the blue guide lines that help you position and size your objects.

Laying Out Canvas Objects

Use the Diagram Layout inspector to change the flow of objects on the Canvas:

Layout Type

Choose either a Hierarchical or Force Directed layout.

Layout Direction

Use the arrows to change the direction of the layout.

Rank and Separation

Use these to specify the amount of spacing between objects.

To apply these settings, tap Lay out now.

Making Changes to Selected Objects

Customize things to your heart’s content! Start by selecting an object on the Canvas and then use the Selected Objects section of the Info menu to make style and property changes. Only the inspectors applicable to your selection are available. For example:

• When you select Shape and then tap , the available inspectors include: Fill, Stroke, Shadow, Text Position, Font, Geometry, Connections, and Notes.

• When you select a Line and then tap , the available inspectors include: Stroke, Line, Shadow, Connections, and Notes (Pro).

These inspectors are briefly described as follows:

Connections

Adjust how the object reacts in relationship to other objects on the Canvas.

Fill

Choose a solid color or apply a nice gradient. Tap to view fill info.

Font

Customize the font family, typeface, and size of your text.

Geometry

Adjust properties of the object like its location and rotation.

Image

Place an image from your Photos library onto the Canvas or into an existing shape.

Shape

Pick a new shape for your object, including for those you may have created in freehand mode. Tap to view shape info.

Shadow

Add a shadow to your shape. The shadow can appear immediately below the shape or below everything on the layer.

Stroke

Customize the border around your object, or make it disappear. Tap to view stroke info.

Text Position

Adjust the layout of the text with respect to the shape.

Each of these inspectors is described in the sections that follow.

Making Changes to a Fill

Fills are great way to add polish to a shape or canvas. Slide or tap a fill style in the carousel to choose a fill. This might be a solid color, a nice gradient, or nothing at all. Different fill styles reveal different options.

Choose no fill to leave the inside of your shape empty. (Canvases do not have this option because they cannot be see-through.) Any objects behind a shape will be visible.

Choose solid fill to apply a uniform color to the inside of your shape. Tap the color well to choose a color and see more color options.

Choose a linear blend to create a two-color gradient or a double linear blend for a three-color gradient. The colors will appear on the extremes of your shape and blend in the middle.

Choose a radial blend for a two-color, circular gradient or double radial blend for a three-color gradient.

Gradients have a few more options than a solid fill:

1. Tap the color wells to pick a color for each part of your gradient. To swap the colors, tap the swap button between the wells. (The swap button is not present in the double blends.)

2. Drag the slider to move the blend towards one side or the other.

3. Drag the blend rotation wheel to set an angle for the gradient. Tap the cell to type the degree of the angle.

Making Changes to a Stroke

The stroke is the line (or lines) drawn around your object. OmniGraffle has several different strokes for different folks; slide or tap a stroke style in the carousel to choose a stroke for your object.

Choosing no stroke removes the border around your shape. (This is not an option for lines.)

A single stroke will add one line around your object and a double stroke will add two, with a color between them.

Different stroke types have slightly different options:

1. Tap the color well to explore the color options for each part of your gradient. For double strokes, the left color reflects the outer colors of the stroke and the right color sets the inner color.

2. Tap the buttons on either side of the thickness indicator to increase or decrease the stroke’s thickness. Or, just tap the cell to type a value.

3. Slide or tap the dash pattern at the bottom to add dashes to your stroke.

Making Changes to a Line

Lines quickly demonstrate relationships between shapes and other objects but they can also stand alone. Select the line and choose line info to make adjustments.

Tap the segmented control to specify your line as straight, curved, or orthogonal.

To choose an end type, slide or tap to choose from the carousel. The upper carousel changes the head arrow (the start point) and the lower carousel changes the tail arrow (the end point).

Change the corner radius to add rounding or rigidity to the bends of your line. Tap the buttons on either side or tap the cell in the center to define a radius by typing.

Making Changes to a Shape

Shapes are two-dimensional objects you can add to your canvas. Swipe to scroll and peruse the list. They are arranged according to commonality and adjustability.

If you have a shape selected on the canvas, tap another in the list to change its shape.

Adjustable shapes have handles that can be dragged to add or subtract elements from the shape. For example, you can increase or decrease the number of points on the star.

Change the corner radius to add a nice rounding or rigidity to the corners of your shape. To change the corner radius incrementally, tap the buttons on the sides of the cell. Tap in the cell to type a value.

Making Changes to a Shadow

Shadows are a great way to add some depth and texture to your diagram.

1. Tap the segmented control at the top to: remove the shadow from your object; add a shadow immediately beneath the object; or add a shadow below all objects on that layer.

2. If your object has a shadow, tap the color well to change the opacity and explore its color options.

3. Drag the blurriness slider to the left for a sharper shadow or to the right to add blurriness.

4. Drag the shadow position indicator to move the shadow or tap in the cells to type x and y offsets.

Making Changes to the Text Position

The text position section contains settings, for your text, as they relate to shapes and the objects around them.

1. Tap the margin indicator buttons (to the left and right of the cells) to increase or decrease the width or height of the margins for your text object. Tap in a cell to type a value.

2. Tap the left, center, or right buttons (the upper group of segmented controls) to change the justification of the text.

3. Tap the top, center, or bottom buttons (the middle set of segmented controls) to change the vertical position of the text in the shape.

4. Tap the overflow, hide, or resize to fit buttons (the bottom set of segmented controls) to have the text: overflow the shape; be cut off when it does not fit the shape; or to resize the shape to fit the text.

5. Tap the wrap to shape button to constrain the width of the text to that of the shape.

Making Changes to the Font

The font info section is where you can specify the style of text for your label.

1. To view the list of fonts, tap the font family name. Choose a recommended font to ensure readability and commonality or, for fonts of all seasons, scroll to see the full list.

2. To choose a typeface, pick a font family, and tap the typeface option to view a list of typefaces (like bold or italic, for example).

3. To increase or decrease the size of your font, tap the buttons on the left and right of the font size or tap in the center to define a size by typing.

Making Changes to the Geometry

The geometry section is where you can adjust object properties like position, size, and rotation.

1. To change the horizontal position of your object, tap the buttons to the left and right of the horizontal position indicator. Tap the center to define a position by typing.

2. To change the vertical position of your object, tap the buttons to the left and right of the vertical position indicator. Tap the center to define a position by typing.

3. To change the rotation of your object, tap the rotate left and rotate right buttons. The buttons will rotate the object in increments of 15 degrees. Tap the center to define a degree of rotation by typing.

4. To flip an object, tap the vertical or horizontal flip buttons.

5. To change the width of the object, tap the buttons to the left and right of the width Indicator. Tap the center to define a width by typing.

6. To change the height of the object, tap the buttons to the left and right of the height Indicator. Tap the center to define a height by typing.

7. To maintain the ratio between the height and width while making adjustments, turn on maintain aspect ratio. To do so, tap the switch so it is blue and reads on. Tap again to turn off.

8. To maintain the ratio between the content of the object and the object itself, turn on maintain aspect ratio and then tap the scale content switch so it is blue and reads on. Tap again to turn off.

9. If more than one object is selected and the objects have different values, the inspector displays two dashes (–) in place of a value.

Making Changes to Connections

Connections are an attribute of shapes and lines that keep objects in touch. With a shape or a line selected, use connections info to make adjustments.

• With a line selected: tap the Connectable to Objects, Route to Shape Center, and Accept Connections toggles to allow or disallow these connections.

  

• With a shape selected: use the Accept Connections toggle to turn connections on and off. All objects have magnets turned off by default. If you would like to apply magnets to an object, tap No magnets and the options for magnet placement becomes available. Tap one of the options to customize how the connections interact with the shape.

  

  

• With a line, a shape, or a group selected: a combination of the two is presented. Use the groups section to specify whether you’d like to connect to the border or the components.

  

Working with Images

Images have a lot in common with shapes. You can add many of the same properties to them—like a stroke or a shadow, for example. In the image info section, you can make changes to how your image is displayed:

1. Use the segmented control at the top to specify the image layout. When changing the border size of the object that contains the image: choose its natural size; stretch the image to fill the shape; or tile the image within the shape.

2. If your image is not stretched, use the size control to increase or decrease the image’s size with the buttons to the left and right of the control, or use tap in the cell to type a value.

3. Use the opacity slider to create an image you can see through. By default, the image is fully opaque.

4. Tap the Replace Image or Remove Image buttons to swap or remove the image, respectively.

5. You can also adjust properties of the image directly on the canvas. Tap, then tap again to reveal a slider to change the image’s size. If your object’s layout is its natural size, you can tap the image, tap again, and then drag to move the image within the shape.

Exploring the Color Options

OmniGraffle has a plethora of color options for your perusal. Tap a color well (or the more colors button when available) to view palettes based on the work of some people whose choices in color have proved rather successful.

Tap the HSV, RGB, and grayscale buttons to refine:

HSV

Change the hue, saturation, value, and opacity of your selection.

RGB

Change the red, green, and blue values of a color, along with its opacity.

Grayscale

Change the white value of your selection and its opacity.

Drawing Basics

Now that you’ve had a chance to skim through OmniGraffle’s interface and have explored the Document Browser, it’s time to put all of that knowledge to good use. It’s time to create a new document and try some of what you’ve learned.

To create a new document:

1. Go to the Locations screen.
2. Select the folder in which you’d like to store the file.
3. Tap in the toolbar at the top of the screen.
4. Choose a Template from one of the eight pre-installed templates or from one you’ve created or added to OmniGraffle. For the sake of following along, choose the third template in the first row, Autosizing - Pixels.

After choosing the template, OmniGraffle opens a new document (named My Diagram, but you can change that later).

The other buttons in the toolbar include:

• Tap to hide and show the Canvases sidebar on the left. This is where you manage, create, and delete Canvases and Layers in your document.

  

  You can also toggle between List or Styles view, which is really convenient for when you need to make changes to a bunch of like-styled objects. You know, for that one instance when your manager wants you to change the fills from aubergine (#3d0734) to chartreuse (#c1f80a).

• Tap to discover details about the Canvas you are working on. If you have an object selected on the Canvas, this is also where you access the Inspectors.

  

• Tap to open the Stencils library. Use the Stencils library to find and drag objects to the Canvas, or to search Stenciltown online for new stencils.

  

Now that you’ve had a chance to peruse the buttons in the toolbar, it’s time to take the Drawing Tools out for a little test drive.

Adding Shapes

A shape is a two-dimensional object that you add to your canvas. Shapes can be styled with an addition like a nice gradient or color, for example. You can also add a label to a shape. The quickest way to add shapes is to drag from the stencil palette:

1. Tap to select the Shapes tool.

2. With one finger, tap on the Canvas and drag your finger to draw a shape.

   

   As you draw on the Canvas, OmniGraffle displays the dimensions of the shape you are drawing, as well as its x/y position on the Canvas.

If you prefer to use one of the pre-installed stencils, tap in the top bar. This opens a menu from which you can select any stencil. You can either double-tap a stencil to add it to the canvas:

Or you can touch and hold a stencil and then drag it to the canvas:

When you drag a stencil to the canvas, the Stencils menu disappears and blue alignment bars appear to help you position the object on the Canvas. Pink alignment bars help you position the object at the horizontal and vertical centers.

You can also create custom shapes:

1. Tap to activate the Freehand drawing tool. Don’t forget, you can also double-tap on a tool to make it persistent; for example .

2. Use your finger (or your favorite stylus) to draw on the Canvas.

   

You can select and customize your shapes with the Inspectors by tapping the button in the top bar. Here, we’ve selected the “head” for the smiley face and have added a yellow radial fill.

You can also add an image to the Canvas through the Stencils menu:

1. Tap to open the Stencils menu.

2. Tap at the top of the Stencils menu.

   

   If you haven’t already authorized OmniGraffle access to your Photos app, you’ll see the following alert:

   

   To grant OmniGraffle access, double-tap the Home button on your iPad, locate and open the Settings app, then tap Privacy on the left, and then flip the switch for OmniGraffle.

   

   Now double-tap Home again and switch back to OmniGraffle.

3. After tapping , some options slide up from the bottom of the Stencils menu:

   • Tap Take Photo to use the iPad’s camera.
   • Tap Choose Existing to select an image from your Photos library.
   • Tap Use Latest to have OmniGraffle place the last image added to your Photos library.

   

4. If you tap Choose Existing, a Photos pane slides into the menu. From here, you can choose from All Photos on your iPad, or photos that have been Recently Added.

   

5. Finally, scroll through the images and tap the image you would like to add to the Canvas.

   

   The Stencils menu disappears and the image is placed on the Canvas.

   

You can further alter the image with the Inspectors. First select the image, and then tap in the navigation bar. This opens the Inspectors menu, from which you can apply any number of styles and effects to the image.

Connecting Objects with Lines

Connections are lines between objects that often help clarify the relationship between the objects. To create connections between objects:

1. Double-tap so you can draw some objects on the Canvas; a couple rectangular shapes should be good.

   

   Notice the light blue sizing guides along the objects. These appear when you draw similar shapes on the Canvas so you can match their sizes. (Of course, you could just draw one shape, and then Copy and Paste the object using tap and hold gestures.)

2. Tap to make the Line tool active.

3. To draw a line between shapes: drag from one shape to the next.

   

4. To draw an unattached line: drag across the canvas.

   

To adjust the endpoints of the line:

1. Touch and hold an endpoint of your line…

   

   …and then drag it to the new desired location:

   

   Notice how the endpoint snaps onto the leading point of the other line when it gets close.

Adding Labels

Labels are text objects that are attached to shapes and lines, typically used to define an object or the relationship between them.

You can also add standalone blocks of text to the Canvas by using the Text tool (). Such blocks of text are independent from the other objects on the Canvas unless you group them together.

To add a label to a shape, double-tap the shape. The default text, Label appears already highlighted so you can just enter text to give the object a proper name.

When you’ve finished typing, tap the Hide Keyboard button in the lower-right corner of your iPad’s keyboard. If you’re using a Bluetooth keyboard, press Esc to accept the text you’ve entered.

If you ever need to edit a label, all you need to do is double-tap the label to select it, and then make the changes you need. If you need to insert or delete a certain character, you can touch and hold on the text object and then use your fingertip to move the insertion point to another location in the text.

To add a label to a line:

1. Double-tap on a line and a text label appears.

   

2. Enter some text to describe the action related to the line’s direction.

   

3. To adjust the label’s position on the line, tap to open the inspector.

   

   You can:

   • use the Fill inspector to add a background color to the label.
   • use the Text Position inspector to adjust the label’s position and text alignment.
   • use the Font inspector to change the font size, style, and color.
   • use the Geometry inspector to rotate the label if you need to.
   • use the Notes inspector to add additional information about the label or the objects it connects to.

Adding Control Points and Curves to a Line

All forms of drawing begin with a basic line. And while the Line tool makes it easy for you to draw a straight line, there are times when you need to angle or bend a line to get the effect you’re after. For this, you need Control Points. Just as the name implies, a control point gives you more control over the line’s appearance and style.

To add a control point to a line:

1. Tap and select the line.

   

2. Tap to use the Point Editing Tools.

   

3. Tap to choose the Add Point tool, and then tap on the line where you’d like to place a new control point. A little blue diamond appears on the line where you tapped.

   

4. To move a control point along the line, tap to use the Point Selection Tool, and then tap and drag the control point along the canvas.

   

You can add as many control points as you’d like to a line (as long as all of them fit, of course). After adding the control points, you can further change the line’s appearance using the Line inspector.

For example, you can change the line from Straight to Curved to get a wavy line, or you could change it from Straight to Bézier so you can create beautifully curved lines with ease.

For more details about Bézier curves, see Working with Bézier Curves later in this chapter.

Selecting, Resizing, and Moving Objects

Once you’ve added some objects to the Canvas, you may find that you need to move things around to get the right configuration. For this, you will primarily need the Selection tool.

Start by tapping in the Drawing toolbar to make it active.

• To select an object, just tap it.

• To select everything on the Canvas, touch and hold the Canvas for a second or two, and then let go. A contextual menu appears just above where you pressed; tap Select All in the menu.

  

• To select multiple objects on the Canvas, touch and hold on the Canvas (don’t let go!); when the selection indicator appears, drag over the objects you’d like to select.

  

  Alternatively, you can touch and hold an object with one finger, while tapping others with another, to add to your selection one object at a time.

  

• To resize an object (or group of objects):

  • Select the objects you wish to resize.
  • Touch and hold one of the handles, and then drag to resize (either larger or smaller). If the object is a shape or a label, a heads-up display appears on the canvas with the selection’s dimensions.

• To specify a size without dragging, tap the object and use the Geometry inspector to specify height and width. You may also want to turn on the Maintain Aspect Ratio and Scale Contents options at the bottom of the Geometry inspector to ensure that your objects continue to look their best.

  

• To move an object: touch and hold the object, and then drag it around the Canvas until you find an appropriate place for it. If the object has connections, its connecting lines come along for the ride, too.

Making Good Use of the Contextual Menu

When you touch and hold on an object or the Canvas, a black and white contextual menu appears above the thing you’ve touched. This menu, much like the contextual menus you find on your Mac, offers shortcuts for common things you need to do.

If you touch and hold on the Canvas, the contextual menu offers these options:

• Select All selects everything on the Canvas.
• Full Screen hides everything but the Canvas. Choose this option for when you need an unfettered view of your work, or when you want to show off the things you’ve been drawing in OmniGraffle. To get the navigation and drawing tools back, touch and hold on the Canvas, and then choose Exit Full Screen from the menu.
• A third option, Paste appears in the Canvas’s contextual menu if something has been copied or cut to the clipboard.

Options you’ll find in the contextual menu when you select a single object are:

• Cut
• Copy
• Select All
• Paste (if something is already on the clipboard)
• Delete
• Lock/Unlock
• Send to Back
• Make Table (Pro)
• Copy Style
• Full Screen/Exit Full Screen

And finally, if you have multiple objects selected and touch and hold to reveal the contextual menu, you’ll get all of the previous options, plus Group or Ungroup.

Using the contextual menu can save you a lot of time for performing tasks you might otherwise use a keyboard shortcut for when using OmniGraffle on your Mac.

Working with Bézier Curves

OmniGraffle isn’t just for creating flow charts and diagrams; it’s a full-blown illustration app. With a little practice, you can quickly master drawing complex shapes in OmniGraffle. And once you have those beautiful things on your Canvas, you can use the Inspectors to style objects to your liking.

This quick tutorial will show you how to take a basic shape (a triangle) and turn that into a leaf. Just follow along…

1. From your favorite folder, tap to create a new document.

2. Choose the Autosizing - Pixels template.

3. In the navigation bar, tap to open the Stencils menu.

4. Select Shapes.

5. In the listing of Plain shapes, double-tap the triangle shown here to add it to the Canvas:

   

6. Tap anywhere on the Canvas to make the Stencils menu go away.

You now have a lone, right-pointing, triangle on the Canvas. And we’re sure that you’re thinking, “How in the heck am I going to turn that into a leaf?!”. Hang on, we’re getting there.

The next task is to rotate the triangle so it is pointing upward (or relatively so).

1. Pinch to zoom in on the triangle. Your zoom may vary; the point here is to zoom in enough so you can use a two-finger gesture to rotate the object.

   

2. Using two fingers at the same time, touch and hold the triangle. Rotate your fingers slightly. When you see an upward-pointing blue arrow appear, remove one of fingers from the display and then use your other finger to rotate and spin the triangle to the left. You can see the angle of rotation in the Inspector bar; here we’ve set the angle to 285 degrees.

   

   Now we can get down to the business of Béziers. Vive la Béziers!

3. With the triangle selected, tap to use the Point Editing Tools. By selecting the Point Editing Tool, the three points of the triangle now become editable control points. You’re going to convert all three into Bézier curves.

4. Touch and hold the top control point of the triangle. There are a few things that happen rather quickly, so let’s step through them one by one:

   • When you touch and hold on the top control point, a blue diamond animates around the point to isolate that control point; this to let you know you can drag the point around to change the shape of the triangle—but don’t do that, there’s more to be done.

     

   • As you continue to touch and hold the top control point, the blue square changes to a red diamond; this to let you know that you can drag to convert this point into a Bézier point:

     

   • If you continue to touch and hold the top control point, the red diamond changes into a set of blue crosshairs; this to let you know that the control point is temporarily locked into position and you’re free to drag out the Bézier control bar.

     

   • Drag your finger to the right to convert the control point into a Bézier curve. A red Bézier control bar follows your finger as you drag it away from the control point.

     

   As mentioned earlier, all of this happens in the blink of an eye—okay, maybe two blinks—but it’s important to understand what’s happening here. For example, if all you wanted to do was grab a control point and drag it to alter the shape of the triangle, you would just have to wait for the blue triangle to appear over the point.

5. Convert the two remaining control points into Bézier curves. You should have something that looks like this:

   

After converting all of the control points to Béziers, it kinda looks like an egg, but with a little work your freaky little circle will take form. Experiment with the different Bézier points on the circle:

• Drag the Bézier handles in or outward to get the curvature of the leaf just right.

• Double-tap between the existing control points to add more, if needed.

• If you only need to adjust one side of the Bézier, first touch and hold one of the Bézier handles, and then touch and hold* somewhere else on the Canvas with another finger. That extra finger you’ve just added locks the Bézier curve’s control point so you can swing the other finger around to create angular or more oblique curves.

  

• To create a sharp point with a curve on the other side, touch and hold one of the Bézier handles, and then touch and hold with another finger elsewhere on the Canvas to lock the control point. Now, with the finger that controls the Bézier handle, drag that inward to the control point. You’re left with a one-sided Bézier curve.

  

Finally, after a little work and by adding a few more lines, your leaf can look something like this:

Some of the tools and inspectors you’ll need include:

• Use the Connections inspector on the leaf edge to turn off all possible connections. This makes it so you can place the lines for the spine and veins wherever you need them to be.
• Use the Line tool to create the spine and veins.
• Use the Line inspector to remove endpoints from the lines.
• Use the Stroke inspector to vary the point size of the lines.
• Use the Stroke inspector to change the style of the leaf edge to Freehand.
• Use the Fill inspector to apply a double linear gradient to the leaf.
• Use pinch gestures to zoom in and out on the Canvas while placing the spine and veins of the leaf.

And, if you create something really cool that you think other OmniGraffle users could enjoy, don’t forget that you can submit it as a stencil to Stenciltown.

Getting Help

When you’re in need of help—whether you’re trying to figure out how layers work, or if you’re having some other issue with OmniGraffle—it’s good to know that the Support Humans at The Omni Group are always available to lend you a hand.

The OmniGraffle Website

The OmniGraffle website is always a good place to find the latest information about OmniGraffle.

Looking for More Stencils? Visit Stenciltown!

With the release of OmniGraffle 2 for iOS and OmniGraffle 6.1 for Mac, we’ve added a new member to the OmniGraffle family: Stenciltown.

Forums

The Omni Group maintains online forums for all of our products, and you’re invited! Come share your questions and ideas with other users and Omni staff.

Email Support

If you’re stuck, if you have a good idea for the next version of OmniGraffle, or if you just want to let us know how we’re doing, go ahead and send us an email. Choose Help ▸ Send Feedback from the menu bar to conjure up a message addressed to us, or just send us an email with your thoughts. We take support pretty seriously, so you can expect a prompt response actually typed by human hands.

Release Notes

For really meticulously detailed information about what has changed in each minor version of OmniGraffle, check out Help ▸ Release Notes from the menu bar.