Web Technologies used:HTML,CSS and jquery plugins
IDE:VS-Code
Note:Bot is deployed on contact page
Industry Name*:Lifestyle
Project Title*:Hotel Booking Website With FAQ Bot
Problem Statement/Opportunity*:An Hotel Booking company wants to build a sample Front End prototype website for their business as the onine Booking industry has been growing at an incredible rate, and so have many challenges To build a whole website they have chosen Azure Cloud Platform. Build a website that have. Home Page, Explore Page, Rooms Page ,Booking Page,Contact Page,Map Location of each hotel and fully responsive website which can be used on any devices along with FAQ Bot deployed on Website for customers help.
Project Description*:Core Idea of Project is to buid an sample Front End prototype Hotel Booking Website with FAQ Bot for a business Company with the help of HTML,CSS, JAVASCRIPT, jquery plugins .The business-to-consumer is the most visible business use of the Worid Wide Web .The primary goal of sample prototype an Hotel Booking Website is to Book Hotel online anytime anywhere with solving problems of customer speedily via FAQ Bot .This project deal with developing an Hotel Booking Website for Booking any hotel room within a second. It provides the user with a catalog of different Hotels available for Booking Rooms in different cities or countries. We are using Azure Technologies with GiHub to complete this project.
Primary Azure Technology*:Azure Bot Service,QnA Maker,Static Web Apps
Other Azure Technologies:App Service,visual studio code
It is a front-end for a simple hotel booking site. The site is developed using HTML/CSS and jquery plugins are used to provide extra features. There are total 5 webpages of the website.
Home Page - It is a indroductionary page about the hotel itself. It contains various images of the hotel which are slided in a conware fashion using an image slider. It also contains details about the rooms and a link to rooms page. It also shows free features that hotel provides to every visitor. Some reviews that hotel recieved over the years are also represented in a conware fashion. and finally a button which links to hotel booking facility. The image sliders (carousels) for rooms and reviews are draggable for the swift use of mobile users. Every page execpt booking page has a button which links redirects user to booking facility. Footer of every page contains some details about the hotel and address of the hotel along with the social links for the hotel. Scroll to top facility is also provided which redirects user to the top of the page along with a subtle animation when user clicks on a button.
Explore Page - It is a descriptive page for the various features hotel provides. New features can be easily added along with an image. The page follows principle of Minimalism and provides just the features nothing more.
Rooms Page - This page provides all the details about the rooms available in the hotel. When you hover over any of the room the details of that room will pe presented to you with a linear transition which is achieved with pure CSS3.
Booking Page - This is the page which has the booking faciltiy of the hotel. The form contains inputs for name, email-id, type of rooms, Number of rooms, and number of visitors. For number of rooms and visitors spinner buttons are provided (-,+) using a jquery plugin. For Date of Arrival and departure a datepicker jquery plugin is used.
Contact Page - This page can be used to contact the hotel by filling a simple form and ask questions using bot. It also serves purpose of providing the location of hotel in google maps. The location of hotel and zoom levels of the map can be easily modified.