Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Service Integration Workshop
Search
Ryan Chung
November 02, 2018
Technology
0
330
Service Integration Workshop
Dialogflow / Bot Framework / Custom Vision
Ryan Chung
November 02, 2018
Tweet
Share
More Decks by Ryan Chung
See All by Ryan Chung
MovieBot Development
ryan403
0
300
Design Voice-First Games for Alexa
ryan403
0
52
AI Teaching Talk
ryan403
0
110
Cognitive Service
ryan403
0
94
jQuery & API Practices
ryan403
0
130
CSS Practices
ryan403
1
150
JavaScript Practices
ryan403
0
96
Web Programming - Lesson 6
ryan403
1
610
Web Programming - Lesson 7
ryan403
1
620
Other Decks in Technology
See All in Technology
データ戦略部門 紹介資料
sansan33
PRO
1
3.2k
doda開発 生成AI元年宣言!自家製AIエージェントから始める生産性改革 / doda Development Declaration of the First Year of Generated AI! Productivity Reforms Starting with Home-grown AI Agents
techtekt
0
140
In Praise of "Normal" Engineers (LDX3)
charity
2
820
JSX - 歴史を振り返り、⾯⽩がって、エモくなろう
pal4de
2
100
Digitization部 紹介資料
sansan33
PRO
1
4.2k
Amplifyとゼロからはじめた AIコーディング 成果と展望
mkdev10
1
190
API の仕様から紐解く「MCP 入門」 ~MCP の「コンテキスト」って何だ?~
cdataj
0
150
AWS と定理証明 〜ポリシー言語 Cedar 開発の舞台裏〜 #fp_matsuri / FP Matsuri 2025
ytaka23
9
2.4k
ObsidianをMCP連携させてみる
ttnyt8701
2
110
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
43
25k
TerraformをSaaSで使うとAzureの運用がこんなに楽ちん!HCP Terraformって何?
mnakabayashi
0
120
産業機械をElixirで制御する
kikuyuta
0
170
Featured
See All Featured
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Become a Pro
speakerdeck
PRO
28
5.4k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Scaling GitHub
holman
459
140k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
43
2.4k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
The Straight Up "How To Draw Better" Workshop
denniskardys
233
140k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
Statistics for Hackers
jakevdp
799
220k
Practical Orchestrator
shlominoach
188
11k
Balancing Empowerment & Direction
lara
1
290
Designing Experiences People Love
moore
142
24k
Transcript
Service Integration –
[email protected]
Service Integration – Chatbot & Custom
Vision AI III Digital Education Institute Source : https://sijieand500words.com Ryan Chung 未來之星 – 菁英培育計畫 1
Service Integration –
[email protected]
資策會 數位教育研究所 ² 最新科技進修 Ø 在職夜間假日進修
Ø 轉職全天養成班 ² 資訊技術充電站 Ø 國際技術趨勢 Ø 職場必備能力 Ø 基本資訊技能 http://taipei.iiiedu.org.tw/ 2
Service Integration –
[email protected]
Ryan Chung ² 主要教授科目 Ø 語音助理應用開發
Ø Chatbot應用開發 Ø Web / App 應用 ² 資策會數位教育研究所 Ø 課程經理 / 養成班導師 Ø 企業包班 / 政府專案經理 Ø 課程專任講師 /專題輔導 http://mobiledev.tw/ryan 3
Service Integration –
[email protected]
AWS AI https://aws.amazon.com/tw/amazon-ai/ 4
Service Integration –
[email protected]
AWS機器學習服務種類 • 架構 Framework & Infrastructure
–Apache MXNet、Caffe & Caffe 2、Tensorflow • 平台 Machine Learning platform –Apache Spark on Amazon EMR、SparkML • 服務 API-driven service –影像辨識 Rekognition、文字轉語音 Polly –聊天機器人 Lex • 模型 Model • 實體 Optimized Instance & Machine Image 5
Service Integration –
[email protected]
AWS ML Stack 6
Service Integration –
[email protected]
Amazon AI 應用服務 • 推薦系統 –Two
Decades of Recommender Systems at Amazon.com • 語音助理 –Amazon Alexa • 無人商店 7 Source:The Verge
Service Integration –
[email protected]
Amazon Comprehend • 語言識別、關鍵資訊擷取、理解正面負面 https://aws.amazon.com/tw/comprehend/ 8
Service Integration –
[email protected]
Amazon Polly • 文字 -> 語音
• 接近真人語音 • 52種聲音、25國語言 • 速度快、準確度高 • 可重複播放使用 9
Service Integration –
[email protected]
SSML • say-as –一個字一個字念 • prosody
–可調整速度、大小聲 • lang –可以穿插別國語言 https://developer.amazon.com/docs/custom-skills/speech-synthesis-markup-language-ssml-reference.html 10
Service Integration –
[email protected]
使用案例 • This app allows you
to easily convert any publicly available RSS content into audio Podcasts, so you can listen to your favorite blogs on mobile devices instead of reading them. https://github.com/aws-samples/amazon-polly-sample Source: meccanismocomplesso.org 11
Service Integration –
[email protected]
微軟認知服務 https://azure.microsoft.com/zh-tw/services/cognitive-services/ 12
Service Integration –
[email protected]
辨識服務 MS Cognitive Service • 辨識
– 可聰明地識別、標示及 控管圖片的影像處理演算法。 • 知識 – 對應複雜資訊和資料,以解決 智慧建議和語意搜尋等工作。 • 語言 – 讓您的應用程式能夠透過預先建置的指令碼處理自然語言、 評估情感,以及了 解如何辨識使用者想要的項目。 • 語音 – 將語音轉換成文字、使用語音來驗證,或將說話者 辨識新增至您的應用程式。 • 搜尋 – 將 Bing 搜尋 API 新增至您的應用程式,並充分利用 以單一 API 呼叫合併數十 億個網頁、影像、影片和新聞的能力。 13
Service Integration –
[email protected]
影像識別:圖片網址 • 輸入圖片網址,可回傳圖片資訊 14
Service Integration –
[email protected]
選取 Computer Vision API https://azure.microsoft.com/zh-tw/services/cognitive-services/computer-vision/ 15
Service Integration –
[email protected]
同意條款並登入帳號 16
Service Integration –
[email protected]
進入 Azure • 左下角 More services
-> Cognitive Services https://portal.azure.com 17
Service Integration –
[email protected]
建立服務 18
Service Integration –
[email protected]
取得 API KEY 19
Service Integration –
[email protected]
測試 • 下載範例 https://ppt.cc/fxtPvx • 填上API
KEY,開始測試 20
Service Integration –
[email protected]
Custom Vision https://www.customvision.ai 21
Service Integration –
[email protected]
建立專案 • New Project -> Add
images • 標記Tag,至少5張照片 –In Classroom • 訓練 • Quick Test 22
Service Integration –
[email protected]
In Classroom 23
Service Integration –
[email protected]
Quick Test 24
Service Integration –
[email protected]
Face API https://azure.microsoft.com/zh-tw/services/cognitive-services/face/ 25
Service Integration –
[email protected]
臉部驗證 • 檢查兩張臉部是屬於同一個人的可能性。API 會傳回信心分數,顯示兩張臉部是屬於同一個 人的可能性。 26
Service Integration –
[email protected]
Microsoft Case – Baby Come Home
https://www.youtube.com/watch?v=AuXnVF_nFws 27
Service Integration –
[email protected]
臉部偵測 • 偵測影像中的一或多張人臉,並取得影像臉部位置所在的臉部矩形 及臉部屬性,該屬性內含以機器學習為基礎的臉部特徵預測。可用 的臉部屬性功能 包括:年齡、表情、性別、姿勢、微笑及鬍子,
以及影像中每張臉部的 27 個地標。 28
Service Integration –
[email protected]
其他服務 29
Service Integration –
[email protected]
整合案例實作 Source: https://www.jiuwa.net 30
Service Integration –
[email protected]
這是不是肯德基 • 語意分析 + 聊天機器人+ 認知服務
+ 部署上線 DialogFlow • 意圖:判斷品牌 • 資料:品牌名稱 認知服務 Custom Vision Service • 圖片分類 MS Bot Framework Bot Channels Registration 31
Service Integration –
[email protected]
DialogFlow • Agent:tellKFCbot • 語言:zh-TW •
Intent:Is it KFC 訓練例句 32
Service Integration –
[email protected]
Action and parameters 33
Service Integration –
[email protected]
Response 34
Service Integration –
[email protected]
Setting • V1 API 35
Service Integration –
[email protected]
建立開發專案 • 專案資料夾:tellKFCBot • 主要程式:index.js •
終端機指令 npm init • package.json 在scripts中增加 "start":"node index.js", "debug":"node --inspect index.js" 36
Service Integration –
[email protected]
index.js 37
Service Integration –
[email protected]
index.js 38
Service Integration –
[email protected]
index.js 39
Service Integration –
[email protected]
index.js 40 https://ppt.cc/fpq6vx
Service Integration –
[email protected]
Custom Vision • Name:tell-KFC • Project
Type:Classification • Domains:Food • Create Project https://www.customvision.ai/projects 41
Service Integration –
[email protected]
上傳KFC照片,按下Train開始訓練 42
Service Integration –
[email protected]
Performance -> Prediction URL 43
Service Integration –
[email protected]
套件安裝 • 終端機: npm-install-all index.js •
新增 .gitignore 檔案 –裡面寫:node_modules/ • Bot Framework版本 – 範例為v3 npm i -S
[email protected]
44
Service Integration –
[email protected]
部署至Heroku • 右上角 New -> Create
new app • 設定App name:tell-kfc-bot • 區域:美國 • Create App 45
Service Integration –
[email protected]
Deploy using Heroku Git • 使用Heroku
Git (Use Heroku CLI) • 下載與安裝 Heroku CLI • 終端機 heroku login cd my-project-dic git init heroku git:remote –a YourProjectNameHere https://devcenter.heroku.com/articles/heroku-command-line 是你在Heroku中的專案名稱哦! 通常長得像 tell-kfc-bot-xxyyzz 46
Service Integration –
[email protected]
開始部署上傳(每次更新步驟亦同) • git add . •
git commit –am "make it better" • git push heroku master • heroku restart 雙引號這邊像是你的上傳筆記 在這裡寫上這次更新的內容 之後code更新時再加這一步 第一次不用 47
Service Integration –
[email protected]
啟動網站 • heroku ps:scale web=1 非常非常關鍵的一步,一定要記得做
48
Service Integration –
[email protected]
找到Heroku的網址 • Domains and certificates https://dashboard.heroku.com/apps/YourAppName/settings
• 其實網址就是 https://YourAppName.herokuapp.com 49
Service Integration –
[email protected]
使用Azure Bot頻道訂閱服務 • 進入 portal.azure.com •
上方搜尋Bot Channels Registration • Bot name:tellKFCBotMMDD • Pricing tier:F0 • Messaging endpoint:heroku網址/api/messages • Application Insights:Off • 點擊App ID and password – Create New – Create App ID in the App Registration Portal – 產生完後,記下來,貼回Azure與程式碼中 • Create 50
Service Integration –
[email protected]
設定EndPoint • Settings -> 設定Messaging endpoint
https://your-project-name.herokuapp.com/api/messages • 完成後按下上方Save 51
Service Integration –
[email protected]
Test in Web Chat • 在Azure雲端上的Web
Chat進行測試 52
Service Integration –
[email protected]
測試 53
Service Integration –
[email protected]
Channels • 依需求再開通哪些頻道可使用服務 54
Service Integration –
[email protected]
Recap for Developer • 新一代的開發者:Connector •
使用者介面、處理機制與雲端資源 • Node.js 在潮流中倍受重視 • 語音助理/Chatbot 設計的第一步是釐清目標 Source : https://sijieand500words.com
Service Integration –
[email protected]
Recap for All • 自然語言交談介面裝置將大舉進入你的生活 •
語言和文化密不可分,跨領域合作優化服務 • 多元化的後端服務與資料,將產生殺手級應用
Service Integration –
[email protected]
敬請指教 Ryan Chung Senior Engineer III
Digital Education Institute
[email protected]
57