Transfer Learning Workflow¶
Specification¶
The full specification below is extracted from Chapter 17: Building a Real-Time Object Detection Pipeline.
Type: workflow
**sim-id:** transfer-learning-workflow<br/>
**Library:** p5.js<br/>
**Status:** Specified
Learning objective: Students will *sequence* (Bloom L3: Apply) the steps of transfer learning used to add a custom object class to a pretrained model.
Canvas: 700x420px, responsive — four connected step boxes recomputed as fractions of `width` inside `windowResized()`, switching from a horizontal row to a vertical stack below 560px wide.
Layout: four connected step boxes: "1. Start with a Pretrained Model" (general vision features already learned) → "2. Collect a Small Custom Labeled Dataset" (a few hundred images of the new object class, not millions) → "3. Retrain Only the Final Layers" (early layers stay frozen and unchanged) → "4. Fine-Tuned Model" (recognizes the original classes plus the new custom object class).
Controls: a `createButton()` labeled "Compare to Full Training" that temporarily overlays a second, grayed-out path above the main sequence reading "Full Training: Millions of Images -> Weeks of Compute -> New Model," letting students directly compare the size of both efforts. A `createButton()` labeled "Hide Comparison" removes that overlay.
Interaction: clicking any of the four main step boxes opens an infobox with a one-sentence explanation matching the chapter's transfer learning definition, plus, for step 3 specifically, a note that "frozen" means those layers' weights are not updated during this retraining pass. Only one infobox is shown at a time.
Implementation: p5.js. Step data as an array of four objects `{title, description}` with fixed relative x positions recomputed on resize. Hit-testing via rectangular bounding boxes. Toggle the comparison overlay's visibility with a boolean state variable set by the two buttons.