200122 SeungHyeon Choe

1. Mobile Data Visualization
Seunghyeong Choe
2020. 01. 22.

2. Contents
• Overview
• Demos and Tutorials
• Challenges and Research Questions
• Visualization Range over Time on Mobile Phones: A Task-
Based Crowdsourced Evaluation

3. Mobile Data Visualization
• Eun Kyoung Choe, Raimund Dachselt, Petra Isenberg, and Bongshin Lee
• Dagsthul Seminar Report, 2019
• Follows the “Data Visualization on Mobile Devices” workshop at CHI 2018
2

4. Overview
3
Mobile device and Mobile visualization... Becoming more prevalent
New form factors
Nice hardware capabilities

5. Overview
4
• Research communities have not paid enough attention to mobile data
visualization
• Visualization techniques are mostly for desktop environments
• Five demos and tutorials
• Challenges and opportunities for future research

6. Demos and Tutorials
5
• Five researchers presented their latest mobile visualization demos on hands-on session.
 Smartwatch demo from a study comparing three representations-bar, donut, text
• Blascheck, Tanja, et al. "Glanceable Visualization: Studies of Data Comparison Performance on Smartwatches." IEEE transactions on visualization and computer graphics 25.1 (2018): 630-640.
 Tilting, brushing & dialing for mobile vis
• Brehmer, Matthew, et al. ＂Tilt Interaction For Mobile Visualization＂ https://github.com/microsoft/TiltInteractionForMobileVisualization
 Personal home automation system with mobile data access and control
• Tobias Isenberg, http://tobias.isenberg.cc
 Visualization of off-screen data using summarization techniques
• Games, Peter S., and Alark Joshi. "Visualization of off-screen data on tablets using context-providing bar graphs and scatter plots." Visualization and Data Analysis 2014. Vol. 9017. International Society for Optics
and Photonics, 2014.
 Product Fingerprints, a mobile visualization that allows people to compare nutrirional information between food products
• Mah, Carrie, et al. "A Visualization Fingerprint: Comparing Nutrient Data Visually."
Smartwatch
Visualization
Sensor
∙
Touch
Interaction
Home
automation
& IoT
Off-screen
Data

7. Demos and Tutorials
6
• Five Tutorials
 Getting Started with Web-based Visualizations
• Basics of creating web-based data visualization
 Designing Mobile Visualizations for Mass-Market Users
 Crowdsourced Evaluation for Mobile Vis
• Practical and methodological aspects of conducting crowdsourced experiments about visualization on mobile devices
 The Immersive Analytics Toolkit – IATK
• Unity project to help you build hign quality, interactive and scalable data visualizations in VR/AR environments
 Microcontroller Programming for Sensor Data Capture & Visualization
• Sensor reading & data visualization (Arduino IDE)

8. Demos and Tutorials
7
• Designing Mobile Visualizations for Mass-Market Users
 광범위한 사용자층과 그들의 정보 해석 능력을 고려해야 한다.
 2/3의 참가자는 비슷한 성비에서 학력, 수입, 인종과 관계 없이 선정되어야 나의 인터페이스가 일반 대중
에게 어떻게 받아들여지는지 알 수 있다.
 Standard infovis techniques(time-series graphs, maps)를 이해하는데 어려움을 겪는 사람들이 많다.
 텍스트 설명, 요약, 데이터를 간단히 표현할 수 있는 방법 등을 사용하여 이해를 도울 필요가 있다.

9. Challenges and Research Questions
8
• Discussion of challenges and important research questions in the field of mobile data visualization
 Evaluating Mobile Data Visualization
 What is Mobile Vis?
 Responsive Visualization
 Vis for Good & Ethics
 Starting Mobile Visualization from Scratch
 Beyond Watch & Pone: From Mobile to Ubiquitous Visualization
 (Discoverable) Interaction for Mobile Visualization
 From Perception to Behavior Change: Designing and Evaluating Glanceable Mobile Vis
 Mobile Vis for 3D Data / AR Vis

10. Challenges and Research Questions
9
• Evaluating Mobile Data Visualization
 Depending on the intention of the system, different evaluation methods are needed.
 User recruitment strategies
• Responsive Visualization
 Visualizations for desktop are often unusable on mobile devices.
 Needs to be responsive to constraints.
