yuliya-becode / javascript Goto Github PK

Mission objectives At the end of this challenge you should have improved your: JavaScript skills team skills git conflict skills

Home Page: https://yuliya-becode.github.io/Javascript/

HTML 43.80% CSS 4.01% JavaScript 52.19%

javascript chatbot teamwork bestpractice create

javascript's Introduction

Javascript

Welcome to the webpage of our chatbot!

Link to the chatbot

What

Please see here below the UX Prototyp of our bot. This UX Prototyp has been created in Figma.

Why

A chatbot is a software application used to conduct an on-line chat conversation via text or text-to-speech, in lieu of providing direct contact with a live human agent. A chatbot is a type of software that can automate conversations and interact with people through messaging platforms.

If you're interested to integrate a chatbot into your daily routine or your business life please check here below some advantages and disadvantages of Chatbots.

Advantages of Chatbots

Gather Customer Insights
Increase Sales
Available 24/7
Save Money
Improve Customer Satisfaction

Disadvantages and Risks of Chatbots

Lack Emotions
Difficult to Create
Made to Handle First-Level Questions
Require Maintenance

Chatbots have a number of advantages and disadvantages. However, with the introduction of new technologies and software solutions such as ours, the advantages clearly outweigh the disadvantages.

When

The first self-learning bot was created by Microsoft, which tweeted the self-learning chat Tay in 2016.

Today chatbots are often used in business to advise and provide information to clients. For these purposes, chatbots are most often used in social networks or applications.

Our project has been started on 15/02/2021 and completed on 17/02/2021.

How

Our chatbot is very intelligent and can talk to you in the following structure:

On loading of the page, the bot welcomes the user with a random greeting message (our bot has 5 different welcoming messages).
Then, our chatbot asks the user "How are you doing? Would you like to talk to me?".

The user can reply freely, and the bot will check in the response if he can find a "yes" or a "no":

 if the script find a "yes" in the message, the bot answers with a random sentence from a specific set 
 if the script find a "no" in the message, the bot answers with a random sentence from a specific set 
 if the script cannot find a "yes" or a "no" in the message, the bot answers something like "I didn't understand, can you please try again"
 if the script cannot find a "yes" or a "no" in the message after three attempts, our bot begins to be mad and use "passive-agressive" answer "Are you serious that you don't know how to read questions carefully. I do not want to talk to you anymore. You know where you can find me. Bye!" 
 if our bot receives an empty message, he will answer in the following way "I receive an empty message. Please try again."

According to the mood of our bot, a smurf image will be also changed

If the script finds a "yes" in the message

If the script finds a "no"

If the bot cannot find a "yes" or a "no" in the message

If the bot receives an empty message

After this answer, our bot will finish his routine. He says "bye" to the user and the textarea goes to disabled mode.

Sending a message to the bot has been done by clicking the send button and also by pressing ENTER.

Our bot also suppotrs multi-line messages: by typing SHIFT+ENTER, you can create a new line in the textarea.

Who

Our Project Team consists of

Frontend Developer - Adriana Lazurca (@adriana-lazurca)
Backend Developer - Frances Joffany Navarro (@frances-joffany-navarro)
Project Manager - Yuliya Bochkovskaya (@Yuliya-beCode)

If you have any questions in regards to our project, please do not hesitate to contact us directly on GitHub

Please find here below the Lighthouse Performance Score and notification of W3 Html Checker of our website

javascript's People

Contributors

Stargazers

Forkers

adriana-lazurca

javascript's Issues

firstDraftStructureFigma (done)

Milestone 1

Hi girls,

as already discussed, we have set our first meeting

on 15.02. at 11h00 am.

Agenda points:

Figma design
html structure
js structure.

It will be a pleasure to meet you on Monday ;-)

Kind regards,
Yuliya

Changing format of images

Hey girls,

I have checked with Lighthouse and we have to change the format of images to get a better score.

For it, it is better to directly insert the link of location of image in our HTML and not save the images in local. As I understood it will save the space and guarantee a better score.

@Adriana
Could you please insert the links of images directly in HTML and delete the images from the file "pictures"

I have prepared and already tested. Paragraphs are just to show you which image to which action belongs.

Greeting
<img src="https://banner2.cleanpng.com/20180407/ysw/kisspng-smurfette-gargamel-youtube-papa-smurf-the-smurfs-smurfs-5ac8c89458e6f4.7524528815231079883642.jpg" alt="">

Yes
<img src="https://www.pngjoy.com/pngm/89/1879064_princess-poppy-smurfs-the-lost-village-smurf-blossom.png" alt="">

No
<img src="https://banner2.cleanpng.com/20180528/xca/kisspng-gargamel-the-smurfs-azrael-smurfette-brainy-smurf-smurfs-5b0ba75019a488.002803221527490384105.jpg" alt="">

noAnswer
<img src="https://banner2.cleanpng.com/20180402/lwq/kisspng-grouchy-smurf-brainy-smurf-gutsy-smurf-gargamel-sm-smurfs-5ac28a9f9eb7e2.0511911715226989116501.jpg" alt="">

