This document discusses designing real-time dashboards to support esports spectating. It describes origins and research on the spectator experience, including online surveys and interviews. Key findings showed that dashboards should be glanceable, adaptable, intelligent, and transparent. This informed design goals to reduce cognitive load, adapt to context, automatically switch based on gameplay, and ensure trust through transparency. The document advocates for open data standards and announces a workshop on spectator experiences in gaming and esports.

1. DESIGNING
REAL-TIME DASHBOARDS
SVEN CHARLEER, PHD
FREELANCE DATAVIZ / DASHBOARD / UX
STRATEGY, RESEARCH & CONCEPT DESIGN
SVEN.CHARLEER@GMAIL.COM / @SVENSLAB
TO SUPPORT ESPORTS SPECTATING

2. ORIGINS
SPECTATOR EXPERIENCE
OPEN DATA
MORE RESEARCH
svencharleer.com

3. ORIGINS
svencharleer.com

8. Lecturer

9. Lecturer

10. 10

11. 11
https://www.apple.com

12. Arnold, Kimberly E., and Matthew D. Pistilli. Course Signals at
Purdue: Using learning analytics to increase student
success. Proceedings of the 2nd International Conference on
Learning Analytics and Knowledge. ACM, 2012.
Engelbart, D. C. (2001). Augmenting human intellect: a
conceptual framework (1962). PACKER, Randall and JORDAN,
Ken. Multimedia. From Wagner to Virtual Reality. New York:
WW Norton & Company, 64-90.

13. CASE STUDY 0
MOTIVATION
svencharleer.com

14. THE RESEARCH
SPECTATOR EXPERIENCE
svencharleer.com

15. KATHRIN GERLING
FRANCISCO GUTIÉRREZ
HANS CAUWENBERGH
BRAM LUYCX
KATRIEN VERBERT
svencharleer.com

16. https://vimeo.com/65429804

17. https://www.youtube.com/watch?v=WziMRN9WoVk

18. https://www.youtube.com/watch?v=j5QahFFHv0I

20. UNDERSTANDING
THE USER NEEDS
ITERATIVE DESIGN
PROCESS
FINAL USER
EVALUATION
svencharleer.com

21. UNDERSTANDING
THE USER NEEDS
ITERATIVE DESIGN
PROCESS
FINAL USER
EVALUATION
788 participants
ONLINE SURVEYS
r/LeagueOfLegends
167
r/GloblalOffensive
596
svencharleer.com

22. UNDERSTANDING
THE USER NEEDS
ITERATIVE DESIGN
PROCESS
FINAL USER
EVALUATION
Paper, digital mockup, interactive prototypes
NLoL =10, NCS:GO =8
USABILITY
THINK ALOUD / SEMI-STRUCTURED INTERVIEWS
svencharleer.com

23. UNDERSTANDING
THE USER NEEDS
ITERATIVE DESIGN
PROCESS
FINAL USER
EVALUATION
18 participants
NLoL =10, NCS:GO =8
SEMI-STRUCTURED INTERVIEWS
EYE-TRACKING
INDUCTIVE THEMATIC ANALYSIS
svencharleer.com

24. Themes Total % Total %
1 Impact on spectator experience 101 29.2 50 33.3
2 Flexible and lightweight dashboards 98 28.3 39 26.0
3 Impact on cognitive load 51 14.7 12 8.0
4 Trust and complexity of information 54 15.6 3 2.0
5 Contextual factors 29 8.4 32 21.3
6 Usability 13 3.8 14 9.3
CS:GOLoL
svencharleer.com

28. 28

29. DESIGN GOALS
GLANCEABILITY
ADAPTABILITY
INTELLIGENCE
TRANSPARENCY
svencharleer.com

30. DESIGN GOALS: GLANCEABILITY
IMPACT ON COGNITIVE
LOAD
“I might prefer to watch later and not during the stream,
because I need to be able to think about it”
“Okay, now I did look a lot [at recent damage] and that did sometimes
distract me from the game, I think. Sometimes that caused me to miss an
entire team fight”
svencharleer.com

