Flowcharts
- Covered in H&P Section 6.6 (9.5 in second) as usage models
- Specifies sequence of interaction
- Covers contingencies and loops with conditionals
- May be used as analysis (current state) or to present solution design
Wireframes
- Covered in H&P section 9.5 (17.5 in 2nd)
- Specifies screen layout including general placement and user controls
- Usually does not specify color, font and exact placement
General considerations
- Diagrams cannot stand alone: they require context, captions and additional explanations
- Consider presenting high-level overview first with references to details that appear later in the document
- Flowcharts and wireframes are useful for presenting resulting design; other diagrams (e.g. mental maps, sketches) are useful for the design process
Discussion questions
- How might flowcharts and wireframes be combined?
- What tools can be used? Does it matter?
- How are storyboards used?