Flowchart: action box or decision box?

11 Aug 2009 - 9:01am
5 years ago
8 replies
9360 reads
DeHui
2009

I'm doing an exercise to practice the design of task flow. I have one
step which has 5 options in it. And the user is supposed to choose one
and move forward. In this case, shall I use the diamond decision box
or the rectangular action box to illustrate this step? I googled a
little bit. And it seems that the outcome of a diamond box is usually
YES or NO instead of options. Where can I find more complicated
samples for learning purpose? Thanks.

Comments

11 Aug 2009 - 9:24am
ELISABETH HUBERT
2007

You can always try Jesse James Garrett's Visual Vocabulary:
http://www.jjg.net/ia/visvocab/. I think that you would use the user
decision diamond, but maybe you can find more info/validation here.
Good luck!

Lis

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=44552

11 Aug 2009 - 9:31am
Jaanus Kase
2008

my 2c what I would do in this situation:

The user sees one screen, hence there is one rectangular box for the
screen. After that, there is a diamond that branches according to the
decision that user made. Nobody says there can only be 2 outcomes. I
have done diamonds with 4 or 5 outcomes, and the Diagram Police has
not caught me yet, so it's fine.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=44552

11 Aug 2009 - 9:32am
DeHui
2009

Thanks for the great explanation! This is quite helpful!

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=44552

11 Aug 2009 - 9:33am
pyces
2007

I would use the decision diamond as this is what is traditionally used
in flowcharts to represent a decision needing to be made, in this case,
probably what is the user doing to create which state in the system. If
there is a generic decision, such as "What happens?" then have five
different paths leading from the diamond, labeling each path with the
appropriate identifying scenario text, such as "error message is
generated", "success message is generated", goes to some other system,
whatever the case may be.

Hope that helps.

Courtney Jordan

-----Original Message-----
From: discuss-bounces at lists.interactiondesigners.com
[mailto:discuss-bounces at lists.interactiondesigners.com] On Behalf Of min
Ouyang
Sent: Tuesday, August 11, 2009 3:01 AM
To: discuss at ixda.org
Subject: [IxDA Discuss] Flowchart: action box or decision box?

I'm doing an exercise to practice the design of task flow. I have one
step which has 5 options in it. And the user is supposed to choose one
and move forward. In this case, shall I use the diamond decision box or
the rectangular action box to illustrate this step? I googled a little
bit. And it seems that the outcome of a diamond box is usually YES or NO
instead of options. Where can I find more complicated samples for
learning purpose? Thanks.
________________________________________________________________
Welcome to the Interaction Design Association (IxDA)!
To post to this list ....... discuss at ixda.org Unsubscribe
................ http://www.ixda.org/unsubscribe List Guidelines
............ http://www.ixda.org/guidelines List Help ..................
http://www.ixda.org/help

11 Aug 2009 - 9:40am
Mike Myles
2009

What you're trying to chart is a switch statement.

It can be done with multiple decision nodes. Here is an example...

http://www.gailer-net.de/tutorials/java/Notes/chap43/ch43_8.html

And there is more info here on charting different decision
statements...

http://www2.tech.purdue.edu/eet/courses/referencematerial/atmel/Control_Statements/control_statements.htm

Depending on the audience for this chart, you could certainly
simplify to using an action box with 5 decision paths out. The
multiple decision node approach might be confusing to people not
familiar with diagramming logical flows. However, if you're creating
specifications for engineers, a detailed flowchart showing each
decision node would probably be the right way to go.

I find it's best to target the communication method to fit the needs
of the intended audience, rather than be to concerned with keeping
true to a particular format. It's a balancing act.

Personally, I don't like seeing a decision (diamond) node with
anything other than a yes/no output - that comes from my EE digital
logic background - to me it's a yes/no (on/off) switch. But I know
I'm probably in the minority on that opinion.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=44552

11 Aug 2009 - 10:03am
Jaanus Kase
2008

On Mike's note: I have found that a system's behavior can be modeled
in two ways. For engineers, there is the UML Activity Diagram, which
is what the first link refers to. And then there is Garrett's
Information Architecture/Navigation Map/UI flow diagram. They look
deceptively similar because they share some (not all) of the same
elements, but I've found I get the best results when I keep these
two things separate, since they need to emphasize different things
for different audiences.

So, as is said, "it's best to target the communication method to
fit the needs of the intended audience". Is this a specification for
an engineer to code the system, or beginning point of sketching and
designing the UI screens? Both are valid, but deserve a different
approach.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=44552

11 Aug 2009 - 9:46am
Anne Hjortshoj
2007

I'm with Mike. Additionally, if your docs are being reviewed by
engineers, you'll be better off sticking to traditional/logical
treatments of decision nodes (they'll appreciate it/won't make fun of
the IA).

-Anne

On Tue, Aug 11, 2009 at 3:40 AM, Mike Myles<mmyles2001 at yahoo.com> wrote:
> What you're trying to chart is a switch statement.
>
> It can be done with multiple decision nodes. Here is an example...
>
> http://www.gailer-net.de/tutorials/java/Notes/chap43/ch43_8.html
>
> And there is more info here on charting different decision
> statements...
>
> http://www2.tech.purdue.edu/eet/courses/referencematerial/atmel/Control_Statements/control_statements.htm
>
> Depending on the audience for this chart, you could certainly
> simplify to using an action box with 5 decision paths out. The
> multiple decision node approach might be confusing to people not
> familiar with diagramming logical flows. However, if you're creating
> specifications for engineers, a detailed flowchart showing each
> decision node would probably be the right way to go.
>
> I find it's best to target the communication method to fit the needs
> of the intended audience, rather than be to concerned with keeping
> true to a particular format. It's a balancing act.
>
> Personally, I don't like seeing a decision (diamond) node with
> anything other than a yes/no output - that comes from my EE digital
> logic background - to me it's a yes/no (on/off) switch. But I know
> I'm probably in the minority on that opinion.
>
>
> . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
> Posted from the new ixda.org
> http://www.ixda.org/discuss?post=44552
>
>
> ________________________________________________________________
> Welcome to the Interaction Design Association (IxDA)!
> To post to this list ....... discuss at ixda.org
> Unsubscribe ................ http://www.ixda.org/unsubscribe
> List Guidelines ............ http://www.ixda.org/guidelines
> List Help .................. http://www.ixda.org/help
>

--
Anne Hjortshoj | anne.hj at gmail.com | www.annehj.com | Skype: anne-hj

11 Aug 2009 - 9:36am
Paulo Marques
2009

I think perhaps the conditional branch (triangle) is more appropriate,
however the trick is to look at what the outcome of a step is.

Basically: Does choosing any of the 5 options returns the same page?
Or does it return one of 5 possible pages depending on the choice?

For example:
If the outcome is one two possible paths depending on an answer
(yes/no), then branch = diamond

If the the outcome is one of 3 or more paths depending on multiple
choice, then branch = triangle

If the outcome is only one path regardless of which options where
chosen, then no branching

Hope it helps :)

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=44552

Syndicate content Get the feed