SUGISAKAMASANORI

Journal of Advances in Artificial Life Robotics
Vol. 4(1); June (2023), pp. 12–19
ON LINE ISSN 2435-8061; ISSN-L 2435-8061
https://alife-robotics.org/jallr.html

Research Article

Table Tennis Tracker Web Application for Tournament
Statistics Analysis
Mastaneh Mokayef1, Belal Khaled1, Chin Hong Wong2, Sew Sun Tiang1, Wei Hong Lim1, MHD Amen Summakieh1,
Miad Mokayef1
Faculty of Engineering Technology and Built Environment, UCSI University, Kuala Lumpur, 56000, Malaysia
Maynooth International Engineering College, Fuzhou University, Fujian, China

1
2

ARTICLE INFO
Article History
Received 15 December 2022
Accepted 29 August 2023
Keywords
Table tennis
Statistics
Web application
Tournaments
Scores

ABSTRACTThe aim of this project is to amplify the table tennis tournament analysis via Web-Basedapplication. Typically, the tournament scores used to be collected and displayed manually. All theinformation used to be captured by the referees during the matches, while most of the competitors
provided only basic information and real-time scores online. Over the years of technologicaladvancements, the modern development of software applications has helped users perform usefultasks and retrieve useful data based on the requests. The objective of this project is to develop afunctional web application that will retrieve or store table tennis tournament statistical data andvisualize them using tables, bar charts, pie charts, histograms as a medium of demonstration for
the user. Moreover, the application will perform specific analysis on the scores and display
insightful data about the tournament for league structures investigation. The developed system
will include a database to store and retrieve data for display on the user interface. The developmentof the project is fully stacked (front-end and back-end), so it is built with the appropriate web
technologies to function in the background (PHP, MySQL, Apache) while displaying results(HTML, CSS, JavaScript) on the page for the user. The project is managed using effective project
management methods to plan, design, implement, develop, and maintain the application.

