Webuino:Bit 入門

學習資源

環境導覽

程式積木區

最左邊程式積木區，留意每種積木分類的顏色提示，即能快速的尋找與記憶需要的積木。

語法切換區

當組合完成積木後，可以切換到「程式碼」，使用的是世界最通用的 Javascript 語言，未來進階修改時，你會需要用到它。

工具列區

各按鈕說明如下：

名稱	說明
檔案	可以「開啟」、「儲存」、「分享」您的作品
範例	直接從範例來學習是最快的，分為基礎、進階，物聯網入門、進階及擴充等。
擴充	除了內建的積木外，尚可以加入網際網路相關，如：Google 試算表、簡報、即時氣象、網路廣播、LINE 等；影音互動：Youtube 、錄音&音量、人臉&顏色追蹤、視訊偵測、英語會話、影像分類等；物聯網開發套件：基礎套件包、擴充套件包、MoonCar 自走車；其它功能：圖片、文字、PM2.5感測器、E-game圖庫、九軸體感偵測。
教學	點按即導引到 Web:Bit 教學手冊
清空	清空當前的積木編輯，使用前請確認是否已保存您的設計
更多	如果您沒有使用實體的 Webduino:Bit 開發板，可能會有部份的選項不能用，如：雲端佈署、網頁預覽，其它還有：萬用遙控、購買套件及下載安裝
執行
帳號	您可以使用 Google 帳號與之綁定，可串連 Webduino 影像訓練平台，直接讀取您訓練好的影像模型

模擬器區域

當你手上還沒有實體的 Web:Bit 開發板或尚未連線時，可以模擬實體開發板，方便專注的完成程式積木。

網頁互動區

有 4 隻小怪獸，透過程式積木的舖排設計，可以和小怪獸們互動。

基本練習

以下透過矩陣LED作為輸出介面，練習變數、邏輯判斷、迴圈、鍵盤輸入及小怪獸互動等，藉以熟悉積木程式設計流程。

矩陣 LED

Web:Bit 開發板的正面內嵌了 25 顆全彩 LED 所組成的的矩陣，每顆 LED 都可透過紅、綠、藍(RGB)三種顏色進行混合產生各種不同顏色，也能顯示圖案及文字，整合判斷式及迴圈整合，可以設計諸多互動功能。

變數

在設計程式時，我們會需要賦予某項數值或字串一個名稱，通常這個數值會在執行時因為狀態而改變，我們將其稱為「變數」Variable。

邏輯判斷

邏輯（logic）又稱理則、論理、推理、推論，是有效（或正確），最基礎的就是判斷某事件是否為「真」True、「假」False。
在程式積木部份，它的設計會有「如果」If、「否則如果」Else If、「否則」Elese ，這3種，而「否則如果」可以反覆的新增更多的判斷條件。
判斷條件式的部份，分為：等於 (=)、不等於 (≠)、小於 (<)、小於等於 (≦)、大於 (>)、大於等於 (≧)。
邏輯運算子的部份，包含了「且」And 與「或」Or

「且」And 與「或」Or之邏輯可以參考以下真值表：

A	B	「且」And	「或」Or
0	0	0	0
0	1	0	1
1	0	0	1
1	1	1	1

以上組合後，即為完整的邏輯判斷式，它可以很簡單，也可以套疊得非常複雜。

練習2：

燈號水平反彈移動

迴圈

當您需要重複執某段程序時，即會用到「迴圈」，您可以將需要重複執行的程式碼放在迴圈內，並指定次數，或是設定成持續無窮盡的執行。

練習2：

燈號反彈球效果

怪獸控制

小怪獸的積木分別有講話、展示圖片、情緒、改變位置、改變角度、改變大小、顯示隱藏和階層…等，小怪獸可以同時進行「輸入」及「輸出」行為，是很生動簡易的互動介面。

練習3：

按鈕開關控制小怪獸尺寸

練習4：

點按小怪獸切換圖案

偵測 - 鍵盤

除了實體的 Webduino:Bit 開發板上有 A 及 B 等2顆按鈕外，我們亦可以透過鍵盤來模擬輸入互動，例如：按↑↓←→按鍵，可以操控小怪獸的移動。

練習5：

鍵盤操控燈號移動

光敏電阻

練習6：

光度切換矩陣LED圖案

熱敏電阻

練習7：

小怪獸講出光度和溫度

蜂鳴器

練習8：

點擊不同小怪獸，播放不同音樂

練習9：

蜂鳴器播放音樂

腦力激盪(作業)

紅綠燈

通知告示

顏色漸變

跑馬燈

蜂鳴器音效

兒歌簡譜

魷魚遊戲

摩斯電碼

在美國影集：重返犯罪現場(NCIS)裡，有一集是探員們被解除權限，並被限制不得使用現代電腦設備，他們最後搬出了早年的 Apple II 電腦，採用摩斯電碼進行通訊…，利用 Webduino:Bit 是不是也能做出一樣的效果呢？

顏色記憶遊戲

利用全彩 LED 5X5 矩陣設計顏色記憶遊戲，可參考 Adobe 色票設計 12 組對比明確的顏色，每組顏色隨機設置在2顆LED上，剩餘一顆，我們可以將它設定地雷，一旦踩到即遊戲結束(踩到的人需扣分)，兩個人可以使用網頁互動按鈕來操作，看誰獲得較高分數，或能加入蜂鳴器音效，增加遊戲體驗。