How We Built the Backpropagation Demo

# Updated Brief: AILT1001 L2 Neural Network Demo

Start again from a fresh implementation of Demo3 for AILT1001 Lecture 2. Pedagogy and technical correctness are the highest priorities. Preserve the previous candidates and creation records as an earlier iteration; do not adapt their discrete-search training into something labelled backpropagation.

Build three independent candidate webpages. Keep the familiar two-input, three-hidden-neuron, one-output network and red knobs from the lecture. The candidates should differ in teaching approach and interaction design, while using the same verified mathematical model, training algorithm, and default data. After independent development, have each agent review both other candidates, make one improvement round, and present all three for the instructor to choose.

## Teaching Purpose

Help students explain this sequence:

1. The network makes predictions using its current parameters.
2. A cost measures the difference between predictions and known outcomes across the training examples.
3. Backpropagation calculates how the cost changes with each parameter.
4. The optimizer uses those gradients to update the parameters.
5. Repeating this process can improve the fit, but does not guarantee a perfect model or reliable predictions for new cases.

Ask students to predict an effect before revealing it. Keep the main screen simple enough for a short live lecture demonstration. Stage detail on demand instead of displaying every formula, control and explanation at once. The cost curve and changing knobs must support one coherent story.

## Exact Examples and Model

Use these synthetic examples from the slides, with editable inputs and known scores:

| Example | Sleep (Hours) | Study (Hours) | Known Score |
|---|---:|---:|---:|
| Apple Cheung | 3 | 5 | 75 |
| Rainbow Wong | 5 | 1 | 82 |
| Sunny Choi | 10 | 2 | 93 |

Use a genuine feedforward neural network:

- Two inputs, three ReLU hidden neurons, one linear output.
- Nine continuous floating-point connection weights, allowing positive, zero and negative values.
- A learnable bias for each hidden neuron and the output neuron: four biases, thirteen trainable parameters in total.
- Explain a bias briefly as an adjustable offset. Show its existence clearly, with its value and adjustment available on inspection. Keep the familiar nine connection knobs as the dominant visual rather than crowding the network with four equally prominent new knobs.
- Keep all calculations at full floating-point precision internally. Round only displayed values. Expose extra precision on inspection.
- Knobs turn smoothly. Tick marks are visual guides, not permitted discrete weight values. No snapping, quantized training, or clipping trained parameters to a display range. Make the zero position and positive/negative direction clear.

Use explicit fixed scaling: divide each input in hours by 10 and each target score by 100. Calculate training predictions and mean squared error in these scaled units. Multiply the output by 100 when displaying a predicted score. Show the conversion when a student traces the calculation, so the displayed arithmetic never mixes raw and scaled units. Do not silently clamp predictions to 0–100. These are scale factors, not a claim that every possible input falls between 0 and 1.

The forward calculation is:

```
x = [sleep / 10, study / 10]
h = ReLU(W_hidden @ x + b_hidden)
prediction_scaled = W_output @ h + b_output
prediction_score = 100 * prediction_scaled
cost = mean((prediction_scaled - known_score / 100) ** 2)
```

This is an intentional update to the earlier bias-free, integer-weight example. Do not carry forward its claim that Sunny's prediction must be twice Rainbow's. That restriction does not generally hold once biases are present.

## Genuine Training

Use analytical backpropagation and full-batch gradient descent on the three current examples. Keep the update rule simple: calculate every gradient from the same pre-update state, then update all weights and biases together with a learning rate. Backpropagation calculates the gradients; the optimizer applies the updates. Do not search alternative knob positions, use finite differences as the training algorithm, or precompute a desired sequence of predictions.

Choose and document a sensible random initialization and stable default learning rate through reference testing before candidate development. Give all three agents that same numerical contract. Randomize connection weights on every new run; document bias initialization. A reproducible seed may be available for inspection or testing. Never silently retry seeds or select only successful runs. Handle inactive ReLU units and stalled training honestly. New Start resets parameters, iteration, optimizer state and history.

