物聯網-以智慧輪椅為例

智齡聯盟跨領域人才培育課程模組-107年優化版

物聯網以智慧輪椅 為例 胡碩誠 助理教授 世新大學 資訊管理學系

本教材內容採用創用CC，「姓名標示-非商業性-相同方式分享」3.0台灣授權條款。

目錄 ✽ 03 概述 ✽ 05 模組規劃 ✽ 07 實施步驟及內容 08 單元一：物聯網-智慧輪椅背景介紹及系統架構 13 單元二：網頁程式設計開發 20 單元三：Arduino YUN無線網路設定 25 單元四：感測器的簡介與應用&無線傳輸 39 單元五：YBB CAR馬達校正&遠端行進控制 44 單元六：關卡設計與競賽

✽ 53 實際案例 – 智慧輪椅工作坊 53 教學實況紀錄 56 學生成果花絮

✽ 58 建議及注意事項 59 模組開發歷史

2

物聯網 - 以智慧輪椅為例 開發教師

物 聯 網 應 用 開 發

胡碩誠 助理教授 世新大學 資訊管理學系

智 慧 輪 椅

概述 模組簡介 本模組設計主要目的是希望不同領 域的同學都能學習到程式設計的基 本概念，並透過實作對於新興科技 應用能有所領悟。 本課程將使用Arduino Yun為主控 制板的輪型機器人作為智慧輪椅的 硬體部分。學員將學習到多個常見 的感測器模組、伺服馬達的原理和 如何使用Arduino Sketch程式來存 取或控制這些硬體，也教導學員使

用HTML與JavaScript來撰寫動態網 頁，透過動態網頁與硬體互動，讓 使用者可以利用任何平台的行動裝 置來操控輪型機器人，能在螢幕上 看到感測器資料以及即時的攝影機 畫面，模擬出高齡者使用智慧輪椅 的情境。最後，學員們將活用所學 到的軟硬體整合技術，透過競賽的 方式，思考如何設計出兼顧安全與 實用性的智慧輪椅。 3

模組目標 瞭解物聯網的基本概念 實際操作物聯網的應用 瞭解物聯網的未來發展 跨領域合作

教學時數 本模組包括六個單元，總計教學時數為8小時。 單元⼀：物聯網-智慧輪椅背景介紹及系統架構（1小時） 單元⼆：網頁程式設計開發（1小時） 單元三：Arduino YUN無線網路設定（1小時） 單元四：感測器的簡介與應用&無線傳輸（1.5小時） 單元五：YBB CAR馬達校正&遠端行進控制（1.5小時） 單元六：關卡設計與競賽（2小時）

適⽤學習者

適用課程

本模組適用之學習者為對於

本模組以物聯網應用為核心，教導 基礎程式設計與軟硬體整合應用， 適合資訊應用及物聯網概論等課程。

「物聯網」應用議題有興趣 的老師、學生及工作者，不 限科系。

應用場域 年長者居家照護

預期效益 提升學員對程式設計的興趣，供學 員修習進階課程，及未來參與相關 產業的基礎。

4

模組規劃 教學理念

「物聯網-以智慧輪椅為例」課程模組採 ⽤以學習者為中⼼的參與式學習，培養學 ⽣發揮自⾝專業、跨領域合作的能⼒，引 導學⽣以設計思考的流程，從概念介紹、 情境分析、整合設計，讓學⽣組成跨領域 的⼩組，討論、合作、分析不同的觀點， 共同製作可行性方案。 此模組中學生藉由課程瞭解軟硬體開發以 及實際操作，引導學生思考生活中可能會 遇到的問題及解決生活中的不方便。

課程時間 總時數8小時 六個單元

學生人數 本模組學生為59位， 共分為8組，每組都是 由不同科系學生組成。

模組大綱 單元一：物聯網-智慧輪椅背景介紹 及系統架構（1時數） 介紹物聯網基本概念及智慧輪椅的背景及 物聯網的概念，瞭解智慧輪椅對於生活的 重要性以及有哪些功能模組，說明系統架 構。

單元二 : 網頁程式設計開發（1時數） 學習基礎的網頁程式設計，了解HTML基本 結構，學習可以在網頁顯示文字、顯示圖 片、製作表格，進而利用網頁操控YBB CAR智慧車。

單元三 : Arduino YUN無線網路 設定（1時數）

介紹什麼是Arduino YUN以及按照步驟進 行無線網路設定。 5

場域洽談 電腦教室、一般教室 (需自備筆記型電腦 以及具有上網功能的 智慧型手機。)

學生成果評量方式 學生經過課程教學， 學習物聯網基本概念、 網頁程式設計、感測 器的應用，讓YBB CAR能遠端控制，再 藉由設計關卡、分組 競賽的方式，達到教 學目的。