34. DESIGN GOALS: ADAPTABILITY
CONTEXTUAL
FACTORS
Game phase - environment - viewer type - replay
svencharleer.com

36. DESIGN GOALS: ADAPTABILITY
NEED FOR LIGHTWEIGHT
AND FLEXIBLE
DASHBOARDS
“I think there is too much information [on the dashboard].
Maybe you can personalise certain things.”
svencharleer.com

37. DESIGN GOALS: INTELLIGENCE
“Damage across the entire game is interesting when not
much is going on. It would be nice if the dashboard would
automatically switch [to recent damage] when damage is
done.”

38. "The vulnerabilities help me understand why
junglers choose to gank in certain lanes"
DESIGN GOALS: INTELLIGENCE

39. DESIGN GOALS: TRANSPARENCY
TRUST AND COMPLEXITY
OF INFORMATION
“[It is all going a bit too fast for me], League of Legends is a fast
game, sometimes you are not going to be able to follow the game
as well. A simple number says enough sometimes.”
svencharleer.com

40. “I prefer to analyse such
things myself at that right
moment during the stream
instead of looking at
vulnerability. I can deduce it
myself from what I see.”

41. svencharleer.com
Charleer, S., Gerling, K., Gutiérrez, F., Cauwenbergh, H., Luycx, B., &
Verbert, K. (2018, October). Real-Time Dashboards to Support
eSports Spectating. In Proceedings of the 2018 Annual Symposium on
Computer-Human Interaction in Play (pp. 59-71). ACM

42. OPEN DATA
A NEW STANDARD
svencharleer.com

43. svencharleer.com

44. svencharleer.com

45. svencharleer.com

46. Charleer, S., Gutiérrez, F., Gerling, K., & Verbert, K. (2018, October).
Towards an open standard for gameplay metrics. In Proceedings of
the 2018 Annual Symposium on Computer-Human Interaction in Play
Companion Extended Abstracts (pp. 399-406). ACM

47. MORE RESEARCH
AN ONLINE WORKSHOP
svencharleer.com

48. BE PART OF IT
SPECTATOR EXPERIENCE IN GAMING
AND ESPORTS
CHI 2020 Workshop
svencharleer.com
13 papers available on
https://seegamesws.wordpress.com/accepted-papers/
SIMONE KRIGLSTEIN
AIT Austrian Institute of Technology
GmbH & University of Vienna, Vienna,
Austria
GÜNTER WALLNER
Eindhoven University of Technology &
University of Applied Arts Vienna,
Vienna, Austria
SVEN CHARLEER
Freelance Researcher, Brasschaat,
Belgium
KATHRIN GERLING
KU Leuven, Leuven, Belgium
PEJMAN MIRZA-BABAEI
Ontario Tech University, Oshawa, ON,
Canada
STEVEN SCHIRRA
YouTube, San Bruno, CA, USA
MANFRED TSCHELIGI
University of Salzburg, Salzburg,
Austria

49. svencharleer.com
Interactive Visualization For Strategy Acquisition In Esports
Spectatorship
Erica Kleinman, Magy Seif El-Nasr
Northeastern University
kleinman.e@northeastern.edu
m.seifel-nasr@northeastern.edu
https://vimeo.com/414803900

50. svencharleer.com
Toward Game Aware Streaming Interfaces
Erik Harpstead, Jessica Hammer
Carnegie Mellon University
harpstead@cmu.edu
hammerj@andrew.cmu.edu

51. @SVENSLAB
/IN/SVENCHARLEER
SVENCHARLEER@GMAIL.COM
SVENCHARLEER.COM
SVEN CHARLEER, PHD
FREELANCE DATAVIZ / DASHBOARD / UX
STRATEGY, RESEARCH & CONCEPT DESIGN