Google AssistantFor Education

มหาวิทยาลัยราชภัฏพิบูลสงคราม

บรรยายโดย

วุฒิพงศ์ คงสิบนักวิชาการคอมพิวเตอร์

นักพัฒนาระบบสารสนเทศ

จรรยา ยานะโสนักวิชาการคอมพิวเตอร์นักพัฒนาระบบสารสนเทศ

แนวทางการพัฒนาแอปพลิเคชันบน Google Assistant บริการข้อมูลสารสนเทศ

เครืองมือพัฒนาแอปพลิเคชันบน Google Assistant

การเชือมต่ออุปกรณ์ IOT เช่น การควบคุมระบบไฟฟาด้วยคําสังเสียง

ตัวอย่างแอปพลิเคชัน Google Assistant explore

หัวข้อบรรยายหลัก

การใช้ Smart Device ในยุคปจจุบัน

Smart Device เช่น สมาร์ทโฟนเข้ามามีบทบทบาทในการใช้ชีวิต ประจําวันมากขึน เพราะสามารถเข้าถึงข่าวสารใหม่ๆ และทันเหตุการณ์ได้เปนอย่างดี เนืองจากมีการอัพเดทอยู่ตลอดเวลา ทําให้รูปแบบการค้นหาข้อมูลข่าวสารต่างๆ ของผู้ใช้งานแตกต่างจากเดิมอย่างสินเชิง

Google Assistant คืออะไรระบบสังงานด้วยเสียงจากคําพูด เปรียบเสมือนเลขาส่วนตัว โดยให้ผู้ใช้

งานสนทนากับ Google เพือช่วยทําสิงต่างๆ ได้ด้วยคําสังภาษาไทย เช่น

เปดเพลง หาเส้นทาง หรือตังนา ิกาปลุก เปนต้น

โดย Google Assistant ขับเคลือนด้วย Machine Learning ถูก

พัฒนามาจากประสบการณ์ในการให้บริการด้านการค้นหาข้อมูลของ

Google ทียาวนาน รวมถึงการเข้าใจภาษาธรรมชาติ และการเข้าใจบริบท

ของผู้ใช้งาน ทําให้สามารถเข้าใจบทสนทนา คําถาม และคําสังต่างๆ ทีมีค

วามซับซ้อน โดยเรียนรู้จากสิงทีผู้ใช้งานสนใจ ชอบ หรือไม่ชอบ ซึงการใช้

งานมีความปลอดภัย เปนส่วนตัว และสามารถควบคุมได้

Google Assistant คืออะไร (ต่อ)

ข้อดีของ Google Assistant

– สามารถใช้งานกับมือถือระบบปฏิบัติการแอนดรอยด์ได้เลยทันที

– สามารถแยกเสียงคน และเสียงภายนอกได้

– มีฐานข้อมูลทีมากกว่า สามารถใช้ค้นหา คุยเล่น ได้

– สามารถส่งต่อ เปดแอปฯ เชือมต่อไปยังแอปฯ อืนๆ ได้

– รองรับภาษาไทย ใช้เสียงภาษาไทยได้ และตอบกลับเปนภาษาไทย

– ความน่ารักของการตอบคําถาม เปนกลาง มุขตลกในบางโอกาส

Google assistant diagram (การทํางาน)

เมือเราต้องการสร้างแอปพลิเคชันบน Google Assistant อาศัย 4 ส่วนหลักๆ ดังนี● Google Assistant● Actions on Google● Dialogflow● Webhook

*จําเปนต้องมีบัญชีอีเมล Gmail ของ Google

1. Google Assistantการใช้งาน Google Assistant สิงแรกทีเราต้องมีคือซอฟแวร์

Google Assistant พัฒนาโดยบริษัท Google ให้เราสามารถได้ใช้และค้นหาข้อมูลต่างๆ ได้ฟรี ปจจุบันนีสมาร์ทโฟนทีเปนระบบปฏิบัติการ Android จะถูกติดตังมาเปนทีเรียบร้อย ส่วน ios จะต้องดาวน์โหลดมาติดตังทีเครือง เมือเราต้องการเรียกใช้งาน Google Assistant เพียงพูดว่า “OK Google” ตามด้วยคําถาม

เราสามารถสร้างแอปฯ บน Google Assistant ได้สามารถเข้าดูได้ที https://assistant.google.com/explore/