單元四：感測器的簡介與應用 &無線傳輸（1.5時數） 認識擴充板接腳，並了解每個感測器的內容， 瞭解後實際運用及接線操作。

單元五：YBB CAR馬達校正 &遠端行進控制（1.5時數） 上傳程式來進行YBB CAR的馬達校正與操 作。利用網頁送出指令，藉由Arduino分析 接收到的訊息，再加上攝影機傳遞影像，達 到遠端行進控制。

單元六：關卡設計與競賽（2時數） 各組思考生活中可能會遇到的障礙，設計出 生活化的關卡，最後利用競賽，達成學習成 果。

課程時間 總時數8小時 六個單元

學生人數 本模組學生為59位， 共分為8組，每組都 是由不同科系學生組 成。

場域洽談 電腦教室、一般教室 (需自備筆記型電腦以 及具有上網功能的智 慧型手機。)

教學師資及人員 學生成果評量方式

授課教師：1位 擔任課程規劃、教學活動設計、授課及引 導討論。

教學助理：14位

協助課程規劃、場地安排及行政聯繫等 工作。

工作人員：5位

協助課程攝影紀錄、體驗物聯網應用開 發及相關軟硬體教學，負責團隊輔導。 6

學生經過課程教學， 學習物聯網基本概念、 網頁程式設計、感測 器的應用，讓YBB CAR能遠端控制，再 藉由設計關卡、分組 競賽的方式，達到教 學目的。

實施步驟及內容 單元規劃 1HR

1 HR

1 HR

物聯網-智慧輪椅背 景介紹及系統架構

網頁程式 設計開發

Arduino YUN 無線網路設定

單元一

單元二

單元三

1.5 HR

1.5 HR

2 HR

感測器的簡介 與應用&無線傳輸

YBB CAR馬達校 正 &遠端行進控制

關卡設計與競賽

單元四

單元五

單元六

本課程為技術模組，透過導師引導，促進團隊跨領域合作、討論及解決 問題，透過課程教學並實際應用操作。課程包含六個單元，運⽤講授法、 體驗式教學法、討論法、合作學習等教學⽅法，最後將每個單元統整， 使得YBB CAR智慧車能夠成功行進，完成關卡。

7

單元一：物聯網-智慧輪椅背景介紹及系統架構 教學方法 講授法，由教師先以簡報⽅式，概述本課程的 目標、流程，講授物聯網-智慧輪椅背景、定 義概念及應用、系統架構等知識，建⽴基本的 專業內涵。

教學內容 物聯網基本概念 物聯網(Internet of Things, IoT)的概念，被提 出最少有10年之久。近年來隨著行動裝置的普 及、微電機技術的進步與成本降低以及網際網 路基礎建設成熟，讓物聯網得以實現。簡單來 說，物聯網就是各種感測器或致動器透過 Internet互相連結，進行通信和信息交換，以 實現智能化的識別、定位、跟蹤、監控與管理。 物聯網的應用範疇從個人到社會各個領域，可 參考下圖所示。從技術層面來看，物聯網可以 分成三層，由下而上分別是感測層、網路層與 應用層，彼此各司其職卻也環環相扣。

目標

了解智慧輪椅的 需求及背景

時間 1HR

場地

電腦教室

器材

投影機、麥克風 電腦 https://www.bnext.com.tw/article/34 549/bn-article-34549 8

物聯網-智慧輪椅背景介紹及系統架構 背景介紹 – 智慧輪椅 下肢行動障礙是高齡者常見的障礙之一,自主行動能力是高品質晚年 生活的基本需求,輪椅是最常見、最重要的行動輔具,輪椅使用者中六 成是中高齡者,目的是要提高自主行動力。 相較於傳統電動輪椅，智慧輪椅需配備攝影機、環境感測器、生理 訊號感測器，以及網路連線的功能能夠將相關感測數據，傳送至使 用者的裝置或是後端照護機構，讓使用者或相關照顧人士能夠了解 或記錄相關數據。遇到緊急的狀況(陡降坡、傾斜路面、使用者發生 緊急生理狀況)，智慧輪椅能夠主動做出適當反應。同時使用者也夠 透過行動裝置來操控智慧輪椅，提高活動自主性。

http://ifish.dudaone.com/newpage-13 https://www.polyu.edu.hk/ife/corp/en/publications/tech_front.php?tfid=12009

9

物聯網-智慧輪椅背景介紹及系統架構 背景介紹 – 智慧輪椅功能模組

輪椅行動載具

環境（情境）感知系統

智慧行車系統

生理訊號量測與評估系統

環境控制系統

網路與通訊系統

人機介面 10

物聯網-智慧輪椅背景介紹及系統架構 系統架構(硬體)

