[Chatbot] สอนทำ Herb-Herb Chatbot ซื้อน้ำสมุนไพร

Herb-Herb Chatbot สำหรับการติดต่อซื้อน้ำสมุนไพร

ที่มาของแรงบันดาลใจในการทำ Chatbot ตัวนี้ คือ ในโลกปัจจุบันผู้คนใช้เวลากันอย่างเร่งรีบ โดยไม่มีเวลาในการดูแลสุขภาพตัวเอง ซึ่งน้ำสมุนไพรก็เป็นทางเลือกหนึ่งในการดูแลสุขภาพ

Concept

เป็น Chatbot สำหรับการขายรับ Order และบอกสรรพคุณของน้ำสมุนไพรที่ขายได้ ทำให้ช่วยตอบลูกค้า แบบทันทีโดยไม่ต้องรอนาน และช่วยพ่อค้า แม่ค้าประหยัดเวลาในการตอบได้มากขึ้น
สโลแกนของสินค้า : เพื่อสุขภาพที่ดีกว่า ต้องน้ำสมุนไพร Herb-Herb

Dialog การทำงานของแชทบอท

จากรูปด้านบน จะอธิบายเกี่ยวกับทำงานของแชทบอท ซึ่งมีการทำงานหลักๆ 6 Intent คือ
1.Intent การทักทาย
2.Intent เมนู
3.Intent สรรพคุณ
4.Intent การสั่งเครื่องดื่ม
5.Intent ชำระเงิน
6.Intent ขอบคุณ

ต่อไปเรามาดูวิธีการทำ Chatbot จาก Dialogflow กันนะคะ

1.ให้เราเข้าเว็ป www.dialogflow.com พอเข้ามาแล้วจะเจอเหมือนรูปด้านล่าง

How to do Chatbot by Dialogflow1

2.ให้กด Sign up for free และให้เราใส่อีเมล์ ถ้าเข้าเสร็จแล้วจะขึ้นเป็นภาพด้านล่าง

How to do Chatbot by Dialogflow2

3. ให้เรากด Create Agent แล้วใส่ชื่อ Chatbot ที่เราจะตั้งตรง Agent name
เราสามารถตั้งค่าให้เป็นภาษาไทยได้ ตรง Default Language ด้านล่าง เสร็จแล้วให้ กด Create

How to do Chatbot by Dialogflow3

4.เสร็จแล้วจะขึ้นภาพนี้ เราต้องการสร้าง Intent ให้กับตัวChatbot ให้กด Create Intent

How to do Chatbot by Dialogflow4

5.พอเรากด Create Intent ให้เราใส่ชื่อ Intent และประโยคที่เราคิดว่า ประโยคที่ลูกค้าจะพิมพ์ถามเราหรือตอบเรามีอะไรบ้าง ตรงช่อง Training phrases

How to do Chatbot by Dialogflow5

6.ถ้าเราต้องการให้บอกตอบแบบไหน ให้เราเลื่อนหน้าจอลงมาจะเจอกับหัวข้อ Responses ให้เราใส่ประโยคที่ต้องการให้ตัว Chatbot ตอบกลับ ตรงหัวข้อ Text Response

(ส่วนโค้ดตรงช่อง Custom payload จะสอนหลังจากเรานำตัวแชทบอทไปลง LINE แล้ว)

How to do Chatbot by Dialogflow6

7.พอเราใส่ประโยคที่ต้องการให้บอทตอบกลับแล้ว ให้เรากด Save และสามารถลองได้ตรง Try it now ตรงขวามือ
*ในตัวของ Dialogflow จะไม่แสดงตัวโค้ดที่เราเขียนไป ตรง Custom payload

How to do Chatbot by Dialogflow7

8.ถ้าเราสร้าง Intent ต่างๆของตัว Chatbot ที่เราต้องการเสร็จแล้ว เราต้องการนำตัว Chatbot ของเราเข้าใน LINE ให้เราเข้าเว็ป Line Developers หรือพิมพ์ใน Google ว่า Line Developers

How to do Chatbot by Dialogflow8

9.ให้เรากด Log in  และเข้า Log in with LINE account

How to do Chatbot by Dialogflow9

10. ให้ใส่ E-mail และ Password (ต้องเป็น E-mail ที่ลงทะเบียนผ่าน LINE แล้ว)

How to do Chatbot by Dialogflow10

11.พอขึ้นหน้านี้ ให้เรากด Create New Provider

How to do Chatbot by Dialogflow11

12. ให้เราใส่ชื่อ Provider name แล้วกด Confrim

How to do Chatbot by Dialogflow12

13. พอขึ้นหน้านี้ให้เราเลือก Messaging API กดที่ Create Channel

How to do Chatbot by Dialogflow13

14.ให้เราใส่ข้อมูลต่างๆ ของตัว Chatbot

