CHAPTER I

INTRODUCTION

1.1 The rationale of the project

The internet is known for its one of a kind tool for communication all over the world.
One of the things the internet is useful to humans is the trend nowadays, the Online Ordering
System. This is where the resellers can choose the product they want by visiting a certain
website. This kind of trend has more advantages for both the distributor and the resellers.
This study aims to provide resellers with a way to place an order over the Internet because as
we face the pandemic, some resellers struggle to get their merchandise advertise. In this
project, the proponents focus on online ordering of beauty products are in some branches of
Isabela.
The current system used by the distributor and resellers by taking orders is through
messenger only. And it takes a lot of time by manually processing orders, inventories and
computation of sales and stocks. By using this online ordering system. Both distributors and
resellers will be more benefited. It will speed up the process of their current manual system.
This system aims to provide a web based ordering system called Coolest Beauty Products
Distributor Online Ordering System. Using this system, resellers can order beauty products
from the distributor with less face-to-face interactions. As individuals, we know that business
has great importance in our lives. It is our responsibility to secure the system and information
specialists in the business world. With this system, both resellers and distributors benefit each
other, and they can be assured that the product they buy is genuine and not fake. Also, our
user's information and data are secured with this system.
1.2 Project Highlights
The following are the highlights of the project:
 Helps the distributors focus more on customer’s satisfaction as their key to
growth
 Help the distributors optimally forecast, plan, and align their resources,
inventories, and processes in real-time
 Become the engine that will drive all the distributors’ sales and
distribution activities, allowing them to perform well with increased
productivity
 Allow the distributors to monitor every phase of their supply chain
1.2 Objectives of the Project
This project aims to design and develop a Coolest Beauty Product Distributor
Online Ordering System. Specifically, the proponents aim to:
1. provide an ordering system for Ordering System for distributor and resellers
2. make a website for easier purchasing process
3. assess the acceptability of the entire system to the end-users in terms of; (a)
o effectiveness, (b) efficiency, (c) quality, (d) timeliness;
1.3.1 Test the following system's functionality:
User Account
 Log In
 Automatic Billing
 Ordering Product
 Profile Management
 Logout

Admin
 Login
 Order management
 Manage users
 Product Management
 Inventory Report
 Sales Report
 Update Report
 Logout

1.3.2 Evaluate the system using ISO 25010 (Software Product Quality) as
perceived
by users' acceptability concerning:
 Security
 Functionality
 Performance Efficiency
 Usability
 Compatibility
1.4 Scope and Limitations of the Project

In this study, the researcher is focused on developing an online ordering for Coolest
Beauty Products. The respondents will be distributors and former resellers of the business.
The scope of the system is relying on the functionality handled by the two users: The item
details and availability of the items is posted in the web page of Coolest Beauty Products
Distributor Online Ordering system. Distributors have access to Manage Users, Simple
Inventory, and reseller orders. The system provides convenient in the manipulation of the
product’s database.
The system only contains the Coolest Beauty Products, and the point of sales is not
integrated. The transactions for the payment are only cash on delivery or drop off on the
reseller’s branch. The target locale is the area of Isabela.
 CHAPTER II

REVIEW OF RELATED LITERATURE

This chapter covers the review of related literature and studies the researchers used to
conceptualize this research project. The following are the related literature web-based and
studies:

2.1 Related Literature

In order to achieve commercial success, project management approaches have been
continuously used in enterprises in recent years. The fundamentals of project management,
such as management of quality, time, content, risks, cost, human resources, and
communications, are utilized to increase the coherence and efficiency of project execution in
these businesses. These regulations govern the accuracy of project planning and expenditure
modifications, the speed with which potential internal or external repercussions are
prevented, and the quality with which risk concerns are eliminated. To successfully
implement the organizational-managerial component of the project, it is required to describe,
organize, and standardize the organization's business processes on time. In today's beauty
goods stores, the order processing system is quickly updated and automated. (Ritu Sahu
2019)

