SlideShare a Scribd company logo
1 of 13
Daniel Kao
Ping Pong Pad
Agenda
● Problem
○ No visible statistics when practicing; no motivation
● Goal
○ Provide a dashboard during and after practicing
● Architecture
● Details
○ RTSP Streaming
○ Image Processing
○ Web Server
○ Statistics
Problem
● Practice without knowing
time, performance, trend.
● Nothing is of help for next
practice.
Goal
● Need something visual.
● Make it more gamification.
● People loves numbers.
Architecture
1. Mobile phone to record videos
and stream to PC
2. PC runs scripts to process
streaming images, extract
information, and feed them into
web server
3. Tablet accesses web server to
show current statistics
RTSP server
Spydroid App
https://github.com/fyhertz/spydroid-ipcamera
Image Processing
● OpenCV library in Python
● Steps
○ Fetch each frame in streaming video
○ Convert them into gray (because color is irrelevant)
○ Take first frame as comparison reference
○ Compare diffs for following frames
■ If difference is larger than a threshold, we believe the ball is entered screen,
● Count as one hit
● If it’s within a time threshold, count it as consecutive hit
Demo Video for Image Processing
Real Image
Diff Image with
Gaussian Blur
Use Threshold
to process the
diff area
Find contour area
Web Server
● Python (again)
● Flask (simple web server framework)
● SocketIO
Web Page Demo
● Total balls
● Total hits
● Current consecutive hits
● Max consecutive hits
● Practice duration
Web Page Demo (II)
● Practice Trend
● Daily statistics
Future Plans
● More analysis on data
○ Practice stability: average consecutive hits
○ Strength measurement: average hit count per minute
○ Etc
● More interactive ways
○ Recognize which area of the training board is hit
○ Show random area in web content, and see if I can hit that area
continuously
○ Identify two training boards (one at right side, and another on left
side of the table)
4 5
1 2 3
6
References
● Github
○ https://github.com/plateaukao/pingpongpad
● Medium article
○ https://danielkao.medium.com/table-tennis-practice-tracking-dashboard-3c2535037f2b

More Related Content

Similar to Ping Pong Pad

How to build Kick Ass Games in the Cloud
How to build Kick Ass Games in the CloudHow to build Kick Ass Games in the Cloud
How to build Kick Ass Games in the CloudChris Schalk
 
Korea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklimKorea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklimSang Seok Lim
 
OSMC 2014: Naemon 1, 2, 3, N | Andreas Ericsson
OSMC 2014: Naemon 1, 2, 3, N | Andreas EricssonOSMC 2014: Naemon 1, 2, 3, N | Andreas Ericsson
OSMC 2014: Naemon 1, 2, 3, N | Andreas EricssonNETWAYS
 
Google Cloud: Next'19 Extended Hanoi
Google Cloud: Next'19 Extended HanoiGoogle Cloud: Next'19 Extended Hanoi
Google Cloud: Next'19 Extended HanoiGCPUserGroupVietnam
 
How We Won Gamedev By Rolling Our Own Tech (no notes)
How We Won Gamedev By Rolling Our Own Tech (no notes)How We Won Gamedev By Rolling Our Own Tech (no notes)
How We Won Gamedev By Rolling Our Own Tech (no notes)Mihai Gosa
 
Better images for video - Jeremy Brown
Better images for video - Jeremy BrownBetter images for video - Jeremy Brown
Better images for video - Jeremy BrownJeremy Brown
 
DN18 | Demystifying the Buzz in Machine Learning! (This Time for Real) | Dat ...
DN18 | Demystifying the Buzz in Machine Learning! (This Time for Real) | Dat ...DN18 | Demystifying the Buzz in Machine Learning! (This Time for Real) | Dat ...
DN18 | Demystifying the Buzz in Machine Learning! (This Time for Real) | Dat ...Dataconomy Media
 
Metail Skin Colour Authoring Tool
Metail Skin Colour Authoring ToolMetail Skin Colour Authoring Tool
Metail Skin Colour Authoring ToolDavid Gavilan
 
OSMC 2014 | Naemon 1, 2, 3, N by Andreas Ericsson
OSMC 2014 | Naemon 1, 2, 3, N by Andreas EricssonOSMC 2014 | Naemon 1, 2, 3, N by Andreas Ericsson
OSMC 2014 | Naemon 1, 2, 3, N by Andreas EricssonNETWAYS
 
Build your own low latency live platform
Build your own low latency live platformBuild your own low latency live platform
Build your own low latency live platformJordi Cenzano
 
