I like to think that one of my more valuable contributions as an Omni employee is providing the lowest common denominator factor in usability testing. That is, when an engineer wants to really understand how a total Cro-Magnon will be using their app, they come to me.

Oh yeah, that’s right. Who’s got two thumbs and represents the most pathetic use case? THIS gal.

Anyway, I thought some of you might be interested in seeing how some of our iPad development work is happening for OmniGraphSketcher. Now obviously we do a lot of mockups in what is surely the world’s best program for creating IA/UX designs, OmniGraffle. But when it comes to envisioning how something works on a piece of hardware no one can actually use yet, a lot of people here are going low-tech to try and figure it out.

Omni’s lead developer for OmniGraphSketcher, Robin, created some iPad-sized paper templates for sketching up ideas.

He didn’t stop there, though. No sir, he most certainly did NOT. Here’s his custom graph paper notebook, which he cut to iPad dimensions using a table saw.

I want to say that’s sort of crazy, except our own CEO Ken Case created a terrifyingly accurate faux iPad using a 3D printer. It—well, it even has a little Omni logo on it. And a 30-pin dock connector. And . . . look, it’s just very, very realistic and I’m a little worried about how much sleep everyone is getting, okay?

Here’s Robin’s own iPad-sized hardware prototype (!) with a variety of UI element ideas designed by our User Experience lead, William Van Hecke.

That’s what Robin had me look at the other day, while asking a series of questions. I’m sure he regretted it almost instantly.

Robin: “So let’s say you want to turn this point from a circle into a square. What would you do?”

Me: “Buhhhhh. Dur. I touch it?”

Robin (soothingly): “Okay. You see a little blue circle around the element. Then what do you do?”

Me: “Uhhhhhrrrr. I’d . . . maybe I’d press real hard. Like this.” *smoosh*

Robin: “Um . . . well, okay. You get a dialogue that says ‘copy’.”

Me: “OH GOD NO THAT’S WRONG ISN’T IT MY HEAD MY HEAD MY HEEAAAD.”

Robin (brisk clap): “Okay then! What say we try this again later.”

Lastly, here’s Robin interacting with his fauxPad.

I think he’s making color adjustments. On a fake, printed-out inspector that Bill made. To the document that is actually just a piece of paper. Man, software development is weird.

Did you know that Photoshop files can be dragged straight into OmniGraffle documents? It’s super true! I’ve been taking this for granted, but it was a lovely surprise when I tried it on a whim and it, yeah, “just worked”.

That one discovery pretty drastically improved my interface design workflow. Before that, having to export to PNG for every change to any graphic in a mockup meant that I didn’t go into Photoshop very often, and I used OmniGraffle to create graphics whenever I could get away with it. Well, OmniGraffle is a superb diagramming app, and it can even hold its own for a lot of graphics work, but it’s not Photoshop. Sometimes you just need those layer styles, shape layers, and masks.

Here’s how I’ve been doing it:

• Working on a mockup in OmniGraffle, realize I need a graphic.
• Switch to Photoshop, create the graphic, and save the file.
• Click and hold on the document icon in the Photoshop window’s title bar, then drag it to the OmniGraffle canvas.
• Take advantage of OmniGraffle’s guides, alignment controls, grouping, tables, and other conveniences to arrange things just right.
• If the graphic needs to change, make the adjustments in Photoshop and save again.
• Just drag the new version right on top of the existing object on the OmniGraffle canvas to replace it.

The screenshot is an actual in-development inspector design for a future Omni product! (With all of its text replaced by neologisms from Finnegans Wake, of course.)