1. IAT 355 Basic Tasks with Interactive Example: EZChooser, Chapter 2 of Spence ______________________________________________________________________________________ SCHOOL OF INTERACTIVE ARTS + TECHNOLOGY [SIAT] | WWW.SIAT.SFU.CA

2. May 28, 2014 IAT 355 2 Problem Gaining insight about cars in marketplace Balancing criteria: –Problem is formulated as it is being solved Schon, 1983 Tasks –Buying a car –Selling own car of an earlier model year –Analyzing competition’s cars –Analyzing market trends

3. May 28, 2014 IAT 355 3 Car Table One Case per row –Categorical: Make –Ordinal: Rating –Numerical: Price, MPG, Age Make Price(£) MPG Rating Ford Chevy 15,450 12,450 31 27 Age (yrs) ***** *** 3 4

4. May 28, 2014 IAT 355 4 Basic Tasks Show distribution –Next slide shows distribution with bargram

5. May 28, 2014 IAT 355 5 Bargrams Represent range of items in the dataset Similar to histogram, except items are stacked horizontally –Width of bar indicates number of items –Label in bar indicates range Price 10-1212-1416-18

6. May 28, 2014 IAT 355 6 Bargram vs Histogram Note that the Bargram hides the fact that there are no cars in the 14- 16K range Price 10-1212-1416-18

7. May 28, 2014 IAT 355 7 Unpopulated subrange If you are buying a car, you have to buy what is available –The fact that there are no cars in the 14- 16K range is not really important If you are selling cars, empty price ranges may be important –You may want to fill that niche with a new product!

8. May 28, 2014 IAT 355 8 Basic Tasks Show individual data value –Car images in next slide

9. May 28, 2014 IAT 355 9 Unquantifiable Attributes Car appearance Not really a data attribute Show a picture of each car in dataset Could report survey of terms like –“attractiveness” “sporty” “luxurious”

10. May 28, 2014 IAT 355 10 Basic Tasks Retrieve value for more than one case: –Next slide shows each data case on the Bargram

11. May 28, 2014 IAT 355 11 Icons Little icons above Bargram represent individual items (Cars) Price 10-1212-1416-18

12. May 28, 2014 IAT 355 12 Brushing Select a car picture, and highlight its corresponding Icon Price 10-1212-1416-18

13. May 28, 2014 IAT 355 13 Brushing Indicate selected car on all Bargrams by color MPG 303540 Price 10-1212-1416-18

14. May 28, 2014 IAT 355 14 Brushing Tag a selected car with a red highlight MPG 303540 Price 10-1212-1416-18

15. May 28, 2014 IAT 355 15 Basic Tasks Filter out cases that you are not interested in Conversely, select the interesting items The next slide shows filtering on 1 attribute

16. May 28, 2014 IAT 355 16 Brushing Highlighting the 12-14K Bargram segment highlights the corresponding icons + pictures MPG 303540 Price 10-1212-1416-18

17. May 28, 2014 IAT 355 17 Basic Tasks Compound Filtering The next slide shows filtering on two attribute ranges

18. May 28, 2014 IAT 355 18 Brushing Selecting the 30 MPG bar highlights only those cars that satisfy both requirements MPG 303540 Price 10-1212-1416-18

19. May 28, 2014 IAT 355 19 Basic Tasks The next slide shows the filtered data All ranges are shown

20. May 28, 2014 IAT 355 20 Make Room for More! MPG 303540 Price 10-1212-1416-18 Make Color Horsepower Age Condition

21. May 28, 2014 IAT 355 21 Icons Putting an icon for every item on every row adds visual clutter Turn on all icons when starting to visualize –Give user sense of number of data items Filter Out those that do not satisfy –Compare the next two slides

22. May 28, 2014 IAT 355 22 Clutter MPG 303540 Price 10-1212-1416-18 Make Color Horsepower Age Condition

23. May 28, 2014 IAT 355 23 Clutter Less MPG 303540 Price 10-1212-1416-18 Make Color Horsepower Age Condition

24. May 28, 2014 IAT 355 24 Basic Tasks The preceding 2 slides compared clutter If the overall task is to select a few good alternatives from many, reducing clutter is good If the overall task is to make correlations –You may possibly want more clutter

25. May 28, 2014 IAT 355 25 Basic Task Identifying a car to buy is a Search task Sometimes you need to browse first! –Learn the market –Learn the trade-offs Filtering on the previous slides was all-or-nothing May want indicator for “pretty close”

26. May 28, 2014 IAT 355 26 Show “Close items” Use hollow icon to indicate close items –The hollow items are OK on all other attributes but not MPG –Selecting 35 MPG will accept 2 other cars MPG 303540

27. May 28, 2014 IAT 355 27 EZ Chooser Sensitivity Information is shown as hollow icons