You can add as many cloud accounts as you’d like. For example, you could add cloud accounts for personal- or work-use, a group-accessible account for your UX team...pretty much whatever you need. The only real limitation is the amount of available storage space on each device.

This chapter opens up the clouds by showing you how to create and connect to Omni Sync Server via OmniGraffle’s built-in OmniPresence. From there, you’ll learn how to connect to other Cloud Storage Providers using a new service that allows you to connect to iCloud Drive, Box, Dropbox, and more.

Whenever you make a change to a file, the file in the cloud is updated when OmniGraffle performs its next sync operation. Of course, this assumes your iOS device is connected to the Internet. And if you aren’t, those changes will sync the next time you are.

Another benefit of storing files in the cloud is that, if you lose or misplace your iOS device, your documents are safe and secure on your cloud provider’s server. All you need to do to access your files is log in to your cloud account, change your password, sync the files with your new iPhone or iPad, and then you’re back in business.

And while most cloud services—including Omni Sync Server—maintain backups, you shouldn’t trust that your cloud provider will be able to help you out in a pinch. Just because you are storing your files in the cloud doesn’t absolve you from backing up your files—you totally should maintain backups of all your stuff! Be sure to regularly backup your iOS device (either to iCloud or to your Mac), and maintain a regular backup schedule for your Mac, too.

• Omni Sync Server, which is a bank of servers we maintain so you can store files in the cloud. OmniPresence is built into our iOS apps (there’s a desktop app for your Mac, too), so there’s nothing additional to download. All you need to do is sign up for a free Omni Sync Server account.
• WebDAV Connectivity is a hook we provide in OmniPresence so users who wish to maintain their own server can store and sync files. You can connect to your own WebDAV server, a third-party service that you trust, or you can even set up a WebDAV service on your local network using WebDAVNav Server.

Now that you know your choice of paths for using OmniPresence, let’s show you how to set them up in OmniGraffle.

sync.omnigroup.com

Just go to that page, enter your email address, and click Sign Up. We’ll send you an email with instructions on how to set up your Omni Sync Server account.

When everything is ready to go with your Omni Sync Server account, return to the Locations screen in OmniGraffle and then follow along.

1. To start syncing to Omni Sync Server, start on the Locations screen and tap Add OmniPresence Account.

   

2. Next, choose the type of cloud account you would like to use; you can choose between Add Omni Sync Server Account or Add WebDAV Server. The difference between the two is that we host and maintain Omni Sync Server, whereas you would need to find a third-party WebDAV server (or host your own) and entrust them to maintain the server.

   Tap Add Omni Sync Server Account.

   

3. On the Account Info screen that appears:

   1. Enter your Account Name
   2. Enter the Password for your account
   3. Optionally, enter a Nickname to be used as the name for your synced folder
   4. Tap Save to authenticate with Omni Sync Server

   

The next message you’ll see is Testing Server for Compatibility along with a progress bar. If everything checks out okay, OmniGraffle lets you know that it has successfully connected to Omni Sync Server.

When your credentials have authenticated, you’re taken back to OmniGraffle’s Locations screen where you’ll see a new folder for your synced files.

To access the files within a document folder, just tap the folder of your choice, and then tap the file you would like to work on.

1. Enter the URL for the Location of your WebDAV Server
2. Enter your Account Name
3. Enter the Password for your account
4. Optionally, enter a Nickname to be used as the name for your synced folder
5. Tap Save to authenticate with the WebDAV server

As with connecting to Omni Sync Server, OmniGraffle informs you that it is Testing Server for Compatibility, and displays the Connected screen when it has connected to the WebDAV server successfully.

Keep an eye on this icon to monitor OmniPresence’s sync status:

• — denotes that OmniPresence is active and ready to sync files to the server.
• — denotes that a sync is currently in progress.
• — denotes that your iOS device does not have access to an active Wi-Fi or cellular network.
• — denotes that there was an error when trying to sync your files. You may see this icon if someone else is working on the same file, or if a connection cannot be made to the sync server you are using. Try tapping the OmniPresence icon again and if you get the same error icon, please contact our Support Humans for assistance.

