AMA COMPUTER LEARNING

CENTER NORTHBAY CAMPUS

Chapter I
Introduction & Its Background

In today's digital landscape, the significance of online stores cannot be overstated. With the
internet becoming an integral part of daily life for billions worldwide, online shopping has evolved from a
convenient option to a fundamental aspect of commerce.
Creating an online store for a Takoyaki establishment is essential to expand reach, increase
convenience, and adapt to changing consumer behaviors. It allows customers to order Takoyaki from
anywhere, at any time, broadening the customer base beyond local foot traffic and providing added
convenience for existing customers. Additionally, an online presence enables the establishment to collect
valuable data, engage with customers through targeted marketing, and stay competitive in an increasingly
digital marketplace.
The Takoyaki Made from Japayuki finally will have their own webpage, a webpage serves as a
platform to showcase the variety and quality of Takoyaki products. Through visually appealing images,
customers can explore the different flavors, ingredients, and toppings available. a business webpage acts
as a virtual storefront, providing potential customers with essential information about the business, such
as location, operating hours, and contact details. This online presence ensures that individuals searching
for authentic Japanese cuisine can easily find and learn about the Takoyaki offerings, increasing foot
traffic to the physical location and generating revenue, and to know more about Takoyaki Made from
Japayuki about the establishment and history of how it's started, who is the owner. Paulo panis, the owner
of Takoyaki made From Japayuki, inaugurated the establishment in May 2020.

Background of the study

Takoyaki Made by Japayuki is a business store that specializes in takoyaki, typically a food
establishment dedicated to the preparation, sale, and often consumption of takoyaki, a popular Japanese
snack or street food, the owner stated that they started their Takoyaki Business in May 2020. They
established this food stall to serve and sell a delicious takoyaki. The store is located in 2414 Bonifacio St
Vitas Tondo Manila at front of Boss King Barbershop in Vitas Bonifacio st. They have no other locations
for their store, The owner with her sister are the only two persons managing the store at the moment,
They have no other employees. Our main goal in proposing a webpage for Takoyaki Made by Japayuki is
to help them enhance their business and also increase their online presence.

1
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
Objectives r
e
 To make an user friendly web page.
 To make an responsive sizes in webpage for mobile phones. 9
 To make an appealing web page designs. .
.
Statement of the Problem:
.
1. Does it easy for the user to use the web page?
2. Does it responds effectively to various screen size for mobile phones?
3. Does the webpage maintain appealing in its design?

2
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
Hypothesis r
e
Enhancing the navigation of a website is crucial for improving its user-friendliness, Ensuring a
9 to
positive user experience. Also use clear menu labels that indicate the content or pages users can expect
find and also limit the number of main menu items to avoid overwhelming users.
.
.
.

SCOPE AND DELIMITATION

This study will focus on creating a webpage using HTML,CSS,JAVASCRIPT languages for
Takoyaki made by Japayuki to provide a user-friendly navigation and responsive web for Takoyaki made
by Japayuki .
The Scope of this study is to provide a user-friendly and easy to navigate webpage, so that
costumers can visit the store easily, see a menu and to know the prices. And it will be usable on any
modern devices like Mobile phone and desktop.The store is located at 2414 Bonifacio St Vitas Tondo
Manila near at Boss King Barbershop in Vitas Bonifacio st. The total respondents are 100 random
persons. The 100 people we will use for the survey are those who live near the store.
This webpage don't have add to cart feature, live chats or chat bots and this webpage don't need
an account to make a purchase.

Significance of the study

This research is made to provide a webpage for business that people tend to look up, the
significance of your practical research in proposing a webpage extends to various groups of people who
can benefit from your work:
Businesses Owners: Businesses that implement the recommendations and findings from your research
can benefit significantly. They may experience improved user engagement, higher conversion rates,
increased sales, and better customer retention. Your research can directly impact their profitability and the
success of their online presence.
Customers: also known as consumers or clients, are individuals or entities that purchase or utilize goods,
products, or services from a business or organization.
Future researchers: Your research can be a valuable resource for educators and students in the field of
web development and design in the future . It can be used as a case study or reference material in
academic programs, enhancing the quality of education and training for future web developer.

3
Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
r
e
Conceptual Framework
9

.
INPUT PROCESS OUTPUT .
.
 Survey
questionnaires
for the  Interview the
respondents and owner
 A webpage with
owner.
appealing
 Profile of the design
respondents :  web design Easy
a) Name to use and
b) Age Navigate
c) Gender
 A webpage that
 Distribution of is easy to use
 100 random survey and navigate
respondents questionnaires to
the respondents
through Google
Forms
 Analyzed and
interpreting the
data collection

