OmniGraffle tips

[Allison Bloodworth]

Hi there,

Since much of the Fluid design team (and likely other folks out there  
on this list!) is now using OmniGraffle for our wireframes and  
storyboards and there are others who are new to the program, like me,  
I thought I'd share some advice and tips on things I've learned.

SHARED LAYERS are great for including the unchanging application  
background on all your mock-ups. Create it by going to Edit -> Layers - 
 > New Shared Layer. Then if a change is needed to the background, you  
can change it on all your mockups at once by changing the shared layer.

INSPECTORS, which usually allow you to set properties on visual  
elements, are your friend. Get familiar with all the different options  
in the inspectors. There are multiple different sections in each  
inspector, represented by a button right under the inspector name. If  
have a small screen, it's helpful to use two screens when working in  
OmniGraffle so you can put the inspectors in one screen and your  
working canvas in another. You can also pull them apart and just put  
relevant ones you are working with on the screen with your working  
canvas.

TURN OFF SNAP TO GRID IN THE "CANVAS: GRID" INSPECTOR if you want to  
be able to move things smaller distances. This drove me crazy before I  
figured out how to turn it off.

THE |->, |<->|, etc. FIELDS right at the top of your working canvas  
can also help you move things right and left, up and down, and expand  
or contract the width of an element. I used this for small movements  
before I turned off "snap to grid."

EXPORTING ENTIRE DOCUMENT - If you've created several canvases in one  
OmniGraffle document you can turn them all into JPEGs at once by going  
to File -> Export and then changing the "Export Area" drop-down to  
"Entire Document." "All Objects" is also a helpful option, as it seems  
to remove any whitespace around your drawing (but only exports one  
canvas, not all of them). Since you can't use this option with "Entire  
Document," you may have to select all your canvases and you can go  
into the "CANVAS: SIZE" INSPECTOR and manually adjust the size. I  
tried to use the "Auto-adjust the canvas size," setting in that  
inspector, but it unfortunately didn't seem to work for me...perhaps  
because my drawing was below some minimum size. But that's another  
thing to try.

STENCILS - Here are some great stencils folks have suggested:
* Yahoo Design Stencil Kit: http://developer.yahoo.com/ypatterns/wireframes/
* Mac OSX Stencils on Graffletopia (which has a TON of other  
stencils): http://graffletopia.com/stencils/44
* Wireframe Shapes Angeles : http://graffletopia.com/stencils/42
* UCD Activities & UCD Deliverables: http://www.userfocus.co.uk/resources/omnigraffle.html
* Sakai: http://confluence.sakaiproject.org/confluence/display/ENC/Style+Guide+OmniGraffle+Stencil

If others have OmniGraffle tips to share, I'd love to hear them! :)

Cheers,
Allison

Allison Bloodworth
Senior User Interaction Designer
Educational Technology Services
University of California, Berkeley
(415) 377-8243
abloodworth at berkeley.edu