OmniPresence checks in with your active sync servers every minute or so, and saves any updates you’ve made to the server. OmniPresence also saves a version of your file to the server whenever you close a file or switch from OmniGraffle to another app on your device. Alternately, you can tap the OmniPresence icon to force an update to the server at any time.

• Omni Sync Server (via OmniPresence)
• iCloud Drive
• Box
• Dropbox
• Google Drive
• OneDrive
• and more!

1. Tap Use Cloud Storage Providers

   

2. Tap the switch next to Use Cloud Storage Providers to turn on the service

   

The switch turns green to let you know that the Cloud Storage Providers service has been turned on. Tap Settings and then Done to close the windows and return to the Local Documents folder.

If you tap Locations in the toolbar, you’re taken back to the Locations screen, where you’ll now see an Other Documents folder; this is where you access files you store in the cloud.

With Cloud Storage Providers turned on in OmniGraffle, there’s one more switch you’ll need to flip if you want to use iCloud Drive from Apple. Let’s do that next.

In the list of apps that use iCloud Drive, make sure that the switch next to OmniGraffle is also On. This allows OmniGraffle to open and save files stored on iCloud Drive.

Let’s assume that you have a file in your Local Documents folder that you’d like to store on Dropbox instead. Here’s what you need to do:

1. In the toolbar, tap Select. This lets you choose files in a folder so you can do something with them.
2. Locate the file that you want to move to Dropbox, and then tap to select it. When you select the file, a blue border is placed around the file icon to indicate that it’s ready for action.

   

3. In the toolbar, tap to open the Sharing menu.

   

4. In the Sharing menu, tap Export to....
5. Choose the file format that you would like to save the document to. You can choose from OmniGraffle, PDF, PNG, or OmniOutliner, depending on your needs.

   

6. Tap Locations to open the Cloud Storage Providers’ menu, and then tap to choose Dropbox as the storage location.

   

7. After you choose the cloud service, the window changes to show you the files and folders for your account on that service. Choose a Save Location and then tap Save to... at the bottom of the window.

   

When you export a file to one of the Cloud Storage Providers, the file you exported also remains in its original location. So, if you exported a file from Local Documents to Dropbox, that file is now in two places. If you want to continue working on the file while it’s stored on Dropbox, you might consider deleting the copy stored in Local Documents just to avoid confusion.

For example, to open a file that resides on iCloud Drive, follow these steps:

1. On the Locations screen, tap Other Documents.

   

2. In the toolbar, tap to add a document stored on iCloud Drive (or another service) to the Other Documents folder.

   By default, the file chooser reveals the files available on iCloud Drive. (If the file is on another cloud service, tap Locations, and then tap to choose your cloud provider.)

   

3. Locate the file you want to work on, and then tap to choose and add the file to the Other Documents folder on your device.

   

4. Finally, tap to open the file in OmniGraffle.

When you Open a file that’s stored on iCloud Drive, the file remains on iCloud Drive while you are making changes. When you close the file (by tapping Documents in the toolbar), the changes are saved to the file on iCloud Drive.

• Do you leave them in the Other Documents folder?
• Or do you remove them from your device?

There’s nothing wrong with leaving files there, especially if you have more work to do to your diagram. Files that you add to the Other Documents folder are shadow files of the original in the cloud. The two are linked for the purpose of synchronizing the changes you make, with the file in the cloud as the “one true source”.

Optionally, you can remove the file from the Other Documents folder. If you need to work on the file again, you can always add it back to your device. Removing the file from the Other Documents folder does not delete the file from iCloud Drive—your file is safe and secure in the cloud—it just removes the file from your device.

To delete a file from the Other Documents folder:

1. In the toolbar, tap Select.
2. Tap to choose the file (or files) you’d like to delete.
3. Tap in the toolbar, and then tap Remove Document.

Files you remove from the Other Documents folder just disappear; they are not moved into a Trash folder. This is because files added to the Other Documents folder are just shadow files (for lack of a better term) of the actual files stored in the cloud.

A quicker way to do this is to swipe left across the account name to bring up the Delete button. If you change your mind before deleting the account, tap Done and the Delete button goes away.

