Augmenting Static Visualization with PapARVis Designer

1. Augmenting Static Visualization
with PapARVis Designer
Zhutian Chen et al., CHI 2020 Paper
Presenter: Seunghyeong Choe
2020. 06. 05

2. Contents
• Overview
• Related works
• Design
• PapARVis designer
• Scenarios
• User study and results

3. Overview of the paper
2
(a) Data journalism + AR (b) Wall-sized timeline + AR (c) Tourist map + AR
Use AR to remove space and time constraints in data visualization

4. Overview of the paper
3
• PapARVis Designer
 Authoring environment to create augmented static visualization
 Codes available at https://github.com/PapARVis
• Criteria to provide a seamless and consistent integration
 C1: Graphical consistency
• Equal graphical style
 C2: Readability
• Aligning, layout, visual clutter
 C3: Validity
• Validity of visual encoding

5. Related works
4
• AR Visualization
 Embedded data representation (Willett et al.)
 ART, AR collaborative analysis tool (Butscher et al.)
• Augmenting Physical Documents
 Projector-based
 Handled-based
 HMD-based
• Visualization Authoring Tools
 D3
 Vega (Satyanarayan et al., Reactive Vega: A Streaming Dataflow Architecture for Declarative Interactive Visualization)

6. Design
5
PapARVis
Designer
AR
Preview
Validator
• VegaAR Editor
• SpecHub
• AR Viewer
• Demo AR on desktop
• Reduce changing device
• Automatically validates a design
• Provide guidelines
• Ensure consistency of visual encodings
Valid Invalid

7. Design
6
• Design Space
 What kind of augmented static visualization is valid?
• Three terms
• Static visualizations (𝑉𝑠)
• Virtual visualizations (𝑉𝑣)
• Augmented static visualizations (𝑉𝑎𝑟)
• Pie chart: virtual pie chart leads to inconsistent mappings
𝑉𝑠 𝑉𝑣
𝑉𝑎𝑟

8. Design
7
• Design Space
 How can a static visualization be augmented by AR?
Extended View
• Should consider data dependency
between 𝑉𝑠 and 𝑉𝑣
• Not all 𝑉𝑣 can be augmented in thi
s way
Small Multiple
• Always be valid as 𝑉𝑣 is displayed
separately from 𝑉𝑠
Composite View
• Given 𝑉𝑣 has different visual
encodings from 𝑉𝑠
Multiple views
• Always ensure valid AR
visualization
• independent 𝑉𝑠 and 𝑉𝑣

9. Design
• Design Goals
 G1: Integrate the visualization design in one tool
• Static visualization + virtual visualization
• PapARVis Designer
 G2: Preview the visualization design in one platform
• AR-Preview
 G3: Provide automatic design support
• Validator
8

10. PapARVis Designer
• Workflow
9
1. VegaAR Editor
• Create static visualizations
• Specify the virtual visualizations in an ar block (a)
• Generate QR code
• Push the whole specification on SpecHub
2. SpecHub
• Cloud server
• Prepares all pre-requisites of AR visualization
• Parse the ar block to render virtual visualization
3. AR Viewer
• Scan QR code
• Identify 𝑉𝑣

11. PapARVis Designer
• AR-Preview
 Avoid switching between devices (Phone ↔︎ PC)
 Extends Vega to preview AR visualization
 Use ar block data
 Certain data
• Specified in the ar block
 Uncertain data
• Placeholder mechanism to allow designers to generate mockup data using wildcard
10

12. PapARVis Designer
• Validator
 Automatically verifies the dataflow of the visual design
 Provides hints for debugging invalid visual encodings
11
Compare dataset and created visualization.
If invalid (𝑉𝑠 + 𝑉𝑣 ≠ 𝑉𝑎𝑟), give hints.

13. Implementation
• VegaAR Editor
 Vega Editor (https://github.com/vega)
 Vega Schema
 Vega Compiler
• SpecHub
 Reuse extended Vega Compiler
• AR viewers
 Vuforia (https://developer.vuforia.com)
 iOS, Android, web-based platform
 Only provide Qrcode decoder, AR image recognition, and 3D registration
12

14. Scenarios
1. Overcome space limitations
2. Displaying new data
3. Showing details
4. Complementing additional data
5. Protecting privacy
13

15. Scenarios
1. Overcome space limitations
14

16. Scenarios
2. Displaying new data
15
Updated after name card printed

17. Scenarios
3. Showing details
16

18. Scenarios
4. Complementing additional data
17
Show other department for comparison

19. Scenarios
5. Protecting privacy
18

20. User study
• Whether non-expertise could create 𝑉𝑎𝑟 with AR-preview and Validator
• Baseline
 Pro: full feature
 Base: no AR-preview and Validator, provide ar block
• Task
 Create 4 extended view in each task
 Provide background information
 Divided into 2 groups
• Validity-tree & Occlusion
• Validity-matrix & Unnoticeable
19
T1: Validity-tree T2: Validity-matrix
T4: Unnoticeable
(mismatch)
T3: Occlusion

21. User study
• Participants
 12 (8 male; age: 22-30; average: 25.6)
 Have at least two-year experience with Vega or D3
 No expertise in AR programming
 Have more than 2 years experience on data visualization
• Apparatus
 15-inch laptop
 iPhone 8 Plus (5.5-inch)
• Procedure
20

22. Results
• Quantitative results
21
• Finished the tasks faster with Pro mode
• Pro mode makes more correct visualization

23. Results
• Qualitative results
 Usability
• “I have never tried Unity and AR thing, but it can help me quickly produce AR extensible visualizations.”
 Usefulness
• “AR-preview is enough thus no need to switch to the AR device”
• “The validator is really important for the debug”
 Satisfaction
• AR-preview was “intuitive”
22

24. Discussions
• Whose faults? AR or my design?
 Design faults lead to misalignment
 “오류가 날 것이 없는데 왜 validator가 틀렸다고 하는 거지?”
 “시스템이 잘못된 것이다!”
• Where am I? Reality or virtuality?
 Some participants could not consider both static and virtual simultaneously.
23

25. Discussions
• What is the hint? Ignore or follow?
 Only one participant ignored hints: “The hints are useless”
 Got confused by the hints
• What scenarios can augmented static visualizations be used for?
 Public display: information boards, park maps, interactive artworks
24

26. Future work and limitation
• 3D and dynamic AR visualizations
• Multiple augmentations for collaborations: HMDs
• Scene understanding: environment adaptive visualization
• Study limitations
 Sample size of user study is small
 QRCode needs optimized (not visualization component).
25

27. My opinions
• Simple but helpful
• Good scenarios
• QRCode optimization
26

28. Thank you😀
Any questions?