The relationship between use cases and user interfaces

Guidelines: Use-Case Storyboard

the relationship between use cases and user interfaces

Use cases involve interactions between human actors and the system state. a set of use case patterns and the corresponding user interface patterns . domain entities and the structural relations between them [2], and the. User interface-flow diagrams - also called storyboards, interface-flow to model the high-level relationships between major user interface elements and thereby For example, a use case can refer to several screens and provides insight into . from The Rational Edge: The author illustrates how to use UML Activity Diagrams to capture and communicate the details of user interface navigation and to additional diagrams) that link to separate use-case scenarios.*.

Iterations are often defined in terms of the use cases they implement. Written use cases are also a good source of analysis and domain classes. Use cases help shape user interfaces. The user interface must provide the necessary functionality for the user to execute a use case.

There was a problem providing the content you requested

Use case also help determine architecture. It's impossible to know all the requirements use cases for a system upfront.

A small set of key use cases, architecturally significant use cases, can provide the basis of the system architecture. If the right set of architecturally significant use cases is identified and used to design the system the use cases that come later should fit in without significantly changing the architecture of the system. Use cases can also be used to create test cases during the testing phase. Use cases also offer a good start for the construction of a user manual.

Use cases can also be realized during the analysis and design phases. During design use cases can be realized by classes and their interactions in detailed closer to implementation class diagrams and interaction diagrams.

A Process for Writing Use Cases A use-case model includes actors, use cases and the relationships between actors and use cases.

the relationship between use cases and user interfaces

These elements will emerge incrementally and become more refined over time. For example, you might start out by identifying an actor which suggests a use case and in the process of detailing the use case you discover another actor.

You can develop the elements of a use-case model in any order but the following sequence of steps tends to be most efficient. Identify Actors The actors represent users and external systems that will interact with the system under development. Actors represent categories of users or external systems.

the relationship between use cases and user interfaces

One way to identify actors is to list the specific users that will use the system and then organize them into categories based on their role or the purpose they have for using the system. Less obvious actors include system maintenance and admin personnel. Consider the task of finding actors for a software system which simulates a virtual mall. A virtual mall connects buyers and merchants.

Customer - A customer represents any person who uses the services of the virtual mall. Affiliate - An affiliate represents a person or organization who is authorized to sell merchandise at the virtual mall.

Credit Bureau - A credit bureau represents an external system used to verify the creditworthiness of a customer. Identify Use Cases This step may be performed simultaneously with the previous step. Finding an actor may suggest a use case which may suggest another actor.

Many development projects start with a high-level list of desired features. For example, the feature list for a virtual mall might include: Each feature is a potential use case. Use cases emerge during interviews with the client and end users of the system. The ways that actors use the system will also suggest use cases. During this step it's sufficient to name each use case and provide a short description of the use case.

During the next step you will describe each use case in detail. A use case name should include a noun and a verb. Usually the name will start with an action verb followed by a noun which represents the recipient of the action. The name should suggest what is achieved by the use case.

During this step and the next you will need to determine the scope of each use case. For a given activity the challenge is to decide if the activity should be a use case by itself or be included as a part of another use case. Use cases tend to split and combine like lava in a lava lamp until they settle into an well organized group. A well organized group is one that is easy to understand, review, test, and implement in one iteration.

The use cases that emerge from exploring how each actor gets value from or provides value to the system are: Browse Inventory - This use cases is used by a customer to shop for items to purchase. Purchase an Item - This use case is used by a customer to purchase an item. Since the purpose of these diagrams is to enhance understanding of complex flows, adding new icons and stereotypes should be done with caution. For most system modelers, the set of tools available to accomplish this complex task is somewhat limited, consisting mostly of flowchart semantics and screen shots of the interface.

Although flowcharts are effective for capturing the dynamic aspects of an interface, they lack the cohesive capability inherent in UML? Moreover, static screen shots cannot illustrate the sequence of events that occur during a dynamic user "conversation" with the system.

Screen shots show what you can do, but not how you can do it, and they cannot illustrate the effect on system state regarding a specific user action. Although on the surface Activity Diagrams may seem little more than glorified flowcharts and perhaps not even as powerful because they lack specific symbologyin fact they represent the same highly adaptable, extensible, and specific modeling structure evidenced in the remainder of the UML specification.

With the addition of several well-chosen stereotypes part of UML's extension mechanism, along with constraints and tagged valuesActivity Diagrams represent a strong addition to the user interface modeler's tool kit. As will be illustrated in detail below, Activity Diagrams provide the ability to accurately depict the dynamic aspect of virtually all current user interfaces.

