Media: finalize Bidirectional BLE lesson (esp32/ble-bidirectional.md)

[jonfroehlich]

Media shot-list for esp32/ble-bidirectional.md (L5: Bidirectional BLE). Part of the draft-lesson finalization tracked in #122.

⚠️ This page lives on the unmerged esp32-bluetooth branch. Goes live when that branch merges. Carries the "in draft form" banner. Currently has zero media of any kind.

Shot list — desk work (drawable in software)

• Fritzing wiring diagram: ESP32-S3 Feather + pot on A5/GPIO8 + onboard NeoPixel. (ble-bidirectional.md:25 TODO)
• Side-by-side diagram: USB serial flow vs BLE characteristic flow (read/write/notify labeled). (ble-bidirectional.md:25 TODO)

Shot list — bench/capture (hardware + screen recording)

Demos span phone app (nRF Connect) and browser (Web Bluetooth) screen capture plus the breadboard.

• Part 1 video (~10–15s): nRF Connect writing RGB hex (FF0000/00FF00/0000FF), onboard NeoPixel changing color per write. (ble-bidirectional.md:295 TODO)
• Screenshot: nRF Connect write dialog with hex values (iOS + Android). (ble-bidirectional.md:288 TODO)
• Part 2 screencast (~5–10s): Chrome Web Bluetooth page — live pot value + RGB sliders driving the NeoPixel. (ble-bidirectional.md:559 TODO)
• Part 2 "magic moment" video (~15–20s): browser sliders → BLE → physical NeoPixel, board visible. (ble-bidirectional.md:566 TODO)
• Screenshot: nRF Connect UART (NUS) chat — text both directions vs Serial Monitor.

Also blocked on (code/hosting, tracked here)

• Build + host the Web Bluetooth demo page (GitHub Pages); push BLENeoPixelControl.ino, BLEUartService.ino to makeabilitylab/arduino ESP32/Bluetooth/.

Suggested hero

The "magic moment" browser→BLE→hardware clip (~20s). Draft caption:

Send data from your phone or web browser to control an ESP32's hardware in real time — BLE's structured power meets Web Bluetooth for a browser-based interface.

Placement (hero-first standard)

Put the hero block immediately after the TOC --- — before any intro prose, the draft banner, or note box (slot: TOC → hero → optional note → prose; see #123). Markup: <video autoplay loop muted playsinline aria-label="..."> for a local clip (use controls instead of autoplay if it has audio), or <div class="iframe-container"><iframe ... title="descriptive..."></iframe></div> for YouTube — followed by a **Video.**/**Figure.** caption with {: .fs-1 }.