網頁/人機介面的設計、測試

圖 3.20 校園多媒體視訊廣播教學系統設備系統圖 資料來源：本研究整理

3.4.2 人機介面網頁的設計

將硬體系統建構完成後，接著是人機介面網頁的設計，在考量操作者的 操作方便性，軟體首先將畫面規劃成三個區域：功能區、目標區及頻道區；

功能區主要以操作功能為主，分別設計為即時廣播、預約廣播、緊急廣播、

電子佈告欄、連線狀態查詢、頻道設定、群組設定、監控點設定、參數設定、

無聲廣播內容、變更密碼、使用者設定、使用者權限設定，而目標區則按學 校或教室分配與控制器內碼對應排列並分別顯現於目標區，至於頻道區則是 按規劃的各種影音源分別設定頻道，上列三大項功能以網頁方式呈現於主控 電腦人機介面軟體的畫面如圖 3.21 所示。

圖 3.21 遠端監控人機介面軟體 資料來源：本研究整理

3.4.3 人機介面軟體測試

本章前二節已分別將 UDP 與 RS-232 進行連線測試，並也將資料由 RS-232 正確的轉換成 Ir 控制碼，因此本節將前章節的命令碼加以人性化的顯 示於電腦畫面，因此畫面上所有的操作最後仍需透過 COM1 輸出，並以前面 章節中的規矩方式輸出，換言之，動態區所提供的指令即是表 3.2 的命令碼 ， 也就是電視電源控制的“Ａ”或電視頻道的切換“Ｊ”的 DATA1 命令碼，而目標 區內的各個班級的控制子機則分別由 DIP Switch 決定一子機編碼，也就是所 謂的子機碼，再分別存放於 DATA2~4 內，最後頻道區則為參數部分，且以 16 進制的方式輸出。

經由上列說明後，即可於軟體(圖 3.21)指標上使用滑鼠至功能區選定功 能為“即時廣播”，並於頻道區內選定頻道“005-民視”，目標區標定一年一班~

一年五班，接著選定二年級為“011-台視”，三年級為“022-龍祥電視台”，四年 級為“024-東森電影台”，最後經由右下方的“送出”鍵將資料透過 COM1 輸出 轉換到 Server 端，再以 UDP 方式傳送到 Client 端並轉換成 TV 可接受的 Ir 遙控碼，最後由 TV 確認是否能順利打開電源並切換到相同子機碼所對應之 頻道，經一連串測試後，本研究分別將子機碼編列如下，並由本節所訂定之

功能區 目標區 頻道區

表 3.3 Client 1 子機碼、頻道轉換測試表(子機 1) 子機碼 指定

頻道碼

實際結果

(TV 頻道) 子機碼 指定 頻道碼

實際結果 (TV 頻道) 001 005 TV 頻道:5 002 005 TV 頻道:5 013 011 TV 頻道:11 014 011 TV 頻道:11 021 022 TV 頻道:22 022 022 TV 頻道:22 034 024 TV 頻道:24 035 024 TV 頻道:24 003 005 TV 頻道:5 004 005 TV 頻道:5 015 011 TV 頻道:11 016 011 TV 頻道:11 023 022 TV 頻道:22 024 022 TV 頻道:22 036 024 TV 頻道:24 037 024 TV 頻道:24 005 005 TV 頻道:5

017 011 TV 頻道:11 025 022 TV 頻道:22 資料來源：本研究整理

表 3.4 Client 2 子機碼、頻道轉換測試表(子機 2) 子機碼 指定

頻道碼

實際結果

(TV 頻道) 子機碼 指定 頻道碼

實際結果 (TV 頻道) 002 005 TV 頻道:5 003 005 TV 頻道:5 014 011 TV 頻道:11 015 011 TV 頻道:11 022 022 TV 頻道:22 023 022 TV 頻道:22 035 024 TV 頻道:24 036 024 TV 頻道:24 004 005 TV 頻道:5 005 005 TV 頻道:5 016 011 TV 頻道:11 017 011 TV 頻道:11 024 022 TV 頻道:22 025 022 TV 頻道:22 037 024 TV 頻道:24 001 005 TV 頻道:5 013 011 TV 頻道:11 034 024 TV 頻道:24 021 022 TV 頻道:22

資料來源：本研究整理

上述二表顯示本研究分別將 Client 1 及 Client 2 端之子機內碼切換成各 種人機介面內所提供之子機碼分別各 19 次，即兩部 Client 端之子機碼已分

別對應了人機介面目標區內的所有子機碼，並將結果分別紀錄於”實際結果”

欄內，將結果與指定頻道相互比較發現，研究結果皆可與研究目的中的預期 結果相呼應，因此確定人機介面軟體確實可行。