Interfaces of the future now available augmented reality - google glass - 3...
Interfaces of the future now available   augmented reality - google glass - 3...Interfaces of the future now available   augmented reality - google glass - 3...
Interfaces of the future now available augmented reality - google glass - 3...CuriousInventor
 
【Unite 2018 Tokyo】スクリプタブルレンダーパイプライン入門
【Unite 2018 Tokyo】スクリプタブルレンダーパイプライン入門【Unite 2018 Tokyo】スクリプタブルレンダーパイプライン入門
【Unite 2018 Tokyo】スクリプタブルレンダーパイプライン入門Unity Technologies Japan K.K.
 
Running HTML5 Mobile Web Games at 60fps
Running HTML5 Mobile Web Games at 60fpsRunning HTML5 Mobile Web Games at 60fps
Running HTML5 Mobile Web Games at 60fpsApoorv Saxena
 
Technical Aspects of Digital Video
Technical Aspects of Digital VideoTechnical Aspects of Digital Video
Technical Aspects of Digital VideoWatson Leese
 
From nothing to a video under 2 seconds / Mikhail Sychev (YouTube)
From nothing to a video under 2 seconds / Mikhail Sychev  (YouTube)From nothing to a video under 2 seconds / Mikhail Sychev  (YouTube)
From nothing to a video under 2 seconds / Mikhail Sychev (YouTube)Ontico
 
AAA 3D GRAPHICS ON THE WEB WITH REACTJS + BABYLONJS + UNITY3D by Denis Radin ...
AAA 3D GRAPHICS ON THE WEB WITH REACTJS + BABYLONJS + UNITY3D by Denis Radin ...AAA 3D GRAPHICS ON THE WEB WITH REACTJS + BABYLONJS + UNITY3D by Denis Radin ...
AAA 3D GRAPHICS ON THE WEB WITH REACTJS + BABYLONJS + UNITY3D by Denis Radin ...DevClub_lv
 
JS Fest 2019. Денис Радин. AAA 3D графика в Web с ReactJS, BabylonJS и Unity3D
JS Fest 2019. Денис Радин. AAA 3D графика в Web с ReactJS, BabylonJS и Unity3DJS Fest 2019. Денис Радин. AAA 3D графика в Web с ReactJS, BabylonJS и Unity3D
JS Fest 2019. Денис Радин. AAA 3D графика в Web с ReactJS, BabylonJS и Unity3DJSFestUA
 
Digital graphics technology
Digital graphics technologyDigital graphics technology
Digital graphics technologyhaverstockmedia
 
Digital Graphics Technology
Digital Graphics TechnologyDigital Graphics Technology
Digital Graphics Technologyhaverstockmedia
 

Similar to Ping Pong Pad (20)

How to build Kick Ass Games in the Cloud
How to build Kick Ass Games in the CloudHow to build Kick Ass Games in the Cloud
How to build Kick Ass Games in the Cloud
 
Korea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklimKorea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklim
 
OSMC 2014: Naemon 1, 2, 3, N | Andreas Ericsson
OSMC 2014: Naemon 1, 2, 3, N | Andreas EricssonOSMC 2014: Naemon 1, 2, 3, N | Andreas Ericsson
OSMC 2014: Naemon 1, 2, 3, N | Andreas Ericsson
 
Google Cloud: Next'19 Extended Hanoi
Google Cloud: Next'19 Extended HanoiGoogle Cloud: Next'19 Extended Hanoi
Google Cloud: Next'19 Extended Hanoi
 
How We Won Gamedev By Rolling Our Own Tech (no notes)
How We Won Gamedev By Rolling Our Own Tech (no notes)How We Won Gamedev By Rolling Our Own Tech (no notes)
How We Won Gamedev By Rolling Our Own Tech (no notes)
 
Better images for video - Jeremy Brown
Better images for video - Jeremy BrownBetter images for video - Jeremy Brown
Better images for video - Jeremy Brown
 
DN18 | Demystifying the Buzz in Machine Learning! (This Time for Real) | Dat ...
DN18 | Demystifying the Buzz in Machine Learning! (This Time for Real) | Dat ...DN18 | Demystifying the Buzz in Machine Learning! (This Time for Real) | Dat ...
DN18 | Demystifying the Buzz in Machine Learning! (This Time for Real) | Dat ...
 
Metail Skin Colour Authoring Tool
Metail Skin Colour Authoring ToolMetail Skin Colour Authoring Tool
Metail Skin Colour Authoring Tool
 
