We hope everyone is getting a chance to evaluate the new features in the 4.2 beta. If you haven't had a chance to download it yet, it is available at www.axure.com/axurerp4-2beta.aspx.

Two of the main features introduced in this release are flow diagrams and the OnPageLoad event.

Here is a file demonstrating those features: FlowAndOnPageLoadSample.rp
And here is a link to the prototype from this file: Prototype

[It will help if you open the file and/or the prototype as you read the rest of this tutorial.]

In this sample, there is a flow diagram called Color Flow in the Sitemap (designated as a flow diagram by right-clicking on the page in the Sitemap and selecting Diagram Type -> Flow).

The Color Flow diagram shows a path a user would take through the pages in the system. The flow shapes in the diagram with reference pages were created by dragging pages from the Sitemap to the diagram.

A reference page can be added to (or removed from) any flow shape by right-clicking on the flow shape and selecting Edit Flow Shape -> Edit Reference Page. If a page is referenced the text on the shape will be tied to the name of the page and the prototype will automatically link them to the referenced pages.

The Start Page contains several radio buttons allowing the user to specify which color they prefer. Clicking each button sets the OnLoadVariable to a string value, in this case "Blue", "Red", and "Green". This is defined in the interactions for each radio button.

The Continue button on the Start Page links to the Colors Page. If the OnLoadVariable is set, it will be passed to the Colors Page.

The Colors Page defines several cases for the OnPageLoad event. Each case compares the OnLoadVariable value to a string ("Blue", "Red", "Green"). If the value matches, the dynamic panel in the body of the page is set to a state containing a rectangle of the selected color.

Two of the panels ("Blue" and "Red") have a button linking to the DontLikeGreen Page, and the "Green" panel contains a button linking to the LikeGreenPage.

Previously, to accomplish this same flow, three cases would have been defined on the Continue button on the Start Page with descriptions like "If red was selected". Then, the cases would be displayed in the prototype for the user to select. Also, each case would have linked to a different page in the Sitemap, each with a different color displayed.

Now this can be accomplished without multiple cases on the Continue button, and the button can link to a single page that responds to the OnLoadVariable.

This gives you the ability to demonstrate a "truer" experience in the prototype, but remember your audience! The case descriptions and multiple pages may be more descriptive for clients and developers. Let us know what you think.