ตัวอย่างแอปฯ

2. Actions on Google

Actions on Google เปนเครืองมือสําหรับสร้างแอปพลิเคชันสําหรับ Google Assistant โดยทาง Google เห็นความสําคัญในแอปพลิเคชันของแต่ละตัว เบืองต้นทาง Google เปดให้เราสามารถสร้างโปรเจ็คได้ 3 โปรเจ็ค (ด้วยเหตุผลทีไม่อยาก ให้นักพัฒนาสร้างแอปพลิเคชันแบบทิงๆ ขว้างๆ โดยเปล่าประโยชน์) และเราสามารถส่งอีเมลเพือขอขยายการสร้างโปรเจ็คได้ โดยระบุเหตุผลการขอเพิมโปรเจ็ค

2. Actions on Google (ต่อ)Actions on Google เปนแพลตฟอร์มทีนักพัฒนาสามารถใช้สร้าง Actions ทีทํางานตามคําสังของผู้ใช้งานผ่าน

การสังการด้วยเสียง ซึงผู้ใช้งานจะต้องเรียกใช้แอปพลิเคชันหรือ Actions ทีต้องการผ่าน Google Assistant ด้วย

คําสังว่า "talk to <ชือ Action>" สําหรับภาษาอังกฤษ และ "คุยกับ <ชือ Action>" สําหรับภาษาไทย โดยการสนทนา

จะดําเนินไปในลักษณะของการโต้ตอบแบบสองทิศทาง นันคือผู้ใช้จะต้องผลัดกันถาม-ตอบกับ Actions ไปเรือย ๆ จน

จบการสนทนา

หลังจากผู้ใช้งานเรียกใช้ Actions ผ่าน Google Assistant แล้ว อุปกรณ์จะส่งคําพูดหรือข้อความของผู้ใช้ไปยัง

Google Assistant ซึงจะส่งต่อไปยัง Actions ด้วย HTTP request เมือ Actions ทําตามคําสังของผู้ใช้งานเสร็จ

เรียบร้อยแล้วก็จะส่ง HTTP response ตอบกลับมาที Google Assistant เพือแปลงเปนคําพูดแล้วพูดตอบกลับผู้ใช้

2. Actions on Google (ต่อ)เมือต้องการสร้างแอปพลิเคชัน เข้าทีลิงค์

https://console.actions.google.com

2. Actions on Google (ต่อ)หน้าจัดการแอปพลิเคชัน จะประกอบด้วยเมนูต่างๆ เช่น นโยบาย

รูปภาพ รายละเอียดเกียวกับแอปพลิเคชัน การเรียกใช้งานแอปพลิเคชัน “คุยกับศูนย์เทคโนโลยีสารสนเทศ” รวมถึงการทดสอบโปรแกรมรันแอปพลิเคชันของเรา Simulator

Invocation เมนูสําหรับตังชือแอปพลิเคชันเช่น ศูนย์เทคโนโลยีสารสนเทศ การเรียกใช้งาน “คุยกับศูนย์เทคโนโลยีสารสนเทศ” รวมถึงการตังค่าประเภทเสียงของบอท ชาย, หญิง ทีมีหลายเสียงให้เลือกใช้

2. Actions on Google (ต่อ)

Actions เปนเมนูสําหรับเรียกใช้งานเครืองมือออกแบบการสนทนา เช่น การกําหนดคําต่างๆ เพือโต้ตอบกับผู้ใช้งาน คือ “Dialogflow” พัฒนาโดยบริษัท Google ตัว Dialogflow มีความฉลาดมาก มีระบบเรียนรู้คํา สามารถแยกแยะคําพูด เพือหาคําตอบทีถูกต้องมาตอบโต้กับผู้ใช้งานได้อย่างถูกต้อง

2. Actions on Google (ต่อ)

Theme customization เปนเมูนูสําหรับปรับแต่งความสวยงามให้มีความน่าใช้และโดดเด่นกับแอปพลิเคชันของเรา เช่น การกําหนดสี ฟอนต์ รูปภาพ เปนต้น

2. Actions on Google (ต่อ)

Simulator เปนเมนูสําหรับจําลองการทํางาน โดยในการทดสอบ Actions ให้พิมพ์คําว่า "คุยกับศูนย์เทคโนโลยีสารสนเทศ" ในช่องข้อความ หรือคลิกทีตัวเลือกใน Suggested input ก็ได้