Provide One Step, Train/Pause and New Start. Train must remain responsive and bounded. Stop visibly on nonfinite values, a documented stopping criterion or an iteration limit. A stop must not imply that a global optimum or a good real-world predictor has been found.

## Visualize the Process

Use the lecture's restrained white background, readable black text, network geometry and red knob treatment. Match the established style rather than introducing a decorative dashboard.

- Hover or keyboard focus reveals the inspected connection, its actual input, weight and product. Include the bias when explaining a neuron's sum, and show what ReLU does.
- Make negative and inactive values intelligible. Do not imply every signal is positive or every neuron is active.
- During a training step, optionally stage prediction, cost, gradients and update, but never display old values as if they belong to new parameter settings.
- Plot real cost against training iteration, including the random initial state at iteration zero. Label the cost's scaled units and axes. Display the actual curve, including increases or plateaus. Do not teach that every gradient-based update must decrease cost.
- Keep the three current predictions and known scores accessible. Distinguish lower aggregate cost from improvement for every individual example.
- Offer a simple way to try a new input after training with parameters held fixed. Clearly separate inference from editing the training data. A good fit to three examples does not establish generalization.

Data editing pauses training and starts a new history. Invalid input must block training and remove or clearly mark stale predictions and costs. Restore Slide Examples should recover the original three rows. Allow sleep/study values from 0 to 24 hours and known scores from 0 to 100; reject blank and nonfinite values.

Make every essential interaction work with mouse and keyboard. Provide meaningful focus states and a complete reduced-motion presentation. Verify that essential content fits and remains readable at both Deckroom demo resolutions, 1280×720 and 1920×1080.

## Independent Verification and Reviews

Before claiming correctness, compare the exact model against a PyTorch reference with identical inputs, scaling, parameters, MSE reduction and learning rate. Verify forward values, every weight and bias gradient, one simultaneous update and a multi-step training trajectory. Use finite-difference gradient checks away from ReLU's nondifferentiable zero as an additional test, not as the learning algorithm.

Test multiple random starts, edited data, inactive ReLU units, pause/resume, restart, invalid-input recovery and inference with frozen parameters. Verify animation/numeric consistency and the real cost history. Report limitations and failures rather than hiding them.

Have all three agents independently critique both other candidates for pedagogy, mathematical fidelity, readability and usability. Preserve the initial proposals, six peer assessments and the concrete changes from one improvement round. The instructor chooses the final candidate.

## Lecture Integration and Creation Record

Build self-contained webpages suitable for the local L2 package and Demo3 tab, with no external service required to run them. Use the current verified Deckroom runtime. Preserve Demo1, Demo2, the existing slides and published releases while developing the new candidates.

Identify the precise slide changes needed for consistency, including:

- Reframing ten positions and one billion combinations as a hypothetical simplification.
- Introducing continuous signed weights and biases.
- Showing any scaling when tracing arithmetic.
- Replacing illustrative prediction values with values the updated network can actually produce.

Present those slide changes for the instructor's design approval rather than silently changing their visual composition.

On each candidate, show “Created with Codex (GPT-6)” and an unobtrusive expandable prompt. Provide a readable creation page containing this updated brief, the reason for restarting, the independent proposals, peer reviews, verification summary and improvement record. Clearly distinguish the earlier discrete-search prototypes from the new backpropagation candidates. Include shareable review conclusions, not private model reasoning or student survey records.

After verification and the improvement round, place a chooser in Demo3 and show all three candidates locally. Do not publish a new lecture release or select the final design without the instructor's instruction.

# A: Follow the Learning Step

Created with Codex (GPT-6)

The teaching question is: “If the cost gradient is positive, which way should this parameter move?” Students first inspect one connection in the familiar network, then use one true gradient-descent step to check their prediction. A compact inspector connects the scaled input, multiplication, biased neuron sum, ReLU and output. After a step, a separately labelled record shows the inspected parameter's previous value, cost gradient and optimizer update; current network values always describe the updated parameter snapshot.

