User Interface Nagivation diagram

[Geert Bellekens]

Hi,

My client is currently implementing a new method which they call Component Based Design with UML notation. This method will be applied to functional and technical analyses.
In this method they would like a (functional) User Interface Navigation Diagram (UI Storyboard) in which they show all navigation paths between the different screen involved in a use case realisation.
I would like to know what type of diagram you would use. I've seen three different diagram types so far that are used to capture this type of information, each with its own strengths and weaknesses.

• Class diagram: Each screen is a Class showing attributes and operations. Each nagivation path between two screens is represented using an association. The event in which case the navigation is followed is represented using the name of the association.
• Collaboration diagram: each screen is an object. Each navigation path a message. Each event a guard on the message.
• State Diagram: Each state is a screen, each navigation path is a transition; the events are guard conditions on the transitions.

Please let me know what your preferred solution is and why.

[thomas.kilian]

I always use a robustness diagram (ICONIX) for that purpose and it's pretty nice for that kind of task.

[jeshaw2]

I would lean towards a state diagram.  User clicking on a navigation button, or updating a control, could be an event directly related to a transition.  Once in a given state, you could specify which navigation or other control events to which  the state/window would respond.

[«Midnight»]

FWIW...

I kind of lean towards both, but you should heed Jim's point either way.

That is, if you don't understand the states the system can be in and how they are related - the state model - then the robustness diagram is merely a pictorial way of guessing. If you do understand the state model then the robustness diagram can be of considerable value.

One excellent way of crystallizing your understanding - and also an excellent way of communicating it - is to create the state model and diagram it.

So my 0.02 CAD is: a state model would be good, as would a robustness diagram with a state model.

David