Most women in today's world of contemporary conveniences don't think twice about
browsing the Internet for the greatest discounts while shopping especially for beauty items. In
fact, according to CEW and The NPD Group, 57% of beauty shoppers purchase online.
Today, that figure is very certainly greater. Unfortunately, looking for a bargain online to
save money on pricey cosmetic products may end up costing women more in the long run in
terms of their health. We can't go outside to get any beauty goods since we're in the middle of
a pandemic, and we know we can't stay in one location for long because it's possible to
contract COVID-19. (Warlina Neorsidik, 2018)

The online-ordering system is a specialized, complex organizational and technical system that
facilitates the creation, editing, sending, managing access, and delivery of orders in the
direction of the client to the performer, while also being synchronized with the enterprise's
administrative and business accounting and control program. OOS is a single, automated, and
regulated mechanism for entering and processing order data in electronic form, allowing the
notion of "no paper processing of orders" to be effectively implemented. ( Priyanka R.
Shidankar, 20180)
Business transactions have been profoundly affected by advances in information and
communication technology (ITC). Automation in the hotel business has resulted from the
acceptance of wireless technologies and the rise of mobile devices. The integration of
wireless and mobile technology can help businesses in the hospitality industry, such as
restaurants, enhance their operations. With developments in meal ordering technology,
competition in the restaurant sector has intensified. Waiters, pens, and paper were used in the
previous method of ordering. Customers' orders had to be taken to the kitchen, updated in
records, and invoices had to be written up again. Despite its simplicity, this approach may be
prone to human mistake while recording orders. (Shweta Shashikant Tanpure,2018)

The project's goal is to efficiently handle orders by utilizing online services, present daily
menus and pricing for customers, and allow customers to make orders directly. The addition
of new technologies to this system will aid in the future ordering of meals in a more
systematic and adequate manner. The advantages of electronic ordering (e-ordering) systems
are generally recognized, but obtaining these advantages remains a problem, owing in part to
end-user aversion to such approaches. The purpose of this study is to contribute to this field
by assessing practical advice on individual e-ordering acceptance found in the literature, so
enhancing our awareness of the options managers have to impact adoption and usage
behavior. Because of the continuous advancement of technology, every businessperson must
improve his or her technology. Many companies have modified their processes to make them
automated and even online. One of the entrepreneurs works in the culinary industry. The
cafe, for example, is under the culinary industry. The ordering procedure is one item that may
help support the quality of ordering at a restaurant. The menu ordering procedure at the hover
café is still the same as it was before, with a menu book. This can be a concern since the
menu book used to place orders might be destroyed or misplaced, causing the ordering
procedure to be slowed. If the diner places extra orders, the waiter must return to the table to
re-enter the costs. Data collecting, observation, interviewing practice, and a literature study
approach were employed in this study to gather reliable data. The data is then examined using
the SWOT analysis method to determine the company's strengths and weaknesses. (Rizky
Amalia,2020)

The Geancyfood Online Reservation System is a web-based system that allows customers to
make catering bookings online. The system may assist the catering administration in filtering,
monitoring, storing, and safeguarding all bookings records. The system will help the
administration in making their work easy and fast such as updating, adding new menu, and
printing of records since all the files will be stored in the database. It is more safe and
dependable to use an automated online system to handle reports and reservation records than
it is to use a manual one. Clients may check their bookings and availability at any time while
online, as well as make catering reservations straight immediately. For security reasons, only
authorized people can access the system using the login and password. (Nico A. Brigula
October 2016)
The "Pizza Ordering Approach" was created to overcome the issues that plagued the previous
manual system. This program is designed to eliminate or, in certain situations, decrease the
difficulties that the current system has to deal with. Furthermore, this system is tailored to the
company's specific requirements for a smooth and efficient operation. To prevent data entry
mistakes, the program has been kept as simple as feasible. The user does not require any
formal expertise in order to utilize this system. The major goal of the Pizza Ordering System
is to keep track of payment information, customer information, pizza information, and order
status. Because the project is entirely constructed on the administrative side, only the
administrator has access.The goal of the project is to create an application software that will
minimize the amount of time spent manually managing payments, customers, and online
orders. It keeps track of all the information about the pizza, as well as the status of the order.
The goal of the Pizza Ordering Method is to automate the existing manual system using
computerized equipment and full-fledged computer software, so that their vital
data/information may be saved for a longer length of time with ease of access and
manipulation.( Shailesh Prakash Abhang 2021)