The central network and three current predictions stay visible. Nine original red connection knobs dominate; four smaller bias controls identify the additional adjustable offsets. A parameter's full-precision numeric editor appears only in the inspector. Tick marks are guides, zero is at the top, and the continuous pointer angle uses atan(weight) without limiting the parameter. Keyboard increments support manual exploration but do not quantize training.

The lower area pairs the editable three-row training table with a cost curve. A separate “Try a New Input” section pauses training and evaluates new hours with the current parameters held fixed. It changes neither training rows nor recorded costs. A sentence asks what a good fit to three examples establishes about a new student, without implying generalization or reviving the old bias-free doubled-input restriction.

The exact model, initialization and analytic backpropagation come from the shared engine.js contract. Full-batch gradient descent uses learning rate0.05 and updates all thirteen parameters from one pre-update gradient. Initial weights are seeded uniform[−0.7,0.7], hidden biases0.1, output bias0; every visible new run uses a fresh seed unless a test explicitly supplies one. Initial and subsequent real scaled-MSE costs are recorded, including increases. Automatic training stops at5000 iterations or nonfinite results. No seed is silently retried.

The white 1280×720 layout uses Arial, black lines and the exact lecture knob body. Hover/focus animates only the inspected edge; pointer positions and numbers update atomically. A visible distinction between “Current calculation” and “Previous update” prevents the gradient trace from being mistaken for the updated state's gradient. Invalid data or parameter drafts pause training, clear cost evidence, and withhold stale numbers. Restore Slide Examples retains current parameters and restarts history.

Independent reference verification belongs to the shared engine; frontend verification will check the exact one-step call, data/parameter reset boundaries, inference preserving training state, keyboard access, invalid recovery, finite stopping and both projection sizes. This is a fresh backpropagation candidate, not an adaptation of the earlier discrete search.

# A's Independent Reviews

Created with Codex (GPT-6)

Reviewed both initial proposals, source files, and the coordinator's 1280×720 captures. These are shareable conclusions about the fresh backpropagation candidates.

## B: One Network, Three Examples

The simultaneous table and per-example “closer / further” feedback make the aggregate objective observable. The inspector correctly labels the current gradient and next optimizer change, and the model dialog clearly documents scaling, initialization, continuous knobs and biases. Core training delegates to the shared analytical engine.

- **High, signed values must remain visually trustworthy:** The initial screenshot loses or obscures signs around crowded connection labels; a white patch also crosses the middle output connection. Reposition numeric labels and give each a small opaque background that does not cover another knob or node. Verify negative values, long decimals and bias labels at both resolutions.
- **Medium, inference is labelled fixed while training changes it:** renderInference runs on every training render and recalculates the separate new-input prediction using the latest parameters, although the section says “fixed parameters” and that cost history stays fixed. Require an explicit inference action that pauses training, or hide/mark that result when training resumes. The displayed claim should describe the current state.
- **Medium, an unfinished parameter edit can be reassigned by hover:** inspect changes the parameter index even while the numeric editor has focus. Hovering a different knob before finishing the edit can apply subsequent typing to another parameter. Hold the editing target fixed until blur or an explicit selection action; preserve invalid drafts and their identity.
- **Low, the benefit of fitting three examples needs a lasting question:** The useful initial question about evidence for a new prediction is replaced after rendering by a state description. Keep a short question about evidence or unseen cases alongside that state description so the final teaching decision remains visible.

Retain the table-led comparison and current-gradient inspector. Prioritize reliable signs and an honest inference state over adding more controls.

## C: Predict, Train, Test

The three stages connect mechanism, training and inference cleanly. The Train stage labels the recorded gradient as belonging to the pre-update state, and the Test stage pauses training before showing an unknown outcome. The compact bias controls and explicit scaling note make the new mathematical contract visible.