© 2022 The Author. Published by Sugisaka Masanori at ALife Robotics Corporation Ltd.
This is an open access article distributed under the CC BY-NC 4.0 license(http://creativecommons.org/licenses/by-nc/4.0/).

1. Introduction

By studying historical scores, analysts can identify
patterns, playing styles, and strategies that contribute toa player's success or failure [2]. This information can beused to make informed predictions and evaluate thepotential outcome of upcoming matches. On the other
hand, analyzing tournament scores provides insights into
the overall dynamics of a ping pong tournament. It helps
identify trends, such as upsets, underdog victories, or
dominant performances by certain players. This analysis
aids in understanding the competitiveness of thetournament, the level of skill among participants, and thepotential for surprises or upsets. Tournament scoreanalysis involves a range of statistical techniques to
uncover meaningful patterns and trends. Analysts can

By scrutinizing tournament scores in ping pong, analysts
can extract meaningful information about various aspectsof the game. In this regard there are some key areas where
tournament score analysis plays a crucial role. For
instance, performance evaluation in which the player’s
consistency and the skill level analysis are considered byanalyzing the match outcome in previous tournaments,
can help to predict the likelihood of a player winning
future matches [1]. Hence, considering the main factors
such as number of wins/losses, scored points, and player
strengths direction in hitting the ball in the analysis, leads
to a better coaching of the athlete.

Corresponding author’s E-mail: mastaneh@ucsiuniversity.edu.my, URL: https://www.ucsiuniversity.edu.my/

12With every search, the user can click an icon that will
redirect them to another page that will view the details of
the player in-depth. This is applicable for tournaments
and matches as well. Another key component to note is
the control panel that is implemented where the user canlogin and make amendments to database records using
the web application. Each user that is logged in will bedeclared an administrator by default. When successfully
logged in, match records, player records, and tournament
records can be added, altered and deleted in real-time.
After successfully executing administrative operations,the user will be able to view the updated database records
on the corresponding pages of the web application. The
system is versatile since their several in-built errorhandling functionalities. For example, when adding a
new player to the database – if the input fields areincompletely filled, the web application will display anerror. Therefore, every administrative operation ismonitored before execution to ensure that no errors areencountered when performing them. Another handy
feature functionality is the sorting of data when being
viewed in the page. When the user views a table of datafrom the system, they will be able to sort data based on
the name, date, number of wins, score values in an
ascending or descending order. By using the newly
developed system, the efficiency for the user can begreatly increased by reducing time consumption inviewing relevant data to their criteria. This will eliminate
most manual work handled by the user and increase theiraccuracy in analyzing tournament statistics. This will
also reduce the number of non-digitized papers thatstatisticians would normally use daily which helps in
keeping the environment economical and green. Rather
than writing the scores down, they can easily input thevalues on the web application and save the records on a
database. These records also encourage organization ofdata that can help prevent confusion when it is required
to search them. The system will overall, provide criticalconveniences to view statistical data directly using thesystem because the retrieval of data is easier, and data canalso be printed directly from the web browser. Since thesystem is multi-cross platform based, it can be used on
almost any device using any browser in the market. Fromdesktops to laptops and phones using Internet Explorer,
Google Chrome or Firefox, viewing statistics isseamlessly easy and convenient.

employ methods such as calculating averages, standard
deviations, win-loss ratios, and point differentials to gain
a quantitative understanding of player and tournament
performance. These statistical insights can be used tocompare players, assess their progress over time, andmake data-driven decisions. Lastly, by delving into
tournament scores, players and coaches can identify areas
for improvement and refine their strategies. Analyzingscores allows players to understand their opponents'
strengths and weaknesses, enabling them to devise
effective game plans. It also helps players identify theirown shortcomings, such as weak shots or vulnerabilities,
and work on rectifying them.
The primary objective of this project is to develop a webbased application that provides statistical insights of table
tennis tournaments scores by utilizing score values andconverting them into useful data for the user. When users
launch the application, the system will display tabulated
data that are retrieved from the database. The application
contains a built-in control panel for which administrators
can log in and input tournament and match details suchas their name, scores and the players who were involved.
When browsing the application, there are several pages
that perform specific functions. For instance, whennavigated to a “tournaments” page, the system will
display all tournaments that are held in the current year
and in the previous years. On the tabulated results being
displayed, the user can click on available hyperlinks
located in each row of data to be redirected to anotherpage that will show detailed results of the tournament.
The results will include the date for which it was held,
the tournament’s name, the players involved and thescores of each match.
Every table tennis match consists of variables
that can be considered as data [1]. The web application
utilizes MySQL database to store them as records whichthen can be added, modified, or deleted. The system isdynamic so the data being displayed on the web
application will be updated automatically. The
application uses PHP to communicate with the database.
The functional requirements of the system can help users
view tournament statistics in an organized manner. They
will also be able to modify their criteria to view data thathave been previously posted. With the search function
implemented, the user can also create custom searches
for tournaments, matches and players.

13will be used as a web server. A web server is a computerthat stores web server software and a website’scomponent files [6]. (For example: HTML documents,
images, CSS stylesheets, and JavaScript files). A web
server connects to the Internet and supports physical datainterchange with other devices connected to the web. Fig.
2 shows a sample of XAMPP control panel that willallow the developer to activate the Apache server and
MySQL database.

In this project, an opensource software called“phpMyAdmin” will be used to help create the databaseand its corresponding tables [3]. It will also allow
developers to execute MySQL operations such asimporting data into the database [4]. Fig. 1 shows asample of phpMyAdmin interface.

Fig. 1. phpMyAdmin Interface

HTML is used as a markup language to setup the layoutof the web page and CSS was used for styling each webcomponent of the page. By using a combination of theseweb technologies, a table can be created to display the
retrieved data to the user. While HTML and CSS are
responsible for the front-end development, PHP
facilitates in executing back-end operations bycommunicating with the database.

Fig. 2. XAMPP Control Panel

An additional tool that will aid in the programming
process is the installation of an integrated development
environment software. For this project, we will be using
Visual Studio Code since it supports code autocompletion, proper indentation, and software debugging.
Visual Studio Code, like Visual Studio software, isessentially a text editor with pre-installed plugins to aid
in application development [7]. Fig. 3 illustrates anexample of how the IDE organizes code and indents themproperly to aid developers.

2. Methodology
The importance in the usage of methodology in thisproject is the identification of dependent and independent
variables based on the requirement of the user and thesystem.
2.1. Developer Tools
For the ability to run the web application on a device(desktop/laptop), a software called “XAMPP” is utilized[5]. XAMPP is a free and open-source cross-platform
web server solution stack package developed by Apache
Friends, consisting mainly of the Apache HTTP Server,
MySQL database, and interpreters for scripts written in
the PHP and Perl programming languages [3]. XAMPP
contains necessary packages and dependencies that will
make the system operational. It consists of Apache which
14Fig. 4. Incremental & Iterative Development Stages

In the second phase or system analysis phase, it isnecessary to analyze the existing system or requirements
to determine the necessary changes and improvements. It
includes gathering user feedback, conducting feasibility
studies, and identifying system constraints.
2.3. Selected Hardware and Software Settings

Fig. 3. Visual Studio Code Editor

The general hardware requirements, software
specifications, and microcapsules physical properties forboth the user and the developer are tabulated in Table 1,
Table 2, and Table 3 respectively.

2.2. Selected Development Methodology
The Agile Model of Systematic & Iterative Development
is applied in our web design. The primary reason for
selecting this approach is because of the complexity of
the framework that will be developed. The Agile model
provides a great connection between software developers,
analysts, and designers, where flexibility, collaboration,and continuous improvement take center stage. The Agilemodel allows for an efficient and dynamic softwaredevelopment process and hence it is used in this project.
The process focuses on breadth rather than depth. We
will not concentrate on the complexity of the feature
because of the significance of providing few functionalfeatures that the user could utilize until the initial versionof the framework has been created. This will ensure thatthe system operations are designed so that users can use
them [7]. There are 7 phases in the Incremental &Iterative Development Model, which include Planning,
System Analysis, Design, Implementation, Application
Testing, Assessment and Delivery [5]. Fig. 4 illustrates
the title of each stage in the development. In planningphase, the project goals, requirements, and scope aredefined.

Table 1. Basic hardware requirements

Component

Minimum
Requirements

Processor

1.5GHz and above

Memory (RAM)512MB

Hard-disk Space

5GB

Video Graphics Card

DirectX 9 and above

Screen Resolution

1024 x 768 or higher

Table 2. User software requirements

15

Component

Minimum
Requirements

Operating System

Windows XP/7/8/10

Web Browser

Chrome/Firefox

3. Results and Discussion

Table 3. The process yield and physicalproperties of the microcapsules

Component

Minimum
Requirements

Operating System

Windows XP/7/8/10

Web Browser

Chrome/Firefox

Server Software

Apache 2.x or above

Database Software

MySQL 5.0 or above

Integrated
Development
Environment

Visual Studio CodePHP Editor

Visual Studio CodeWeb Server

XAMPP

The following demonstrations were results obtained fromthe web application when launched by the user. As per
depicted in Fig. 6, the web application home page
includes the Id, name, Country name, number of winningcases and the last but not the least, information search has
been provided to cover the in-depth information of theathlete.

The process flow of this module is shown in Fig. 5. The
user will open the web application and will find that the
homepage displays basic table tennis player statistics thatcan be sorted in ascending or descending order based on
the category of sorting that was selected. The categories
can be defined as the player’s name, player’s score or
player’s country of association.

Fig. 6. Web Application Homepage

The homepage of the web application demonstrated inFig. 6, displays basic statistics of the top 10 table tennis
players of the year for both men and women separated
into two tables. Each table will contain the unique
identification number of the player for which can be used
to retrieve their designated records from the databaseusing PHP and MySQLv. Additionally, the name of theplayer described in the second column of the table. The
table will also display the player’s association as well as
their total scores for the year. All data are sorted by theplayers’ total scores in descending order. The table will
also contain a final column which represents amagnifying glass that will redirect the user to a separate
profile page which will describe the information of theplayer in detail when clicked.
An administrator can log into the system by using thelogin form as shown in Fig. 7. The form includes two
input fields: username and password. Once the user
enters their credentials, the web application will crosscheck the details with the user records stored in the
database. If the credentials are correct, the user will be
redirected to the homepage where the navigation bar will
display the full name of the user. If the input values areinvalid, the application will display an error message to

Fig. 5. Module Process Flow

16

the user. Once logged in, the user can click on their fullname located at the top right corner of the application andthey will be redirected to the control panel. The control
panel will allow the user to execute administrative
operations such as adding, modifying, or deleting players.

Fig. 8. Matches List Page

To have a clear analysis on the athletes, the player profile
page is also considered in this web page. The athlete’s
name, gender, age, number of wins and loses followed by
the status of the player as either active or retired isdetermined, as shown in Fig. 9.

Fig. 7. Tournaments List Page

This is applicable to table tennis matches andtournaments as well. The administrative operations are
essentially handled at the back end where PHP willvalidate the user’s input and make changes to the
database accordingly. Fig. 7 is an illustration of the web
application that will display a list of tournaments sorted
in descending order by time (in years). For each row ofdata, the table contains a unique identification number for
reference with the database followed by the name of thetournament being held. The user will be able to see thenumber of total matches that was held during thetournament which can be viewed in detail when the user
clicks on the identification number. They will be
redirected to a separate page that will list all matches andtheir details as shown in Fig. 8.
When viewing the list of matches in a tabulated form, theuser is expected to find the name of players who wereinvolved including the number of points each player has
allocated. The total rounds displayed is calculated basedon the total number of points collected by the match’s
corresponding players.There is always a need for theexact information of the competition lists to have a better
understanding and more reliable analysis in eachtournament and hence, in this web app, the matches list
page has been introduced in which, thetournament, players name and the result of the game has
been stated clearly. This webpage is shown in Fig. 8.

Fig. 9. Player Profile Page

4.

Conclusion

This paper summarizes the development of a web
application for managing and viewing table tennis
tournament scores and statistics. It is a demonstration of
applying efficient methodologies to implement thesystem based on the user requirements as well setting up
the developer’s workspace for application development.
Minimum specifications were stipulated to ensure thatthe system is optimal for development, implementation,and execution to the developer as well as the user. The
objective of this paper was to map out the guidance forsetting up a web server and install the necessarycomponents to successfully run the software.

17

The application is usable in any device across several
platforms and to promote responsiveness and flexibility,
the application can also run on mobile devices with theability to work in almost any web browser.
By running the web application, the user can view
valuable statistical insights about table tennis tournamentscores as well as view additional information about theplayers involved in matches that were held in those
tournaments. Additionally, this paper also describes theother features that was built in the web application
including the dedicated user control panel for executing
administrative operations with the records stored in the
database.

Authors Introduction
Dr. Mastaneh Mokayef
She has received her PhD from
Wireless Communication Centre
Faculty of Electrical Engineering in
University Technology Malaysia(UTM) in 2014. She has also
obtained her master’s degree fromthe faculty of engineering in 2009
from the University Technology
Malaysia. She is a member of Boardof Engineers Malaysia (BEM) since2017, She has been working in UCSI University, Malaysia,
since 2015 in which she currently serves as an AssistantProfessor in the Faculty of Engineering and Built
Environment (FETBE). Her research interests include:
Wireless communications, spectrum sharing method,
spectrum management, cellular communication systems
and Antenna design. To date, he has been awarded with thequalifications of a Chartered Engineer (C.Eng.) from U.K.
Engineering Council.

References
1. Abdullah, R.A., Mokayef, M., Mokayef, M., Tiang, S.S.,& Lim, W.H. (2020). Table Tennis Using Arduino For
Seniors' Healthcare.
2. Zagatto, Alessandro M., Erika A. Morel, and Claudio A.
Gobatto. "Physiological responses and characteristics oftable tennis matches determined in official tournaments."
The Journal of Strength & Conditioning Research 24.4
(2010): 942-949.
3. Amann, Sven & Proksch, Sebastian & Nadi, Sarah &Mezini, Mira. (2016). A Study of Visual Studio Usage inPractice. 124-134. 10.1109/SANER.2016.39
4. Stobart S., Vassileiou M. (2004) MySQL Database and
PHPMyAdmin Installation. In: PHP and MySQL Manual.
Springer Professional Computing. Springer, London.
https://doi.org/10.1007/978-0-85729-404-3_34
5. Cvitić, I., Peraković, D., Periša, M., & Sekondo, M. (2022).
Exploring the Applicability of Open-Source Tools forWeb
Application
Cybersecurity
Improvement.
In International Conference on Future Access Enablers of
Ubiquitous and Intelligent Infrastructures (pp. 64-79).
Springer, Cham.
6. Chan R, Lok K, Woo J. Prostate cancer and vegetableconsumption. Mol Nutr Food Res. 2009;53(2): 201-216.
7. Weintraub, Eli. (2010). Weintraub, E. "A New System
Development Life Cycle Model: Vertical, Integrative andDynamic", IRM - International Conference on Information
Resources Management, USA, 5, 2010.

Mr. Belal Khaled

He received the B.Eng. degree(Hons.) in electrical and electronics
engineering from UCSI University,
Malaysia, in 2020.

Dr. Chin Hong Wong
He is a Lecturer in MaynoothInternational Engineering College at
Fuzhou University in China. He
received his PhD in Electrical andElectronic
Engineering
fromUniversiti Sains Malaysia in 2017.
His research interests are Energy
harvesting and control system.
Dr. Sew Sun Tiang

18

She is an Assistant Professor in
Faculty of Engineering at UCSI
University in Malaysia. She received
her PhD in Electrical and Electronic
Engineering from Universiti Sains
Malaysia in 2014. Her researchinterests are optimization and antenna
design.

Dr. Wei Hong Lim

He is an Assistant Professor in
Faculty of Engineering at UCSI
University in Malaysia. He received
his
PhD
in
Computational
Intelligence from Universiti Sains
Malaysia in 2014. His researchinterests are optimization andartificial intelligence.

Mr. MHD Amen Summakieh
He received the B.Eng. degree(Hons.) in communication andelectronics engineering from UCSI
University, Malaysia, in 2016, andtheM.Eng.Sc.
degreefromMultimedia University, Malaysia, in
2020. His research interests include
heterogeneous
LTE-advanced
cellular networks, user association,
metaheuristic algorithms, and antennas design.
Mr. Miad Mokayef

He is the Head Coach of Iran’s Table
Tennis National Team. He received
his master’s degree in Sport andExercise Physiology in Science andResearch University Iran.

19