dataplay: sports game data collection and visualization [information design analysis]
DESCRIPTION
An information design analysis on some prototypes for my MFA thesis project in Design + Technology. Check out my documentation blog (lizrutledge.com/mfa-thesis) for more updates if you're interested!TRANSCRIPT
![Page 1: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/1.jpg)
LIZ RUTLEDGEINFORMATION DESIGNSPRING 2012PARSONS MFA DESIGN + TECHNOLOGY 03/28/2012
dataPlayGAME DATA COLLECTION + VISUALIZATION DESIGNED FOR THE NON-PROFESSIONAL ATHLETE
![Page 2: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/2.jpg)
AN ECOSYSTEM OF STATISTICS TRACKING TOOLS THAT ARE TAILORED TO LACROSSE BUILT ON A SYSTEM THAT COULD BE USED FOR COUNTLESS OTHER SPORTS
recreational/student/youth athletes + data =
dataPlay
![Page 3: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/3.jpg)
There is a growing gap between the rapidly expanding field of data visualization and sports statistics tracking at the non-professional level.
WHY:
![Page 4: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/4.jpg)
I seek to bridge this gap by creating an ecosystem of easy to use, cloud-based tools for real-time mobile statistics collection and visualization.
WHAT:
![Page 5: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/5.jpg)
1) to facilitate and encourage the collection of data
2) to enable deeper comprehension of the data through visual exploration
3) to enhance traditional game statistics by tagging each piece of data with the location and time at which it was recorded.
PURPOSE:
![Page 6: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/6.jpg)
This will allow for both immediate data analysis and the preservation of spatiotemporal relationships between events—without the steep learning curve or prohibitive costs of professional-grade tools.
SO WHAT?
![Page 7: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/7.jpg)
One possible implementation of this system: an iPad app tailored to the needs of lacrosse.
THE PROJECT:
![Page 8: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/8.jpg)
Through a case study focused on several youth lacrosse teams in New York and the Bay Area, my project will demonstrate how the thoughtful reconfiguration of existing technologies can empower a wider sports community by helping them transform data into knowledge.
HOW & WHY:
![Page 9: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/9.jpg)
RESEARCHINFORMATION DESIGN + VISUAL THINKING
![Page 10: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/10.jpg)
RESEARCH“Picturing the Concepts: An Interactive Teaching Strategy”— Thinking Classroom
“The Influence of Information Presentation Formats on Complex Task Decision-Making Performance”— International Journal of Human-Computer Studies
“Cognitive Models of the Influence of Color Scale on Data Visualization Tasks”— Human Factors
“The Eyes Have It: A Task by Data Type Taxonomy for Information Visualizations”— Human-Computer Interaction Laboratory and Institute for Systems Research, University of Maryland
VISION AND COGNITION
![Page 11: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/11.jpg)
CURRENT SYSTEMTHE PAPER SCORE BOOK
![Page 12: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/12.jpg)
current data tracking is either WAY too simple... ...or incredibly cramped and complicated.
![Page 13: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/13.jpg)
current data tracking is either WAY too simple... ...or incredibly cramped and complicated.
GROUPED IN COLUMNS BUT NO HIERARCHY TO HELP LOCATE THE RIGHT STAT
![Page 14: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/14.jpg)
space to hand-write in 25 players—most teams only have between 16-20 players on the roster (wasted space!)
when someone scores, you need to find their name, find the goals column, tick off a goal, note the time on the game clock, write down the time, then record the goal AGAIN down at the bottom....UGH.
![Page 15: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/15.jpg)
COMPONENT 1.0DIGITAL GAME DATA COLLECTION
![Page 16: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/16.jpg)
easy counter buttons increment using Javascript
goals appear wherever you click the mouse to indicate field position using Javascript. Future functionality will including dragging from the goal location to indicate an assist and its location.
all stats will be tied to game clock to enable time-accurate playback after the game is complete
![Page 17: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/17.jpg)
NO GROUPING OF STATS—JUST A ROW
![Page 18: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/18.jpg)
![Page 19: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/19.jpg)
STATISTICS GROUPED BY OFFENSE AND DEFENSE TO ALLOW MENTAL CHUNKING OF ITEMS
![Page 20: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/20.jpg)
NO VISUAL CUES: STILL HAVE TO READ LABELS TO KNOW WHAT YOU’RE PRESSING
STATISTICS GROUPED BY OFFENSE AND DEFENSE TO ALLOW MENTAL CHUNKING OF ITEMS
BUT:
![Page 21: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/21.jpg)
SIMPLIFIED TO DRAG & DROP INTERFACE USING ICONS FOR
IMMEDIATE VISUAL RECOGNITION
![Page 22: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/22.jpg)
FIREHAWKS COYOTESvs.
FORCED TURNOVER
DRAW CONTROLGOALIE SAVE
MISSED GOAL
ASSISTED GOAL
SHOT ATTEMPTS
OUT OF BOUNDS
FOUL
CALLS
GROUND BALL
POSSESSION
INTERCEPTION
DEFENSE
MISSED PASS
COMPLETED PASS
PASSES
0 30 4
FIRST HALF
SIMPLIFIED TO DRAG & DROP INTERFACE USING ICONS FOR
IMMEDIATE VISUAL RECOGNITION
ICONS GROUPED INTO UMBRELLA GROUPS TO SIMPLIFY VISUAL LANGUAGE/AVOID INFORMATION OVERLOAD
![Page 23: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/23.jpg)
IF AN “UMBRELLA” STATISTIC GROUP IS SELECTED, REVEALS A SECOND LAYER OF INFORMATION
(BUT ONLY IF RELEVANT TO YOU)
![Page 24: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/24.jpg)
COMPONENT 2.0GAME DATA VISUALIZATION + MANIPULATION
![Page 25: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/25.jpg)
ORIGINAL DESIGN OF VISUALIZATION INTERFACE:HIERARCHY IS WRONG! FIELD AND SCORE ARE MOST IMPORTANT, NOT CONFUSING LINE GRAPH OF GOALS
REUSEABLE ASPECT:USING VISUAL FAMILIARITY OF SCOREBOARD AND CLOCK TO MAKE INFORMATION EASIER TO DIGEST QUICKLY
![Page 26: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/26.jpg)
#FAILCLEVELAND’S TASK MODEL
![Page 27: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/27.jpg)
INCREDIBLY CONFUSING!
VISUALLY THERE IS NO DIFFERENTIATION BETWEEN DIFFERENT STATISTICS
#FAILCLEVELAND’S TASK MODEL
![Page 28: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/28.jpg)
INCREDIBLY CONFUSING!
VISUALLY THERE IS NO DIFFERENTIATION BETWEEN DIFFERENT STATISTICS
INTENSE COLOR ON BAR CHARTS MAKES THEM APPEAR MOST IMPORTANT
(WHEREASE THE FIELD AND CLOCK HAVE MOST IMPORTANCE)
#FAILCLEVELAND’S TASK MODEL
![Page 29: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/29.jpg)
BREAKING VISUAL LANGUAGE OF BAR CHARTS WITH LINE CHART—NEED TO BE
CONSISTENT TO TRAIN THE VIEWER
UTTERLY UN-SCANNABLE #FAILCLEVELAND’S TASK MODEL
INCREDIBLY CONFUSING!
VISUALLY THERE IS NO DIFFERENTIATION BETWEEN DIFFERENT STATISTICS
INTENSE COLOR ON BAR CHARTS MAKES THEM APPEAR MOST IMPORTANT
(WHEREASE THE FIELD AND CLOCK HAVE MOST IMPORTANCE)
![Page 30: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/30.jpg)
THE NEW VISUALIZATION DASHBOARD FIELD GIVEN THE
SIZE AND SPACE IT DESERVES FOR A
LOCATION-INCLUSIVE VISUALIZATION
INTERFACE
![Page 31: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/31.jpg)
THE NEW VISUALIZATION DASHBOARD
LESS SPACE DEDICATED TO BAR CHARTS BUT WITH ADDED VISUAL AIDS (ICONS)
FIELD GIVEN THE SIZE AND SPACE IT
DESERVES FOR A LOCATION-INCLUSIVE
VISUALIZATION INTERFACE
![Page 32: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/32.jpg)
LESS SPACE DEDICATED TO BAR CHARTS BUT WITH ADDED VISUAL AIDS (ICONS)
LESS SPACE USED BUT CLEARER DUE TO
CONSISTER BAR CHART LANGUAGE
FIELD GIVEN THE SIZE AND SPACE IT
DESERVES FOR A LOCATION-INCLUSIVE
VISUALIZATION INTERFACE
THE NEW VISUALIZATION DASHBOARD
![Page 33: dataPlay: Sports Game Data Collection and Visualization [Information Design Analysis]](https://reader036.vdocuments.site/reader036/viewer/2022070304/54c81b3a4a7959d0388b459e/html5/thumbnails/33.jpg)
THANKYOU!