Updated Sketch GUI Shapes for Visio

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)

This entry was posted on May 27th, 2008 and is filed under Uncategorized. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response or Trackback from your own site.