This chapter provides you with an overview of OmniGraffle’s Document Browser, and shows you how to manage the files you create. You’ll learn how to create subfolders, move files around between the Local Documents folder and a folder in the cloud, as well as sharing and trashing files that you no longer need.

Let’s go!

Tap Local Documents to see what’s inside this folder:

If you swipe down while viewing the contents of a folder, you’ll discover the super secret Document Organizer. By default, OmniGraffle sorts your files by the date created and displays any OmniGraffle diagrams in that folder. You can opt to sort by Title instead, or view the available Stencils or Templates.

Tap Show stencils to see the available stencil collections included with OmniGraffle. For an example of how to use the stencils, see Drawing Basics.

Tap Show templates to see the available templates. Take some time to scroll through the list of templates to see the types of document styles available to you. When you’ve finished, tap on Show diagrams. To hide the Document Organizer, swipe up.

Let’s examine these items:

1. Locations: Tapping here takes you backwards in the folder hierarchy, eventually landing you on the Locations screen.
2. Current Folder: In the center of the navigation bar, you’ll see the name of the current folder.
3. Document Type: As you saw earlier, swiping down within the Document Browser reveals the Document Organizer. If the organizer is set to Show outlines, the text shown here is “Outlines”; if the organizer is set to Show templates, the text here is “Templates”.

   Note
   When in portrait mode on iPhone, the Current Folder and Document Type appear beneath the navigation bar, and above the files within that folder.

   

4. (New Diagram/Template): Tap the plus-sign button to create a new diagram, template, or stencil.
5. (Application Menu): Tap the Gear icon represents the Application Menu.

   If you haven’t upgraded to OmniGraffle Pro, you’ll see two additional options in the Application Menu: Try Pro Features and Upgrade to Pro. The upgrade to OmniGraffle Pro is available via in-app purchase, and we’ve built in the Try Pro Features option so you can take OmniGraffle Pro for a spin before deciding whether you need the upgrade.

   

   After upgrading to OmniGraffle Pro, the Application Menu changes to the following:

   

   You’ll also receive a nice little message from us, thanking you for upgrading to Pro:

   

   • About OmniGraffle: Discover details about the build of OmniGraffle installed on your device, and details for contacting The Omni Group.
   • OmniGraffle Help: Get access to the online help and EPUB manual for how to use OmniGraffle.
   • Contact Omni: Tap this item to send us an email. We preload the Subject line of the message with details about your build of OmniGraffle, that way we are better able to assist you when you contact us.
   • Release Notes: Find out what’s new with the latest build of OmniGraffle.
   • Restore Sample Diagrams: You can delete the sample diagrams if you would like to free up some storage space on your device. However, if you later decide that you need one of those sample files back, tap here to view the list of available diagrams and then choose which one you would like to restore.
   • Try Pro Features: Choosing this menu option opens a window within OmniGraffle so you can try out OmniGraffle Pro’s features before purchasing the upgrade. (This option is only available if you haven’t purchased the upgrade to OmniGraffle 2 Pro.)
   • Upgrade to Pro: Choosing this menu option takes you through the process of purchasing the Pro upgrade. (This option is only available if you haven’t purchased the upgrade to OmniGraffle 2 Pro.)
   • Copy from WebDAV: Tap here to import files stored in a WebDAV service.
   • Copy from...: You will only see this option if you have turned on the feature, Use Cloud Storage Providers, in the Settings menu.
   • Settings: Use this screen to customize OmniGraffle’s Settings. You can choose to Send Anonymous Data to Omni, and you can opt to turn on the service that provides access to Cloud Storage Providers, such as iCloud Drive, Box, Dropbox, and more.

     

6. Select: The final option, Select is the most-used item in the navigation bar. Tapping Select allows you to choose files so you can do other things with them, such as move them from one folder to another, email a file to a coworker, or duplicate a file.

When you tap Select, the navigation bar turns into an Action Bar. At first, the buttons you see in the Action Bar are disabled (as noted by their gray color), but when you tap to select a file, those buttons become active (changing from gray to blue).

The following buttons relate to the actions you can perform on a selected file:

1. Tap to share and export files.
2. Tap to move files between folders or to create a new subfolder.
3. Tap to make a copy of the selected file.
4. Tap to move the selected file to the Trash folder.