行動裝置

微控制器 http://www.playrobot.com/arduin o-board/7-arduino-yun.html

感測器與致動 器

http://www.playrobot.com/playrob ot-education-kit/775-arduino-yunybb-car.html

http://mypaper.pchome.com.tw/pigkuo2012/p ost/1326449059 https://www.kocoafab.cc/tutorial/view/62

硬體架構: 藉由各種行動裝置連線至Arduino Yun主控制板，加上多個感 測器模組、伺服馬達等，使輪型機器人可以執行動作。

11

物聯網-智慧輪椅背景介紹及系統架構 系統架構(軟體)

行動裝置

HTML&JavaScript

HTTP

微控制器

Digital/Analog Signal

Arduino Sketch

感測器與致動器

軟體架構: 使用HTML與JavaScript來撰寫動態網頁，透過動態網頁與 Arduino Yun主控制板作連結，再使用Arduino Sketch程式存 取或控制感測器模組。

12

單元二：網頁程式設計開發 目標 簡單了解HTML與 JavaScript的架構， 最終能完成簡單的 動態網頁。

時間 1HR

場地

電腦教室

器材

投影機、麥克風、 電腦

教學方法 講授法，由教師以簡報⽅式，概述網頁程式基 本概念，講授及練習並行，建⽴基本網頁撰寫 的專業技術。

教學內容 HTML HyperText Markup Language 超文件標示語言 (一)打造網頁的基石 (二)用標籤(tag)來標記(markup)網頁中所呈現 的畫面內容<html>

HTML基本結構 <html> <head> <title> </title> </head> <body> 您所要在瀏覽器顯示的內容 </body> </html>

13

網頁程式設計開發 HTML – 文字及圖片顯示 <html> <head> <title> IoT Workshop </title> </head> <body> Hello Everyone! </body> </html> welcome.html <html> <head> <title> IoT Workshop </title> </head> <body> <img src="on.jpg" width="50“id="image12"> <br> <img src="off.jpg" width="50" id="image13“> </body> </html> image.html

14

網頁程式設計開發 HTML – 表格 <html> <head> <title> IoT Workshop </title> </head> <body> <table border="1"> <tr> <th width="100dp" height="50dp">Left Light</th> <th width="100dp" height="50dp">Right Light</th> </tr> <tr> <th height="50dp"></th> <th height="50dp"></th> </tr> </table> </body> </html>

table.html

15

網頁程式設計開發 HTML – 按鍵、文字欄位

<html> <head> <title> IoT Workshop </title> </head> <body> <input type=“button” value=“BUTTON” id="btn" style="width: 200px;height: 70px"> </body> </html> button.html

<html> <head> <title> IoT Workshop </title> </head> <body> Show Text: <input type="text" style="text-align: center;" id="text1" value="100" size="10" readonly /> </body> </html> text.html

16

網頁程式設計開發 JavaScript - 介紹 HTML文件

<script> …………….. …………….. </script>

使用在HTML文件中 <script> …</script> Javascript

在瀏覽器環境下執行的程式語言 以程式來控制網頁內容 提供網頁互動功能與動態效果

事件發生(參數)

改變網頁內容

<body> …………..... …………..... </body>

html

17

網頁程式設計開發 JavaScript - 範例說明 <table border="1"> <tr> <th>Left Light</th> <th>Right Light</th> </tr> <tr> <th> <input type="hidden" name="pin" value="12" id="pin12" /> <input type="hidden" name="action" value="1" id="action12" /> <img src="on.jpg" width="50" id="image12“

onclick="sendbutton(document.getElementById('pin12').value ,document.getElementById('action12').value);" /> 12 </th> 1 <th> <input type="hidden" name="pin" value="13" id="pin13" /> <input type="hidden" name="action" value="0" id="action13" /> <img src="off.jpg" width="50" id="image13" onclick="sendbutton(document.getElementById('pin13').value ,document.getElementById('action13').value);" /> </th> </tr> </table> dyn_image.html pin12(12) action12(1) pin13(13) action13(0) 18

網頁程式設計開發 JavaScript - 範例說明 <script type="text/javascript"> function sendbutton(Pin, action){ (12, 1) if (action == 0) { action = "1"; image = "on.jpg"; } else { action12 action = "0"; image = "off.jpg"; image12 } ActNum = "action" + Pin; ImgNum = "image" + Pin; document.getElementById(ActNum).value = action; document.getElementById(ImgNum).src = image; document.getElementById("description").innerHTML = ActNum; } </script> dyn_image.html

pin12(12) action12(1)

pin12(12) action12(0)

19