- **High, nonfinite training exceptions are not caught:** NN.step throws when an update becomes nonfinite, but step calls it outside a try/catch and checks its return afterward. An exception bypasses the intended stop message and can leave the interval running. Catch the engine exception, stop immediately, retain or clearly invalidate the previous evidence, and report the failure. Guard nonfinite evaluations during manual extreme-parameter edits as well.
- **Medium, the lower lesson overlaps the footer at 1280×720:** In the initial capture, the Restore Slide Examples button lies across the creation footer, and the last teaching sentence reaches that boundary. Reserve explicit footer space or compact the lesson region without reducing essential text sizes. Check the longer last-update equation as well as the initial state.
- **Medium, parameter editing can silently change target:** Hover/focus inspection changes inspected even if the numeric parameter editor still has focus. Keep the active editing target stable until the edit ends, including incomplete input, so typing cannot mutate a different weight or bias.
- **Low, some output traces omit the actual bias value:** The outgoing-weight trace says “Sum + output bias” without displaying that offset. Include its numeric value in the inspected equation, while retaining the final scaled-output-to-score conversion.

Keep the stages and explicit pre-update gradient record. Fix exception handling and footer overlap before expanding the explanation text.

# A: One Peer-Informed Improvement Round

Created with Codex (GPT-6)

The revised candidate retains the mechanism-first journey: predict an update direction, reveal the current gradient, apply one true learning step, then inspect a separately labelled previous update. The shared model and analytical training engine are unchanged.

- **Signed values and biases:** Repositioned connection values onto small opaque white backgrounds so negative signs remain distinct from black edges. Moved compact bias labels away from outgoing connections and added matching white backing. The nine original red knob bodies remain unchanged.
- **Output units:** Renamed the already converted output “Prediction (points).” The inspector still shows the actual scaled output multiplied by100, so the node cannot be mistaken for another value awaiting conversion.
- **Gradient scope:** Both revealed gradients and previous-update records explicitly refer to the cost across all three training examples. This distinguishes the aggregate training gradient from the single student's forward trace, including when that student's ReLU is inactive.
- **Manual interaction:** Added native pointer dragging for continuous weight adjustment. Keyboard increments and the full-precision numeric editor remain available. Pointer angles are display mappings only; neither training nor manual numeric entry snaps or clips parameters.
- **Editing target stability:** Hover cannot change which parameter a focused numeric editor will update. An invalid parameter draft also retains its target. Biases use the same protected inspector; explicit valid selection remains available.
- **Inactive units:** Added a short legend identifying dashed nodes as ReLU output zero.
- **Nonfinite evaluation:** Guarded baseline, validation and rendered evaluations, as well as the existing training-step exception handling. Nonfinite model calculations pause training, withhold cost evidence and give a recoverable message. No seed is retried automatically.
- **Projection:** Added uniform scaling from the1280×720 composition to1920×1080, preserving the relationship between typography, network and controls.

Both independent reviews were read before this single revision. Root findings about native drag, negative signs, output units and editor retargeting were included in the same round. The updated inline JavaScript passes Node syntax checking, and the naming audit reports no violations in candidate A's files. Numerical reference verification and final browser interaction checks are recorded by the coordinator in the shared verification summary; this document does not substitute source inspection for those tests.

Final integration check: moved the output caption upward so the outgoing weight label cannot cover the beginning of “Prediction (points)”.

# B: One Network, Three Examples

The teaching question is: **When average error falls, does every example improve?** Students see the three known scores and current predictions beside the same network, select one example to trace, then predict the effect of an update before pressing One Step.

The fresh implementation uses the shared analytical backpropagation engine. Every step computes gradients of scaled mean squared error over all three examples, then gradient descent updates all nine continuous signed weights and four biases together at learning rate 0.05. The UI never substitutes search, snapping or a predetermined training trajectory.

## Teaching Sequence