These functions are described more in-depth in the sections that follow.

When you open a folder, such as your Local Documents folder, tap Select in the navigation bar, and then select the file (or files) that you want to share. This places a blue highlight around the file to let you know which files you’ve selected to do something with.

Now tap the Share button in the navigation bar and select from one of the following options:

• Send via Mail — lets you choose a document format for the file you want to email, and then queues up an email message for your to send.

• Export to WebDAV — lets you move the file over to a WebDAV share. If you haven’t already configured a WebDAV account, you’ll need to do that before you can export the file.

• Export to... — is only available in this menu if you have turned on the feature, Use Cloud Storage Providers in OmniGraffle’s Settings.

• Send to App — lets you open the file in a compatible app on your iPad, or, if you are on a Wi-Fi network with someone you know, you can share the file with another iOS 8 device or Mac using AirDrop.

  

  First choose a Format, and then choose an app on your device that you would like to send the file to. Optionally, you can also send the file to another person via AirDrop.

  

• Copy as Image — Copy the contents of the currently selected OmniGraffle file as an image. This allows you to then paste the image into another document.
• Send to Photos — Instantly export a version of the OmniGraffle document as an image and save it to the Photos app on your device.
• Print (Landscape/Portrait) — If you have an AirPrint-compatible printer on your Wi-Fi network, you can print the selected OmniGraffle file. The orientation of how the document is printed, however, is based on how you are holding your iOS device.

  The initial print screen allows you to choose a printer and set the number of copies of the document you would like to print. If you haven’t previously set a default printer for OmniGraffle to use, tap Select Printer.

  

  After tapping Select Printer, choose a printer on your network, and then tap Printer Options in the navigation bar to return to the previous screen.

  

  With a printer now selected, tap Print to print the file.

Tap New folder to create a new folder containing the selected file. The file is moved out of the current folder into a new Untitled subfolder. Enter a new name for the folder and tap Done.

Subfolders have a dark gray background and show mini icons for the files contained within.

To open a file within a subfolder, tap the folder to open it, and then tap the file.

When you remove all of the files from a folder, either by moving them to the trash or to another folder, that folder disappears automatically. The exception to this rule, however, is the Local Documents folder and the root folder for any Omni Sync Server accounts or WebDAV servers which you have added as Cloud Accounts. Those are the only folders that can remain empty on your device.

Regardless of how you decide to organize your folders, you’ll inevitably get to a point where you want to move files between the folders you have created. Or, you may decide that you want to free up the storage space on your iPad or iPhone and shift all of your files from the Local Documents folder to a folder on Omni Sync Server.

To move files from one folder to another, follow these steps:

1. In the navigation bar, tap Select

   

2. Tap to select the files you want to move. When you select a file, a blue border appears around the file. If you tap a file by mistake, just tap it again to deselect that file.

   

3. In the navigation bar, tap to open the Folder menu.
4. Tap Move to to move the selected file to another location.

   

5. In the Folder menu, tap the name of the folder to which you want to move the selected file. If you see a ❯ symbol to the right of a folder name, that means the folder has subfolders within.

   

   After you select the folder, the file makes the jump from the current folder to the folder you’ve chosen.

6. Tap Done when you have finished moving files out of the current folder.

Need to move more files around? Go back to the Locations screen, tap to open another folder, and then repeat the aforementioned steps.

1. Tap Select and then tap to select the file you’d like to copy:

   

2. In the Action Bar, tap . OmniGraffle makes a copy of the selected file and places it next to the original, adding a number to the filename; for example, a copy of Pretty Flowers would be named Pretty Flowers 2.

   

3. After copying the file, chances are that you will want to rename that file to something more unique and fitting of its purpose. Start by tapping the filename of the file icon. The keyboard on your device comes into view so you can edit the filename. You can also tap the × to clear out the old title before you start entering a new title.

   

4. When you have finished entering the new filename, tap Done to accept the name.

   

Fortunately, deleting files from OmniGraffle is pretty easy. When viewing a folder of documents, tap Select in the navigation bar at the top of the screen. Then tap on the document you’d like to delete; you’ll see that the file now has a blue highlight around it.

