An assistive Health & Fitness application using

enhanced ABC Algorithm

Daryl Tadeo Paolo Miranda Mark Jericho Fabro

Gordon College CCS Gordon College CCS Gordon College CCS
Olongapo City, Philippines Olongapo City, Philippines Olongapo City, Philippines
daryltadss21@gmail.com pacmiranda@gmail.com mjerichfabro09gmail.com

ABSTRACT Diet, Workout, Healthy, Fruitful, Vigorous, Out of

Shape, Admissible
Many people like students, workers or even
people at home are looking for a way to diet. Although
many people tend to diet in their own way without
I. INTRODUCTION
thinking twice what will be the result of it. Despite
having many kinds or way of dieting most of them are
Considering that in today’s situation
just doing they’re diet routines on their own, without
numerous of dietary or health problems are existing.
considering the fact that they’re doing diet routines
In form of not proper diet, not proper workout and
that affecting their own health. Although they just
many more problems related to this like lack of
want the result to lessen fats and become more fit.
financial capability and lack of knowledge on how to
With the help of the survey and interviews the
diet properly. That is why many people is tend to
researchers found out that the random ways of dieting
become unhealthy in a way that some looks thin but
can become a big problem for one’s health. The results
healthy and some looks overweight yet they’re still
say’s that there is an existing difficulty for a person
healthy looks strange isn’t it? Also there are some that
when dieting. Also they are experiencing problems
is overweight but feels light and healthy on their own
such as: how they diet without going to gym and
and there are also some that is underweight but feels
working out. Also what food would they eat if they
perfectly fine and strong as well. So why this scenarios
want to have a healthy diet. As the application
happening? In the first glance nutrition is about the
development title suggest, this assistive health &
foods we eat that nourishes our body and it helps us
fitness application using enhanced abc algorithm is all
become strong and grow. But many of us tends to have
about developing web and mobile application for the
unbalanced nutrition that’s why the above scenarios
proponents and provide smart way to diet. This
are happening.
application aims to provide the proponents smart diet
strategies or plans that is built with food sets and home
Workout and nutrition is the best partner in
workouts that enables them to workout at home.
making our health good and fortify our bodies. It
Another is build an environment for the application
promotes the balanced and relativity of our body and
administrator that makes it easy for them to supply
our health condition. We also sought that this is very
users more plans to choose from.
effective way to become fit and healthy. In today’s
generation that has many more process foods and fast
CCS CONCEPTS foods that is basically delicious yet not recommended
if we talk about healthy foods, So we need to find a
For our web and mobile development. We used way to have an Idea what food to eat and what will be
programming languages like JavaScript and the ideal foods for our health status. In that way we can
Typescript with a help of Ionic framework and CCS to become healthy plus doing the workouts will make it
build the user-interface of the application, finally we more fun and produce greater results in our body
used the Rest API and MySQL for database shape. Lastly one must have the hard work and strong
management. will within ourselves to become a healthy person and
it all starts with our self-discipline and anything that
we do afterwards will succeed.
KEYWORDS
II. STATEMENT OF THE PROBLEM
Most of the people didn’t know how to diet
properly to be specific these problems are the
following:
a) They’re doing diet routines base on their own way
b) When they are working out in gyms most of the time
it does not match with proper meals and resulting in
not so good results
c) Many people are not eating on time and improperly
sometimes a little in their breakfast and too much on
their dinner and lunch vice versa
d) Some people is not eating at all to perform their diet.
III. STATEMENT OF THE OBJECTIVE
The proponent will produce a system
where the people can have their personal dietary plans
to follow with the addition of workout sets matching
the dietary plans in a way that this plans is based on
their BMI and lead them to a healthy way of dieting.
IV. SCOPE AND LIMITATION
The proposed web and mobile application for
now will focus on the features that will lead someone
to a healthy way of dieting using our application in
which this have they’re health tracker, diet strategies,
personalize planner and they can also see their history
in which they can know if they’re losing or gaining
more weight.
V. SIGNIFICANCE OF THE STUDY
This study will greatly benefit the following
people mentioned here who will be the beneficiaries of
this application:
Workers / Students: This will help them primarily
because they’re not more related to physical activities
unless they’re student-athletes or working some
physical jobs like being a carpenter and so on. Means
that they’re much more prone in being unhealthy, It
will help them to become more fit by using the
application to be developed by the proponents.
Athletes / Body Builders: This will help them
improve their overall growth and effect of their
physical activities by matching it with the diet
strategies like we said earlier that good exercise must
be matched with good nutrition to produce an accurate
result or effects to the people.
VI. RELATED LITERATURE
This chapter presents the related
literature and studies, both local and foreign, which
provides a background and conceptual framework to
fully understand the research to be done and lastly the
definition of the terms for better comprehension of the
study.
Diet and nutrition:
Nutrients are consumed through the
food that we eat, and through metabolic processes in
the digestive system these nutrients are absorbed at a
cellular level in the body (Gibney et al. 2009).
Optimum nutrition contributes to health, wellbeing,
normal development, and high quality of life (Gibney
et al. 2009). However, undernutrition, overnutrition,
and malnutrition are linked to suboptimal health
outcomes (Gibney et al. 2009). Such poor diets have
been linked to the occurrence of chronic diseases,
including cardiovascular disease, Type-2 diabetes,
cancer, osteoporosis and anaemia (Lytle et al. 2002).
For example, research reports that low intake of fruit
and vegetables increases the risk for developing cancer
(Steinmetz & Potter 1996), as well as cardiovascular
disease (Hung et al. 2004), whereas low intake of
dietary fibre has been linked to being overweight
(Patrick et al. 2004).
Obesity is often a consequence of overnutrition, and it
is an ever-increasing problem in both developing and
food-secure countries, such as Australia (Gibney et al.
2009). A recent longitudinal study conducted in
Victoria report on the significant increase of obesity
from adolescence to adulthood (Patton et al. 2010).
This study of 1520 adolescents tracked over a period
of 10 years also highlights the decreased likelihood of
overweight adolescents achieving a normal weight in
adulthood (Patton et al. 2010). Frequently linked with
a greater proneness to Type-2 diabetes (e.g., Wang,
Hoy & Si 2010), obesity severely affects health-
related quality of life in a range of domains, including,
physical, social and psychological (Mannucci et al.
2010). However, factors influencing young people in
transition, Melbourne: Incolink & Australian
Clearinghouse for Youth Studies, and reproduced with
permission.
2 obesity and chronic diseases are more complex than
diet alone. For example, together with increased
sedentary behaviour, decreased physical activity has
been shown to play a crucial role in becoming
overweight and obese (Patrick et al. 2004). For the
purposes of this project, and literature review, the
focus will be on the diet and nutrition of apprentices,
although the influence of other factors (e.g., lifestyle
and environmental factors) is acknowledged, but noted
as outside the scope of this project.
The Effects of Nutrition Knowledge on Food Label
Use:
Nutrition information on food labels is an
important source of nutrition information but is
typically underutilized by consumers. This review
examined whether consumer nutrition knowledge is
important for communication of nutrition information
through labels on packaged foods. A cognitive
processing model posits that consumers with prior
knowledge are more likely to use label information
effectively, that is, focus on salient information,
understand information, and make healthful decisions
based on this information. Consistent with this model,
the review found that nutrition knowledge provides
support for food label use. However, nutrition
knowledge measures varied widely in terms of the
dimensions they included and the extensiveness of the
assessment. Relatively few studies investigated
knowledge effects on the use of ingredient lists and
claims, compared to nutrition facts labels. We also
found an overreliance on convenience samples relying
on younger adults, limiting our understanding of how
knowledge supports food label use in later life. Future
research should 1) investigate which dimensions, or
forms, of nutrition knowledge are most critical to food
label use and dietary decision making and 2)
determine whether increases in nutrition knowledge
can promote great use of nutrition information on food
labels.
VII. Technical Background
A. Hardware Used
The proponent would discuss the different
hardware used in developing the proposed system.
Computer
A computer is a machine or device that
performs processes, calculations and operations based
on instructions provided by a software or hardware
program. It is designed to execute applications and
provides a variety of solutions by combining
integrated hardware and software components. This is
also our main device used in building the application
Smartphone
A smartphone is a mobile phone that can do
more than other phones. They work as a computer but
are mobile devices small enough to fit in a user's hand.
Uses include: Sending and receiving emails, text,
photographs and multimedia messages. This will be
used for testing the mobile version of our application.
B. Integrated Development Environment
An integrated development environment
(IDE) is a software application that provides
comprehensive facilities to computer programmers for
software development. An IDE normally consists of at
least a source code editor, build automation tools and
a debugger.
Visual Studio Code
Visual Studio Code is a source code editor
that can be used with a variety of programming
languages, including Java, JavaScript, Go, Node.js and
C++. Instead of a project system it allows users to open
one or more directories, which can then be saved in
workspaces for future reuse. It’s our main source-code
editor for our Mobile Application.
Sublime Text
Sublime Text is a shareware cross-platform
source code editor with a Python application
programming interface (API). It natively supports
many programming languages and markup languages,
and functions can be added by users with plugins,
typically community-built and maintained under free-
software licenses. It’s our main source-code editor for
our Web Application.
C. Ionic Framework
Ionic Framework is an open source UI toolkit
for building performant, high-quality mobile and
desktop apps using web technologies — HTML, CSS,
and JavaScript — with integrations for popular
frameworks like Angular and React. ... Learn to easily
customize and modify your Ionic app's visual design
to fit your brand. Ionic helps us make the structure and
layout of our mobile application.
D. Programming Languages
A programming language is a type of written
language that tells computers what to do in order to
work. Programming languages are used to make all the
computer programs and computer software. ...
Usually, the programming language uses real words
for some of the commands, so that the language is
easier for a human to read. Listed below are the
programming languages used in the development of
the application.
HTML5
HTML5 is the latest version of Hypertext
Markup Language, the code that describes web pages.
It's actually three kinds of code: HTML, which
provides the structure; Cascading Style Sheets (CSS),
which take care of presentation; and JavaScript, which
makes things happen. It is used to layout the overall
page and show things on the part of the page that you
wanted it to show.
Cascading Style Sheets (CSS)
CSS is the language for describing the
presentation of Web pages, including colors, layout,
and fonts. It allows one to adapt the presentation to
different types of devices, such as large screens, small
screens, or printers. CSS is independent of HTML and
can be used with any XML-based markup language. It
is used to make the Frontend for the users and have a
great UI/UX.
JavaScript
JavaScript is a programming language
commonly used in web development. It was originally
developed by Netscape as a means to add dynamic and
interactive elements to websites. ... Like server-side
scripting languages, such as PHP and ASP, JavaScript
code can be inserted anywhere within the HTML of a
webpage. It is used to make functions and hard
complex programs to make the web application
functional and let user do what they want with ease.
jQuery
jQuery is a JavaScript library that allows web
developers to add extra functionality to their websites.
It is open source and provided for free under the MIT
license. ... jQuery can also work with Ajax code and
scripting languages, such as PHP and ASP to access
data from a database. It is used to make JavaScript
code simple to write and read.
AJAX
AJAX stands for Asynchronous JavaScript
and XML. AJAX is a new technique for creating
better, faster, and more interactive web applications
with the help of XML, HTML, CSS, and Java Script.
A user can continue to use the application while the
client program requests information from the server in
the background. It is used to make the Web page
dynamic.
JSON
JSON (JavaScript Object Notation) is a
lightweight format for storing and transporting data
and often used when data is sent from a server to a web
page that is "self-describing" and easy to understand.
This is used by the proponent to make the fetched data
from the back end easy to read.
PHP
PHP Hypertext Preprocessor (or
simply PHP), used by the proponent to create the APIs
connecting to the MySQL database is a server side
scripting language that is used to develop Static
websites or Dynamic websites or Web applications.
PHP stands for Hypertext Preprocessor, that earlier
stood for Personal Home Pages. PHP scripts can only
be interpreted on a server that has PHP installed.
Angular
AngularJS is a JavaScript-based open-source
front-end web framework mainly maintained by
Google and by a community of individuals and
corporations to address many of the challenges
encountered in developing single-page applications. It
is the base of Ionic framework used by the proponent
in developing the mobile application.
TypeScript
TypeScript simplifies JavaScript code,
making it easier to read and debug. TypeScript is open
source. TypeScript provides highly productive
development tools for JavaScript IDEs and practices,
like static checking. TypeScript makes code easier to
read and understand. It is the JavaScript of the Ionic
framework where the functions and methods is made.
G. Application Programming Interface (API)
API stands for Application Programming
Interface. An API is a software intermediary that
allows two applications to talk to each other. In other
words, an API is the messenger that delivers your
request to the provider that you're requesting it from
and then delivers the response back to you
Figure 1 How Rest API works
VIII. METHODOLOGY
A. REQUIREMENTS SPECIFICATION
Based upon the concepts, theories and
findings from related literatures, studies reviews and
insights taken from them, a conceptual model of the
study is shown.
Figure 2 Conceptual Model of the Study
B. DATA AND PROCESS MODELING
In this section, the logical design of the system will be
represented by different diagrams. The technologies
cited on the conceptual model of the study will be the
basis for the actual development of the study.
1. System Architecture
A system architecture or systems architecture is the
conceptual model that defines the structure, behavior,
and more views of a system.
Figure 3 System Architecture of the Study
2. Data Flow Diagram
A data-flow diagram (DFD) is a way of
representing a flow of a data of a process or a system
(usually an information system). The DFD also
provides information about the outputs and inputs of
each entity and the process itself.
Figure 4 Data Flow Diagram of the Study
3. Entity Relationship Diagram
An entity relationship model, also called an entity-
relationship (ER) diagram, is a graphical
representation of entities and their relationships to
each other, typically used in computing in regard to
the organization of data within databases or
information systems.
Figure 5: Entity Relationship Diagram of the Study
C. Design
System design
In this section, interface design of the study will be
presented.
 Figure 6: STRICTFOODS Mobile Splash Screen Figure 9: STRICTFOODS Mobile Plans Page