OSMC 2014 | Naemon 1, 2, 3, N by Andreas Ericsson
OSMC 2014 | Naemon 1, 2, 3, N by Andreas EricssonOSMC 2014 | Naemon 1, 2, 3, N by Andreas Ericsson
OSMC 2014 | Naemon 1, 2, 3, N by Andreas Ericsson
 
Build your own low latency live platform
Build your own low latency live platformBuild your own low latency live platform
Build your own low latency live platform
 
Interfaces of the future now available augmented reality - google glass - 3...
Interfaces of the future now available   augmented reality - google glass - 3...Interfaces of the future now available   augmented reality - google glass - 3...
Interfaces of the future now available augmented reality - google glass - 3...
 
【Unite 2018 Tokyo】スクリプタブルレンダーパイプライン入門
【Unite 2018 Tokyo】スクリプタブルレンダーパイプライン入門【Unite 2018 Tokyo】スクリプタブルレンダーパイプライン入門
【Unite 2018 Tokyo】スクリプタブルレンダーパイプライン入門
 
Running HTML5 Mobile Web Games at 60fps
Running HTML5 Mobile Web Games at 60fpsRunning HTML5 Mobile Web Games at 60fps
Running HTML5 Mobile Web Games at 60fps
 
Flowframes
FlowframesFlowframes
Flowframes
 
Technical Aspects of Digital Video
Technical Aspects of Digital VideoTechnical Aspects of Digital Video
Technical Aspects of Digital Video
 
From nothing to a video under 2 seconds / Mikhail Sychev (YouTube)
From nothing to a video under 2 seconds / Mikhail Sychev  (YouTube)From nothing to a video under 2 seconds / Mikhail Sychev  (YouTube)
From nothing to a video under 2 seconds / Mikhail Sychev (YouTube)
 
AAA 3D GRAPHICS ON THE WEB WITH REACTJS + BABYLONJS + UNITY3D by Denis Radin ...
AAA 3D GRAPHICS ON THE WEB WITH REACTJS + BABYLONJS + UNITY3D by Denis Radin ...AAA 3D GRAPHICS ON THE WEB WITH REACTJS + BABYLONJS + UNITY3D by Denis Radin ...
AAA 3D GRAPHICS ON THE WEB WITH REACTJS + BABYLONJS + UNITY3D by Denis Radin ...
 
JS Fest 2019. Денис Радин. AAA 3D графика в Web с ReactJS, BabylonJS и Unity3D
JS Fest 2019. Денис Радин. AAA 3D графика в Web с ReactJS, BabylonJS и Unity3DJS Fest 2019. Денис Радин. AAA 3D графика в Web с ReactJS, BabylonJS и Unity3D
JS Fest 2019. Денис Радин. AAA 3D графика в Web с ReactJS, BabylonJS и Unity3D
 
Digital graphics technology
Digital graphics technologyDigital graphics technology
Digital graphics technology
 
Digital Graphics Technology
Digital Graphics TechnologyDigital Graphics Technology
Digital Graphics Technology
 

Recently uploaded

+97470301568>> buy weed in qatar,buy thc oil qatar,buy weed and vape oil in d...
+97470301568>> buy weed in qatar,buy thc oil qatar,buy weed and vape oil in d...+97470301568>> buy weed in qatar,buy thc oil qatar,buy weed and vape oil in d...
+97470301568>> buy weed in qatar,buy thc oil qatar,buy weed and vape oil in d...Health
 
Thermal Engineering -unit - III & IV.ppt
Thermal Engineering -unit - III & IV.pptThermal Engineering -unit - III & IV.ppt
Thermal Engineering -unit - III & IV.pptDineshKumar4165
 
Generative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPTGenerative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPTbhaskargani46
 
Thermal Engineering-R & A / C - unit - V
Thermal Engineering-R & A / C - unit - VThermal Engineering-R & A / C - unit - V
Thermal Engineering-R & A / C - unit - VDineshKumar4165
 
DeepFakes presentation : brief idea of DeepFakes
DeepFakes presentation : brief idea of DeepFakesDeepFakes presentation : brief idea of DeepFakes
DeepFakes presentation : brief idea of DeepFakesMayuraD1
 
Learn the concepts of Thermodynamics on Magic Marks
Learn the concepts of Thermodynamics on Magic MarksLearn the concepts of Thermodynamics on Magic Marks
Learn the concepts of Thermodynamics on Magic MarksMagic Marks
 
Standard vs Custom Battery Packs - Decoding the Power Play
Standard vs Custom Battery Packs - Decoding the Power PlayStandard vs Custom Battery Packs - Decoding the Power Play
Standard vs Custom Battery Packs - Decoding the Power PlayEpec Engineered Technologies
 