How to do Chatbot by Dialogflow14

 

How to do Chatbot by Dialogflow14.1

App icon – จะเป็นรูปภาพของตัวแชทบอท

App name – เป็นชื่อของตัว Chatbot

App description – คือการอธิบายตัว Chatbot
เลือก Category และ Subcategory ใส่ E-mail address แล้วกด Confirm

15.พอสร้างเสร็จ จะขึ้นหน้านี้ให้เรากดที่ Channel ที่สร้าง

How to do Chatbot by Dialogflow15

16.ให้เราย้อนกลับไปที่ dialogflow แล้วกดที่ Integrations แล้วกดเปิดใช้งาน LINE

How to do Chatbot by Dialogflow16

How to do Chatbot by Dialogflow16.1

Channel ID – ให้เราไป Copy มาจาก Line Developer
Channel Secret – ให้เราไป Copy มาจาก Line Developer
Channel Access Token – ให้เราไป Copy มาจาก Line Developer ( ให้เรากด Issue เลือก 0 hour เสร็จแล้วจะขึ้นให้เราก็อปมาใส่)
Webhook URL – เราจะเอาไปใส่ใน Line Developer Copyจากหน้ารูปภาพด้านบนไปใส่ในรูปภาพด้านล่าง
และเปิดใช้งาน Webhook

How to do Chatbot by Dialogflow16.2

เลข1. คือ ให้เรานำ LINK URL จาก Dialogflow มาใส่
เลข2. ให้เปลี่ยนจาก Disabled เป็น Enabled
เลื่อนลงมา ให้เราเปลี่ยน Auto-reply Messages จาก Enabled เป็น Disabled

How to do Chatbot by Dialogflow16.3

เสร็จแล้วให้เรากลับไปที่ Dialogflow แล้วกดStart ตามที่ไฮไลท์ในรูป ( เนื่องจากเคยคีย์ข้อมูลแล้วปุ่มมันจึงขึ้น Stop แต่คนไม่เคยทำจะขึ้นว่า Start)

How to do Chatbot by Dialogflow16.4

ถัดมาให้กลับไปที่ Line Developer ไปที่ Webhook URL แล้วกด Verify ถ้าขึ้น Success แสดงว่า ตัว Chatbot สามารถใช้งานได้แล้ว

How to do Chatbot by Dialogflow16.5

วิธีการใส่ Sticker Line ใน Chatbot

อย่างแรกกดไปที่ Document ที่ Line Developer

How to do Sticker Line1

พอกดแล้วมันจะเข้ามาหน้านี้ ให้เลื่อนลงมา เลือก Messaging API

How to do Sticker Line2

ถัดมาให้เลื่อนลงหาหัวข้อ Concept และเลือก Messages

How to do Sticker Line3

จะเจอหน้านี้ให้เราเลือก Sticker message

How to do Sticker Line4

ถัดมาให้เราคลิ๊ก Sticker message ตรงไฮไลท์สีเหลือง

How to do Sticker Line5

ไฮไลท์สีเหลือง คือ List ของ Sticker ลักษณะต่างๆ ส่วนวงกลมสีขาวคือโค้ดที่เราจะใส่กัน

How to do Sticker Line6

พอเราเลือก Sticker ที่ต้องการได้แล้วให้ Copy Code ที่วงกลมสีขาว ไปหน้า Dialogflow และไปที่ Intent ที่เราต้องการจะใส่
เลื่อนลงมาตรง Responses จะมีเรากด Add Responses ให้เราเลือก Custom payload
*ก่อนจะวางโค้ดที่เรา Copy มา ให้เราพิมพ์ “line”: ตรงบรรทัดที่สองก่อนจะ Paste โค้ด

How to do Sticker Line7

แค่นี้ก็เสร็จเรียบร้อยแล้วนะคะ สำหรับวิธีการใส่ Sticker Line ใน Chatbot

QR code ของ Herb-Herb

QR Code

ต่อไปเป็นตัวอย่างที่คุยกับแชทบอทนะคะ

Chat with Herb-Herb1

Chat with Herb-Herb2

Chat with Herb-Herb3

Chat with Herb-Herb4

Chat with Herb-Herb5

————————————————————————————————————————————————————

ชื่อ Chatbot : Herb-Herb
จัดทำโดย
นางสาวณิชา ถนอมชาติ 1610900613
เสนอ
อาจารย์ทศพล บ้านคลองสี่
วิชา CE111 ปฏิบัติการวิศวกรรมคอมพิวเตอร์และอิเล็กทรอนิกส์
คณะวิศวกรรมศาสตร์
มหาวิทยาลัยกรุงเทพ
ภาคเรียนที่ 2 ปีการศึกษา 2561

 

  •  
  •  
  •  
  •  
  •  
  •  
NICHA THANOMCHART
at GlurGeek.Com

Leave a Reply