System Diagramming Basics

©Tim Sheiner 2013 All rights reserved 1

System Diagramming Basics

IXDSN-‐210: SystemsTim Sheiner

©Tim Sheiner 2013 All rights reserved

Agenda

2

The pointBenefits and limitaCons of diagramsThe reference bookProcessConvenConsAnnotaConDecoraCon


of system diagrams?

What is the point

3


CommunicaCon.

4


System Diagrams as a tool

Benefits•O#en actually worth one thousand words•Help you—the designer—definitely•Ac:vate visual and spa:al cogni:ve machinery

LimitaCons•Not dynamic•Help others—not the designer—maybe•Can become an end, rather than a means

5


A Reference Book: Communica:ng Design

The good things•Dan’s POV: read chapter 2!•The informa:on architecture of the book•The examples•The detail (well explained trees)

The less good things•systems-‐specific ar:facts not covered•The physical format of the book•The detail (obscures the forest)

6


suggested order of operaCons for construcCng diagrams

Process

7


Diagramming Process1

8

1. [Make a list of the pieces]2. Sketch3. Move to final medium4. Color sparingly5. Use conven:ons6. Label, label, label

7. [Collaborate]1. Share2. Revisit Inputs

8. Iterate1. Explore a different approach2. Move stuff around

1adapted from CommunicaCng Design, pp 18-‐19


Process: Sketch

9


Process: Place the Objects

10


Process: Make Connec:ons

11


Process: Refine

12


The diagram AND the learning are the valuable outcomes

13

~3 hours


Diagramming Conven:on

14

1. Follow conven:on2. If there is no relevant standard to follow, apply a standard of

consistency


// diagramming conven:on

15

If !(relevantStandard) {internalConsistency;

}


of following an ad hoc internal standard...

An example

16


Diagramming Conven:ons

17



18

rectangle = plug-‐in logic



19

rounded rectangle = controller logic

round = API type object



20



21

brackets = sub system



22

brackets = sub system

layer: use of different bracket styles conveys an actual difference


Annota:on

23

Text associated with the illustraCon and intended to clarify its meaning. A common kind of layer applied to info graphics.


Notes

24

notes


Key

25

key


Call out

26

this is a call outand this is a leader line


Decora:on

27

Imagery, embellishment, shading or any kind of non-‐textual marks applied to an illustraCon to improve its communicaCon value. Oben subject to abuse.


Examples of Decora:on

28


Advice

29

Master your tools.


Advice

30

Maximize data-‐ink raCo2.

pixels devoted to non-‐redundant informa:on

total pixels of graphic

2Tube, The Visual Display of QuanCtaCve InformaCon, p. 93


Advice

31

Keepitsimple,stupid.


Fin

32

System Diagramming Basics

Text of System Diagramming Basics

Diagramming Compound Subjects

Diagramming Sentences the Basics

Kinship Diagramming

Sentence Diagramming: Gerunds

Sentence Diagramming, #1

Precedence Diagramming

7 Diagramming Sentences

Diagramming Sentences (2)

Sentence Diagramming #11

Diagramming Arguments

TACTICAL DIAGRAMMING Rooms

Contingency Diagramming 2

Energy Systems Diagramming

Sentence Diagramming - Weeblywalkercds.weebly.com/uploads/9/1/2/0/9120298/diagramming_revie… · 8/25/2014 Sentence Diagramming 3 This will introduce you to the basics of sentence

Diagramming Adjectives Adverbs

Diagramming Review II - WCUSD15 · about sentence diagramming. classes are excited ... -ed, -d, -t, or ... Diagramming Review II [Compatibility Mode]

Diagramming Begins!

Lecture1 Diagramming

Diagramming - Introduction

2250 Diagramming

System Documentation and Diagramming Technique

Diagramming Worksheets Name: - PrintNPractice.com · Diagramming Worksheets Name:_____ DIAGRAMMING COMPLEX SENTENCES A complex sentence, according to STRUCTURE, is a sentence that

Diagramming sentences

Sentence Diagramming 1

Program and diagramming

Relationship Diagramming Method

Block Diagramming

Practice Diagramming Sentences

Contingency Diagramming 1

Sentence diagramming