Creating a Table of Contents in OmniGraffle with AppleScript

Datum: 19 juli 2010 | Door: | Categorie: Blog, Tools | 25 reacties

Table of Contents in OmniGraffle

Yes, another post in English, especially for all interaction designers out there using OmniGraffle. We are planning a “Tools” section especially for everybody involved in UX. We have a major update of iPrototype on the way and maybe you have missed our OmniGraffle gesture stencil

Most of us use OmniGraffle for making flows and documenting wireframes (documenting, not drawing, but that is another post) and our documents tend to get long, like over 50 pages. A table of contents would be nice, but this button is not in OG…. Since I started using OmniGraffle a few years ago I already was searching the web for a solution, but found nothing really useful until last week. I improved the method and now it is possible to create a ToC in a single click. Great until OmniGraffle 6 comes out (it is in there, right?).

I found this post, from a guy called Joshua Dickens. An AppleScript that automatically generates a TOC from all your canvases. Nice, thanks Josh. I made some improvements to the page numbering. This was not working out for our documents as the order of the canvases in a document has nothing to do with the canvas ID. Also I added some easy configuration and a multiple column layout and of course some oral feedback, as this is the first AppleScript I have written :) .

Can’t wait?

Download the script

What does it do

  • Adding a Table Of Contents of all your canvases to the second canvas of the document based on the Canvas Title
    You can change it to the first or third or every canvas you like. You probably figured out to use “<%Canvas%>” as a canvas title.
  • If the list gets too long (you decide how long it should be) it automatically creates a new column. Ideal for landscape documents, like ours.
  • If you open the document in presentation mode (View > Start Presentation) or export as PDF, the TOC will link to the page. How cool (thanks agian Joshua, that’s his part)

How to use it

Configure

I advice to first change the script so it will fit your page setup and style

  1. Download the script and unzip
  2. Open “Create Table Of Content.scpt” with AppleScript Editor
  3. Change configuration. See the script comments for explanation. The default values are based on our company template, which is probably different from yours.
  4. Open an OmniGraffle document
  5. Create an empty second canvas
  6. Run the script
  7. Tweak configuration

Getting easy access to the script

  1. Open your AppleScript Editor (of course using Launchbar, Quicksilver or spotlight if you will)
  2. Go to preferences, tab general and select “Show script menu in the menu bar” and show computer scripts at the top
  3. Open Omnigraffle (we use OmniGraffle Pro 5.2.3 at the moment)
  4. Click  in the menu bar and select “Open Scripts Folder > Open OmniGraffle Pro Script folder”
  5. Drop your unzipped file in the folder
  6. Restart OmniGraffle

From now on, just do this

  1. Open any OmniGraffle document
  2. Make some space on the second canvas
  3. Run the script using the icon in the menu bar
Joshua Dickens
25 reacties

