INTRODUCTION AND

MOTIVATION
Introduction
In today's digital age, businesses are constantly seeking innovative ways to enhance customer
engagement and improve operational efficiency. One such solution gaining popularity is the
deployment of chatbots, which provide automated and interactive conversational experiences to
website visitors.
By leveraging artificial intelligence and natural language processing technologies, chatbots can
efficiently handle customer inquiries, offer personalized recommendations, and provide timely
support, leading to enhanced user satisfaction and streamlined operations.

This project report outlines the process and implementation of deploying a chatbot using Azure
services, integrated into a website built with HTML, CSS, and JavaScript. Azure, Microsoft's
cloud computing platform, offers a comprehensive set of tools and services for developing,
deploying, and managing intelligent chatbots. By utilizing Azure services, we aim to create a
user-friendly and responsive chatbot that seamlessly integrates with the website interface,
providing a seamless user experience.

The primary objectives of this project are as follows:

1) Develop an interactive website: The initial step involves designing and developing a visually
appealing website using HTML, CSS, and JavaScript. The website serves as the platform for
hosting and integrating the chatbot, ensuring a consistent and intuitive user interface.

1) Implement chatbot functionality: Leveraging Azure services such as Azure Bot Service,
Language Understanding Intelligent Service (LUIS), and Azure Cognitive Services, we will
build and train a chatbot capable of understanding user queries, generating appropriate
responses, and learning from user interactions. The chatbot will be equipped to handle various
scenarios, including answering frequently asked questions, providing product
recommendations, and offering personalized assistance.

2) Integration with website: We will seamlessly integrate the chatbot into the website, ensuring it
aligns with the overall design and layout. Through effective HTML and JavaScript
integration, users will be able to access the chatbot from any page of the website, allowing for
effortless communication and interaction.

3) Testing and evaluation: Extensive testing will be conducted to ensure the chatbot functions
accurately and efficiently. Various test cases and user scenarios will be considered to evaluate
the chatbot's performance, responsiveness, and accuracy. Feedback from users and stakeholders
will also be collected to further refine the chatbot's capabilities.

4) Deployment and maintenance: Once the chatbot is deemed ready for deployment, it will be
hosted on website, taking advantage of its scalability and reliability. Ongoing maintenance and
monitoring will be performed to address any issues, enhance the chatbot's performance, and
incorporate new features or improvements as needed.
 We hope to improve customer engagement, automate support operations, and increase overall
user satisfaction by implementing a chatbot utilizing Azure services. This project report will go
into detail about the implementation process, issues faced, solutions implemented, and the
ultimate result. We hope to illustrate the usefulness and potential of chatbot technology in
revolutionizing consumer interactions and support services in the digital era through this
Endeavor.

Identify Building
Analyzing intents a
and Respons
the Request
Entities! e

How a Chatbot Works?

 It demonstrates how a chatbot operates. When a user asks a question, the bot will
respond. Analyses the request first, then discovers intents and entities, constructs a
response, and sends it back to the user. Now, intentions refer to the query's intention,
whereas entity refers to the query's specifics In addition, since millennials prefer live chats
over a phone call, they find a chatbot,

 which offers a very interactive marketing platform that is quite appealing. Additionally, a
chatbot can automate repetitive chores. In some cases, a user may require the same query
multiple times in a day, and the support team must react to each query repeatedly. Finally,
the most crucial benefit of having a chatbot is that it is available 24 hours a day, seven days
a week. A user can get an inquiry answered no matter what time it is.

System Design

 The Fit Life Chatbot is an intelligent virtual assistant that provides users with health-
related answers and help. Using Azure services, this chatbot understands user
inquiries and provides correct and personalized responses by leveraging advanced
natural language processing (NLP) and artificial intelligence (AI) capabilities.
 The chatbot is developed on Azure Bot Service, a powerful platform for designing
and deploying conversational agents. It makes use of Azure Cognitive Services,
namely Language Understanding Intelligent Service (LUIS), to extract meaning from
user inputs and determine the intent behind their searches. As a result, the chatbot
can understand a wide range of health-related topics and deliver relevant and
informative responses. The Fit Life Chatbot can understand thanks to Azure
Cognitive Services, which allows it to use pre-trained machine learning models.