單元三：Arduino YUN無線網路設定 教學方法 講授法，由教師以簡報⽅式，介紹Arduino YUN雲板，講授及實作Arduino YUN之無線網 路設定，建⽴操作YBB CAR的基礎能力。

教學內容 概述Arduino YUN雲板 Arduino Yun是Arduino最新的開發板，是 Arduino公司Wi-Fi生產線的首項產品。設有乙 太網和WiFi支援功能、USB-A埠、微型SD卡插 槽、20個數位輸入/輸出引腳、micro USB連接 器、ICSP和三個重新開機按鈕。

目標 認識Arduino YUN 雲板，並學習無線 網路設定，上傳程 式。

時間 1HR

場地

電腦教室

器材 投影機、麥克風、 YBB CAR、筆記型 電腦以及具有上網 功能的智慧型手機。 http://www.playrobot.com/arduino-board/7-arduino-yun.html

20

Arduino YUN無線網路設定 概述Arduino YUN雲板

https://www.epictinker.com/Arduino-Yun-p/ard-yun.htm

左邊是ATmega32u4控制晶片為Arduino環境，右邊是AR9331處理器 為Linux環境，Bridge庫用來連結兩個處理器之間的通信。USB、網路 介面、Wifi和SD卡是連接到AR9331，再利用Bridge連結到Arduino。

21

Arduino YUN無線網路設定 無線網路設定 STEP 1: 先重設Wifi 壓住wifi reset鍵五秒鐘 以YUN作為Access Point(AP)

STEP 2: 在筆記型電腦中開啟wifi設定，選擇Arduino YUN-XXXXX 接著開啟瀏覽器輸入 : http://192.168.240.1 進入設定頁面，輸入密碼 : doghunter，按下configure

Teaching note 請描述教學注意事項或是經驗分享小提醒。字體大小14pt，行 距1.15，微軟正黑體。文字文字文字文字文字文字文字文字文 字文字文字文字。 文字文字文字文字文字文字文字文字文字文字文字文字文字文 字文字文字文字文字文字文字文字文字文字文字文字文字文字 doghunter 文字文字文字文字文字文字文字文字文字文字文字文字。

22

Arduino YUN無線網路設定 無線網路設定 STEP 3: 將手機開啟網路並分享熱點 到此頁面選擇自己手機的網路、輸入密碼 按下Configure&Restart，無線網路設定完成! 將電腦wifi設定為自己手機的網路，此時 YBBCAR及電腦都連接至手機。

選擇手機網路 輸入密碼

以手機為AP

23

Arduino YUN無線網路設定 無線網路設定 測試並上傳Arduino程式: 打開Arduino→選擇Tools→Board:Arduino YUN→ Board:Arduino YUN Tools→Port→YUN at 192.168.X.XX→按下箭頭符號→成功上傳!

Teaching note: 這一單元須設定無線網路，在第二步驟，若是電腦一直搜尋不到 AP(Arduino YUN-XXXXX)，則需要再次按壓wifi reset鍵五秒，直 到筆記型電腦搜尋到，才能進行下一步驟。 24

單元四：感測器的簡介與應用&無線傳輸 目標 認識擴充板接腳， 了解感測器的用途， 實際運用及操作。

時間 1.5HR

教學方法 講授法、體驗學習法，由教師以簡報⽅式， 認識擴充板的構造、接腳，了解各個感測器 的功能、用途，並實際讓同學操作。

教學內容 感測器介紹 1.光敏電阻/模組 • 利用光電導效應的一種特殊電阻，對環 境光線敏感 • 光強度增加，則電阻減小；光強度減小， 則電阻增大

場地

電腦教室

器材 投影機、麥克風、 YBB CAR、筆記型 電腦以及具有上網 功能的智慧型手機。

光敏電阻

光敏模組

2.三軸加速器 • 三軸加速度感應器可用來量測三個軸向 移動的加速度 • 用來偵測：傾斜、旋轉、震動、碰撞

三軸加速器正面

25

三軸加速器反面

感測器的簡介與應用&無線傳輸 感測器介紹 3.紅外線收發器 • 利用紅外線收發器來感應前方是否有物品或者前方是否懸空 • 應用實例：避障、循跡、防跌落

紅外線收發器(避障)

紅外線收發器(循跡)

4.超音波測距模組(HC-SR04) • 由超音波發射器、接收器和控制電路所組成 • 藉由物體反射超音波，感測器依來回時間測量與物體距離

超音波模組原理

超音波測距模 組

5.溫溼度感測器 • 可以檢測周圍環境的濕度和溫度 • 將所量測到的溫、濕度資料拆解成為數位訊號，再由 data pin腳 將資料送出

溫溼度感測器

26

http://www.playrobot.com/5-Sensor

感測器的簡介與應用&無線傳輸 Sensor shield & 擴充板接腳介紹