4
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
Definition of Terms r
e
Broadening - a process of becoming larger or longer or more numerous or more important
9
Commerce – is the conduction of trade goods and services
.
.
Digital landscape - is the total collection of hardware, software, and content that interact with
digital advertising. .

Foot Traffic - the number of customers that enter a store, mall, or location.

Inaugurated - begin or introduce (a system, policy, or period).

Japanese cuisine -refers to the food and cooking traditions of Japan. It involves a diverse
range of dishes, often featuring fresh ingredients, subtle flavors, and meticulous presentation
Navigation - The process or activity of accurately ascertaining one's position and planning
and following a route.

Overstated - used to say that something is very large or very great.

Responsive sizes - the page adapts to the screen size, so that it contains the same content and
information on any device, but the layout is flexible and adjusts itself depending on the screen size

Revenue - is the money generated from normal business operations, calculated as the average
sales price times the number of units sold

Store - A store is a retail establishment or physical location where goods, products, or services
are made available to customers for purchase or exchange.

Virtual Storefront - form of interactive marketing that allows customers to view and
order merchandise on their computer screens or mobile phones.
Web Page – The Takoyaki Made By Japayuki were displayed using a webpage, which is a
document that can be accessed through a web browser and can display text, photos, video and other
multimedia.

5
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
r
e

9
Chapter II
.
Review of Related Literature Studies .
.
Foreign and Local Literature
The Evolution of Web Design
According to Bonsor, (2020) study explores the evolution of website design since 1989, with the
internet's genesis first proposed by Tim Berners-Lee in 1989. The first live websites were text-based and
required a text-based browser. With increased broadband speeds, innovative software and hardware
solutions were prioritized. Facebook and WordPress revolutionized social media, while YouTube was
acquired by Google in 2005. In the last six years, responsive web design has become the norm, with
mobile users using their devices for internet access. Increased browser support for CSS3 and HTML5 has
enabled high-quality animations and effects. As mobile web usage increases, Google's Mobile-First Index
prioritizes websites that are fast and mobile-friendly.
Website Design Quality
Nicholas Wilson, (2019) website design quality is a multi-dimensional construct with a higher
order structure, influenced by technical, general content, and appearance dimensions. A survey of 216
internet banking users found that these dimensions are most important for users, directly and indirectly
influencing usage behavior. Improving the appearance of a website can enhance overall evaluation and
lead to greater usage intentions.
Web Usability
Maristella Matera, (2006) Web usability refers to the ease of use and user-friendliness of a website for
visitors. A website with good usability is intuitive, easy to navigate, and provides a positive experience
for users. Web applications are complex software products, and usability is crucial for their success. Web
engineering research aims to define methods for usability, with industry attention to usability evaluation
before and after deployment. This chapter introduces principles and evaluation methods for the entire
application lifecycle, illustrating features, advantages, and drawbacks.
Exploring Usability and User-centered Design through Emergency Management Website:
Advocating Responsiveness Web Design
Samantha Cosgrove, (2018) conduct study to explore the usability of the website, applying theories of
user experience design to emphasize the importance of responsive web design in
practice. By rhetorically analyzing the usability of their websites, such as. Ready at the national and local
level becomes a model for the needs of future research and application of user centered design principles.
Responsive web design within emergency management website should be considered when first
evaluating usability and user experience design because of the real-life implications of these interactions.
Responsive web design is a critical aspect of creating a user-friendly and accessible website. It involves
designing a website that can adapt to various screen sizes and device, ensuring that user have a consistent
and seamless experience.

6
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
Customer satisfaction as Mediator Between Website Service Quality and Repurchase Intention:r An
Emerging Economy Case e

Ash N. Sah , (2017) The goal of this research is to develop a research model to understand the9
important dimensions of website service quality and its influence on repurchase intention. The study also
.
analyzes the mediating effect of customer satisfaction on repurchase intention. The results of empirical
.
analysis confirmed that website quality can be conceptualized as a composite of navigation, ease of .
understanding, information usefulness, website design, ease of use, security and privacy, ease of ordering,
and customization. Second, website quality positively affects repurchase intention and customer
satisfaction. Third, website service quality can affect repurchase intention by enhancing mediators like
customer satisfaction, as it has full mediating effect on repurchase intention. This study has developed the
instrument dimensions of website service quality in online shopping context. The study has also refined
the scale of repurchase intention by including “cash-on-delivery” (COD) mode of payment as a new
dimension to inculcate confidence for online shopping in emerging economies.
Web Design: How to Ensure Consistency
K Norbdy, (2018) Ensuring consistency in web design is crucial. Indeed, any area of design can
succeed or fail on the level of how well its various elements sit with each other – and how consistently.
Design is ultimately a form of communication, and if we are to get anything across effectively there must
be an element of constancy in our delivery. In design, this most often means achieving a certain harmony
— between colours and elements, shapes and sizes. Whatever identity your web designer intends to create
for your company, the consistency with which they apply and repeat each element will go a long way
towards ensuring that they achieve their aim.
Design Principles and User Experience
Khalaf, (2019) The increasing use of mobile devices has led to issues with website design and
suitability for different screens. Fixed designs have become inappropriate for developing websites that
display on diverse mobile devices. AW or RW is the best solution, as it ensures full page display without
loss or hiding parts. The transformation towards RW or AW is necessary to design suitable websites for
diverse mobile devices, considering factors like user expertise, device compatibility, cost, usability, and
navigation type. Balancing design and use on technical and artistic levels is crucial to achieve the most
appropriate design that meets the learner's preferences.