1. Begin with a fresh visible random seed and show the three current predictions. Select one row and inspect its forward calculation, including hours divided by 10, hidden weighted sums plus biases, ReLU and the output multiplied by 100.
2. Inspect a red connection knob. Its actual scaled input, signed weight and product appear beside its current cost gradient. Ask which direction gradient descent will move that parameter. One Step applies all thirteen updates simultaneously; the result reports which examples moved closer or further from their known scores.
3. Train accumulates the actual cost curve, including increases or plateaus. Pause preserves the current parameters. The chart measures scaled MSE; individual signed errors remain score points.
4. Try a new sleep/study input in a separate inference area. This pauses training and uses the fixed parameters. Training data and history remain unchanged. Ask what evidence three fitted examples provide for this new prediction.

## Composition

White 1280 × 720 canvas, scaled uniformly for the 1920 × 1080 demo view. Arial black text, familiar black network lines and red weight knobs dominate the left. The three examples occupy the right, with a compact independent new-input area below. The bottom holds training controls, an inspected-parameter explanation, and the real cost curve.

Nine smooth connection knobs use a signed arctangent display: zero points upward, negative values left, positive values right. Tick marks are guides only. Knobs never clip or quantize training parameters. Four small bias controls beside the hidden and output neurons reveal adjustable offsets without adding four competing knobs. Keyboard focus shows the same calculation and moving signal as hover; reduced motion keeps static highlighting and complete numeric values.

Invalid training input pauses training and removes stale prediction, cost and history evidence. Valid edits start a fresh history at the current parameters. Restore Slide Examples recovers the original data. A selected parameter can be edited at full floating-point precision. Seed, initialization, scaling, learning rate and the current inspected gradient are available without requiring the learner to read all thirteen values at once.

## Limits to Teach

A lower average cost does not imply that every row improved, that every gradient step must improve cost, or that a new student's score is predictable from these features. Inactive ReLU units are shown honestly. There is no success-seed filtering or automatic retry. The run stops visibly at 5000 iterations or on nonfinite results. The earlier bias-free doubled-input restriction is inapplicable to this model.

Source grounding: the updated brief and shared contract in this workspace; the active lecture's familiar red knob and two-input, three-hidden-neuron geometry; curriculum_design.md, lecture_delivery.md and the cohort survey's emphasis on carrying out a concrete check. No earlier discrete-search implementation is reused.

# B's Independent Peer Reviews

Reviewed the initial a/index.html and c/index.html implementations, their proposals, and root's 1280 × 720 screenshots. Findings concern the fresh backpropagation candidates only.

## A: Follow the Learning Step

**Strength:** The strongest explanation of a learning update. “Current calculation” and the explicitly labelled previous update separate pre-update gradients from current parameters. Revealing a gradient after making a prediction is a useful learning interaction. The editable examples, genuine engine step, and fixed-parameter inference are clearly separated.

- **Medium, signed-value legibility:** Several weight values sit directly on black connection lines, and the middle hidden bias is printed on its outgoing edge. The minus sign is part of the mathematics, so it must remain unambiguous. Put short numeric labels on opaque white backgrounds offset from the line, and move the bias label away from the outgoing connection.
- **Medium, output conversion label:** The output node contains the already multiplied score, while its caption says “Score × 100.” This can be read as an instruction to multiply that score again. Label the node “Predicted score,” retaining the scaled-output × 100 calculation in the inspector, or show the scaled value inside the node and an explicit conversion outside.
- **Low, inaccessible explanation of inactive units:** The screenshot uses dashed hidden nodes for zero activations, but the main screen does not explain the dash. Add a short legend such as “Dashed neuron: ReLU output 0,” or name the state directly when inspected.
- **Low, 1080p use of space:** The page remains at a maximum width of 1280 pixels rather than scaling with the 1920 × 1080 lecture view. Check projection readability at that size and consider uniform canvas scaling so text remains proportionate.

The genuine training computation is delegated correctly to the shared engine. The loop preserves every cost point and retains the last finite parameters if the engine rejects an update. Prioritize readable signs and the output-unit label.