The food sector is labor-intensive, and the cost of hiring the proper people to execute the job
is the highest expense. Year after year, labor rates rise, making it tough to find qualified
employees. One option to cut costs is to employ contemporary technology to automate some
of the tasks that would otherwise be performed by humans. We propose a "Online Food
Ordering Management System" for Fast Food, Take-Out, and College Cafeterias. Any group
that distributes food might benefit from using the system. The meal ordering experience for
both the customer and the restaurant is maximized since the whole process of taking orders is
automated. The goal of the online food realtime ordering management system is to allow
consumers to order food and beverages via the internet. The main reason for this is because it
is advantageous to both the client and the seller. The Online Food Ordering Management
System is primarily intended for use in the food-service business. This feature aids hotels and
restaurants in expanding their online meal ordering capabilities.Within minutes, customers
may pick from a large variety of culinary menu items. It is also possible to transport quickly
and simply to a customer's location in today's modern food industry. The Online Food
Ordering Management System provided streamlines the ordering procedure. The suggested
solution displays a user interface and modifies the menu to accommodate all accessible
options, making customer work easier. Customers may order whatever item they want and
change the quantity of the dish. The order confirmation is visible to the consumer on the
website's homepage. The order is added to a queue, updated in real time throughout the
database and admin interface. This technology assists employees in verifying orders in real
time and executing them efficiently and accurately with little mistakes. The consumer may
also reserve a table at a restaurant of his or her choosing and receive confirmation of their
reservation on our website's homepage. ( Karan Dhiman , Mayuresh Phansikar 2021)
With the fast advancement of science and technology, computer technology and information
technology have gotten more mature, and the Internet has become the greatest route and
channel for people to get information, which has had a significant impact on people's dining
lives and habits. To satisfy and facilitate people's living demands, an online meal ordering
system is required. As a new method of consumption, an online meal ordering system allows
users to order great cuisine for friends and family, as well as for themselves, whenever and
wherever they choose. Its growth has opened up new business options for the catering sector,
and it is poised to compete successfully. The object-oriented software development technique
is used in this system, which analyzes, plans, and implements software engineering's essential
phases. However, the system only performs the most basic duties of online ordering for a
small restaurant, and some of them are insufficient. Despite the rise in people's living
standards, the food system still need upgrading to fulfill the high standards and diverse
dietary demands. The invention of an online meal ordering system has addressed a
shortcoming in conventional eating, allowing individuals to enjoy high-quality service while
staying at home.( Huadong Wang 2018)

2.2 CONCEPT OF THE STUDY (IPO)

Figure 1: Coolest Beauty Products Distributor Online

 CHAPTER III
METHODOLOGY

3.1 Requirement Analysis

3.1.1 Fishbone Diagram

Figure 2. Fishbone Diagram

This figure shows the system's main problem, WIREFRAMES, is poor
communication, monitoring, and manual computation of distributor and resellers transactions.

3.1.2 GANTT CHART

 The Gant chart below serves as the guide for the proponents in doing the project and
determining whether the activities involved meet the project deadline.
Figure 3: Gant chart.

The table shows the deliverable and the system's duration; the deliverable contains the
following: Concept Proposal, Project Planning, Development, Testing, Evaluation, and
Documentation with the date period.

3.1.3 WIREFRAMES
RESELLER SIDE

BRANDS

CATEGORIES

OURBRANDS
OURBRANDS

HOME

PRODUCTS

ACCOUNTS

Figure 1. Home Page

Figure 1 shows the Home page of the website for resellers and distributors. The search and
login button, as well as categories, clickable cart symbol and slide promotions, it also
showcase Brands, Products, and information about the admin, with thorough availability for
all interested individuals who will visit the page.
 CATEGORIES

REMOVE IMAGE PRODUCTNAME QUANTITY PRICEPERUNIT SHIPPINGCHARGE

CONTINUESHOPPING UPDATESHOPPINGCART

PROCEEDTOCHECKOUT

OURBRANDS

HOME

PRODUCTS

ACCOUNTS

Figure 5. Cart Page

Figure 5 will allow resellers to view the orders they have placed in their cart. Resellers can
also manage their orders on this page by adding and removing products, and once they have
decided what to purchase they can proceed by clicking Checkout and wait for the distributor
to receive their orders. From here you can also directly go to Home page, Products and
Accounts by clicking the said text button.
 BRANDS