@frances

For your information: I do not know how it will affect the js part. We should check it.

Thank you girls and see you later

Best.
Yuliya

JS/Array for messages

Dear Frances,

as we have discussed, here is the issue TO DO for setting the array of messages.

List of messages you will find here below.

messages.docx

Best,
Yuliya

JS/image changing function

Dear Frances,

after you complete the issue with the messaging array and function, it would be great if you could create the image changing function, as already discussed.

To have some idea, I will invite you to see my replit under https://repl.it/@YuliyaBochkovsk/JS-change-images-sur-click

Best,
Yuliya

html/semantic structure

Dear Andriana,

could you please also check the semantic structure of our HTML?

Thanks a lot 👍

Best,
Yuliya

Check / README file

Message list

Hey girls,

I just have created the message list for our chatboot 😇 and would like to share it with you.

messages.docx

It would be greate to discuss it, e.g. its integration tomorrow durinng our meeting at 11h00.

Have a good evening & see you tomorrow 😉

Best,
Yuliya

Add "in progress" animation and timeout to simulate "bot thinking"

Meeting / 15.02. at 15h00

Hey girls.

as already discussed, today we will have our google.meet meeting at 15h00.

Herewith I send you the meet link https://meet.google.com/xua-kjii-arg

See you later 👍

Best,
Yuliya

html/figma structure

Dear Adriana,

as already discussed, it would be great if you could integrate our Figma structure into an HTML file.

Here is the link to the Figma https://www.figma.com/file/lFlS61v7WiXLmwrczrTrkL/Micro-chatbot-challenge?node-id=0%3A1

If you have any questions, please ask me.

Best,
Yuliya

Sending a message to the bot is done by clicking the send button or typing ENTER.

Dear Frances,

it would be great if you could integrate the sending of messages by typing ENTER also.

Thanks a lot & have a nice evening

Best,
Yuliya

I will include them through VSC as soon as possible.

Best,
Yuliya

Meeting / 16.02. / 16h30

Hey girls,

here is the link for our upcoming meeting at 16h30

https://meet.google.com/fnr-ztav-dsb

Thanks for your great job

See you 👍

Best
Yuliya

Meeting / 17.02. / 10h00

Hey girls,

here below you will find the link too our meet tomorrow at 10h00

https://meet.google.com/fnr-ztav-dsb

Have a pleasant evening & thanks for your great job

Best,
Yuliya

html/checking responsive design

Dear Adriana,

as already discussed, could you check, if our design is responsive?

Thanks 👍

Best,
Yuliya

CDN

Dear Adriana,

as already discussed, could you please update the cdn links of [email protected] and [email protected].

For bootstrap you can check here https://snyk.io/vuln/npm:bootstrap?lh=4.0.0&utm_source=lighthouse&utm_medium=ref&utm_campaign=audit

For jQuery here https://snyk.io/vuln/npm:jquery?lh=3.2.1&utm_source=lighthouse&utm_medium=ref&utm_campaign=audit

Thanks a lot and see you later 👍

Best,
Yuliya

Customize the contrast

Dear Adriana,

as already discussed, could you please customize the contrast of the following items

Here is an appropriate tool https://contrastchecker.com/

Thanks a lot & see you later 👍

Best,
Yuliya

figma design & list of messages of our chatbot (@Yuliya-beCode)
html structure (@adriana-lazurca)
js structure (@frances-joffany-navarro)
👍

add the scroll

Dear Adriana,

as already discussed, it would be great, if you could add the scroll to the textbox.

Thanks a lot & have a nice evening

Best,
Yuliya

Meeting / 16.02. at 11h00

Hi girls,

as already discussed, herewith I am sending you the link to our meeting tomorrow at 11h00.

https://meet.google.com/fnr-ztav-dsb

I wish you a pleasant evening :-)

Best,
Yuliya

README complete

insert Figma UX Prototype
check the link and functionality

Meeting / 16.02. / 14h30

Dear girls,

as already discussed, here below you will find the meet link to our Meeting today at 14h30

https://meet.google.com/fnr-ztav-dsb

@Adriana: Good luck for your presentation 👍

See your girls,

Best,
Yuliya

JS/function for messages

Dear Frances,

after you create an appropriate arrow for our messages, could you please set an appropriate JS function for them.

If you have any questions, please contact me.

Thanks & best,
Yuliya

yuliya-becode / javascript Goto Github PK

javascript's Introduction

Javascript

Welcome to the webpage of our chatbot!

What

Why

Advantages of Chatbots

Disadvantages and Risks of Chatbots

When

How

Our chatbot is very intelligent and can talk to you in the following structure:

If the script finds a "yes" in the message

If the script finds a "no"

If the bot cannot find a "yes" or a "no" in the message

If the bot receives an empty message

Who

javascript's People

Contributors

Stargazers

Forkers

javascript's Issues

Recommend Projects

Recommend Topics

Recommend Org