Presentation is loading. Please wait.

Presentation is loading. Please wait.

3. THE LANGUAGE OF INTERFACE DESIGN. Design decisions at different levels of visual form LevelExample Pixel. Graphic atomsA, 3 _ graphic fragmentsWord,

Similar presentations


Presentation on theme: "3. THE LANGUAGE OF INTERFACE DESIGN. Design decisions at different levels of visual form LevelExample Pixel. Graphic atomsA, 3 _ graphic fragmentsWord,"— Presentation transcript:

1 3. THE LANGUAGE OF INTERFACE DESIGN

2 Design decisions at different levels of visual form LevelExample Pixel. Graphic atomsA, 3 _ graphic fragmentsWord, 2002, scale Graphic formA graph of indicator ViewsA window or single cohesive display screen workspaceThe entire display application

3 Elements of these design decisions Forms of reference –Propositional forms –Iconic forms –Analogical forms Analog and digital forms Context salience

4 Single variable display options –A variable within limits –A variable with a constraint –A variable with a normal value –A variable changes with time, or where the rate of change of the variable is of interest The bar graph The meter Combined analog and digital display

5 Single variable display options –A variable within limits –A variable with a constraint –A variable with a normal value –A variable changes with time, or where the rate of change of the variable is of interest The pie graph

6 Single variable display options –A variable within limits –A variable with a constraint –A variable with a normal value –A variable changes with time, or where the rate of change of the variable is of interest Indicating normality

7 Single variable display options –A variable within limits –A variable with a constraint –A variable with a normal value –A variable changes with time, or where the rate of change of the variable is of interest The trend chart Indicating rate and direction of change

8 Multivariate display options –Variable balance, or variable = variable –Variables are additive –Variables are multiplicative –Multiple variables determine system state –Multiple variable balance –Multiple variables with interacting constraints Balances with bar graphs Balances with trend charts

9 Multivariate display options –Variable balance, or variable = variable –Variables are additive –Variables are multiplicative –Multiple variables determine system state –Multiple variable balance –Multiple variables with interacting constraints Additivity with a bar graph Additivity with nomographs Additivith with trend charts

10 Multivariate display options –Variable balance, or variable = variable –Variables are additive –Variables are multiplicative –Multiple variables determine system state –Multiple variable balance –Multiple variables with interacting constraints Multiplication with trigonometric relations Mutiplication with nomographs

11 Multivariate display options –Variable balance, or variable = variable –Variables are additive –Variables are multiplicative –Multiple variables determine system state –Multiple variable balance –Multiple variables with interacting constraints Polar graphics, the polar star and basic polygon graphics Configural features of a line graph Mass data display

12 Multivariate display options –Variable balance, or variable = variable –Variables are additive –Variables are multiplicative –Multiple variables determine system state –Multiple variable balance –Multiple variables with interacting constraints Close proximity meters Connected meters

13 Multivariate display options –Variable balance, or variable = variable –Variables are additive –Variables are multiplicative –Multiple variables determine system state –Multiple variable balance –Multiple variables with interacting constraints Variables against a background

14 Structural display options –Linear structures –Spatial structures –Symbolic structures Linear arrangements spiral

15 Structural display options –Linear structures –Spatial structures –Symbolic structures map Matrix with independent dimensions

16 Structural display options –Linear structures –Spatial structures –Symbolic structures Hierarchy of elements in a tree representation A network arrangement Mimic diagrams and other diagrams

17 How to develop a new visual form Do you need to show a single value or multiple values together? Are there any physical principles or textbook graphs that show how the values relate? Are there any geometric relationships that you can use? Common geometric relationshipsBasic nomographs


Download ppt "3. THE LANGUAGE OF INTERFACE DESIGN. Design decisions at different levels of visual form LevelExample Pixel. Graphic atomsA, 3 _ graphic fragmentsWord,"

Similar presentations


Ads by Google