Azure Text Analytics

Cognitive
Services
end
S Process
Process Text

Receive Process and Receive

Send Response ntents
I LUIS

Azure Web App

QnA Maker
Azure Bot Service Cosmos DB (Mongo)

System Design

2.1 Microsoft Azure

Microsoft Azure provides cloud services to build, manage, and deploy applications on a
cloud network which helps organizations to meet their business needs using their favorite.
tools and frameworks. College Enquiry Chatbot uses all the services shown in Figure 2
which are provided by Microsoft Azure.
2.1.1 Azure Bot Service

Azure bot service is a service provided by Microsoft Azure which builds and artificial
intelligence (AI) chatbot. It offers the ability to add intelligent agents that can do
conversations with users without having to commit the resources to develop one’s own A I .

2.1.2 Azure Web App

I have used Azure web app to host my bot application built by Azure bot service. Azure
Web App are the web applications which are hosted on Microsoft Azure cloud without any
programming language barrier. Since it is hosted on the cloud, infrastructure maintenance.
is not needed to host the applications. It also provides various features like auto scaling,
automated deployment and supports both Windows and Linux environments.

2.1.3 Azure Cognitive Services

Azure Cognitive services are used to add intelligence to the bots by adding features such
as sentiment analysis and language understanding which help in analyzing user's queries
These services can be added to an existing bot by adding service calls to
 Microsoft’s SDK to get the desired results. College Enquiry Chatbot utilizes Tax
Analytics, LUIS, and QnA Maker services which are part of cognitive services and use
natural language processing (NLP) for different purposes.

2.1.3.1 Text Analytics

Text Analytics is used to perform sentiment analysis on a user’s queries. As shown in

a text is sent to text analytics, turns the sentiment of that text.

2.1.3.2 LUIS

“LUIS stands for Language Understanding Intelligent Services which aims at creating.
cloud-based machine learning language understanding (LU) models specific to an
application and without machine learning expertise” [16]. To implement a College Enquiry
Chatbot, I have first created all the possible intents and entities using LU IS tool. Based on
these intents and entities, LUIS have built and trained a LU deep learning model. Then, the
created model needs to be pushed to the endpoint on the cloud. The queries from the user
are passed to the endpoint to get the recognized intent and entities in JSON format. Based
on various flows, responses will be sent back to the user.

Active learning is also implemented using LU IS as shown in Figure 3. LUIS detects

the user's query (utterances) in terms of intents and entities. It sends back the response to
the service code where those utterances are examined based on the confidence score. Then,
College Enquiry Chatbot labels these utterances, re-trains, and publishes the LU model
Another method of active learning is also implemented which involves using user’s
response to re-train the model. The endpoint provided by LU IS responds with intents,

entities, and a corresponding confidence score. A threshold is maintained based on the

confidence score and corresponding prompts are provided to the user. When the users
respond to it, the system keeps track of the responses and uses it to re-train the model.
2.1.3.3 QnA Maker

For answering simpler queries, instead of detecting intents and entities, College Enquiry
Chatbot uses QnA Maker for structuring answers from a semi-structured document like
FAQs. This web-based service is useful in incorporating multiple FAQs from an URL,
structured documents, product manuals, or editorial contents; and building the LU model.
for natural language processing.

2.1.4 Cosmos DB (Mongo)

Cosmos DB is a database service provided by Microsoft Azure. All my Chat buses this database
service to store my conversational history.
 Implementation

This section of the study provides a step-by-step explanation of how to set up the bot,
LUIS (for NLP), and QnA Maker, as well as an example of service code that contains the
implementation of Active Learning. In addition, the process of creating databases to store
the discussion history is described. All these processes serve as a blueprint for deploying
and publishing a simple bot on the Azure cloud.

The followings are couple of the prerequisites that are needed in order to get started:

· Microsoft Azure Student Account

3.1 Azure Bot Setup

Open https://portal.azure.com and follow the steps explained in the following subsection
3.1.1 Bot Creation

