1. BTS430 Dialogue Charts Please run this as a presentation. It uses hyperlinks.

2. Dialogue Charts In this tutorial you will explore dialogue charts. The tutorial shows only partial dialogue charts. “…” indicates there is more to the chart but it is not shown. The tutorial is set up using hyperlinks

3. Dialogue Charts Dialogue charts are tree structures describing online navigation of a system. Each entry in the tree represents a user interface (screen or Web page). Each entry in the chart, except for the root, is named hierarchically. For example, a common path to display screen 1.1.2 is to first go to screen 1, then select the option that takes you to 1.1, and from there you select the option that takes you to 1.1.2. (Note that this might not be the only path).

4. Dialogue Charts Each entry in the chart is composed of three parts: 1.1 Add New Customer 1, 0, 1.2 1.2 Update Customer 1, 0 1.2.1 Update Credit Information 1.2 1 Manage Customer 0 X Login 0 Main Admin Screen X 2 Manage Groups 0 The top number is the numeric identifier of the screen. Our convention will be to name any Login screens X (the only non- numeric), and main screens 0 (this will help make the numbering simpler).

5. Dialogue Charts Each entry in the chart is composed of three parts: 1.1 Add New Customer 1, 0, 1.2 1.2 Update Customer 1, 0 1.2.1 Update Credit Information 1.2 1 Manage Customer 0 X Login 0 Main Admin Screen X 2 Manage Groups 0 The middle section contains the name of the screen.

6. Dialogue Charts Each entry in the chart is composed of three parts: 1.1 Add New Customer 1, 0, 1.2 1.2 Update Customer 1, 0 1.2.1 Update Credit Information 1.2 1 Manage Customer 0 X Login 0 Main Admin Screen X 2 Manage Groups 0 The bottom section contains numbers of the screens that can be navigated indirectly to, back to, or sideways to from this one. Do not include screens that follow directly in the navigation scheme. For example, below, in screen 1.2, you would not show the number 1.2.1 in the bottom section because you go there directly.

7. Dialogue Charts When you do your dialogue charts in MSPowerPoint, you will set up each screen name as a hyperlink to a mock-up of the screen. The hyperlink will simply point to another page in the MSPowerPoint document. You also have to put in a hyperlink to get back from the mock-up to the dialogue chart (don’t forget that!). Check out the example by clicking here. Navigate the hyperlinks. See how the dialogue chart continues across two pages (with links continued and previous). When you are done, return to this tutorial.clicking here Note that “…” indicates there is more to the chart but it is not shown.

8. Dialogue Charts This is the end of the tutorial.

9. 0 Main Menu 1 Product Management 0 4 Purchasing 0 3 Sales Management 0 1.1 Add New Product 1,1.2 1.2.1 Update Product prices 1.2,1 1.2 Update Product 1 5 Receiving 0 Continued… ……… Back To Tutorial

10. 0 Main Menu 6 Returns Processing 0 8 System Administration 0 7 Marketing 0 …… … Previous…

11. ACME OFFICE PRODUCTS Add New Product Product # Product Line: Photo Location AddHome Product Description Buyer Activate Date Office Chairs Preira, Mary September 30, 2002 h:\user\products\office\2003.jpg Update Back To Dialogue Chart Note that I can navigate back directly to the page I came from. This is really important. And this button or hyperlink should be in the same place on all screen pages of your system.

12. ACME OFFICE PRODUCTS Returns Processing Back To Dialogue Chart Note that again I can navigate back to the page I came from on the dialogue chart. This is important. Returns Processing screen mock-up would go here