Design For Accessibility: Getting it right from the start
Design For Accessibility: Getting it right from the startDesign For Accessibility: Getting it right from the start
Design For Accessibility: Getting it right from the startQuintin Balsdon
 
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptxHOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptxSCMS School of Architecture
 
2016EF22_0 solar project report rooftop projects
2016EF22_0 solar project report rooftop projects2016EF22_0 solar project report rooftop projects
2016EF22_0 solar project report rooftop projectssmsksolar
 
Block diagram reduction techniques in control systems.ppt
Block diagram reduction techniques in control systems.pptBlock diagram reduction techniques in control systems.ppt
Block diagram reduction techniques in control systems.pptNANDHAKUMARA10
 
COST-EFFETIVE and Energy Efficient BUILDINGS ptx
COST-EFFETIVE  and Energy Efficient BUILDINGS ptxCOST-EFFETIVE  and Energy Efficient BUILDINGS ptx
COST-EFFETIVE and Energy Efficient BUILDINGS ptxJIT KUMAR GUPTA
 
HAND TOOLS USED AT ELECTRONICS WORK PRESENTED BY KOUSTAV SARKAR
HAND TOOLS USED AT ELECTRONICS WORK PRESENTED BY KOUSTAV SARKARHAND TOOLS USED AT ELECTRONICS WORK PRESENTED BY KOUSTAV SARKAR
HAND TOOLS USED AT ELECTRONICS WORK PRESENTED BY KOUSTAV SARKARKOUSTAV SARKAR
 
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills KuwaitKuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwaitjaanualu31
 
Tamil Call Girls Bhayandar WhatsApp +91-9930687706, Best Service
Tamil Call Girls Bhayandar WhatsApp +91-9930687706, Best ServiceTamil Call Girls Bhayandar WhatsApp +91-9930687706, Best Service
Tamil Call Girls Bhayandar WhatsApp +91-9930687706, Best Servicemeghakumariji156
 
Rums floating Omkareshwar FSPV IM_16112021.pdf
Rums floating Omkareshwar FSPV IM_16112021.pdfRums floating Omkareshwar FSPV IM_16112021.pdf
Rums floating Omkareshwar FSPV IM_16112021.pdfsmsksolar
 
Online food ordering system project report.pdf
Online food ordering system project report.pdfOnline food ordering system project report.pdf
Online food ordering system project report.pdfKamal Acharya
 
data_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfdata_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfJiananWang21
 
Computer Networks Basics of Network Devices
Computer Networks  Basics of Network DevicesComputer Networks  Basics of Network Devices
Computer Networks Basics of Network DevicesChandrakantDivate1
 

Recently uploaded (20)

+97470301568>> buy weed in qatar,buy thc oil qatar,buy weed and vape oil in d...
+97470301568>> buy weed in qatar,buy thc oil qatar,buy weed and vape oil in d...+97470301568>> buy weed in qatar,buy thc oil qatar,buy weed and vape oil in d...
+97470301568>> buy weed in qatar,buy thc oil qatar,buy weed and vape oil in d...
 
Thermal Engineering -unit - III & IV.ppt
Thermal Engineering -unit - III & IV.pptThermal Engineering -unit - III & IV.ppt
Thermal Engineering -unit - III & IV.ppt
 
FEA Based Level 3 Assessment of Deformed Tanks with Fluid Induced Loads
FEA Based Level 3 Assessment of Deformed Tanks with Fluid Induced LoadsFEA Based Level 3 Assessment of Deformed Tanks with Fluid Induced Loads
FEA Based Level 3 Assessment of Deformed Tanks with Fluid Induced Loads
 
Generative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPTGenerative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPT
 
Thermal Engineering-R & A / C - unit - V
Thermal Engineering-R & A / C - unit - VThermal Engineering-R & A / C - unit - V
Thermal Engineering-R & A / C - unit - V
 
DeepFakes presentation : brief idea of DeepFakes
DeepFakes presentation : brief idea of DeepFakesDeepFakes presentation : brief idea of DeepFakes
DeepFakes presentation : brief idea of DeepFakes
 
Learn the concepts of Thermodynamics on Magic Marks
Learn the concepts of Thermodynamics on Magic MarksLearn the concepts of Thermodynamics on Magic Marks
Learn the concepts of Thermodynamics on Magic Marks
 