MYPROFILE YOURCHECKOUTPROGRESS

PERSONALINFO My Account

Shipping / Billing Address

Name:
Order History
Email:

Contact No.

UPDATE

CHANGEPASSWORD

OURBRANDS

HOME

PRODUCTS

ACCOUNTS

Figure 6. Account Page

Account page can let Resellers update their basic personal information like Name, Email
and Contact Number as well as manually edit shipping address to their liking. They can also
modify their password here anytime whenever they change their minds, not only that resellers
can also see the entire history of their orders and purchases here which allow them to see
whichever products they want to buy again or see what they already bought.
 BRANDS

# Image Product name Quality Price Charge Grandtotal Order Date Status

OURBRANDS

HOME

PRODUCTS

ACCOUNTS

Figure 7. ORDER HISTORY PAGE

In the order history page resellers can see the history of orders they checked out. They can
see the image of the product, the product’s name, the quality and the price as well as the
grand total if more than one item is added to a single product it also shows the date, and the
status of each product to verify if the orders were successful or denied, in which if denied
they can check out the declined item once again.
 BRANDS

CATEGORIES

AVAILABILTY:
PRODUCTBRAND:
SHIPPINGCHARGE:

₱
QTY: ADDTOCART

DESCRIPTION

RELATEDPRODUCTS

OURBRANDS

HOME

PRODUCTS

ACCOUNTS

Figure 8. Single Product Page

This is the single product page where resellers can see the product’s description such as its
brand, availability of the product, and price including the shipping fee. Resellers can also
modify the quantity of stock they need and when they have finalized their thoughts they can
simply click "add to cart," and the orders will be automatically calculated and will be moved
to their cart for the checkout phase.
Distributor Side
This is the dashboard of the Website for distributors. Every button has a designated function
and importance. Here are the major parts: First is order management, next is manage users,
and lastly inventory.

Figure 9. Order Management

This is the order management wherein the distributor can access all the resellers order and
have control what action to take whether process or decline orders. This page also shows the
history of in-process, delivered, and denied orders for the distributors benefit to lessen the
amount of time to track orders.

Figure 12. Manage User

In this page the Distributor can manage the reseller’s account, view all the basic information
given by the reseller by the time they were able to create one. As shown in figure 12
important details will be shown to the Distributor who has control to delete the users account
to protect the distributor when a reseller commit an inappropriate behaviour during his stay
on the system.
Figure 10. Insert Product
By clicking this page, the distributor can place products into the system for the resellers to
look upon. Distributor can select categories and subcategories depending on what items they
are going to upload, as well as enter the product name, input the quantity of the product, and
most importantly, the product price. It also allows the distributor to select three different
images of the item to showcase what it looks like to the resellers.

Figure 13. Manage Product

In this page the Distributor can see and manage the entirety of the products she inputs from
the insert product page. The distributor can now check and modify all the items that are
shown in the Tab by clicking the action button. She can update the stocks, make changes and
delete the item if it has flaws or out of stock.
Figure 11. Inventory Report

Distributors can view the information about the status of each product and also the product's
history on this page, including how many stocks are available, how many products have been
sold, which products are selling the fastest, category performance and how many items are
still available. Distributors can use the system to update the stock levels to gain important
insights for a better reseller’s satisfaction.
3.2 TECHNICAL BACKGROUND

This chapter describes the technicalities of the project, details of technology to be used, and
how the project work.

Figure 14. Project Framework.

The figure above shows the technical framework of the study. The system runs in a
Wide Area Network. The reseller can access the Website with the use of the Internet then
they can start ordering. The Distributor can access the Website with the help of the Internet,
and they can begin to their transactions of calling. All the saved data goes straight to the
database server.

3.3. Data, Software, and Hardware Specification

3.3.1 DATA
ADMINISTRATOR
o Reseller's info
o Input product info
o Inventory
RESELLER
 o Orders
o Quantity Orders

3.3.2 Software

● HTML = A Hypertext Markup Language is used to create electronic documents