This page serves as the main splash screen page This plans page is where the users can browse
that redirects mobile user to login. suggested plans for them or either personal
plans for them to use.

This login and register

page is the first step for
the users in using the
Figure 10: STRICTFOODS Mobile Create Plan
application they create
account and logins it to This is the Create Plan page for premium users
access strict foods. where they can create their own plans by picking
through the food sets and workouts supplied by
the database.
Figure 7: STRICTFOODS Mobile Login/Register

Figure 11: STRICTFOODS Mobile Profile Page

This is the profile page where the users can see

Figure 8: STRICTFOODS Mobile User Dashboard their profile summary and manage their account

This is the main dashboard for the mobile users

where they can see their quick summary and
take their health check.
 Figure 12: STRICTFOODS Mobile Edit and
Change Password Page
This is the edit and change pass page nor modal
where the users can update their passwords or
account information.
This is the history page nor
modal where the user can
see his past weight and
height also to check what
his progress so far.
Figure 13: STRICTFOODS Mobile Splash Screen
Figure 14: STRICTFOODS Web Admin Dashboard and
Reports Generation
This is the main admin Dashboard where the
administrators can see the quick reports about
the system and generate it as PDF for printable
reports.
Figure 15: STRICTFOODS Web Manage User
This is the manage user dashboard for the
administrator where he can see the lists of users
and also delete some administrators.
Figure 16: STRICTFOODS Web Manage Foods
This is the manage food part in the administrator
where he/she can add or delete food sets that
can be used in creating plan.
Figure 17: STRICTFOODS Web Manage Exercise
This is the manage exercise part in the
administrator side where he/she can add or
delete workouts that can be used in creating
plan.