Standard vs Custom Battery Packs - Decoding the Power Play
Standard vs Custom Battery Packs - Decoding the Power PlayStandard vs Custom Battery Packs - Decoding the Power Play
Standard vs Custom Battery Packs - Decoding the Power Play
 
Design For Accessibility: Getting it right from the start
Design For Accessibility: Getting it right from the startDesign For Accessibility: Getting it right from the start
Design For Accessibility: Getting it right from the start
 
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptxHOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
 
2016EF22_0 solar project report rooftop projects
2016EF22_0 solar project report rooftop projects2016EF22_0 solar project report rooftop projects
2016EF22_0 solar project report rooftop projects
 
Block diagram reduction techniques in control systems.ppt
Block diagram reduction techniques in control systems.pptBlock diagram reduction techniques in control systems.ppt
Block diagram reduction techniques in control systems.ppt
 
COST-EFFETIVE and Energy Efficient BUILDINGS ptx
COST-EFFETIVE  and Energy Efficient BUILDINGS ptxCOST-EFFETIVE  and Energy Efficient BUILDINGS ptx
COST-EFFETIVE and Energy Efficient BUILDINGS ptx
 
HAND TOOLS USED AT ELECTRONICS WORK PRESENTED BY KOUSTAV SARKAR
HAND TOOLS USED AT ELECTRONICS WORK PRESENTED BY KOUSTAV SARKARHAND TOOLS USED AT ELECTRONICS WORK PRESENTED BY KOUSTAV SARKAR
HAND TOOLS USED AT ELECTRONICS WORK PRESENTED BY KOUSTAV SARKAR
 
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills KuwaitKuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
 
Tamil Call Girls Bhayandar WhatsApp +91-9930687706, Best Service
Tamil Call Girls Bhayandar WhatsApp +91-9930687706, Best ServiceTamil Call Girls Bhayandar WhatsApp +91-9930687706, Best Service
Tamil Call Girls Bhayandar WhatsApp +91-9930687706, Best Service
 
Rums floating Omkareshwar FSPV IM_16112021.pdf
Rums floating Omkareshwar FSPV IM_16112021.pdfRums floating Omkareshwar FSPV IM_16112021.pdf
Rums floating Omkareshwar FSPV IM_16112021.pdf
 
Online food ordering system project report.pdf
Online food ordering system project report.pdfOnline food ordering system project report.pdf
Online food ordering system project report.pdf
 
data_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfdata_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdf
 
Computer Networks Basics of Network Devices
Computer Networks  Basics of Network DevicesComputer Networks  Basics of Network Devices
Computer Networks Basics of Network Devices
 

Ping Pong Pad

  • 2. Agenda ● Problem ○ No visible statistics when practicing; no motivation ● Goal ○ Provide a dashboard during and after practicing ● Architecture ● Details ○ RTSP Streaming ○ Image Processing ○ Web Server ○ Statistics
  • 3. Problem ● Practice without knowing time, performance, trend. ● Nothing is of help for next practice.
  • 4. Goal ● Need something visual. ● Make it more gamification. ● People loves numbers.
  • 5. Architecture 1. Mobile phone to record videos and stream to PC 2. PC runs scripts to process streaming images, extract information, and feed them into web server 3. Tablet accesses web server to show current statistics
  • 7. Image Processing ● OpenCV library in Python ● Steps ○ Fetch each frame in streaming video ○ Convert them into gray (because color is irrelevant) ○ Take first frame as comparison reference ○ Compare diffs for following frames ■ If difference is larger than a threshold, we believe the ball is entered screen, ● Count as one hit ● If it’s within a time threshold, count it as consecutive hit
  • 8. Demo Video for Image Processing Real Image Diff Image with Gaussian Blur Use Threshold to process the diff area Find contour area
  • 9. Web Server ● Python (again) ● Flask (simple web server framework) ● SocketIO
  • 10. Web Page Demo ● Total balls ● Total hits ● Current consecutive hits ● Max consecutive hits ● Practice duration
  • 11. Web Page Demo (II) ● Practice Trend ● Daily statistics
  • 12. Future Plans ● More analysis on data ○ Practice stability: average consecutive hits ○ Strength measurement: average hit count per minute ○ Etc ● More interactive ways ○ Recognize which area of the training board is hit ○ Show random area in web content, and see if I can hit that area continuously ○ Identify two training boards (one at right side, and another on left side of the table) 4 5 1 2 3 6
  • 13. References ● Github ○ https://github.com/plateaukao/pingpongpad ● Medium article ○ https://danielkao.medium.com/table-tennis-practice-tracking-dashboard-3c2535037f2b