displayed on the World Wide Web. Each page contains a series of connections to
other pages called hyperlinks.
● CSS = Cascading Style Sheets will bring style to your web pages by interacting with
HTML elements. It will also help to create a uniform look across several pages of a
website. Instead of defining the style of each table and each block of text within a
page's HTML, commonly used techniques need to be limited only once in a CSS
document. Once the type is defined in cascading style sheet, it can be used by any
page that references the CSS file. Plus, CSS makes it easy to change styles across
several pages at once.
● JAVASCRIPT = A text-based programming language used both on the reseller-side
or distributor-side to make web pages interactive. Where HTML and CSS are
languages that give structure and style to web pages, JavaScript gives web pages
interactive that engage a user.
● XAMPP = Helps a local host or server test its website and clients via computers and
laptops before releasing it to the central server. It is a platform that furnishes a suitable
environment to test and verify projects based on Apache, Perl, MYSQL, database, and
PHP through the host's system.
● Windows 10 = Is the latest system from Microsoft personal computers. Officially
unveiled in 2014, it introduced the idea of rolling updates to the operating system. It has
one gigahertz (GHz) or faster processor, RAM 1 gigabyte (GB) for 32 GB for 64-bit, hard
drive space is 16GB for 32-bit for 32GB for 64-bits OS, graphics card DirectX9,
and has a display of 800x600.
● Canva = is a graphic design platform used to create social media graphics, presentations,
posters, documents, and visual content.
● MYQL = This application is used for various purposes, including data warehousing,
eCommerce, and logging applications. It can store anything from a single record of
information to an entire inventory of available products for an online store.
● PHP = Hypertext Preprocessors will allow you to collect, process, and utilize data to
create output. PHP will command-line scripting and writing a desktop application
 3.3.3 HARDWARE

HARDWARE SPECIFICATION

Computer Central Processor o Intel Core i-5-8400 Desktop Central Processor