25 Reacties op “Creating a Table of Contents in OmniGraffle with AppleScript”

  1. Inge zei om 08:48 op 23 juli 2010:

    Works like a charm, love it :)

  2. Omnigraffle Table of Contents Generator | Fuzzy Thoughts zei om 17:02 op 20 augustus 2010:

    [...] Yow! I was going to write up a lovely exposition on the benefits of using this table of contents script, honest! But then, personal stuff happened for me in a big way. For the backstory on that, you can go check out my recently maudlin blog. In the mean time, this script sat and got no better while left to its own devices. And someone else had the same idea for this script! [...]

  3. bravelittlememe zei om 10:03 op 22 september 2010:

    This is absolute genius. You have saved me countless hours of mind-numbing labour. Thank you! (and to the original script author, of course!)

  4. joey zei om 11:41 op 13 oktober 2010:

    Found a need for this, looked for it, first thing we found was this and it works awesome. Thanks, saved us writing one!

  6. Youri zei om 19:29 op 31 oktober 2010:

    I am new to Omnigraffle. I have installed the script an run it on a file with 2 canvases, with their own names, and canvas 2 for the TOC, but nothing comes up. I would appreciate help, since I might create in the future files with more canvases.
    Thank you

  7. Youri zei om 19:31 op 31 oktober 2010:

    Hi, i am new to Omnigraffle. I have run the scrip on a File with 3 canvases, including canvas2 clean, and I get no Table of Contents, although I hear the start and end message.
    Also, Is there any way to export all the text from a canvas?

  8. Matthijs zei om 23:53 op 9 november 2010:

    @Youri, you can send me the file if you don’t mind, so I can check out what is going wrong.

  9. Youri zei om 02:04 op 10 november 2010:

    Hi Matthijs,

    it will not be necessary. It worked. It is simply that I had some more content in Canvas 2 and the table of contents was not easy to see at first glance.
    Thanks for your support. It is indeed a great script. Congratulations!

  10. Dimitri Visser zei om 23:03 op 18 november 2010:

    bad ass! (thx)

  11. yenny zei om 14:58 op 30 november 2010:

    Thanks! This is a great tool which will save me from endless hours of brainless work. Do you have more useful scripts to share? I cannot find anything else in your site but would be awesome!

  12. Brian zei om 17:19 op 6 januari 2011:

    Thanks for the script. Some of my canvasses are more than one page long. Do you know how I can use page numbers instead of canvas numbers. Example scenario: I have an 3-canvas document. Canvas 1 is one page. Canvas 2 is three pages. So I want the TOC to say: [Canvas 1 Title]:Page 1, [Canvas 2 Title]: Page 2, [Canvas 3 Title]: Page 5. I don’t need to repeat the canvas title for the additional pages in Canvas 2. Thanks in advance for your help!

  13. Matthijs zei om 10:25 op 28 januari 2011:

    @yenny Currently working on a “tools” section on our site.

  14. Matthijs zei om 10:27 op 28 januari 2011:

    @brian Mmm, I don’t know about that one. We always try to keep our canvases one page. You can probably tweak the script and replace “page” by “canvas”, but that is just a guess. Let me know if you get any further with this.

  15. andrea zei om 03:06 op 23 maart 2011:

    Wonderful!!
    That was super easy and worked like a charm. Links are great.

  16. Harry zei om 09:42 op 29 april 2011:

    That’s awesome. I still don’t understand why this functionnality is not available on Omingraffle..

  17. Karen zei om 17:31 op 4 mei 2011:

    Worked like a charm! This was so easy and effective. Love it! Thanks so much for figuring this out and posting it.

  18. Joost zei om 15:47 op 31 mei 2011:

    Helemaal blij mee!

  19. axelrod zei om 21:36 op 7 juni 2011:

    Great script – worked perfectly. I’m not an applescripter, but managed to figure out how to change the text color as well if it’s relevant to anyone – define color var…

    set tocFontColor to {0.4, 0.4, 0.4}

    and then drop color:tocFontColor into the ‘text’ calls.

    Thanks for the script.

  20. Shane zei om 23:34 op 19 juli 2011:

    This works like a charm, but as noted in the script, changing the font doesn’t actually change the font. Any ideas on how to get this working? The font I want to use is “Myriad Pro”, wondering if it’s got something to do with the space…

  21. 7 reasons why we love OmniGraffle Pro | Hungry Browser Ltd zei om 10:57 op 20 juli 2011:

    [...] handy all the same) is the ability to create a table of contents. Courtesy of unitid comes the table of contents AppleScript which inserts a table of contents page into your Graffle document (best saved until after you've [...]

  22. 7 reasons why we love OmniGraffle | Hungry Browser Ltd zei om 10:58 op 20 juli 2011:

    [...] handy all the same) is the ability to create a table of contents. Courtesy of unitid comes the table of contents AppleScript which inserts a table of contents page into your Graffle document (best saved until after you've [...]

  23. Jay zei om 16:10 op 20 juli 2011:

    Thanks. This is an awesome script; saved me a bunch of time.

  24. Shane zei om 06:50 op 1 augustus 2011:

    For other people with the font issue I asked about, I’ve found the solution. You can’t use the font name directly for some fonts, because a) it has a space in the name and b) it might have some other features related to to it – light, semibold, etc. Easy way to find what font name you want to use:
    1) Create some text in the font that you want
    2) “Copy As…” in the edit menu and select Applescript
    3) Paste into an empty applescript window. You’ll see somewhere in the text font:”NameOfTheFont-ExtraBits” – that’s the name of the font as Omnigraffle sees it.
    4) Copy and paste that font name into the TOC script, and you’re good to go

    Mathijis, maybe worth putting this into your script or updating the post…

  25. mack zei om 23:57 op 26 september 2011:

    Hi –

    This configures very well, allowing me to create a ToC for a 70pp document in two columns on a single page (9pt Arial Narrow), with a tocHeight of 600.

    But I’m having a persistent problem. When I set tocWidth to 200 (or anything less than the default) the page numbers disappear from the first column, even though they appear correctly for the second column.

    I’ve examined padding, but found no solutions there.

    Can anyone tell me what I am doing wrong?

Reageer