I2C Bus and Address Explorer¶
Specification¶
The full specification below is extracted from Chapter 8: Adding an OLED Display and Expressive Behaviors.
Type: microsim
**sim-id:** i2c-bus-address-explorer<br/>
**Library:** p5.js<br/>
**Status:** Specified
Learning objective: Students will *explain* (Bloom L2: Understand) how multiple I2C devices share the same two wires by responding only to messages addressed to their own unique I2C address.
Canvas: 700x420px, responsive -- recompute the bus line and device icon spacing from `windowWidth` in `windowResized()`.
Layout: a horizontal pair of lines representing the shared SDA and SCL wires, running left (Pico icon) to right, with three device icons (OLED display, a generic sensor, a generic second display) tapped onto the same two wires at different points along the bus. Each device icon displays its I2C address label beneath it (e.g., "0x3C", "0x27", "0x68").
Controls: a `createSelect()` dropdown labeled "Send Message To" listing the three device addresses; a `createButton()` labeled "Send" that animates a small message packet traveling from the Pico icon along the bus to every device simultaneously; a `createButton()` labeled "Add Address Conflict" that changes the second display's address to also read "0x3C", demonstrating a collision.
Interaction: after clicking "Send," the animated packet reaches all three devices at once, but only the device whose address matches the dropdown selection visually lights up green and shows a small "ACK" (acknowledged) label -- the other two remain gray, showing they saw the message but ignored it since it wasn't addressed to them. If "Add Address Conflict" has been triggered, sending to the conflicting address lights up both matching devices simultaneously and displays a warning "Address collision -- both devices respond!" Clicking any device icon opens an infobox naming its address and one sentence on what a real device at that address might be.
Implementation: p5.js. Devices stored as an array of `{name, address, x, y}` objects. Message packet animated along a straight-line path using an interpolated `lerp()` position each frame. Address matching done with simple string comparison against the dropdown's selected value. Recompute all icon and wire positions from `windowWidth` in `windowResized()`.