Skip to content

Buzzer Tone Generator Simulator

Run MicroSim in Fullscreen

Specification

The full specification below is extracted from Chapter 6: Buttons, Photoresistors, and Analog Sensor Input.

Type: microsim
**sim-id:** buzzer-tone-generator-simulator<br/>
**Library:** p5.js<br/>
**Template:** https://github.com/dmccreary/signal-processing/tree/main/docs/sims/tone-gen<br/>
**Status:** Specified

Learning objective: Students will *compare* (Bloom L4: Analyze) how active and passive buzzers respond to code, and *apply* (Bloom L3: Apply) a frequency value to generate a target musical pitch on a simulated passive buzzer.

Canvas: 700x420px, responsive -- recompute waveform plot width from `windowWidth` in `windowResized()`.

Layout: a mode toggle at the top switching between "Passive Buzzer" and "Active Buzzer" views. In Passive mode, a live square-wave plot shows the PWM signal at the current frequency, with a note-name readout (e.g., "440 Hz -- A4") beneath it. In Active mode, the plot is replaced with a static fixed-frequency wave and a text note reading "Active buzzers ignore frequency code -- always the same pitch," and the frequency slider becomes visibly disabled.

Controls: a `createSelect()` dropdown for buzzer mode (Passive / Active, default Passive); a `createSlider()` labeled "Frequency (Hz)" (range 220-880, default 440, step 1, disabled in Active mode); a `createSlider()` labeled "Duty Cycle (%)" (range 0-100, default 50) that visibly compresses or widens each pulse in the waveform plot and, at 0%, flattens the wave to silence; a `createButton()` labeled "Play Tone" that uses the Web Audio API (via a simple `osc = new OscillatorNode(...)` or p5.sound `p5.Oscillator`) to actually sound the selected frequency for 500 ms, so students hear the pitch that matches the plotted wave.

Interaction: moving the Frequency slider live-updates both the waveform plot and the note-name readout (computed from the standard equal-tempered frequency table); clicking "Play Tone" plays the audible pitch and briefly flashes the waveform plot's border to sync sound with visual. Switching to Active mode and clicking "Play Tone" always plays the same fixed reference pitch regardless of slider position, reinforcing that active buzzers ignore frequency input.

Implementation: p5.js with p5.sound (or raw Web Audio API) for actual tone playback; waveform rendered with `beginShape()`/`vertex()` tracing a square wave computed from the frequency and duty-cycle values. Guard audio playback behind the "Play Tone" button click (required by browser autoplay policy) rather than playing automatically.