Indexing UI Sketches

January 26th, 2010

For a little while now I’ve been playing with new strategies for indexing my UI sketches so they can be easily found/shared. Rifling through my various notebooks is pretty inefficient, and it also makes it difficult to send designs off to someone for feedback.

Here’s a little video detailing my methodology, which includes, Evernote, and Preview with annotations to get the job done. Would love some feedback on my approach, and to hear about what works for you.

Tweet This

8 Comments to “Indexing UI Sketches”

  • Paper prototyping and indexing/annotating sketches is an ever-evolving process for me too. My latest routine includes scanning in a page of my notebook and pasting portions into Omnigraffle and doing the annotating in there. Scanning is a bit more tedious but I suppose I could just as easily snap a photo and sync it with my laptop, though I prefer working off the high quality scans.

    Annotating in Preview is a nice little touch. I tend to pull things into Omnigraffle only because the rest of our IA work tends to be annotated with it already, but I’ll definitely keep Preview top of mind next time I need to do something quick.

    Thanks for sharing your process!

    • Nice Verne. I’m a big fan of Omnigraffle myself, but I usually end up reserving it for further along in the process. I think I wound up landing on this Evernote/Preview combo largely because it’s so quick – if it wasn’t I’d end up abandoning it before long.

      As odd as it may sound, I actually really like that the images aren’t super hi-res because it discourages me from going into too much detail. With hi-res, I tend to spend more time on detail then I should at the early sketching phase, which prevents me from rapidly iterating to the best possible UI.

  • I’ve been using Evernote for about a year and bit now, mostly for storing important documents (business expenses, to-dos, etc), but never touched on storing sketches and notes.

    Also, I should start using the Annotate function alot more; admittedly, I’ve never used it, even though I use Preview on a daily (if not hourly) basis.

    Thanks for sharing this Adam.

  • Great tip – I’ll definitely try this out, thx!

    Just wondering – will the annotated version be saved back to Evernote, eg. with the image itself?
    I’d love to be able to pull a sketch up on my phone with all the annotations there..!?

    Thx again.

    • Hey Casper,

      Yes, once the annotated image is saved in Preview, it’ll update in Evernote on your desktop, which will then sync to your phone. Very handy :)

  • Nice tip! I’ve found another iPhone app to be useful in clearing the background and glare and other issues of such snaps. Qipit White. I’m not affiliated but I got the demo from the CEO, and I like and use it. As their site says (I removed marketing blah) “Qipit White [...] create(s) a clear ink-on-white copy by removing shadows, glare and other digital distortions…”. http://qipit.com

    Cheers, NickW

Leave a Reply