In the left side pane, click on “Create a Resource” and search for “Web App Bot”. As a

next step click on “Create” to start creating a bot. Fill up all the required field
3.1.2 Adding the DirectLine Channel

After the bot has been created, several channels can be configured to access the bot such

as Skype, Webchat, Slack, Facebook, etc. In this project, DirectLine channel is used to

communicate with the bot. It show that how to add a channel to a bot. After the

channel is added, copy the secret key to be used in the service and click on “Done”
Channel Configuration Page of the Bot

Configure DirectLine Channel for the Bot

3.1.3 Testing the Echo Bot

After the channel is configured, we can test the new bot with some preconfigured bot

template where we can echo back whatever the user queries.

Web Chat Testing of the Created Bot

3.2 LUIS Setup

Go to https://www.luis.ai to setup the intents and entities to create a model and train the

natural language processor.

3.2.1 LUIS App Creation

After visiting the website, sign in with the same Azure credentials, scroll down and click

on the button “Create a LU IS app now”

App Bot is created with LUIS bot template, then a LU IS App will be created automatically

with preconfigured intents and entities to work with.

LU IS App Creation

3.2.2 Intents Creation

Go to created LU IS app and click on “Create new intent” and provide a specific intent

Name. The next step would be to add training data to train the intent with all different types of

utterances.
 Intent Creation in LU IS

Adding Training Data to Created Intent

3.2.3 Entity Creation

In the left side pain, click on “entities” and then select “Create an Entity” and provide a

name for the entity. In this project, a list type of entity is used since the professor and course

values are stored in the entity sub list as shown in figures 12 and 13.

Entity Creation in LU IS - 1
 Entity Creation in LU IS - 2

3.2.4 Train and Publish the Model

After adding the intents and entities, the model is trained and published. After the model is

published, R E S T API can be accessed from the service to access the LU IS endpoint to get

the intent and entity from the user’s query.

3.3 QnA Maker Setup

Go to https://www.qnamaker.ai to setup the questions and answers from the FAQs listed

in any website and also to include some of the responses to be displayed depending on

user’s emotions based on some metadata.

3.3.1 chatbot Maker App Creation

After visiting the website, sign in with the same Azure credentials, click on “Create a

knowledge base” from the top navigation bar.

QnA Maker App Creation - 1

QnA Maker App Creation - 2

QnA Maker App Creation –

3.3.2 Add/Manage Knowledge base

Click on “Settings” from the top navigation and add FAQs U R L from the CSUS website

which are needed to be included in the knowledge base .

Knowledge Base Configuration Page

3.3.3 Train and Publish the Knowledge Base

After the knowledge bases are added, the next step is to train the app and publish to get a

published endpoint to use the QnA Maker service.

3.4 Service Code Setup

I am using Azure DevOps to setup continuous deployment with a source control repository

where the code will reside.

3.4.1 Create Project, Repository, and Branches

Sign in to Azure DevOps using the Azure account, create a new project and setup a

repository based on the needs.

Azure DevOps Source Control Repo

Project Creation on Azure Devops

 Repository and branch configuration in Azure DevOps Project

3.4.2 Sync Service Code with Azure DevOps

After the repository is setup, use Git clone functionality to clone the repo onto the local

system and add all the files related to the service into the project. Finally, when a Git push

is made from the same folder, all the files will be copied over to Azure DevOps.

3.5 Setup Continuous Deployment

we need to configure the project created on Azure DevOps with the

application created on Azure portal.

Continuous Deployment Configuration - 1

Continuous Deployment Configuration - 2

Continuous Deployment Configuration - 3

Continuous Deployment Configuration

LU IS and Active Learning Logic - 1

LU IS and Active Learning Logic - 2

 Sample Health

3.6 Deployment of the Web chat over an website

 Execution Results
This section provides execution results for all Chatbots by listing many functions
contained in this project and discussing these functionalities with screenshots.

1) To start chat with the chatbot, a student will have to go to the

https://aaru607.github.io/Kaizen/ and click on the services in the navigation bar as shown in
Figure.

2)Sentiment Analysis
 B The illustration depicts how a bot responds to user queries that are irrelevant, a scenario
