In this tutorial, you will learn how to use multiple cases to show the different paths a user can take in a login scenario.

Basic Interactions Tutorial

Multiple Cases

Show Different Login Scenarios

First, open MultipleCases.rp and open the "Login Button" page.

Select the Login button and add a case to OnClick. This opens the Case Editor dialog.

At the top of the Case Editor dialog next to "Step 1: Description" edit the case description from "Case 1" to "If login succeeds".

Still need help? Check out the forum or drop us a line at support@axure.com.

© 2002-2012 Axure Software Solutions, Inc. All rights reserved.

The Round Up

(AxureMultipleCases.zip)

This zip file contains the RP file needed to complete this tutorial

If the login fails, we want the user to link to Page 2 so let's add an action to "Open Link in Current Window" and choose Page 2. Click "OK".

Now, the OnClick interaction should look like the above screenshot, and have these two cases:

     If login succeeds, Open Page 1 in Current Window

     If login fails, Open Page 2 in Current Window.

Change the description from "Case 1" to "If login fails".

Case descriptions can be useful for communicating multiple paths, but sometimes that just isn't enough! In those situations, you can use Conditional Logic.

Generate the prototype (Generate -> Prototype in the main menu) and you can see that clicking the Login button presents you with the two case options. Clicking on "If login succeeds" opens Page 1. Clicking on "If login fails" opens Page 2.

When the login succeeds, we want the user to link to Page 1, so add an action to "Open Link in Current Window" and choose Page 1. Click "OK" to close the Case Editor.

Now, let's add a second case to the Login button. To do this, select the OnClick event again and click on "Add Case" again (or, double-click on the event). This opens the new case in the Case Editor dialog.

Step 1: Add the first OnClick case

Step 2: Edit the case description

Step 3: Add an action for "If login succeeds"

Step 4: Add a second OnClick case

Step 5: Edit the case description

Step 6: Add an action for "If login fails"

Step 7: Review the cases

Step 8: Generate the prototype

Next: Anchor Links Tutorial

Back to Basic Interactions