o 6 Cores / 6 threads
o 2.80 GHz up to 4.00 GHz MAX Turbo / 9MB Cache
o Compatible only with motherboards based on Intel
300 Series chipsets
o Intel UHD Graphics 630. Bus speed: 8gt/s DMI3
o MAX Memory Bandwidth 41.6 GB/s
COMPUTER MEMORY RAM (Random Access Memory)
Pins ( 184 DIMM)
Speed ( PC3200 = 400 MHz/ 3200 MBPS
Internal Memory 64 GB

Wireless Mouse with USB Laser sensor (1600 CPI max), with three buttons primary
clickable and a scroll wheel, with the wireless receiver at 2.4
GHz

The table above shows the recommended hardware specifications needed by the
system to run. It must meet the necessary hardware specifications to avoid miscalculations
and the hanging of the system.
3.4 Functional Decomposition Diagram

Figure 15. Functional Decomposition Diagram

The first thing you will see on this website is the landing page, you can see all the
products here, but you won't be able to place an order until you've logged in. When you've
finished logging in, you automatically go to the Reseller page if you're a reseller. Under the
resellers, you'll see the categories, shopping cart, and personal page. There is a cart list under
the shopping cart, place order and check out, and under the individual page, there is My
Purchase, Profile, and Notification. And when the Distributor is finished logging in, she can
see the three functionalities: orders, Manage User, and Inventory. Under orders, she can see
all the updated rankings of the resellers. Under the manage user, you can see the user list, add
user and update user and under the inventory, you can see the update.
3.5 Data flow Diagram

Figure 16: Data flow Diagram

Data Flow Diagram of the System (Admin)

Figure 17: Data Flow Diagram of the System (Admin)

This figure shows the representation of the process to help the readers understand the
operation of the developed system. The Distributor/admin can set up and manage the
resellers' profile, inventory, and orders.
Data Flow Diagram of the System (Reseller)

Figure 18: This figure shows the representation of the process to help the readers understand
the operation of the developed system. The Reseller must log in and choose their orders.
3.6 Entity Relationship Diagram

Figure 19: Entity Relationship Diagram

The above figure shows the Entity Relationship Diagram. Table Landing Page, Table landing
page, Table Shopping Cart, Table Personal Page, Table Inventory, Table Manage Users, and
orders connected in admin/resellers login.
tbl_categories and tbl_product has single relationship as tbl_products burrows tbl_categories
category_id to establish category type of products indicated in tbl_products.
tbl_cart has many to one relationship with tbl_products and tbl_user. tbl_cart requires access
of user from tbl_user to initialize and recognize products user added to cart and products data
will be then collected in tbl_products
tbl_order has one to many relationship with tbl_cart. As the data collected by the cart is
accessed to assess by order
3.7 Systems Design
3.7.1 System Development Methodology
Proponents are going to use the prototyping model in System Development Methodology.
Proponents will build the system's prototype, test it, and rework it until it meets an acceptable
prototype

Figure 20 : System Development Methodology

3.7.2 Development and Testing
Proponents are going to develop the system by using the following:
⮚ Front End
o HTML = A Hypertext Mark-up Language is used to create electronic documents
displayed on the World Wide Web. Each page contains a series of connections to
other pages called hyperlinks.
o CSS = Cascading Style Sheets will bring style to your web pages by interacting with
HTML elements. It will also help to create a uniform look across several pages of a
website. Instead of defining the style of each table and each block of text within a
page's HTML, commonly used techniques need to be limited only once in a CSS
 document. Once the type is limited in cascading style sheet, it can be used by any
page that references the CSS file. Plus, CSS makes it easy to change styles across
several pages at once.
o JAVASCRIPT = A text-based programming language used both on the reseller-side
or distributor-side to make web pages interactive. Where HTML and CSS are
languages that give structure and style to web pages, JavaScript gives web pages
interactive that engage a user.
o Canva = is a graphic design platform used to create social media graphics,
presentations, posters, documents, and visual content.

⮚ Back-End
o XAMPP = Helps a local host or server test its website and clients via computers and
laptops before releasing it to the central server. It is a platform that furnishes a
suitable environment to test and verify projects based on Apache, Perl, MYSQL,
database, and PHP through the host's system.
o VISUAL STUDIO = Can be used for developing websites, web applications, and
web services. It includes a code editor, debugger, GUI design tool, and database
schema designer and supports most major revision control systems.
o Windows 10 = Is the latest system from Microsoft personal computers. Officially
unveiled in 2014, it introduced the idea of rolling updates to the operating system. It
has one gigahertz (GHz) or faster processor, RAM 1 gigabyte (GB) for 32 GB for 64-
bit, hard drive space is 16GB for 32-bit for 32GB for 64-bits OS, graphics card
DirectX9, and has a display of 800x600.
o MYQL = This application is used for various purposes, including data warehousing,
ecommerce, and logging applications. It can store anything from a single record of
information to an entire inventory of available products for an online store.
o PHP = Hypertext Pre-processors will allow you to collect, process, and utilize data to
create output. PHP will command-line scripting and writing a desktop application
3.7.3 Data Gathering Procedure
Proponents conducted a study on the information needed for the system and the technology
and software required to construct it. The proponents interviewed the owner/Distributor of
Coolest Beauty Products and asked the common problems she encounters in the shop every
day. Proponents will use Open-Ended Survey Questions for the Distributor and resellers to
gather the data and use it in the system for better use.
 3.7.4 Data Analysis
Evaluation
Resellers will evaluate this system in different branches of Isabela. Proponents are going to
use the Likert Scale to determine, evaluate give feedback on the system. Formula and
interpreting the result is shown in the table below:

5 4.20 - 5.00 Excellent

4 3.40 – 4.19 Very Good
3 2.60 – 3.39 Weak
2 1.80 – 2.59 Not Satisfied
1 1.00 – 1.79 Not Acceptable

Analysis of Data
3.7.5s Population of the Study

The population of study covers: 1 Distributor or the owner of the shops, 100 total of Resellers
in different branches of Isabela, and 4 IS Experts and a total of 105 respondents
Respondent Total Number

Distributor 1

Resellers 100

IS Experts 4

3.8 Implementation Plan

Action Plan Activities Person Involved Duration

Approval of the Letter for the Researchers and 1 DAY

owner/distributor of Owner/Distributor of Owner/Distributor
Coolest Beauty the Coolest Beauty
Products Product
System Installations Installation of system Researcher 2 DAYS
and software needed

RESELLER Asking Questions to Researchers and 2 DAYS

ACCOUNT the Distributor Owner/Distributor