Tour Year

A fully responsive travel blogging website with beautiful UI embed with a trip planning chatbot and voice enabled feedback form and also the feature to post and rate the places you visit in 2021!

Comment

Inspiration

After the long and dull 2020 people all over the world are looking forward to this new year 2021! After the worldwide lockdown, people had been staying in their homes and could not move out. We have all adjusted to this new normal caused because of the pandemic and all of us need some refreshments in our lives. What better an option can that be than travelling to your favorite destinations in 2021! Hence we have built this beautiful responsive travel blogging website with many other features for all the travel lovers!

What it does

The website shows some of the top places all over the world where you can visit, along with blogs of other people where they have shared their experiences about the places they visited. You can visit a place and give a rating or review about it on our website and also post about what you enjoyed about the place so that other people can know what's amazing about it. There is also a voice enabled feedback form where you can submit your feedback or queries. The chatbot that we embedded is basically a trip planner which guides you to choose your holiday destination and we have provided a 24/7 chatbot assistance system with also a helpline number.

Features of the website~

  • Beautiful UI with the photos having the feature of zoom in and zoom out.
  • Hovering and slideshow feature implemented on the photos.
  • Responsive and fully functional website hosted using the registered Godaddy domain name.
  • Used the beta feature Phone Gateway of Google Dialogflow to provide helpline number and 24/7 assistance of the chatbot.
  • Voice enabled feedback form to make it more interactive with the user.

How we built it

  1. HTML, CSS and Javascript- Used for the frontend of the website.
  2. Bootstrap - Imported some awesome font icons, owl carousal theme, AOS library and custom styling.
  3. GoogleDialogflow - Used for making the chatbot.
  4. PhoneGateway- Used this beta feature of dialogflow to connect our chatbot to the helpline number.

Challenges we ran into

Since we are from non-cse background, making a fully responsive front end website was a challenge to us. We referred to several youtube videos and lectures to learn about the coding and how to make our website look more animated with the hovering features and also how to improve the UI of the website. We also used the Google Dialogflow platform for the first time to implement our chatbot. We also faced a problem in the backend part of the voice enabled feedback form.

Accomplishments that we're proud of

We are proud that we could make a fully functional website based on the theme of the hackathon and submit it on time. Although we have still yet a lot more to add to the website but we are happy we were able to try something new and learn a lot during the weekend.

What we learned

We learnt a lot about front end web development, how to make websites responsive, how to use Google Dialogflow and its beta feature- Phone Gateway to connect our chatbot, how to improve the UI of the websites and also how to host our website using the Godaddy custom domains. Being from the non-cse background, we indeed learnt a lot this weekend and hope that you all would love our project! :)

What's next for Tour Year

We are still working on the website to make it better by working on the backend! We will be enabling users to make an account on our website so that they can login using their respective accounts which will help us know how engaging our website is! Hope you like our project! :)

Built With

Share this project:

Updates