Diagramming the night away

What are we calling ourselves this month? UI designer, information architect, usability specialist? I’m not sure the correct term anymore.

Regardless of title, tonight I’ve come to terms with one of the tasks I dread usually…creating usage scenarios.

In the past after coming up with my personas and getting into their heads I would write out a little story as suggested in The Inmates Are Running The Asylum.

One of the problems I’ve found with that approach is that it doesn’t break down the process into nice chunks that are easy to digest when designing or coding.

Full blown process diagrams are equally dreadful, and only useful mostly to programmers, which I only play a third of the time (the other 2/3 being shared equally between entrepreneur and designer).

Doing a little searching I came across this interaction modeling article which I found pretty interesting and easy to understand. (Definitely a plus when running on a few hours of sleep…)

Unfortunately I didn’t have a program like Visio on my laptop to craft such a diagram as described in the article…Not like I’m a huge fan of the program in the first place.

Enter OmniGraffle...For me, this is definitely the way to go when faced with the challenge of diagramming something. (OS X only, sorry XP people…)

Everything seems to be laid out logically and nothing is too complicated, as I’ve complained Visio can be at times.

Cashboard usage scenarios

Yes, I relentlessly bit their demo style for my Cashboard scenario diagram, complete with gradients and all. But look it’s so shiny, so easy on the eyes.

For me, looking at something like this engages me more than a boring black and white diagram or a page full of text. On top of that, it’s extremely easy to pick out items I need to take action on during the design and coding phases of a project.

I’ve broken it down into five categories…
  • Actions by a user (blue gradient rectangles)
  • Actions that map to another diagram (green rectangles)
  • Actions the system takes (aqua rectangles with white text)
  • Decisions (diamonds)
  • Thought processes or actions that don’t happen in the system (rounded rectangles)

If I’m wearing my designer or coder hat it’s easy to pick out the things that matter to me, while still maintaining an overall view of the process in question.

Of course this isn’t as detailed as it could be, but I use this to create larger task lists later on. Just going through the process of creating a document like this always seems to crystallize my thoughts on a specific part of an application’s design.

Take that user stories…

seth, Sat, 30 Dec 2006 10:44:00 GMT
no comments