where typical bots often lack empathy. To enable the bot to address such responses, it
undergoes training with chitchat integration sourced from QnA Maker. This integration offers a
plethora of question-answer pairs, enhancing the bot's ability to engage with users effectively.
3) Below Figures demonstrates how conversations are saved in the database and how LUIS does
sentiment analysis on user queries before returning a response to the user. In the service that tracks
talks, a bot interceptor is deployed. The user's query is forwarded to the LUIS endpoint, which
includes a sentiment analyzer that determines if the question is positive, negative, or neutral. These
results are then saved in the database for future use.
4) When a user poses a question outside the script's scope, the bot initiates a conversation by asking
clarifying questions to understand the user's query and offer relevant responses. The figure
illustrates an instance where a user randomly asks for a "Name," prompting the bot to present
three alternative options to ascertain the user's intent. Upon the user's selection, the bot generates
a tailored question based on the chosen option and delivers a response accordingly.

5) The system inserts FAQs about Health Roadmap, Troubleshooting IT, and so on. Evaluations and
graduation, applications, existing students, and campus information are all available. Two distinct
highlighted questions and answers from two distinct FAQ URLs are added to QnA Maker.
6) Our chatbot has the ability for providing home remedy for college hostel students who all are
leaving far from their houses for their studies. It has a vast library of remedies for curing different
diseases.

7) Our chatbot has the ability to provide It Troubleshoot problems occurs at the work places the
User who all are from Non IT Field face the some general issues in their daily life to Overcome that
problem we have developed this bot. Below figure demonstrate one of the problem

8) Last but not the least our one another bot named Alchemist works and mainly developed for the
students to overcome their doubts which constantly give them a issues can be cleared over here it
contains all the basic information about their respective Subjects mainly for the Programming
Background to clear their basics.
 CONCLUSION
In summary, integrating multiple chatbots into a website constructed with HTML, CSS, and
JavaScript presents numerous benefits for improving user experience and delivering efficient
customer support. Through the combined use of these technologies, we can create an
interactive and dynamic website that facilitates seamless communication between users and
chatbot systems.

The integration of chatbots enables immediate engagement with users, offering quick
responses to inquiries and support across various tasks. These chatbots can be tailored to
handle diverse scenarios, from addressing common questions to recommending products,
facilitating bookings, or processing transactions. This not only enhances user experience but
also alleviates pressure on human support staff, allowing them to focus on more complex
issues.

HTML structures and provides content for the website, CSS allows customization of visual
appearance, and JavaScript adds interactive and dynamic functionality. These technologies
collaborate to deliver a cohesive and visually appealing user interface for chatbot systems,
with CSS enabling styling of the chatbot UI.

Employing multiple chatbots enhances flexibility in catering to diverse user needs. Each
chatbot can be specialized for specific sectors such as customer care, sales, or product
recommendations, optimizing user experience. Additionally, integrating chatbots with other
web technologies like APIs and databases extends their functionality and ensures continuous
access to essential data and services.

Ultimately, deploying multiple chatbots on a website developed with HTML, CSS, and
JavaScript fosters greater user engagement, streamlined customer assistance, and enhanced
website functionality. By leveraging the strengths of each technology, we can create a
dynamic and immersive user interface that efficiently handles customer inquiries, automates
processes, and delivers personalized experiences.

 Future work of Chatbots

 Enhancements to Natural Language Processing (NLP): Chatbots can be improved to
better understand and respond to human language. Chatbots can give more accurate
and contextually appropriate responses as NLP techniques such as sentiment analysis,
language generation, and entity recognition advance.

 Personalization and User Profiling: Future chatbots will be able to give personalised
experiences by leveraging user data and preferences. Chatbots can modify their
responses to specific users by analysing user interactions and utilising machine learning
techniques, making conversations more customised and effective.

 Multilingual and cross-linguistic Capabilities: Creating chatbots that can interact

effectively in several languages would allow organizations to cater to a worldwide
audience. Future work could concentrate on improving language translation
capabilities and increasing cross-lingual understanding to enable seamless
communication across multiple languages.