创意编程语言——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还可以帮助学生更好地理解计算机科学与其他学科的交叉应用，帮助学生了解计算机科学在现实生活中的应用。