• Vis for Good & Ethics
 People are more at the mercy of the visualization designer

11. Challenges and Research Questions
10
• Starting Mobile Visualization from Scratch
 Progressive Visualization : inversion of Ben Shneiderman’s interaction mantra
• Details-first, Triggering interest, Analysis/Overview-on-demand
• Glanceable Mobile Vis
 Fitness tracker, GPS tracker
 Quick information needs
 Purposes
• indicate serious problem to driver or pilot
• Evoke long-term behavior change

12. Challenges and Research Questions
11
• Mobile Vis for 3D Data / AR Vis
 Mobile and 3D interaction techniques can prevent the misunderstanding

13. Visualization Ranges over Time
on Mobile Phones:
A Task-Based Crowdsourced Evaluation
Matthew Brehmer, Bongshin Lee, Petra Isenberg, and Eun Kyoung Lee
TVCG 2018

14. Overview
• 작은 화면을 통해 보여지는 시각화 데이터에 대한 사람들의 반응?
1

15. 14
Factors
1. Layout
 Linear, Radial
2. Data Source
 temperature range data of Chicago (Seasonal variation)
 Sleep duration range data (Periodic pattern, almost consistent)
3. Granularity
 Week, Month, Year
4. Task

16. 15
Factors
4. Task
Locate date
제시된 날짜가
포함된 범위 선택하기
Read value
얻고자 하는 값이
포함된 범위 선택하기
Locate Min/Max
취침/기상 시간이
가장 빠른/늦은/긴 날
선택하기
Compare values
제시된 권장
수면 시간과 비교
Compare ranges
제시된 권장 수면
시간과 가장 근접한 날
선택하기

17. 16
Experiment Design
1. Portrait mode, 평평한 바닥에 놓기
2. 검지로만 터치 (Fat finger problem 방지)
3. 문제에 익숙해지기 위한 trial 배치
4. 진행 중인 task와 다른 task로 quality control
5. 100명의 Mturk 참가자 모집 후 50명은 기온 데이터, 50명은 취침시간 데이터로 실험
6. Color gradient를 이용한 고저 표현
7. 완료 시간과 정확도 수집
8. Preference와 Confidence 정도 survey

18. 17
Research Question
Q1. Layout
Linear와 Radial의 차이가 performance에 미치는 영향
Q2. Granularity
Granularity가 task 수행 performance에 미치는 영향
Q3. Target Range Value
Radial layout에서 periphery scale이 미치는 영향

19. 18
Results overview
Completion times
Linear : 2.8 ~ 5.4 sec
Radial : 3.3 ~ 6.9 sec
Granularity 증가할수록 오래 걸림.
Error rates
Linear : 2% ~ 20%
Radial : 1% ~ 37%
Year-Compare Range일 때 최대
Sleep group은 Locate Min/Max에서 에러 증가

20. 19
Results overview
• People prefer linear layout and feel more confident
• Some participants preferred Radial layout as granularity increased

21. 20
Results Q1 / Layout
Radial is slower
Unexpetedly shrank
Radial is better
Fewer errors

22. 21
Results Q2 / Granularity
Completion times Error rates
Typically Week range is faster Increased granularity does not necessarily increase error rate
판단 시간이 오래 걸렸지만 에러가 높지는 않았음.

23. 22
Results Q3 / Target Range Value
Completion times Error rates
Radial layout이 약 1.3배 오래 걸림. Layout에 따른 error rate 변화 원인을 정확히 판별하지 못함.

24. 23
Discussion
• Layout
 Comparing values show similar performance either Linear or Radial.
 Linear is better if the use case involves Locating Min/Max.
• Display range
 Depends on the task and the source of data
 Year range → aggregate into weekly or monthly
 Year range → show in landscape mode
• Consider which combination of layout and granularity is fit.
 Radial layout if data have cycle

25. 24
Future works
• How different color gradients affect task performance?
• A personal relationship with ranges
• Beyond a single mobile visualization study
 Use various interaction method (e.g. Using sensor)
 Consider how the phone is held or which finger provide touch input

26. 25
What I’ve learned
• About Mobile Data Visualization
 Design mobile vis easy to interpret
 Use text information to help understanding
 Use sensors properly
 Consider usability on choosing layout
• Progressive Visualization
 More study needed.