## C: Predict, Train, Test

**Strength:** The three questions distinguish predicting, training and testing while keeping the network stable. Selecting Test changes the traced network to the inference input, which makes frozen-parameter inference unusually concrete. The previous-update equation identifies the gradient's pre-update state.

- **High, uncaught nonfinite update:** `step()` calls `NN.step` without a try/catch, although the engine can throw on nonfinite results. The later finite-value branch cannot handle that exception, so automatic training can retain an active timer while errors repeat. Catch engine exceptions, stop the timer, state the reason, and retain the last finite parameters. Also treat nonfinite baseline costs or gradients as invalid evidence before enabling training.
- **High, tiny positive costs can display as zero:** `fmt` rounds to `d` decimal places and then calls `toLocaleString` without `maximumFractionDigits:d`; the latter defaults to three decimals. Thus a value such as 0.0004 with d=6 prints as 0 instead of its positive value. Respect the requested decimal precision and use scientific notation for tiny nonzero costs. The same issue affects the displayed gradient and update equation.
- **Medium, footer collision:** In root's 720p screenshot, the Train-stage explanation runs into the footer and Restore Slide Examples overlaps the footer attribution. Reserve a clear footer band and give the stage explanation enough height for two lines. Verify the longer previous-update equation as well as the initial text.
- **Medium, invalid parameter inspection:** After clearing the parameter editor, focusing another knob can replace the empty editor with a valid parameter value while `paramInvalid` stays true. The page then appears valid but still blocks training. Preserve the invalid draft and selection until corrected, or explicitly reset validity when changing which parameter is edited.
- **Medium, output units:** As in A, the output node displays a score while the caption says “Score × 100.” Name the displayed quantity unambiguously and keep the conversion in the trace.

Prioritize nonfinite stopping and precision before layout refinements. The source otherwise uses the intended scaling, continuous parameters, simultaneous engine update and actual history rather than search or prerecorded outputs.

# B: One Peer-Informed Improvement Round

The revision retains the evidence-first question and the three simultaneous examples. It changes presentation and interaction boundaries while keeping all model calculations in the shared analytical engine.

- **A, C and root: reliable signed labels.** Weight values now occupy dedicated positions on small opaque white backgrounds, clear of adjacent red knobs. Compact rounded displays preserve negative signs and avoid false zeros through scientific notation; inspection retains the full parameter. ReLU state labels move above their neurons, and bias controls have separate positions clear of the output knobs.
- **A and C: fixed-parameter inference.** An explicit Predict action pauses training and displays the new-input result. Training, a manual parameter change or New Start invalidates that result until Predict is used again. The inference area now asks whether fitting three examples supplies enough evidence for this new prediction.
- **A and root: stable parameter editing.** Hover cannot retarget the inspector while its numeric editor has focus. Invalid drafts retain their parameter identity and block alternative knob adjustment until corrected or explicitly reset.
- **C: visible conversion.** The output area now shows the scaled output × 100 conversion and the current score in points, even when an input connection is selected.
- **C: gradient scope.** The inspector calls the gradient a batch gradient, and its accompanying line explicitly says it uses all three examples. This separates a forward trace for one example from the aggregate training gradient.

The nine weight knobs retain smooth continuous signed pointer positions. The four compact bias controls remain editable, and the model dialog retains scaling, initialization, learning rate and seed documentation. No model search, quantized update or seed screening is introduced. Root's independent numerical checks and final browser checks are recorded in the shared verification summary.

Final visual inspection of root's revised 1280 × 720 and 1920 × 1080 captures confirmed readable signed values, bias controls clear of the red knobs, a visible scaled-output-to-score conversion, inference withheld until Predict, and essential content fitting above the footer. The revised inline JavaScript passed a syntax check. Root's standard UI/API checks passed before the remaining edge-case checks.

# Candidate C: Predict, Train, Test

Created with Codex (GPT-6)