Figure 1 shows an overview of Activity Diagram elements and icons. See the Sidebar for a description of the Activity Diagram icons and stereotypes we will use in our model. David Anderson, for example, published a paper in which he refers to a Navigation Model to describe the user experience with the visual elements of the system. I believe that UML Activity Diagrams represent a well-developed technique for satisfying many of these requirements.

the relationship between use cases and user interfaces

Although Anderson does use UML statecharts effectively to represent navigation from one page or system state to another, I would argue that Activity Diagrams show these changes in a more natural and easier-to-visualize manner. Scott Ambler also recently authored a book chapter that recommends the creation of Interface-Flow Diagrams to illustrate the movement from one "screen" to another; the transition between one system state and another is indicated as the result of a user action e.

As we will see below, this approach can be very neatly applied using the guard condition semantics and activity elements from Activity Diagrams. The Graphical User Interface As I explained in my two previous articles for The Rational Edge, Activity Diagrams give you the ability to construct a "roadmap" of user functionality that accurately represents the paths a user can follow, but they do not discuss why or when a particular path should be followed.

This information is best captured in the use-case textual description, which allows you to express the required level of detail. This article presents a technique for modeling three common but distinct types of GUIs: For each type of interface, the details of the user experience? As with all modeling techniques, the task begins by segmenting the modeling domain into sections that can be organized and managed.

For this purpose, we will use the elements we identified above: The term frame indicates that the functionality is logically separated, but not that it is necessarily implemented using HTML-based frame tags although it may very well be, in which case the designation is exact.

As shown in the figure, users can select a different display language all of which are indicatedand the system will then present them with the same interface branded to the selected language. Users may also select from a collection of hypertext links that will take them to different pages or sites note: If the user is validated, he or she will then see the initial Hotmail screen.

If the user is invalid or nonexistent, a "Sign-In Failure" page will appear that asks the user to reenter the information. Note that although the information is nearly identical in the login frame and the re-enter page, they are shown as separate because the user interface distinguishes between them. Hotmail Login Site View image at full size After successfully completing the login, the user is taken to the main page for the Hotmail system Figure 3.

From here, the user is presented with either the Hotmail homepage if no new messages have been received, or the user's InBox if new messages have arrived.

The InBox offers numerous options for navigation and state control. The navigation bar, which offers options for composing messages, the address book, calendar, etc. The InBox frame allows the user to change the state of the display and sort messages according to From, Subject, Date, and Size.

diagramming - Should interface be part of a system in use case diagram? - Stack Overflow

Messages may be marked for deletion, blocking, or movement to other designated folders. By selecting a message, the user can bring up the Display Message page and access additional navigation options for his messages, such as Next, Previous, and Delete.

Finally, the user may chose to add the sender to his Address Book or to block further messages from the sender. In Figure 3, notice the use of frames to segment functionality and the placement of links into notes. Often a Web site makes many hyperlinks available to users advertisements, off-site links, etc.

Usually, it is only necessary to diagram those links that will take users to another section of the current site Navigation or change the state of the display Controls. The guiding principle here should be to "tell a story" with your diagrams. Too much information may confuse the reader and make the model less useful. Frames are a good way to segment the functionality presented by complex sites such as the Hotmail site.

Inspector - Use Case Demonstration (2008)

Separating concerns visually i. This is done deliberately to show that these links lead to other diagrams or some other change of user focus. Modeling a Guided Interface To illustrate the modeling of guided interfaces e.

As shown in Figure 4, the Print Wizard is mostly a series of dialogs that lead the user from one step to the next. The functional flow is as follows: First identify the printer type that will be used networked vs. As Figure 4 shows, there are several branches in the flow e. If the user does not provide a mandatory data element such as Share Namethen an exception will occur and an error message will be displayed.

When the user follows all the steps correctly, then the printer connection will be established and the Print Wizard will end. In this model, the note at the beginning indicates that the user has the option at any step to return to the previous step back or to cancel the operation cancel.

Also, there is only one exit point from this wizard, although some guided interfaces provide the option to end the sequence early such as the Internet Connection Wizard. In this case, the guard [finish] condition may occur in earlier steps and lead to a different exit state. Also, this series of steps allows the user at one point to go online to select a driver update from the Microsoft?

In any case, the resulting information here the updated driver files is indicated. As would be expected from a directed interface, navigation is limited, and there are very few explicit backward connections we already noted the ability to back up one step at a time or other looping connections.