上圖左半邊為Sensor shield有Digital pins(數位訊號:只有0和1兩種訊 號)、Analog pins(類比訊號:有連續的訊號)、馬達接到的GND(接地線) 和馬達接到的5V(電流)以及一個Power LED。 右半邊則是有VCC(電流)、麵包板、Digital pins(與左半邊的數位訊號是 同樣的)、 GND(接地)、Analog pins(與左半邊的類比訊號是相同的)。 [上述是本次工作坊主要會使用到的部分]

LED接線範例圖

LED長腳接到正極(VCC);短腳接到負極(GND) 此範例:黑線→接地;藍線→綠LED和紅LED共用地線; 綠色LED接電阻再接到Digital pin13; 紅色LED則接到Digital pin12(Digital帶有電流) 27

感測器的簡介與應用&無線傳輸 Sensor shield & 擴充板接腳介紹 光敏模組接線範例圖

此範例: 綠線:Signal→A0 黑線:GND 紅線:VCC

三軸加速器接線範例圖 此範例: 綠線:Z→A1 黃線:Y→A2 藍線:X→A3 黑線:GND 紅線:VCC

28

感測器的簡介與應用&無線傳輸 Sensor shield & 擴充板接腳介紹 超音波測距(HC-SR04)模組接線範例圖 此範例: 紅線:VCC 黃線:Trig(發送訊號) →Digital5 藍線:Echo(接收訊號) →Digital6 黑線:GND

溫溼度感測器(DHT11)接線範例圖

此範例: 黑線:GND 紅線:VCC 綠線:Signal→Digital pin8

29

感測器的簡介與應用&無線傳輸 無線傳輸影像 利用網頁與YUN溝通 Arduino YUN HTTP

Linino

網頁檔案(html)

Bridge/process Arduino

Script (ino)

Browser

http://YUN's IP/sd/AJAX/index.html HTML *顯示影像* <img src=“http://YUN’s IP:8080/?action=stream" /> JavaScript ㄏ function morestatus() *取得Sensor值* function updateasyncstatus() function YBBControl()

*遙控行進方向*

onClick

網頁存放路徑: /mnt/sda1/Arduino/www/AJAX/index.html 30

感測器的簡介與應用&無線傳輸 無線傳輸影像 重點程式碼如下: 傳輸影像至網頁 (HTML) 請參考單元三(P23)，知道

<html> YUN’s IP，在程式碼此處修改 <head> <title>Arduino Yun I/O Demo</title> </head> <font face=”Arial”> <img src="http://192.168.31.110:8080/?action=stream" /> <p id="description"> Live Video Streaming </p> </font> </html> 傳輸影像至網頁 (Script) #include <Bridge.h> //加入Bridge.h程式庫 #include <YunServer.h> //加入YunServer.h程式庫 #include <YunClient.h> //加入YunClient.h程式庫 #include <Process.h> //加入Process.h程式庫 YunServer server; //Yun的網路伺服器監聽預設 在port 5555將會發送所有HTTP指令給我們 Process WebCam; // 宣告WebCam物件使用Process類別

31