2. Actions on Google (ต่อ)

Directory information เปนเมนูแสดงรายละเอียดข้อมูลเกียวกับระบบ ซึงสามารถเข้ามาเปลียนภาษา กําหนดคําบรรยายของระบบประโยคทักทายเริมต้น รูปภาพ ข้อมูลการติดต่อ นโยบายสาธารณะ และการตังค่าเพิมเติมอืนๆ

2. Actions on Google (ต่อ)

Location targeting เปนเมนูทีใช้ในการกําหนดพืนทีการให้บริการ ซึงมีประเทศให้เลือก หากไม่ต้องการให้เปดใช้งานในประเทศไหน เพียงคลิกเครืองหมาย ✅ ออก

2. Actions on Google (ต่อ)

เมนูอืนๆ

● Surface capabilities

● Manage releases

● Analytics

● Account Linking

● Brand verification

● Backend services

2. Actions on Google (ต่อ)

https://dialogflow.com หรือ https://api.ai

3. Dialogflow

3. Dialogflow

การระบุหรือเรียกใช้งาน Action Api ระหว่าง Actions on Google กับ Dialogflow โดยเราสามารถเลือกเชือมต่อได้ทังปรับแต่งเองหรือที Dialogfolw จัดเตรียมไว้ให้ ปกติแล้วให้เลือก Custom intent เพือเราสามารถปรับแต่งได้ตรงตามวัตถุประสงค์ของงาน

เมนูนีจะแสดง Intent ทังหมดของ Actions โดยจะมี Intent เริมต้น

ทีระบบสร้างขึนมาให้โดยอัตโนมัติทังหมด 2 Intent ได้แก่ Default

Fallback Intent และ Default Welcome Intent

3. Dialogflow

เมือคลิกที Default Welcome Intent

3. Dialogflow

ในส่วนของ Events (หมายเลข 1) จะเปนการผูกเหตุการณ์เข้ากับ intent นี ซึงระบบได้ผูก

เหตุการณ์ Welcome ไว้ให้อัตโนมัติ นันหมายความว่าเมือ Actions นีถูกเรียกใช้งาน intent นีก็

จะทํางานเปนอันดับแรก

ในส่วนของ Response (หมายเลข 2) จะมีช่องให้เราพิมพ์ข้อความที Actions จะใช้

ตอบกลับเมือ intent นีถูกเรียกให้ใช้งาน และข้างล่างกรอบจะมีตัวเลือกอยู่ ถ้ากดเปดใช้จะทําให้

Actions จบการสนทนาทันทีที intent นีทํางานเสร็จ

ในส่วนของ Response สามารถคลิกปุมถังขยะเพือลบข้อความทังหมดออก จากนันคลิก

ปมุ ADD RESPONSE แล้วเลือก Text response จากนันให้ใส่ข้อความว่า "ยินดีต้อนรับสู่ศูนย์

เทคโนโลยีสารสนเทศ สวัสดีค่ะ สบายดีไหมคะ" คลิกปุม SAVE เพือบันทึกการเปลียนแปลง แล้วคลิ

กเมนู Intents ทีอยู่แถบซ้ายมือเพือกลับไปหน้าแสดง intent ทังหมด

3. Dialogflow

การสร้าง Intent ใหม่

3. Dialogflow (ต่อ)

คลิกปมุ CREATE INTENT เพือสร้าง intent ใหม่

ในหน้าสร้าง intent ใหม่ จุดทีต้องใส่ข้อมูลจะมีอยู่สามจุด ได้แก่

3. Dialogflow (ต่อ)

ชือ intent, Training phrases และ Responses 1. ชือของ intent จะต้องใส่ชือทีไม่ซากับ intent อืน ในทีนีให้

ใส่เปน Welcome Response Intent

3. Dialogflow (ต่อ)

2. Training phrases เปนส่วนทีกําหนดว่า intent นีจะทํางานเมือได้รับคําสังอะไรมา

จากผู้ใช้ ให้คลิกปุม ADD TRAINING PHRASES แล้วใส่คําว่า "สบายดี" ซึงนันหมายความว่า เมือผู้ใช้งานพูด

