 |
User interface prototypes are an excellent means of
exploring your user interface, but unfortunately it is
easy to quickly become bogged down in the details of the
user interface and not see the bigger picture.
Consequently, you often miss high-level relationships
and interactions within your system’s UI. User
interface-flow diagrams – also called storyboards,
interface-flow diagrams, windows navigation diagrams,
and context-navigation maps – enable you to model the
high-level relationships between major user interface
elements and thereby ask fundamental
usability questions.
|
|
In Figure 1
you see the start at a user interface-flow diagram,
called a Navigation diagram in RUP, for
the university system. The boxes represent major user
interface elements, modeled as you would
instances/objects, and the arrows represent the possible
flow between them, modeled as you would transitions in
activity diagrams. For example, when you are on the
Desktop screen, you can use the Students Icon
to take you to the Search for Students screen.
Once you are there, you can either go back to the
desktop (going back is always assumed) or go to the
Student Profile screen.
Figure 1. A UI flow
diagram.
|
User interface-flow diagrams are
typically used for one of two purposes. First, they are
used to model the interactions that users have with your
software, as defined in a single use case. For example,
a
use case can refer to several screens and provides
insight into how they are used. Based on this
information, you can develop a user interface-flow
diagram that reflects the behavioral view of the single
use case. Second, as you see in
Figure 1 they enable you to gain a high-level
overview of the user interface for your application.
This overview is effectively the combination of all the
behavioral views derived from your use cases, the result
being called the architectural view of your user
interface (Constantine
and Lockwood 1999). I prefer to take the high-level
overview approach, also referred to as the
architectural
approach, because it enables me to understand the
complete user interface for a system.
Because user interface-flow
diagrams offer a high-level view of the interface of a
system, you can quickly gain an understanding of how the
system is expected to work. It puts you in a position
where you can validate the overall flow of your
application’s user interface. For example, does the flow
make sense? I am not so sure. Why can’t I get from
Seminar Details to Professor Information? When
you are viewing the information for a seminar, isn’t it
possible you might want to view the information for the
instructor of that seminar? Furthermore, user
interface-flow diagrams can be used to determine if the
user interface will be
usable. If there are many boxes
and many connections, it may be a signal to you that
your system is too large for people to learn and
understand. |
 |
Unfortunately the UML does not yet
support this sort of diagram. In the past I have used a
modified version of a UML collaboration/communication
diagram whereas others have suggested modified UML
activity diagrams or even UML state machine diagrams for
this. Our solutions all look something like what you
see in Figure 1, albeit using
slightly different notations. Because the UML is not
yet complete we find ourselves in exactly the situation
that the UML is meant to avoid – people using different
notations to model the software that they’re building.
My hope is that the Object Management Group (OMG) will
eventually define a profile for UI flow modeling.
In fact, I'd really appreciate it if you could send them
an
email to that effect.
This artifact description is excerpted from Chapter 6 of
The Object Primer 3rd Edition: Agile Model Driven
Development with UML 2.
 |
|
The Object Primer 3rd Edition: Agile Model Driven
Development with UML 2 is an
important reference book for agile modelers,
describing how to develop 35
types of agile
models including all 13
UML 2 diagrams.
Furthermore, this book describes the techniques
of the
Full Lifecycle Object Oriented Testing
(FLOOT) methodology to give you the fundamental
testing skills which you require to succeed at
agile software development. The book also
shows how to move from your agile models to
source code (Java examples are provided) as well
as how to succeed at implementation techniques
such as
refactoring and
test-driven development
(TDD). The Object Primer also includes a
chapter overviewing the critical database
development techniques (database refactoring,
object/relational mapping,
legacy analysis, and
database access coding) from my award-winning
Agile Database Techniques
book. |
 |
|
Agile Modeling: Effective Practices for Extreme
Programming and the Unified Process is the seminal
book describing how agile software developers approach
modeling and
documentation. It describes principles and
practices which you can tailor into your existing
software process, such as
XP, the
Rational Unified Process (RUP), or the
Agile Unified Process (AUP), to streamline your
modeling and documentation efforts. Modeling and
documentation are important aspects of any software
project, including agile projects, and this book
describes in detail how to
elicit requirements,
architect, and then
design your system in an agile manner. |
|
|
|
Maturing Usability: Quality in Software, Interaction,
and Value contains a collection of
writings from various experts in the field of usability
and user interface development. It provides an
understanding of how current research and practice has
contributed towards improving quality issues in
software, interaction and value. I wrote chapter 4 which
describes how usability fits into the Agile SDLC.
Other chapters look at how using development tools can
enhance the usability of a system, and how methods and
models can be integrated into the process to help
develop effective user interfaces; theoretical
frameworks on the nature of interactions; techniques and
metrics for evaluation interaction quality; the transfer
of concepts and methods from research to practice;
assessments of the impact that a system has in the real
world; and how to focus on increasing the value of
usability practice for software development and on
increasing value for users. A balance between
theoretical and empirical approaches is maintained
throughout, and all those interested in exploring
usability issues in human-computer interaction will find
this a very useful book. |
Translations
We actively work with clients around the world to
improve their information technology (IT) practices,
typically in the role of mentor/coach, team lead, or trainer. A full
description of what we do, and how to contact us, can be
found at Scott W.
Ambler + Associates.
 
|
