2023年4月30日 星期日

[app, Thunkable, flowchart] 從流程圖到 Thunkable app_3:計算圓面積

 從流程圖到 Thunkable app_3:

計算圓面積

Line:ted2016.kpvs
Email:Lct4246@gmail.com
FBhttp://gg.gg/TedLeeFB/
Bloghttp://gg.gg/TedLeeBlog/

Apr. 30, 2023
[1]


本 Thunkable app 系列文之三係改編陳會安老師所著「2_fChart_Blockly_Thunkable_變數與運算子(循序結構).pdf(https://reurl.cc/6NEGRV)」中第 40 至 42 頁中計算圓面積範例。
第一小節先說明要解決的問題,再將它的解題步驟匯整為陳會安老師設計的 fChart 流程圖(圖 1、2)。最後再著手設計 app 的呈現畫面(圖 3、4)及其背後的控制程式(圖 5)。

問題說明

由鍵盤手動輸入圓的半徑(radius) app 會自動計算該圓的面積,並將之繪於畫面上。
陳會安老師提供了本問題前半段的解決流程:輸入圓的半徑 r,自動計算其面積,如圖 2 所示。

圖 1:長方形面積的計算流程

緊接著,要以半徑 r 在畫面上實際畫出該圓,如圖 2 所示。

圖 2:計算圓面積並繪圖的解題流程

畫面設計

畫面的安排如圖 3 所示,我們使用 3 個 Label、1 個 Text Input 和 1 個 Canvas(畫布)元件。

圖 3:畫面設計圖

各元件的命名及其屬性設定詳列如圖 4。


圖 4:各元件設定

程式畫面

在程式自動化方面,當我們輸入完圓形的半徑時會觸發(trigger)改變(Changes)事件,於是我們立刻計算該圓的面積並在畫布上畫出它的形狀(圖 5)。


圖 5:積木程式

2023年4月5日 星期三

[機電整合, 運算思維, OpenRoberta] 機電整合之運算思維訓練 1:以 Open Roberta Lab 開發平台為例

  機電整合之運算思維訓練 1:

以 Open Roberta Lab 開發平台為例[1]

Line:ted2016.kpvs
Email:Lct4246@gmail.com
FBhttp://gg.gg/TedLeeFB/
Bloghttp://gg.gg/TedLeeBlog/

Apr. 5, 2023
[2]



Arduino-like 的自走車教具要訓練學生學習什麼?硬體?軟體?STEM/STEAM?
如果說是學習硬體(機構、電控),那車輪幾輪才好?車的外形要設計成休旅車款嗎?…。
如果說是學習軟體(電控程式設計),那軟體學習需要綁一款硬體不可嗎?
科技的本質在於軟硬體知識的整合(integration)。硬體知識的核心在設計思考(design thinking)。另一方面,軟體知識的核心在運算思維(computational thinking)
本 Open Roberta Lab 開發平台系列文將著眼在以運算思維培養解決問題(problem solving)的能力:先詳述問題的內含,再甞試將對應的解決過程描繪成流程圖(flowchart)。最後,以純軟體模擬(simulation)的方式來實現(implement)之。

機電整合學習法

廠商會因為教育市場的利基不斷地設計出各種軟硬體套件,而現今的這些套件多半是將昔日專業機電技術相互結合的最終產物。在學習上,先以套件成品來吸引初學者的學習興趣後,再將之逐一拆解基礎的原子知識以利後續相關應用的整合,我們將之稱為「拼圖法」(最終的作品是各部件的組合)。以前述提及的自走車為例,我們在《廢材車之廢等級https://reurl.cc/9VxyMd一文中,已呈現了從套件拆解至原子知識的方法了。讀者們可細細推敲這其中的意涵。
另外,將需要的原子知識逐步整合成為一個專案亦為實務上常見的一種問題解決方法,我們將之稱為「積木法」(以眾小積木堆積成最終的作品)。

如圖 1,至於拼圖法或積木法的學習選擇,仍應端賴學習者的特質而選定之。但是,前者的要義在拆解;後者則著重在整合的層面上。這是學習時所需要特別留意的要項。

圖 1:機電整合之套件與專案學習法

問題描述:開車經過經斑馬線

小羅開車來到了十字路口(圖 2),請設計一科技駕駛方式(車上裝有顏色感測器(color sensor)),在「禮讓行人,行車安全」的前提下順利通過。註:圖 2 的街道圖為 Scratch 內建的背景圖,老婆婆圖示「cartoon grandma with crutches」取用自 https://reurl.cc/7RnQDN。組合的完整圖檔「Urban+grandma.jpg」可由 https://reurl.cc/WD76mL 下載。

圖 2:十字路口場景

解題流程

使用運算思維的方法,詳列其四步驟如下:

1. 拆解(decomposition) 將上述的「開車經過經斑馬線」問題拆解為:前進、處理斑馬線識別、前進、左轉、前進、處理老婆婆過斑馬線、前進(圖 3)。


圖 3:問題拆解

2. 模式識別(pattern recognition) 觀察 1 的拆解內容,可以看出有前進控制、斑馬線處理、左轉三種模式。
3. 抽象化(abstraction) 開車經過經斑馬線時的處理方式:慢行、停車再開。
4. 演算法(algorithm) 以圖 4 的流程圖來詳述此問題的解決步驟。

圖 4:行經斑馬線問題的流程圖

原子操作(atomic operations)

Open Roberta(https://lab.open-roberta.org) 的程式積木中,是控制前進/後退的積木,速度從 0~100%,移動距離以公分為單位。

是控制左/右轉的積木,以角度值來轉動。

是顏色感測器的讀值積木。

透過這三個原子操作及結構化程式設計(structural programming)循序(sequential)選擇(selective)結構就能撰寫出本問題的完整程式了。


積木組合

為了簡化感測器感測南北向的白色斑馬線,我們將圖 2 的背景圖加上白色的長方形色塊,並將之放在圖 3 中的適當位置(完整的設定檔 TrafficSafty.json 可以從https://reurl.cc/ZXvpdp 下載)。其中,車子的初始位置亦已設定完畢。

最後,完整的控制程式 TrafficSafty.xml 如圖 5 所示,讀者們可以從 https://reurl.cc/7Rm5xd 下載。而程式的執行動畫如圖 6。註,需要反覆測試程式時,請按按鈕歸位。


圖 5:完整程式碼

圖 6:執行結果動畫


註:一開始使用 Open Roberta 時可以先註冊個人帳號,這樣我們寫過的專案都會自動存在自己的帳號之內。此外,Open Roberta 是一個支援多款機器人主機的開發平台,本文使用的是樂高 EV3 的模擬器,請依照圖 7 的方式先行選定。

圖 7:機器人主機設定

教學小幫手

為了將本文的 Open Roberta 專案融入「交通安全」教育以期能達到「禮讓行人,行車安全」的教學願景(vision),我們也設計了教案和(圖 8)和學習單(圖 9)供讀者們參考。





圖 8:教案

圖 9:學習單

筆者針對本文的教學翦影如圖 10 所示。



圖 10:教學翦影

後敘

喜歡動手做的讀者們可以先以設計思考(design thinking)的方法設計出自己的實體自走車後,再運用本文介紹的運算思維設計出自走車的機電整合控制程式試試。


[1] 感謝林汶忠老師提供協助。