คําว่า "สบายดี" ก็จะเปนการสังให้ intent นีทํางาน

3. Dialogflow (ต่อ)

3. Responses

ให้คลิก ADD RESPONSES แล้วใส่คําว่า "ดีใจทีได้ยินเช่นนัน" จากนันให้คลิกปุม SAVE แล้วคลิกเมนู

Intents ทีอยู่แถบซ้ายมือเพือกลับไปหน้าแสดง intent ทังหมด

3. Dialogflow (ต่อ)

3. Default Fallback Intent โดยเจ้า intent ตัวนีจะทํางานในกรณีทีคําสัง

ของผู้ใช้ไม่ตรงกับ intent ไหนเลย ซึงเราจะทํา

การแก้ไขในส่วนของ Responses เพือให้ Actions

จบการสนทนาเมือ intent นีทํางานเสร็จ

สามารถลบข้อความเก่าออกแล้วเพิมข้อความใหม่

ลงไปแทน จากนันคลิกใช้งานจบการสนทนาแล้วจึงค

ลิกปมุ SAVE ซึงหลังจากทําการตังค่าต่าง ๆ เสร็จ

เรียบร้อยแล้ว ก็จะมาทดสอบ Actions ได้

3. Dialogflow (ต่อ)

Integrationคลิกทีเมนู Integrations ทีอยู่ใน

แถบเมนูฝงซ้าย เพือทดสอบ Actions

หลังจากคลิกแล้วจะมีปอปอัพขึนมา ให้

เลือนลงไปข้างล่างกดใช้งานตัวเลือก

"Auto-preview changes" แล้วคลิ

กปมุ TEST ระบบจะเปดหน้า

Simulator ของ Actions Console

ขึนมา

3. Dialogflow (ต่อ)

Simulator ของ Actions Console

4. Webhookเชือมต่อกับ webhook

สร้าง Actions on Google ให้เชือมต่อกับ webhook เพือเพิม

ความสามารถในการโต้ตอบ เช่น การเชือมต่อฐานข้อมูลภายในองค์กร

เปน JSON format ภายในเปน array เก็บของในรูปแบบของ webhooks event objects

4. Webhook (ต่อ)

เชือมต่อกับ webhook

ในส่วนของ Fulfillment คลิกเปดให้ intent นีมีการเรียกใช้งาน webhook

ซึงเปนทีเก็บโค้ดสําหรับประมวลผลและสร้างข้อความโต้ตอบแบบไดนามิก โดย

สามารถสร้าง webhook ได้ 2 วิธี

● สร้างภายใน Dialogflow ผ่านเมนู Inline Editor

● สร้างที Server ภายนอก จากนันนํา url มาใส่ให้ Dialogflow

เมือเปดการเรียกใช้งาน webhook เรียบร้อยแล้วให้คลิกปุม SAVE

4. Webhook (ต่อ)

สร้าง Webhook บน Inline Editorวิธีนีจะเปนการสร้าง webhook ภายใน Dialogflow ซึงถือเปนวิธีสร้าง

webhook ทีง่าย เนืองจากเราไม่จําเปนต้องติดตังอะไรลงบนเครืองของเรา โดยวิธี

สร้างให้คลิกทีเมนู Fulfillment ทีอยู่ในเมนูด้านซ้ายมือ คลิกเปดการใช้งาน Inline

Editor

4. Webhook (ต่อ)

การสร้าง Webhook บน Inline Editor

โค้ดทีใช้ใน webhook จะเขียนด้วยภาษา Javascript หรือ TypeScript

และเรียกใช้งาน Actions on Google Node.js client library เพือตอบกลับ

HTTP requests ที Google Assistant ส่งมาที webhook ซึง

conv.parameters จะเก็บตัวแปรทีมาจาก Entity

4. Webhook (ต่อ)

การสร้าง Webhook

บน Inline Editorถ้าใช้ conv.ask() บทสนทนาจะยังไม่

จบ แต่ถ้าใช้ conv.close() บทสนทนาจะ

จบทันที

จากนันให้คลิกปุม DEPLOY เพือใช้

งานโค้ดปจจุบัน และจะใช้เวลาในการ

deploy สักครู่

4. Webhook (ต่อ)

การสร้าง Webhook บน Inline Editor

Inline editor ของ Dialogflow จะ deploy โค้ดของ webhook บน

