---
# System prepended metadata

title: AI生成故事

---

# AI 故事生成
## 介面平台設定 
### LINE Bot設定流程(網址 https://developers.line.biz/zh-hant/services/bot-designer/)  
![image](https://hackmd.io/_uploads/SkoC5nG5Jg.png)  
1. 建立聊天機器人(massage API)
 ![image](https://hackmd.io/_uploads/rJ8NYTGq1e.png)  
2. 建立管理者 Admin (massage API)
![image](https://hackmd.io/_uploads/S1ali6G5Jg.png)  
3. 建立Bot 介面
![image](https://hackmd.io/_uploads/Sk67pTzcJg.png)  
![image](https://hackmd.io/_uploads/SJaOyAzcke.png)  
![image](https://hackmd.io/_uploads/Sy4j1RGckl.png)  
(綠點欄位必填)
![image](https://hackmd.io/_uploads/SkOJg0f91x.png)  
![image](https://hackmd.io/_uploads/Bkdqe0zc1l.png)  
![image](https://hackmd.io/_uploads/ByX4bCzckg.png)  
![image](https://hackmd.io/_uploads/SJKSbRM9Je.png)  
![image](https://hackmd.io/_uploads/BkTUb0zqyx.png)  
![image](https://hackmd.io/_uploads/Hk8lMAz9kl.png)
※Issue 產生bot介面資料串流認證權碼(Channel access token)，必需保管儲存※  
### Make.com 註冊流程(網址 https://www.make.com/en/login)  
![image](https://hackmd.io/_uploads/rJ2GF0fqJe.png)
1.      建議選用 google 帳號(  
2.      hosting region: 伺服器位置 (建議 US)  
3.      免費資料串流量1000/mo  
### Get Gemini API Key(https://ai.google.dev/aistudio?hl=zh-tw)  
![image](https://hackmd.io/_uploads/BkZLs1uj1e.png)
![image](https://hackmd.io/_uploads/r1Cp3kdi1x.png)
### motoBlockly 平台設定    
1. motoBlockly網頁入口(http://www.motoduino.com/)
![image](https://hackmd.io/_uploads/r1xYZU65Jg.png)
2. motoBlockly編輯環境及下載燒錄軟體(https://www.motoduino.com/wp-content/themes/storefront/moto_broker/motoblockly_broker_v2.6_setup.exe)  
![image](https://hackmd.io/_uploads/rJxCiz8T51l.png)  
![image](https://hackmd.io/_uploads/SytSt8pqJx.png)
3. 測試範列(LED_Blink)
![image](https://hackmd.io/_uploads/rkBHnIpc1l.png)
### Make.com & Line bot 串流工作佈建  
1. scenarios  
![image](https://hackmd.io/_uploads/B1sTvRG91g.png)  
2. Create a newscenarios 
![image](https://hackmd.io/_uploads/SJqUwCG9Jl.png)  
#### 範例一：學舌鳥  
1. 新建newscenarios  
![image](https://hackmd.io/_uploads/S1YO1Vh9Jx.png)  
    1 建立scenarios 2 LINE 工作服務元件
2. 建立LINE 工作服務元件
![image](https://hackmd.io/_uploads/r19QeNnq1x.png)
    1 Watch Events 等待LINE bot 訊息  
    2 send a Reply Message 回覆至LINE 聊天室
3. 建立 Watch Events元件
![image](https://hackmd.io/_uploads/H1ZJmEhqJg.png)  
    1 加入連線LINE bot
    ![image](https://hackmd.io/_uploads/SJuoVE2q1x.png)  
    ![image](https://hackmd.io/_uploads/HyaLB4n9Jg.png)  
    2 Watch Events元件接收LINE bot 傳訊息網址，將其複製貼至LINE Developers bot
    ![image](https://hackmd.io/_uploads/rywYwVncJg.png)
4. 加入send a Reply Message元件
    ![image](https://hackmd.io/_uploads/rJxGYVh5ye.png)  
    ![image](https://hackmd.io/_uploads/rkcEFN2c1x.png)  
    ![image](https://hackmd.io/_uploads/HymxgB35Jl.png)  
    ![image](https://hackmd.io/_uploads/BklAgS29Je.png)  
5. 執行運作成果
    ![image](https://hackmd.io/_uploads/H1UFMBhcJl.png)  
    1  執行 Run once  
    2  成果
    ![image](https://hackmd.io/_uploads/r1vI7B29kg.png)  
    LINE bot聊天室輸入"你好"
    ![image](https://hackmd.io/_uploads/B1iaXSh91e.png)  
    LINE bot聊天室回覆"你好"  
    
#### 範例二 LINE bot To Mqtt 推播  
1. 利用MQTT伺服器媒介推播及訂閱(https://broker.mqttgo.io/)
※mqtt_topic:公告欄名稱     mqtt_payload:公告欄訊息    Subscriptions:訂閱  
    ![image](https://hackmd.io/_uploads/ByqAqSHj1x.png)
2. 在Make.com->新建newscenarios->Line (Watch Events) 連接 Http(Mark a request)
![image](https://hackmd.io/_uploads/rkohFIHi1e.png)  
![image](https://hackmd.io/_uploads/BJx0VoIrj1g.png) 
3. Mark a request 設定  
![image](https://hackmd.io/_uploads/rJ_sp8SsJe.png)  
4. 測試結果
![image](https://hackmd.io/_uploads/r11JBvSi1g.png)
![image](https://hackmd.io/_uploads/H1LmrwBi1x.png)
### Line Bot & AI 運作工作架構
![image](https://hackmd.io/_uploads/SJTwn0z5Jg.png)
####  範例三 LINE bot To Gemini_AI  
1. 在Make.com->新建newscenarios->Line(Watch Events) -> Http(Mark a request)->Line(Send a Reply Message)  
![image](https://hackmd.io/_uploads/HkX332ojyx.png)  
2. Line(Watch Event) 設定  
![image](https://hackmd.io/_uploads/HylNranjjJl.png)  
3. Http(Mark a request)設定
![image](https://hackmd.io/_uploads/Sk0Cg6oi1x.png)  
![image](https://hackmd.io/_uploads/S1NmzTojyg.png)  
4.Line(Send a Reply Message)  
![image](https://hackmd.io/_uploads/H17t7ajike.png)  
5. 測試成果
![image](https://hackmd.io/_uploads/SJN_Nasiye.png)  
![image](https://hackmd.io/_uploads/SkAnEpjske.png)  
## Line Bot & AI & motoBlockly & NodeMCU-32S 運作工作  
### NodeMCU-32S硬體介紹  
![image](https://hackmd.io/_uploads/SJ7J-_CoJl.png)  
![image](https://hackmd.io/_uploads/ryMfbO0s1e.png)  
#### iMoto ESP32 I/O Board  
![image](https://hackmd.io/_uploads/rJ3rZdAsJl.png)  
### 硬體組裝  
#### MAX98357A接線圖  
![image](https://hackmd.io/_uploads/ByDzfd0iJl.png)  
![image](https://hackmd.io/_uploads/rJ6mM_Cjke.png)  
#### 按鈕+旋鈕接線圖  
![image](https://hackmd.io/_uploads/HkzvfdRjke.png)  
### motoBlockly & NodeMCU-32S 運作工作  
#### 範例四 WIFI & Google 語音播放  
![image](https://hackmd.io/_uploads/B1YcBdCoyx.png)  
#### 範例五 音量旋鈕及按鍵控制  
![image](https://hackmd.io/_uploads/HJdC05RjJx.png)  
#### 範例六 MQTT Publish  
![image](https://hackmd.io/_uploads/HyyyhjPhyg.png)  
#### 範例七 MQTT subscribe  
![image](https://hackmd.io/_uploads/Skw8Ohw3ye.png)  
### Line Bot & NodeMCU-32S 運作工作  
#### 範例八 千里傳音  
1. 利用範例二 Line Bot 推播文字至MQTT Publish  
2. NodeMCU-32S 接收Subscribe訊息播千里傳音  
![image](https://hackmd.io/_uploads/B1FGMpPnkg.png)  













 
   


    
    











