Sketchy custom shapes ....

[Geert]

I like using Visio for a number of things and one of them is to create prototypes.

I recently started using the sketchy looking (from Henrik Olsen/Niklas Wolkert I believe) prototyping shapes stencil:

• Rapid Prototyping Visio Wireframe Shapes, by Niklas Wolkert and Henrik Olsen
• Updated Sketch GUI Shapes for Visio, by Jonathan Abbett
• updated links by admin

and even though the stencil is great it does lack a few things e.g.:

- the checkbox and radio button don't have a "selected and disabled";
- a multi-line text field;
- a multi-line "tab" shape;
- allow the "box" shape to have a background colour;
- Question, Exclamation, Error or other icons;
- ...

Anyway, I would just like some help/advice on how to create/customize shapes.  I have googled for help but with Visio's "Edit Master" I can't seem to figure out how to add the selected and disabled state or how to create a multi-line text edit etc.  How does one create their own shape?  How does one create/edit a shape's states?  Where does the image/icon for the states go?

[JuneTheSecond]

Hi,

Cool shapes!

http://msdn.microsoft.com/en-us/library/bb726434.aspx
includes all reference for Visio2000 thru Visio2007
needed by visio developer.

By the way, what is the value to make non-accurate
sketch, despite Visio can draw accurate figures easily?

[Visio Guy]

Well, since computers and the internet are everywhere now, it is nice to have a "human touch" to diagrams, so the hand-drawn look is becoming attractive in a world that is too perfect.

But the designer of the wireframe shapes that Geert posted said that the hand-drawn look serves another purpose: it lets viewers of the document know that this is a design, a rough-draft, a prototype. It doesn't exist yet, and still requires discussion and feedback before it is final.

I thought that was interesting, well said, and an important consideration!

[Visio Guy]

Oh, and if you like sketchy shapes, be sure to check out:

‘Indexed’ Shapes – for that Hand-drawn Look

[Visio Guy]

Hi Geert,

I noticed that the updated shapes have added some of the features that you wanted:

Updated Sketch GUI Shapes for Visio, by Jonathan Abbett

At least the check-box works.

[Geert]

Yep, I really like the sketchy "this is only a prototype"

I am installing the SDK at the moment ... seems quite tedious as it needs a Microsoft SQL Server Desktop Engine as well.

[Visio Guy]

Does the SDK have an option to "Not install ShapeStudio"? That is probably what is requiring it, and not very many folks use ShapeStudio.

[wapperdude]

There is an expanded set of Visio Guy's sketchy shapes here:  http://visguy.com/vgforum/index.php?topic=340.0

[Geert]

Hmmm, it seems a bit too complicated for me 

Would there be anyone else here who is experienced enough to make some improvements to the Sketchy look visio shapes?

[JuneTheSecond]

Cool and cute they are.

Some of them vary shapes as they were drawn by human hands.

[wapperdude]

Not sure where the complication is?  These shapes can be added to a custom stencil for easier access, perhaps I should have done that.  But, they just drag n' drop like any Visio shape.  They can then be stretched and rotated as normally, filled, line style changed, copy, duplicate ... all the things existing shapes do.  Right click menu brings up a menu entry that allows you to randomize the shape so no two look identical.

If you want to create your own shapes, yes, that's complicated and involved.  That's why I provided these "basic" shapes to add to the ones Visio Guy already created.

[Geert]

I don't have a problem with that at all - although I don't find the wacky shapes not that useful for my screen mock-ups.

I am more looking for "sketchy" screen mock-up shape improvements as mentioned in my first post like:
- the checkbox and radio button don't have a "selected and disabled" (for Visio 2003);
- some sort of multi-line text field;
- a multi-line "tab" shape;
- allow the "box" shape to have a background colour;
- Question, Exclamation, Error or other icons;
- ...

[wapperdude]

Sorry, mis-understood.

So, the prototyping is in the context of creating a web-page? 

Yeah, these shapes wouldn't be much help at all.  I saw Visio Guy's response was adding to it.  We sort of wandered away from your post.

Hopefully, we're back on track. 

[Geert]

Sorry, mis-understood.

No worries 

So, the prototyping is in the context of creating a web-page? 

I find that those shapes can be used for prototyping for any type of application, thats the advantage of being very "sketchy", the prototype doesn't really care whether it will be implemented using a web-app or fat client etc.

[Visio Guy]

Sorry to hijack this thread. I think the point was that all of those "wacky" shapes could be used to make UI shapes as well. The UI shapes are almost all built out of carefully arranged rectangles, squares, circles and lines. Perhaps people don't quite understand what they do when they just quickly glance at the article or screenshot.

The benefit of the hand-drawn-look shapes is that they are different every time you copy them, because they have some randomness built in. So every box you draw will look a bit different. It may be that they are TOO random for prototyping, though. Maybe a reduced-randomness set would be better suited for professional use.

Another benefit is that the Visio Guy/Wapperdude shapes are (probably) lighter-weight than the Olsen/Niklas shapes, because they use formulas and actual Visio geometry, as opposed to foreign objects (bitmaps or metafiles?)