My site got hacked — fortunately in a way that wasn’t visible to visitors — so I upgraded my site to the latest WordPress release. This is the first time in my long relationship with WordPress that I’ve been unhappy with an upgrade: the dashboard is really hard to use. Buttons don’t look like buttons; there are so many links and options on every screen; some links are underlined, others are not; some elements stretch across the browser window, others are fixed-width; there’s too much contrast between certain elements, and not enough contrast between others.

The experience, sad to say, is approaching Vista-like proportions — in this case, though, I don’t have a stable, secure XP to fall back on.

Given the proclivity to make everything in WordPress configurable and skinnable, I wouldn’t be surprised to see “Dashboard themes” in a future version. I also wouldn’t be surprised to see a far simpler upstart blogging engine start to chip at WordPress’s market share.

Below, find a link to download my revision of Niklas Wolkert’s “sketchy” Visio prototyping shapes that are included in Henrik Olsen’s GUUUI Web Prototyping Tool. These shapes have made mocking up a web UI much easier, and the hand-drawn style makes it very clear to stakeholders that “this is not yet working software.” My typographical and usability improvements include:

• Got rid of heinous Comic Sans typeface. I use Calibri except in the form elements, which use Consolas.
• Changed text spacing on all text block items. Almost every text element has zero spacing, so it can be placed more precisely.
• Made left margin consistent between check boxes and radio buttons.
• Made “edit text” the default double-click behavior. Original shapes did not have consistent behavior, requiring first a single-click, and then a click of the “Text Tool” button.
• Improved “empty box” shape. Sometimes I like to use the empty box shape as a textarea, so I gave it some default text font/spacing settings to accomodate.
• Added the Grid Column shape. I may be running afoul of some sort of license, but I copied the “Grid Column” shape from the “Common Controls” stencil; it helps for mocking up tables. Unfortunately, it’s not “sketchy,” but I made the fonts consistent.

Download Updated Sketch GUI Shapes (zip of Visio 2007 .vss)

I was fortunate to find Jesse James Garrett’s article, “A visual vocabulary for describing information architecture and interaction design,” on his website yesterday. Flowcharting is not a skill I’ve been privileged to learn formally, and I’ve been hesitant to get into it for fear of doing it wrong, since I assume there actually is a right way to draw a flow chart. Garrett, thankfully, has published his approach to a simple, IA/IxD-specific design diagram which can serve as a basis for all other design tasks:

The trouble is that the detail each audience requires differs vastly from the detail required by others, and the bulk of this detail is irrelevant to the needs of other audiences. The sensible approach is to limit the detail in the diagram to that which can be usefully applied by all audiences. The diagram thereby serves as a touchstone document for the development of more detailed documents specific to the needs of each audience.

The article gets high marks for including inline examples, full-featured downloadable examples, and shape libraries in a dozen formats. I’ve already successfully migrated my latest flow map to his format, and along the way, tweaked the Visio stencil to be more in line with my style:

• Calibri typeface, rather than Verdana (it’s narrower and a bit more refined)
• Connector labels that cover the line (the Visio default), with a white text-box background
• Improved text spacing in the File Stack shape
• Improved text spacing in the area shapes

Updated IA/IxD Diagramming Stencil

This is my first post at the new abbett.org. I’m generally not a fan of personal blogs, so I don’t expect to post very frequently here. I’ll mainly use this digital outcropping to keep visitors up to date on material elsewhere on the site, and to keep my links list up to date — though if anything particularly inspiring comes to mind, I reserve the right to share it.