Author of WireframeSketcher plugin. Peter has posted 5 posts at DZone. View Full User Profile

WireframeSketcher 2.0: Introducing Interactive Prototypes

09.27.2010
| 1303 views |
  • submit to reddit

WireframeSketcher just released a new version with support for interactive prototypes.

How it works

Interactive prototypes are created by linking two or more mockups together. The new UI element for working with links is the Links view. To link two screens select a widget and then specify the target screen using the Links view. Widgets with multiple items allow you to specify a link target for each item. A small yellow icon lets you quickly see where your links are. You can click it to edit the linked screen.

 Adding links

To test the prototype just hit F5 to launch the presentation. Clickable areas are highlighted and you can click around and go back using arrow keys. You can disable link highlighting from the context menu.

Presentation mode

Another thing that you can do is create clickable PDF documents from your prototype. To do so put all the linked screens of your prototype into a storyboard and then export it to PDF. This way you can share your prototypes with your clients without requiring any additional software besides a PDF viewer.

Here’s a screencast that gives you a more visual overview of how linking works: http://www.youtube.com/watch?v=WHah9FAkN84&hd=1

 I’d love to hear your feedback on this version! Please let me know how it works for you and what can I do to make it even better.

 

0
Published at DZone with permission of its author, Peter Severin.

(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)

Comments

Andrew McVeigh replied on Tue, 2010/09/28 - 4:47am

sounds interesting, but no URL to try the software?

Peter Severin replied on Thu, 2010/09/30 - 12:14pm

My bad. For more details visit http://wireframesketcher.com

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.