This fresh candidate uses three guided questions while keeping one network, three known examples, and the real cost curve in stable positions. It replaces the previous discrete-search implementation entirely with the coordinator's verified analytical-backpropagation engine.

1. **Predict:** What happens if this connection becomes stronger? Select a training example and inspect a signed weight. The explanation shows input scaling, the actual multiplication, bias offset, and ReLU output. Nine red connection knobs dominate the network; four smaller bias buttons make the additional offsets explicit. Numeric parameter editing permits arbitrary finite decimals.
2. **Train:** How does the network decide what to change? One Step performs one simultaneous update of all13 parameters. An inspection strip distinguishes the gradient calculated at the previous state from the optimizer update and current value. Train repeats real updates with every cost point retained, including increases. The three displayed predictions remain the evidence; a lower aggregate cost is not a claim about each student.
3. **Test:** Will the same parameters work for a new input? A separate pair of hour inputs pauses training and performs inference with fixed parameters. The current dataset and cost history stay unchanged. Students see a prediction without a known outcome, then decide what further evidence would be needed before trusting it.

The page uses Arial, white space, black network lines and the lecture's red ten-tick knob geometry. Ticks are visual guides, not discrete permitted values. Signed continuous values map through atan to pointer angle; zero points upward. Numeric values are authoritative. Pointer and numerical updates occur together; restrained animated strokes identify the inspected connection, with a static reduced-motion equivalent.

Shared model: two inputs scaled by10, three ReLU hidden units with biases, a linear output with bias, displayed score scaled by100. Nine weights plus four biases. Training MSE uses targets divided by100. Initialization is seeded uniform[−0.7,0.7] for weights,0.1 for hidden biases,0 for output bias; learning rate0.05. New Start uses a fresh seed without screening. Training pauses at5000updates or a nonfinite result and makes neither perfection nor generalisation claims.

All controls, including data editing and bias inspection, support mouse and keyboard. Invalid data hides prediction evidence and clears the curve until corrected. Editing data or parameters pauses training and begins a new history; inference does neither. The complete lecture interface must fit1280×720 and remain legible at1920×1080. Independent peer review will precede one improvement round; the instructor selects the final candidate.

# Candidate C's Independent Peer Reviews

Created with Codex (GPT-6)

Reviewed both initial proposals, frontend source, and coordinator screenshots at1280×720. Mathematical observations concern how the interfaces use the shared engine, whose independent numerical reference verification belongs to the coordinator. These are shareable review conclusions.

## A: Follow the Learning Step

**Strongest feature:** The distinction between Current Calculation and Previous Update is especially effective. A student can inspect a forward calculation and then see the gradient/optimizer action without confusing two parameter snapshots. The complete data table and explicit inference button support a clear learning sequence.

- **Medium, ambiguous output units:** The output node already shows score points but its label says “Score ×100.” That can suggest students should multiply the displayed value again. Use “Prediction (points)” and retain the correct scaled-output-to-score conversion in the inspector.
- **Medium, gradient scope needs to be explicit:** With seed1, Apple's first hidden neuron is inactive. That does not force the corresponding training-cost gradient to vanish, because gradients aggregate all three training examples. Label the revealed quantity “Gradient of the cost across all3 examples” so the single-student trace is not mistaken for the source of the complete gradient.
- **Medium, overflowing finite parameters:** The validity predicate directly calls NN.evaluate without a try/catch. Entering an extreme but finite parameter can cause evaluation to throw before the existing step-level error handling runs. Guard evaluation in validation/reset/render and stop with a clear unavailable state while preserving recoverable parameters.
- **Low, projection hierarchy:** The legend and curve labels are comparatively small, while some network lines pass close to bias labels. Preserve the main composition but give bias offsets a small white background and check legibility on projection.

The model/gradient distinction is pedagogically strong. Prioritise unit clarity, aggregate-gradient scope, and robust invalid-state handling over adding more controls.

## B: One Network, Three Examples