Baturay and Birtane, (2021) RW is a flexible web design technique that adjusts the
display dimensions of a web page to the device's screen dimensions and resolution, enabling a full view
of the page. It optimizes learning performance without requiring more effort from web developers,
enables easy access to important information, and offers several advantages, including a more suitable
mobile learning environment, readable, enjoyable, and user-friendly content, and high-quality, easily
uploaded presentations compared to flash-based content presentations.
Burk, (2019) The researcher defines AW as a design technique that creates multiple versions of
sites for each mobile device's characteristics, allowing users to interact with diverse devices. Unlike RW,
AW uses JavaScript to add functions and features based on device, browser capabilities, and screen
resolution. It operates with users through a single link to all templates, while RW only enhances layout.
High-resolution images are provided to devices with high resolution, ensuring a specialized experience
for each device.
\

7
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
Effectiveness of E commerce r
e
Kaplan, (2020) A business's online presence significantly impacts its success, as most customers
visit their website before making a purchase. A strong website can generate more revenue and impact9
results. The quality of a website impacts results, but the article emphasizes the importance of having a
.
website. Many businesses are hesitant to get online due to lack of tech-savvy or price concerns.Back,.
(2015) E-business is a concept that utilizes internet technologies for transactions, primarily through .
websites. Its development was influenced by the rapid growth of the internet, new information and
communication technologies, low implementation costs, and the interactive nature of communication. E-
commerce offers numerous advantages over traditional trade transactions, benefiting companies,
customers, and society.
Current trends
Kopalle, (2022) This research examines AI technologies in marketing through a global lens,
focusing on country, company, and consumer levels. It highlights economic inequality and globalization,
as AI adoption requires significant resources. The company-level analysis examines globalization, as AI
hardware requires adaptation to local cultures. The consumer-level analysis examines consumer ethics
and privacy concerns, as AI collects and processes personal data globally. The research focuses on
human-machine interaction and automated analysis of text, audio, images, and video, aiming to develop
research questions for future marketing scholarship in this crucial domain.
Sung, (2021) A study on consumer responses to a $17 million AI-embedded mixed reality exhibit
in a retail/entertainment complex found that the quality of AI associated with an augmented object
increases MR immersion, spatial immersion, and enjoyment. This increases consumer engagement and
positively influences behavioral responses, such as purchase intentions and sharing experiences with
social groups. The study highlights the potential of interactive AI and MR technology to promote
consumer engagement.
Digital Content Marketing
Macky, (2019) Digital content marketing (DCM) is a growing field aimed at fostering brand
engagement and trust among consumers. However, academic research on DCM is lagging, leading to a
knowledge gap. Hollebeek (2019) defines DCM as creating and disseminating valuable brand-related
content to customers on digital platforms to develop their trust and relationships. A conceptual framework
identifies consumer-based motives for DCM interactions, including uses-and-gratifications. DCM's first-
tier consequences include cognitive, emotional, and behavioral engagement, fostering brand-related
sense-making, identification, and citizenship behaviors.

Synthesis
According to Bonsor, (2020) the first live websites were text-based and required a text-based
browser. With increased broadband speeds,
innovative software and hardware solutions were prioritized. Facebook and WordPress
revolutionized social media, while YouTube was acquired by Google in 2005. ecome the
standard, allowing websites to adapt to different screen sizes and devices. As technology

8
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
continues to advance, the evolution of website design will only continue to progress, with virtual r
e
reality and artificial intelligence shaping the future of web development.
9

.
In his 2019 study, Nicholas Wilson emphasizes that website design quality is a complex .
.
concept consisting of various dimensions such as technical, general content, and appearance.
Through a survey of 216 internet banking users, it was found that these dimensions play a
crucial role in influencing user behavior, both directly and indirectly. Wilson suggests that
enhancing the appearance of a website can significantly improve overall evaluation by users
and increase intentions to use the website more frequently. This highlights the importance of considering
multiple dimensions of website design in order to enhance user experience and drive usage behavior.