感測器的簡介與應用&無線傳輸 無線傳輸影像 傳輸影像至網頁 (Script) void setup() { // 建立初始化區塊 pinMode(13, OUTPUT); //設定紅色LED為輸入 digitalWrite(13, LOW); // 透過燈號改變知道bridge開始運作 Bridge.begin(); // 初始化Bridge，連接ATmega和AR9331 server.listenOnLocalhost(); // 只監聽連接本地主機的指令， 不能連接其他額外的網路 server.begin(); delay(10000); //等待Linux開機完全再輸入指令 //開啟視訊串流 WebCam.runShellCommandAsynchronously("mjpg_streamer -i \"input_uvc.so -d /dev/video0 -r 320x240 -f 25\" -o \"output_http.so -p 8080 -w /www/webcam\" &"); while (WebCam.running()); digitalWrite(13, HIGH); } //end of setup() 如何上傳網頁至YUN

開啟WinSCP 輸入主機名稱(YUN’s IP:192.168.X.XX)、使用者名稱(root)、 密碼(doghunter)即可登入 32

感測器的簡介與應用&無線傳輸 無線傳輸影像 如何上傳網頁至YUN 登入後的畫面

Teaching Note: 登入後，左邊畫面是自己電腦的資料 夾目錄，右邊是YBB CAR的SD CARD 資料夾目錄，將index.html的檔案上 傳至 /mnt/sda1/Arduino/www/AJAX 再開啟瀏覽器，輸入 YUN’s ip(192.168.X.XX)/sd/AJAX 即可看到影像畫面 33

感測器的簡介與應用&無線傳輸 無線傳輸感測資料 重點程式碼如下: 傳輸感測資料 (html)

傳輸感測資料 (JavaScript)

每隔2秒傳送HTTP GET request到YUN(Server)

http://YUN’s IP/ arduino/status / 99 處理解析response

Teaching Note: 上半部程式碼為HTML的部分: Light的內容為光敏電阻值;LED Green&Red的內容為LED燈亮或不亮; X、Y、Z axis為三軸加速器值。 下半部程式碼為JavaScript的部分: 紅框中表示每隔兩秒會傳送資訊到YUN，再去解析回應內容。 34

感測器的簡介與應用&無線傳輸 無線傳輸感測資料 重點程式碼如下: 傳輸感測資料 (Arduino)

Arduino YUN

Linino 網頁檔案(html)

http://YUN’s IP/ arduino/ status / 99

Bridge/process status/99

Arduino Script (ino)

Teaching Note: 紅框部分表示從伺服器接收，如果是新的client端訊息就跳到process執 行，如果是command=status再到statusCommand接收接腳訊息，下 頁程式接續。

35

感測器的簡介與應用&無線傳輸 無線傳輸感測資料 重點程式碼如下: 傳輸感測資料 (Arduino) status [12,13] status#12=0 status#12=0 #13=1 [0,1,2,3]

status#12=0#13=1#A0=900 status#12=0#13=1#A0=900#A1=407 status#12=0#13=1#A0=900#A1=407#A2=347

status#12=0#13=1#A0=900#A1=407#A2=347#A3=339 Teaching Note: 此頁程式是將讀取數位及類比各個接腳的資訊並輸出成所要的格式， 再傳到Client端。 36

感測器的簡介與應用&無線傳輸 無線傳輸感測資料 重點程式碼如下: 傳輸感測資料 (JavaScript)

分析response，更改 網頁內容

status#12=0#13=1#A0=950#A1=390#A2=378

status

12

12=0

0

13

13=1

1

A0=950

A0

950

A1=390

A1

390

A2=378

A2

378

Teaching Note: 此頁程式是將接收到的資訊分割，先分割”#”再分割”=”，讓網頁在 指定的資訊欄只呈現出”數值”。 37

感測器的簡介與應用&無線傳輸 無線傳輸感測資料 網頁呈現的結果

38

單元五：YBB CAR馬達校正&遠端行進控制 教學方法 講授法、體驗學習法，由教師以簡報⽅式 教學，測試馬達方向，並修改網頁端程式， 成功遠端操控;學生們將老師範例程式進行 修改，實際操作、撰寫程式。

教學內容 校正馬達 啟動Arduino軟體，並上傳MotorTest.ino 程式。 重點程式碼如下:

停止

void carstop( ) { servoRight.writeMicroseconds(1500); servoLeft.writeMicroseconds(1500); }

目標 上傳程式校正YBB CAR馬達。利用網 頁送出指令，分析 訊息，達到遠端行 進控制。

時間 1.5HR

場地

電腦教室

器材

Teaching Note: 當傳送停止的指令，馬達需為靜止狀態; 若馬達有動作，則需調整馬達螺絲，調整 至馬達靜止。 39

投影機、麥克風、 YBB CAR、筆記型 電腦以及具有上網 功能的智慧型手機。

YBB CAR馬達校正&遠端行進控制 行進控制 啟動Arduino軟體，並上傳MotorTest.ino程式。 重點程式碼如下:

前進

void forward( ) { servoRight.writeMicroseconds(1300); servoLeft.writeMicroseconds(1700); }

後退

void backward( ) { servoRight.writeMicroseconds(1700); servoLeft.writeMicroseconds(1300); }

左轉

void turnLeft( ) { servoRight.writeMicroseconds(1300); servoLeft.writeMicroseconds(1300); }

右轉

void turnRight( ) { servoRight.writeMicroseconds(1700); servoLeft.writeMicroseconds(1700); }

40

右輪順時針方向最大轉速 左輪逆時針方向最大轉速

右輪逆時針方向轉 左輪順時針方向轉

右輪順時針方向轉 左輪順時針方向轉

右輪逆時針方向轉 左輪逆時針方向轉

YBB CAR馬達校正&遠端行進控制 遠端行進控制 如何送出前進指令 - 網頁端 重點程式碼如下:

<input type="hidden" name="action" value="1" id="forward" /> <input type=“button” value=“Forward“ id="btnF" style=“width:200px;height:70px”onclick= “YBBControl( document.getElementById(‘forward’).value );" />

1 function YBBControl(action) { document.getElementById(“description”).innerHTML = “Button Click"; server = "/arduino/robot/" + action; request = new XMLHttpRequest(); request.open("GET", server, true); request.send(null); }

http://YUN’s IP/ arduino/ robot / 1

Teaching Note: 此部分程式碼為網頁端接收到前進的指令，前進的指令值為action“1” ，再傳送到Arduino端去執行動作。

41

YBB CAR馬達校正&遠端行進控制 遠端行進控制 如何送出前進指令 - Arduino分析接收訊息 重點程式碼如下: void setup() { ………… servoLeft.attach(11); // 連接左邊馬達的訊號到PIN 11 servoRight.attach(10); // 連接右邊馬達的訊號到PIN 10 ………… } void process(YunClient client) { String command = client.readStringUntil('/');// 讀取指令，讀取指 令的字串直到遇到 / 符號 if (command == "status") { // 是"status"指令? (回報個接腳狀態) statusCommand(client); // 是的話執行statusCommand副程式

} if (command == "robot") { // 是否為"robot"指令? (控制移動方向) robotCommand(client); // 是的話執行robotCommand副程式 } } // end of process() Arduino YUN http://YUN’s IP/ arduino/ robot / 1

Linino 網頁檔案(html)

Bridge/process Arduino Script (ino)

robot/ 1

42

YBB CAR馬達校正&遠端行進控制 遠端行進控制 如何送出前進指令 - Arduino控制行進方向 重點程式碼如下: void robotCommand(YunClient client) { byte command; command = client.parseInt(); if (command == 1) { forward(); } if (command == 2) { backward(); } if (command == 3) { turnright(); } if (command == 4) { turnleft(); } if (command == 5) { carstop(); } } // end of robotCommand()

robot / 1

// 前進 1 // 後退 // 右轉 // 左轉 // 停止移動

Teaching Note: P.40&P.41程式碼解說: 設定好馬達的PIN，到process執行，如果是(command=="robot")再到 robotCommand執行，接收到的值為”1”，就執行前進的動作。

43

單元六：關卡設計與競賽

目標

教學方法

將學習到的技術實 際應用，藉由設計 關卡、闖關的方式， 呈現出最後成果。

教學內容

時間 2HR

場地

電腦教室 一般大教室

講授法、討論法、合作學習法。由教師示 範教學，再讓學員們分組討論。

由教師示範，結合網頁程式、Arduino YUN、馬達校正、遠端行進操控，最終實際操 控YBB CAR。學員們發想討論，思考生活中會 遇到的障礙，設計出符合生活及多元化的關卡， 最後利用闖關競賽，展現學習成果。 學員們分為六組，各自進行討論。分別進 行程式撰寫、修改及除錯，將自己組別的智慧 車程式修改成符合實際操作的角度或動作;也需 要同時進行關卡的設計，各組發揮創意，設計 出有趣的關卡。

關卡設計 分為幾個重點

器材 YBB CAR、筆記型 電腦以及具有上網 功能的智慧型手機、 紙箱、巧拼墊、剪 刀等文具。

1.

2.

3.

4.

5.

6.

7.

直線前進 直角轉彎 弧度轉彎 自動避障 上坡下坡 紅外線偵測 超音波偵測 44

關卡設計與競賽 關卡設計

在智慧輪椅工作坊課程的最後，教師示範最後成果給學員們參考，包 含網頁設計、感測器變化的結果即時呈現、感測器的應用、智慧車的 攝影機拍攝等等，給予學員參考及方向，完成最後的競賽。

45

關卡設計與競賽 關卡設計

第一組學員們自行分為 兩個小隊。 一個小隊負責設計關卡， 另一個小隊負責程式碼 的部分。

初想的關卡: 1. 上坡及下坡 2. 凹凸地面 3. 轉彎 4. 勿壓到黑線 學員們思考生活中可能 會遇到的障礙並結合競 賽關卡。

第一組學員的關卡，最 後加上寶特瓶作為障礙 物，在上坡後把寶特瓶 移除原本路線，並且避 開路旁的寶特瓶。

46

關卡設計與競賽 關卡設計 第二組學員設計的關卡 為: 1. 遇到障礙物，不能 撞倒。 2. 偵測到牆壁，能後 退或是轉彎 3. 直角轉彎 4. 停車到車庫中

從起點出發馬上 遇到障礙物，接 下來遇到的暗處 轉角，可利用 LED一點點微弱 的光作為打亮的 功能，指引路線， 最後矯正角度， 完美停車。

47

關卡設計與競賽 關卡設計

第四組學員，設計的關卡為一出發就必須要大角度繞過障礙物，直 線加速通過第一個坡道，遇到牆壁後必須直角轉彎，再經過一個約 三十度的斜坡及完成關卡。看似簡單，但是富有許多生活中會遇到 的狀況，是個很實際的關卡。

1.

2.

3.

4.

48

大角度轉彎 上坡下坡 直角轉彎 陡上坡度

關卡設計與競賽 關卡設計 第五組學員相當有創意 關卡豐富又有趣。 1. 勿壓黑線 2. 倒車上坡 3. 斜角直走 4. 進入山洞 5. 停車入庫

第五組學員們絞盡腦汁 想出來的關卡非常特別， 利用寶特瓶做成翹翹板， 也在關卡中加入許多小 機關，例如黑洞及窗簾， 讓闖關更加有趣。

49

關卡設計與競賽 關卡設計 第六組學員設計關卡相 當的用心，只簡單利用 巧拼墊、寶特瓶，就構 想出富有難度、考驗操 控者技術、智慧車行進 角度的一關。

最後的關卡規則: 1. 起點出發，跟著路 線走 2. 超過黑線則加5秒 撞倒寶特瓶加5秒 3. 停車到黑框中

50

關卡設計與競賽 關卡設計

關卡如下: 1. 直線前進 2. 上坡下坡 3. 自動避帳 4. 調整角度 5. 停車入庫

第七組學員，將主力放在撰寫程式、矯正馬達及調整轉彎角度，經過多 次的修改，最後把智慧車調整得很好，讓操控者在其他組別闖關時，都 能順利過關。 51

關卡設計與競賽 競賽

學員們到各組一一闖關，每一 組關卡風格都不同，難度也不 同，希望藉由這些關卡，反思 生活中在一般道路上也時常會 遇到這些障礙，要如何突破、 避障都值得我們去思考。

52

實際案例 -「智慧輪椅工作坊」 教學實況紀錄

智慧輪椅工作坊 時間:106/3/17、18 地點:世新大學 管理學院

Arduino YUN 無線網路設定

53

教學實況紀錄

助教們技術輔導

54

教學實況紀錄

助教們技術輔導

55

學生成果花絮

賽後合影

56

學生成果花絮

教師、助教群及 工作人員合影

57

建議及注意事項 本模組為技術模組，學習著重於 網頁程式、Arduino程式及感測 器的使用，需將這三個部分串聯 起來才能完成整個物聯網的應用。 由於學員們都是跨領域學習，因 此教導軟體應用部分需從基本概 念開始教學，可參考教師已完成 的程式碼，再進行修改及測試， 較有效率及完成度較高。 硬體應用部分按照步驟教學以及 助教在旁協助，學員們可快速上 手，達成教學目標。 最後關卡設計及競賽，讓學員們 發揮創意，思考生活中可能會遇 到的障礙，製作趣味又富有挑戰 性的關卡，整合課程所學，完成 課程。

教學中使用到的網頁程式碼、 Arduino程式、需安裝的軟體、 教學用之PowerPoint都放在雲端 硬碟中(https://goo.gl/3Vb4Ms) ， 或 於 智 齡 聯 盟 網 站 (http://www.t-edu.tw/module)、 智活資料庫下載，可供參考使用。 注意的事項:軟體可能會有版本的 更新，使用者可至官方網站下載 最新版本。

58

模組開發歷史 智齡聯盟物聯網模組。在世新大學資訊管理學系，由胡碩誠老師開課， 課程名稱為”智慧聯網”，課程中教導學生學習Arduino Sketch程 式及各種感測器應用。於2017年由世新大學資訊管理學系胡碩誠老 師指導執行，研發成適合智齡聯盟之模組教材，目前經歷過一次工作 坊教學。 第一次教學時間為2017年3月17、18日，由胡碩誠老師指導，於世 新大學辦理兩天的「智慧輪椅工作坊」，參與人數79人，包含講師1 人、學員59人、助教14人及工作人員5人。

59

Note

60

智齡聯盟課程模組系列

物聯網-以智慧輪椅為例 開發教師：胡碩誠 助理教授 (世新大學資訊管理學系) 開發學校：世新大學 原屬課程：智慧聯網 內容編輯：陳佩妤 (世新大學資訊管理學系) 版面設計：楊哲玟 (臺大土木工程學系) 開發時間/版本：106年12月18日 研發初版 107年07月31日 優化版 計畫名稱：智齡聯盟 計畫網站：www.t-edu.tw 計畫主持人：劉佩玲 特聘教授 (臺大智活中心) 共同主持人：毛慧芬 副教授 (臺大職能治療系) 協同主持人：陳育亮 教授 (世新大學資訊管理學系) 指導單位：教育部智慧生活整合性人才培育計畫 執行單位：臺灣大學智慧生活整合與創新研究中心 106臺北市羅斯福路四段一號 聯絡資訊：(02)3366-3366 分機55336 silverstaff@caece.net

本教材內容採用創用CC，「姓名標示-非商業性-相同方式分享」3.0台灣授權條款。

61