**Strongest feature:** Reporting each example as closer/further after a real gradient update makes the aggregate objective concrete. Showing the current gradient and proposed change gives students an immediate prediction opportunity.

- **High, inference is labelled fixed while it changes during training:** The separate inference area says “fixed parameters,” but every training render calls renderInference and recomputes its number from newly updated parameters. Editing an inference input correctly pauses training, yet starting Train again makes that apparently frozen result move. Hide/invalidate the inference result while training, or explicitly lock a snapshot and label which snapshot it uses. The first option is simpler.
- **Medium, network labels collide:** In the720px screenshot, several weight numbers touch connections or other numbers; ReLU/bias labels crowd the middle node, and “Scaled output” competes with the upper outgoing-weight label. Allocate dedicated label positions and white backing for numeric labels. Keep all9 weights legible without increasing the number of decorative elements.
- **Medium, score conversion is hard to locate:** The network shows a scaled output while the table shows points, but the visible input-edge inspector may not show the ×100 conversion. Add a compact persistent conversion beside the output or selected row so students can connect0.124 to12.36 without opening the settings dialog or selecting an outgoing edge.
- **Low, gradient scope:** Label the displayed gradient as the gradient of the cost across all3 examples. The currently traced student's inactive ReLU may coexist with a nonzero batch gradient; that distinction is useful teaching rather than an error.

B's per-example feedback is a compelling alternative to a mechanism-first walkthrough. Fix the frozen-inference claim and label collisions before adding explanatory text.

## Shared Recommendation

Keep the demos' distinct questions. Both should explicitly distinguish a forward calculation for one chosen example from a gradient aggregated over the full training set. Successful fitting and a low three-example cost must remain separate from evidence about a new input.

# Candidate C: One Improvement Round

Created with Codex (GPT-6)

This revision responds to independent A/B reviews and the coordinator's initial browser findings. It preserves the three-stage Predict → Train → Test approach and the shared analytical-backpropagation engine.

- **Nonfinite calculations:** Added guarded evaluation for manual extreme parameters and a try/catch around the training-engine step. A failed update stops the timer and retains the previous parameters. Invalid baseline evidence is withheld rather than plotted.
- **Accurate small numbers:** Locale formatting now respects the requested decimal precision. A positive cost such as0.0004 remains visibly positive; smaller nonzero values use scientific notation. The numeric editor and precision line expose the full parameter string.
- **Clear output units:** Renamed the output caption Prediction (points). Conversion from scaled output to score remains explicit in the trace. Outgoing-weight inspection now includes the numeric output-bias value.
- **Stable editing target:** Hover/focus cannot switch the inspected parameter while its numeric editor has focus or contains an invalid draft. Explicit valid selection ends the previous edit. Invalid drafts must be corrected or reset before selecting another parameter.
- **Direct continuous interaction:** Added pointer dragging to the red knobs. Dragging changes the actual continuous parameter, pauses training, and restarts history. Numeric and keyboard editing remain available; training never snaps to ticks.
- **Signed-value legibility:** Moved weight values to dedicated opaque label positions so black connection lines do not obscure minus signs.
- **Space for the teaching conclusion:** Compacted the training table, curve spacing, and lower controls to reserve the footer band. Essential text retains its intended hierarchy; the longer previous-update explanation remains in the lesson area.
- **Gradient scope:** The previous-update explanation now states that its gradient is computed across all three examples from the pre-update state. Changing the inspected parameter updates that recorded explanation as well as the current calculation.

## Verification

The revised inline JavaScript parses successfully. Naming audit passes for the candidate directory. The coordinator's initial frontend API checks passed before the revision; the shared engine independently passed199 PyTorch/reference checks across13 fixtures, with maximum numerical difference4.3e−14. Final browser interaction and layout checks belong to the coordinator and are not claimed complete here.

The model's limitations are unchanged: random starts can stall, gradient steps need not decrease cost, predictions are not clipped, and fitting three examples does not establish performance on new inputs.