Tap the Trash icon in the navigation bar to move the document to the Trash.

If you tap Locations in the navigation bar, you’ll see a Trash folder in your list of OmniGraffle folders. Right now, the file is still on your device, it’s just inside the Trash folder.

Tap to open the Trash folder.

Finally, if you really are sure that you no longer need this file, you have a couple options for emptying the trash:

• Tap Empty Trash at the bottom of the screen to permanently remove all of the files in the Trash folder.

  

• If you have multiple files in the Trash but you think you might not want to get rid of all of them just yet, you can select the only the files you know need trashing. Tap Select in the Action Bar, and then tap to select the files you want to delete. Next, tap (shred), and then tap Delete Document at the bottom of the screen to delete the selected file.

  

The difference here is that tapping Delete Document only deletes selected files whereas tapping Empty Trash deletes everything in the Trash folder, regardless of whether any files have been selected.

Now that you have a firm grasp on how to use the Document Browser, it’s time to expand your horizons and start working on your first OmniGraffle document.

Before moving on, though, take some time to practice moving and copying files, and try creating a few subfolders to organize your files. It’s also worth noting that you can move a file out of the Trash and back into another folder, so go ahead and try that after duplicating one of the templates.

Catch you in the next chapter.

But beneath OmniGraffle for iOS’s hood lies a sophisticated and extremely powerful layer of custom gestures. Gestures for things like switching between Canvases or layers, grouping and ungrouping, heck, even for converting text objects on the Canvas into labels, and for decoupling them.

This chapter introduces you to all of the gestures that we’ve built into OmniGraffle 2 for iOS. In total, there are over 20. So sit back with your iPad or iPhone (because, hey, OmniGraffle is now universal for iOS!) and get ready to try some of these out.

That finger you tap and hold with is known as your primary finger, since it’s the one that initiates further actions. Whenever you see the following image in this chapter, it refers to a tap and hold gesture:

• Swipe with one finger: Nudge the object along the minor grid.
• Drag with two fingers up or down: Move forward or back in the object stack.
• Tap another object: Add or remove that object to the selection. This is helpful when you need to select multiple, noncontiguous objects on the canvas.
• Tap canvas with two fingers: Duplicate
• While dragging, add a finger to a different shape: Alignment guides extend from the second object so you can align the dragged object to that shape.
• While dragging, add finger anywhere else: Reverse Grid Swapping

• Swipe with one finger up or down: Switch canvases; the document must have more than one canvas.
• Tap with two fingers: Paste the copied object where the two fingers touch.
• Drag: Drag to select multiple objects on the canvas.

• Once secondary gestures are enabled, they stay enabled as long as your primary finger stays down.
• When you tap and hold (either on an object or the canvas), there’s a slight delay (approximately 300 milliseconds) from when OmniGraffle recognizes your hold before you can perform a secondary gesture.
• If you tap and hold (either on an object or the canvas) and then lift that finger without performing a secondary gesture, a contextual menu appears.

And sure, you’re probably thinking “How is just selecting an object powerful?”. It’s not so much what you do at that exact moment—with the thing you’ve selected—it’s what comes next that can make you smile or save you a lot of time. Either way, you’re going to smile.

This section covers some of the more “familiar” iOS gestures when applied to their use in OmniGraffle.

Drag-Select

Tap on the canvas and drag your finger to highlight the objects you want to select.

This method is best used when you need to select multiple objects that are in close proximity to each other.

Multi-Select

Tap and hold to select the first object.

Using another finger (either on the same hand or with your other hand), tap to select additional objects.

This method is best used when you need to select various objects on the canvas that aren’t right next to each other.

• Tap to select and then drag the object to where you’d like it to be. Use the alignment guides to line up objects with one another.

  

• For precise control over an object’s position, tap to select the object, and then open the Geometry inspector and use the x/y Position meters to reposition the object.

  

• Pinch to Zoom In

  

• Pinch to Zoom Out

  

• Tap and drag an object handle.

  

• To proportionally resize an object, tap and drag on a handle, but follow along the dashed blue line to scale the object.

  

