創意編程語言——Processing：基于設計思維的課堂音量可視化軟件開發

張寧

摘要：教師常常面臨管理課堂噪音水平的挑戰，過多噪音會導致學生注意力下降。而如果用技術賦能教師課堂管理，則能協助教師監控和控制噪音水平。作者基于設計思維用Processing編程實現兩款課堂音量管理軟件，以協助教師提升課堂管理效率。

關鍵詞：創意編程；設計思維

中圖分類號：G434? 文獻標識碼：A? 論文編號：1674-2117（2023）07-0094-03

Processing具有易學易用、可視化效果好等特點，能夠幫助學生更好地掌握編程技能，同時還能培養學生的創造性思維和實踐能力，加深學生對計算機科學與其他學科的交叉應用的理解。因此，在中小學編程教育中應該更加注重Processing的應用。下面，筆者基于設計思維進行Processing程序開發。

開發過程

1.同理分析

設計思維過程的第一步是與教師同理分析。本階段的主要需求和問題包括：①教師難以確定課堂噪音過多的來源。②教師難以執行一致的噪音水平標準。③過多噪音降低學習效果。

2.定義問題

定義問題階段涉及分析前階段收集的需求，并將它們轉化為明確的問題陳述。這個陳述將作為構思過程的指導，確保專注于滿足用戶需求。例如，如何設計一個易于使用的軟件解決方案，幫助教師監控和管理課堂噪音水平，改善學習環境，減少教師和學生的壓力？

3.構思創意

在構思階段，針對問題陳述產生大量可能的創意想法：①利用游戲化技術吸引學生維持適當噪音水平的軟件，獎勵他們遵守規則。

②利用人工智能聲音識別軟件識別課堂過度噪音來源并在屏幕上顯示給教師。③實時跟蹤課堂噪音水平，提供視覺和聽覺反饋以幫助教師執行噪音水平規則的軟件。

上述第一個創意想法，已在本欄目上一期文章《創意編程語言——Processing：聲控音量管理程序》實現。下面主要實現第二個和第三個創意想法，其中第二個創意想法會用到Teachablemachine網站（https：//teachablemachine.withgoogle.com/），適合初中計算機課程。可以將其作為訓練模型平臺，學生無需代碼編程，只需根據網站操作要求，獲取相應的聲音的測試數據、訓練模型，把模型導入到在線p5js代碼編寫網站即可。第三個創意想法可以通過導入Processing聲音模塊庫，可視化展示課堂噪音水平。

4.原型搭建

根據以上兩個創意想法，筆者使用Processing進行原型創建，并構建兩個獨立程序。

人工智能識別聲音來源：一個用戶界面，顯示實時噪音水平和過度噪音的來源。

可視化課堂噪音水平：一個跟蹤和可視化歷史噪音水平數據的系統。

5.測試

設計思維過程的最后階段是讓用戶測試原型以收集反饋并驗證解決方案的有效性。可以通過在現場課堂環境中部署課堂音量管理軟件原型并觀察教師和學生與其的互動來測試原型。在測試階段收集的反饋可以用來優化原型并迭代設計。

程序設計

1.人工智能識別聲音來源程序

本案例無需編程基礎，適合初中生初步體驗和認識語音識別情境。

①背景噪音樣本獲取，每個背景噪音20秒。

②錄入每個學生的音頻樣本。每個學生需要至少8個樣本，為了提高模型識別率，可以多錄入些音頻樣本數據。

③數據錄入結束后，即可點擊訓練模型，然后通過預覽進行聲音來源識別輸出預測。同時，根據準確率，適當調整模型音頻輸入樣本數據（如圖1）。

④導入p5.js的在線編輯器，即可以進行測試。具體操作為：選擇上傳按鈕→選擇p5.js→選擇復制代碼到p5.js的在線編輯器。

⑤在p5.js的在線編輯器進行測試。如果語音模型預測性能良好，當學生A說話時，會在屏幕上顯示學生A，當學生B說話時，會在屏幕上顯示學生B，程序如圖2所示。

2.可視化課堂噪音水平程序

編寫本程序需要有一定的編程基礎，熟悉面向對象的編程方法。

該程序功能是依據聲音音量大小生成顏色和半徑不同的圓形，進入屏幕并互相碰撞，把聲音的音量分布通過可視化形式呈現給教師和學生，進而方便他們分析課堂音量情況，并根據需要進行相應的調整。其中，聲音的高低會影響圓形的半徑和顏色，聲音高顏色為紅色，半徑大，否則顏色為綠色，半徑小。程序界面如下頁圖3所示。下面程序參考了Processing官網示例程序：碰撞球（https：//processing.org//examples/bouncybubbles.html）。程序邏輯流程圖如圖4所示。

①首先，程序中定義ArrayList，名為circles，用于存儲所有的球對象。同時，使用Sonia庫處理音頻輸入。然后，創建一個AudioIn對象和一個Amplitude對象來分析音頻信號，并將其與音頻輸入相關聯。

②在setup（）函數中，設置窗口大小并初始化circles ArrayList。

③在draw（）函數中，每次循環時，獲取音頻信號的振幅值，將其映射到球的半徑上，并創建一個新的soundCircle對象，將其添加到circles ArrayList中。

④遍歷circles ArrayList中的每個soundCircle對象，依次調用其display（）、move（）和collide（）方法，來顯示、移動和檢測碰撞，最終實現通過音頻控制球的大小、顏色和運動的效果。

其中，圓形通過soundCircle類來進行設計。在類中創設了collide、move和display方法，具體代碼如圖5所示。collide（）的函數用于檢測球之間的碰撞，并在碰撞時根據球的彈性特性來更新其速度。在函數中，使用for循環來遍歷others ArrayList中所有的球對象，以檢測當前球對象和其他球對象之間的碰撞。在檢測碰撞時，要先計算出當前球對象和其他球對象之間的距離，如果距離小于球的半徑之和，則說明兩個球相交了。然后根據兩個球的位置和半徑，計算出兩個球碰撞后的位置，并根據球的彈性特性，計算出兩個球的加速度，更新其速度。

對中小學編程教學的意義

第一，Processing可以幫助中小學生更好地理解編程的基本概念和原理。Processing語言簡單易懂，同時具有可視化的編程界面，能夠讓學生在編寫程序時直觀地看到代碼的運行效果。

第二，Processing可以培養學生的創造性思維和實踐能力。良好的可視化效果、豐富的編程庫和開發工具可以幫助學生更好地表達自己的創意和想法。

第三，Processing還可以幫助學生更好地理解計算機科學與其他學科的交叉應用，幫助學生了解計算機科學在現實生活中的應用。