Figure 20: STRICTFOODS Web Register

Figure 18: STRICTFOODS Web Admin Create Plan This is where the new users can create their free account in
the application to access it later on.
This is the admin create plan where the
administrator can create plans for the users to
use. Admins can create plans base on his food
sets values and exercise values.

Figure 21: STRICTFOODS Web Login

This is the login page where the users inputs it

credentials to access the app.

Figure 19: STRICTFOODS Web Home Page

This is the main page in web application where the user can
see the quick introduction and what the application can do
for them.
 Figure 22: STRICTFOODS Web User Dashboard Figure 25: STRICTFOODS Profile Page

This is the user dashboard where the users can take This is where the users can manage and view their personal
health check and see quick summary of what his/her information.
health status is.

Figure 26: STRICTFOODS Change Password Modal

Figure 23: STRICTFOODS Web Plans Page This modal is where the users can change they’re password
Where the users can choose from the suggested plans for to a new one.
him/her to use that suggested plans is based on his own
BMI and age.

Figure 27: STRICTFOODS Edit Profile Modal

This modal is where the users can update their information

Figure 24: STRICTFOODS Web History to a new one if there is any changes in his/her information
This is the history page where the users can browse and see like email, number or address.
his/her history that is recorded every time he/she uses
health check.

Figure 28: STRICTFOODS Premium Users Create Plan
Page
This feature is only able for premium users where he/she
can create his own personalize plans by choosing in the
food sets or exercises from the database.
Figure 29: STRICTFOODS Premium Subscription
Payment Modal PayPal Payment
IX. CONCLUSION
With all the studies being considered and taken into
account, the researchers therefore concluded that this
assistive Health & Fitness application using enhanced
ABC Algorithm will help its target customers. In
guiding them to a healthy and proper way of dieting
by the help of diet strategies and workout sets. Also it
will help them even just in maintaining they’re health
status by checking the personal plans they made and
checking their health status in mean time.
X. REFERENCES
https://www.webmd.com/diet/default.htm
https://mymemory.translated.net/en/Tagalog/English
https://www.thesaurus.com/browse/healthy
https://en.wikipedia.org/wiki/Diet_(nutrition)
http://www.nutritionaustralia.org/sites/default/files/Diet%20an
d%20nutrition%20chapter%20from%20Apprentices%20-
%20young%20people%20in%20transition.pdf
https://exerciseright.com.au/exercise-on-a-budget/
https://business.inquirer.net/223197/filipinos-lack-exercise
https://med.stanford.edu/news/all-news/2013/04/change-diet-
exercise-habits-at-same-time-for-best-results-study-says.html
https://www.healthline.com/health/5-benefits-healthy-habits
https://en.wikipedia.org/wiki/Integrated_development_environ
ment
https://simple.wikipedia.org/wiki/Smartphone
https://www.techopedia.com/definition/4607/computer
https://en.wikipedia.org/wiki/Visual_Studio_Code
https://en.wikipedia.org/wiki/Sublime_Text
https://ionicframework.com/docs
https://simple.wikipedia.org/wiki/Programming_language
https://www.techradar.com/uk/news/internet/web/html5-what-
is-it-1047393
https://www.w3.org/standards/webdesign/htmlcss
https://techterms.com/definition/javascript
https://techterms.com/definition/jquery
https://www.tutorialspoint.com/ajax/what_is_ajax.htm
https://developers.squarespace.com/what-is-json
https://www.guru99.com/what-is-php-first-php-program.html
https://docs.angularjs.org/guide/introduction
https://www.tutorialspoint.com/typescript/typescript_overview
.htm
https://blogs.mulesoft.com/biz/tech-ramblings-biz/what-are-
apis-how-do-apis-work/
https://www.tutorialspoint.com/sdlc/sdlc_agile_model.htm
https://www.google.com/url?sa=i&url=https%3A%2F%2Fproj
ect-management.com%2F10-key-principles-of-agile-software-
development%2F&psig=AOvVaw0Y6mYFWSNWrSU_rWfm
5Zhj&ust=1587302698533000&source=images&cd=vfe&ved
=0CAIQjRxqFwoTCOCd7MKQ8ugCFQAAAAAdAAAAAB
AD
https://en.wikipedia.org/wiki/Android_version_history
https://en.wikipedia.org/wiki/Data-flow_diagram
https://www.webopedia.com/TERM/E/entity_relationship_dia
gram.html