Marisella Matera's 2006 study highlighted the importance of website usability, which includes a
website's ease of use and availability to its visitors. This emphasizes the importance of
accessibility when designing and creating websites that users understand.

Samantha Cosgrove's 2018 study explores the usability of emergency management websites
using user experience design theories. She advocates for responsive web design and highlights
the importance of user-centered design principles for effective emergency management
websites, ensuring user needs are met.

Ash N. Sah's 2017 study examines the link between website service quality, customer
satisfaction, and repurchase intention in an emerging economy. It develops a comprehensive
model, revealing that website quality significantly influences customer satisfaction and
repurchase intentions, emphasizing the importance of high-quality services.

K. Norbdy's 2018 study emphasizes the significance of consistency in web design, highlighting
its role in creating visually appealing and user-friendly websites. Consistency in elements like
colors, fonts, and layouts ensures effective communication and enhances the overall user
experience, highlighting the importance of consistency in web design.

9
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
Khalaf's 2019 study highlights the challenges of mobile device use in website design, r
e
suggesting the adoption of responsive web or adaptive web design. These approaches enable
9
websites to adapt dynamically to screen sizes, ensuring content is displayed without
.
compromising usability. The study emphasizes the importance of responsive design principles .
.
for user experience and accessibility.

Kaplan's 2020 study emphasizes the importance of e-commerce for business success,
highlighting the role of a well-designed, functional website in generating revenue and influencing
business outcomes. Back's 2015 study introduces the concept of e-business, emphasizing its
significance in the digital age. Despite challenges like technical expertise and cost, embracing
ecommerce and e-business strategies is crucial for businesses to thrive in the digital economy.

Kopalle's 2022 study analyzes AI trends in marketing from a global perspective, highlighting e
conomic inequality and globalization's impact. It emphasizes the need for significant resources,
adapting AI hardware to local cultures, and ethical considerations at consumer and company
levels. The study underscores the complexities and multifaceted impacts of AI technologies in marketing.

Macky's 2019 study highlights the importance of digital content marketing (DCM) in enhancing
brand engagement and building trust with consumers. Hollebeek (2019) defines DCM as
creating and distributing valuable content to customers, aiming to foster trust and nurture
relationships. These studies highlight the evolving landscape of DCM and its pivotal role in
building brand-consumer relationships.

10
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
r
e

9
CHAPTER III
.
Research Methodology .
.
Research Design
Quantitative research design is defined as a research method used in various disciplines, including
social sciences, psychology, economics, and market research. It aims to collect and analyze numerical
data to answer research questions. The researchers employed this design to assess the webpage
adaptability, accessibility, and information needed by the costumers.
The findings were presented in a comprehensive report that provide insight and recommendations
for the development and marketing of TAKOYAKI MADE BY JAPAYUKI.

Participants
The researchers selected 100 random persons to be interviewed and take the online survey. The
respondents composed of who live near the shop and ages from fifteeen (15)to forthy-two(42).

Data Collection Tools

The researchers interviewed the owner of “Takoyaki Made By Japayuki” to gather information that
can be put in the web page. They also utilized a survey questionnaire on Google Forms to check the
overall performance of the webpage. The first part was used to collect the demographics of the
respondents such as name(optional), age, gender, address, while the second part was used to assess the
technical aspect of the webpage.

Data Gathering Procedure

The researchers met up with the owner of TAKOYAKI MADE BY JAPAYUKI, Mr.Paulo Panis,
personally to interview his background story to gather information in developing this study on the day of
September 26, 2023.
The interview was used to accumulate all data and information embedded to the webpage.
Google Form was utilized to collect the data to test the technical aspect of the webpage and
administered to the respondents
After collecting the survey data, the researchers began the process of data interpretation.

11
 Picture P
10 ... AMA COMPUTER LEARNING i
c
CENTER NORTHBAY CAMPUS t
u
r
e
Data Analysis
9
The researchers obtained information from the respondents and undergone interpretation of the
.
raw data to validate the functions of the webpage. All collected raw data were cleaned, interpreted and
analyzed .
.
The formula used to evaluate the gathered raw data is:
P=F/T x 100
P- Percentage
F- Frequency
T- Total of Respondents

Ethical Considerations
Google forms are utilized as the survey platform to collect data for the research
study, aiming to gather opinions from individuals regarding the responsiveness,
relevance, and modernity of a web page. This also includes ensuring all disclosed
information of the respondents will only be used in this study and will remain confidential and private.

12