Cloud Functions for Firebase ซึงเปน cloud service ของ Google ซึง

วิธีนีจะต้องใช้ Node Package Manager หรือ npm ทีเปนตัวจัดการแพ็คเกจ

เสริมต่าง ๆ โดยเจ้าตัว npm นีจะถูกติดตังมาพร้อมกับ Node.js

4. Webhook (ต่อ)

วิธีติดตัง Node.jsให้เข้าไปที Nodejs.org แล้วเลือกตัวติดตังตามทีต้องการ

กดติดตัง หลังจากติดตังเสร็จแล้ว ให้เปด Command Prompt (สําหรับ Window) หรือ

Terminal (สําหรับ Mac) ขึนมาแล้วพิมพ์คําสัง node -v

ถ้าหาก Command Prompt (หรือ Terminal) แสดงเลขเวอร์ชันของ Node.js ขึนมา ก็

แปลว่าเราได้ติดตัง Node.js เสร็จเรียบร้อยแล้ว

4. Webhook (ต่อ)

วิธีติดตัง Node.js

ถัดไปเราจะต้องติดตัง Firebase Command Line Interface (CLI) ให้พิมพ์คําสัง

npm -g install firebase-tools

เราสามารถเช็คว่าติดตัง Firebase CLI สําเร็จหรือไม่ ได้โดยการพิมพ์คําสัง

firebase --version

ถัดไปให้ทําการ Login Firebase CLI โดยการพิมพ์ firebase login

4. Webhook (ต่อ)

Command Prompt (หรือ Terminal) จะเปดเว็บบราวน์เซอร์ขึนมา เพือให้ login

Account ของ Google เมือ login แล้ว ก็จะเจอหน้า Firebase CLI ขอสิทธิการ

เข้าถึง Google Account ให้คลิกปุม อนุญาต

จากนันให้สร้างโฟลเดอร์ทีจะเก็บโปรเจค แล้วย้ายเข้าไปยังโฟลเดอร์นัน

mkdir test-action

cd test-action

จากนันก็ทําการ init ตัว Cloud Functions for Firebase ด้วยคําสัง

firebase init functions

การสร้าง Webhook บน Cloud Functions for

Firebase

4. Webhook (ต่อ)

การสร้าง Webhook บน Cloud Functions for

FirebaseCommand Prompt จะแสดงตัวเลือกให้เลือกโปรเจคทีเราต้องการจะใช้งาน

จากนันก็กดปุม enter แล้ว Firebase CLI จะแสดงคําถามขึนมา

ให้เลือกอีก 3 คําถาม ได้แก่

● โปรเจคจะใช้ภาษา Javascript หรือ TypeScript

● โปรเจคจะใช้ ESLint เพือตรวจสอบ bug และ code style หรือไม่ (ตอบ Yes)

● ต้องการให้ติดตัง dependencies ทันทีเลยหรือไม่ (ตอบ Y)

4. Webhook (ต่อ)

การสร้าง Webhook บน Cloud Functions for

Firebaseจากนันรอให้ Firebase CLI ทําการ Initial โปรเจคขึนมา ให้เข้าไปยังโฟลเดอร์

functions แล้วทําการติดตัง Actions on Google Node.js client library ด้วยคําสัง

cd functions

npm install actions-on-google

เปดไฟล์ firebase.json และ index.js

เพือแก้ไข เมือแก้ไขเสร็จแล้ว ให้ใช้คําสัง

firebase deploy

4. Webhook (ต่อ)

การสร้าง Webhook บน Cloud Functions for

Firebaseเมือกลับไปทดสอบการทํางานใน Actions Console จะเห็นได้ว่า Actions มี

การทํางานแบบเดียวกับตอนทีใช้ webhook บน Inline Editor แต่ต่างกันเล็กน้อย

ทีประโยคตอบกลับ ซึงข้อดีของการสร้าง Webhook บน Cloud Functions for

Firebase นันก็คือ เราสามารถใช้งาน JavaScript Library ตัวอืนเสริมได้ด้วย

ซึงจะเพิมประสิทธิภาพในการเขียนโค้ดนันเอง

SmartHome

การประยุกต์ใช้งาน Google Assistant ควบคุมบ้านอัจฉริยะ

Private serverNodemcu esp8266

Q & A