1. Press an Object until the light blue box appears around the object.
2. Press and hold on the canvas with another finger—be sure not to press and hold on the same or another object on the canvas.
3. With first finger, move the object. The object now has a set of crosshair grid lines within, which indicates the object moves along an invisible grid in increments rather than freely.

   

   

1. Tap and hold on an object
2. With a second finger, swipe up, down, left, or right to nudge the object in that direction (nudged objects abide by the Grid settings).

As you double-swipe up or down, you’ll see a message just beneath the toolbar which indicates whether the object has been moved forward or backward.

To bring an object forward in a stack of objects:

1. Tap and hold on an object with one finger
2. Swipe up with two fingers to move the object to the front of any other objects on the same layer.

   

   

To send an object backward in a stack of objects:

1. Tap and hold on an object with one finger
2. Swipe down with two fingers to move the object to the front of any other objects on the same layer.

   

   

1. Tap once on the object

   

2. Press and hold on the object for a second or two and then release; the Context menu appears above the object.

   

When you release your finger from the object, a contextual menu appears directly above the object you selected:

If you tap the arrow at the right edge of the contextual menu, you’ll find a couple more options for working with objects:

The easy way to copy and paste objects on the canvas is:

1. Tap and hold the object you would like to duplicate
2. With your other hand, tap with two fingers where you would like the copied object to be pasted.

Notice the little Duplicate message that appears onscreen momentarily after you paste the object.

All you need to do is swipe in the direction you’d like to move the Canvas.

1. Press and hold on the Canvas.
2. Swipe up or down to move through the different canvases in your document.

   

When you switch between canvases, OmniGraffle places a little notification onscreen to let you know when you have switched to the Previous Canvas or Next Canvas.

The same gesture (swiping in from the left) performs both actions.

OmniGraffle has a few, very unique, gestures just for working with lines and labels.

1. Draw two objects on the Canvas

   

2. Choose the Line tool:
3. Tap and drag from one object to another to connect them with a line.

   

• Double-tap an Object to add a label within the Object
• Double-tap a line to add a label to the line
• Double-tap the Canvas to add a text label on the canvas

1. Touch and hold the text object.

   

   

2. Tap the line, and the text object moves from its current location on the canvas and becomes that line’s label.

   

   

1. Touch and hold the text label.

   

2. Tap anywhere else on the canvas.

   

The label still looks like it’s attached to the line, but you can tap and drag the text object to another location or delete it entirely.

1. Touch the object with two fingers; a box appears above the object indicating its current rotation angle.
2. Spin one or both fingers to rotate the object.

   

   

As you twist your fingers, the object rotates on the canvas while the angle indicator updates to show you the present angle.

With all of these gestures, you’ll first need to tap one of the drawing tools: , , or .

To draw a shape on the canvas, follow these steps:

1. In the toolbar at the bottom of the screen, tap to select the Shape tool

   

2. After selecting the Shape tool, the Shape Selection tool becomes available beneath the canvas; tap this to open the Shape Tool.

   

3. You can choose from one of the shapes currently on the canvas or from one of your Favorites, or you can tap Custom Style to choose from an array of Shapes we’ve built into OmniGraffle. In this case, tap Custom Style to see what’s available:

   

4. Choose the desired shape that you want to draw on the canvas:

   

5. Finally, tap and drag your finger on the Canvas to draw the shape:

   

1. In the toolbar, tap the Freehand tool to make it active:

   

2. If you tap the Freehand Selection Tool , you can choose from a default set of favorite styles, or you can tap Custom Style to adjust the Fill and Stroke:

   

   

   

   

3. The last thing you might want to do before you start drawing is to turn off Accept Connections for the objects you draw. This makes it easier for you to draw without the lines trying to connect to other objects on the canvas.

   

   

With the Fill and Stroke set to your liking, you can finally start drawing. The following image consists of just two shapes: the stigma and a single pedal. Once the pedal was the desired shape, it was copied and pasted a bunch of times, rotated, and then each was moved forward or backward in the object stack.

To learn more about drawing in OmniGraffle, see Drawing Basics, later in this book. Also in that chapter, be sure to check out the Working with Bézier Curves section.

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.

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.

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).

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.

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.

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.

• 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.

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.

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.

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.

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.

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.

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.

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.

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.

• 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.

  

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.

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.

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.