Interactive Math · Learning Design

Christopher Welch

Mathematics curriculum & learning designer · 11+ years teaching mathematics · 13 years external examining · M.Ed. Education Technology & Instructional Design
PGCE Secondary Mathematics & QTS · Subject Knowledge Enhancement (SKE) in Mathematics, MMU · B.Sc. (Hons) Economics · IGCSE Further Pure Mathematics Examiner (Pearson Edexcel)

How I introduce an unfamiliar idea: start from what the learner already knows, make it something they can move and see, and let the formal result fall out of their own reasoning. Below: five case studies (four in curriculum and assessment design, one in instructional design), four interactive mathematics explainers you can try live, and a self-paced online course I designed end to end.

Case studies · Curriculum & instructional design

Designing an Online Calculus Skill

The full design chain for one online skill: objective, a six-item progression, misconception-mapped distractors, and a build-ready production spec.

Assessment designMisconception mappingProduction spec
Explore the case study

Reasoning-Aware Practice

Three prototypes that collect better evidence about where a learner's reasoning may have broken: identify the first unsupported step, repair a prerequisite misconception, and verify transfer across representations.

Item designDiagnostic feedbackExaminer insight
Explore the case study

From Arrays to Factoring

A vertical-articulation audit of the distributive property, traced Grade 3 arrays to Algebra 1 factoring, with an area-model interactive that expands forward and factors backward.

Vertical articulationStandards mappingInteractive model
Explore the case study

One Learner, Three Systems

One proportional-reasoning pathway for a neurodivergent learner, mapped across the US, England, and New Zealand with version-controlled standards and diagnostic item specs.

Cross-system designNeuroinclusiveLocalization
Explore the case study

Rugby League 101 — onboarding (San Diego Barracudas)

A learner-research-driven onboarding design for a rugby league club, built to prevent negative transfer for players arriving from rugby union.

Learner researchInstructional designMeasurement plan
Explore the case study

Interactive · Mathematics

Completing the square, without the recipe

Most people learn this as steps to memorize. Step through it and watch why the name is the explanation — you're literally completing a square.
Design notes — problem, learner, decisions, evaluation

Design problem: Completing the square is usually taught as a memorized recipe, so the −(b/2)² correction feels arbitrary and errors follow.

Learner & objective: Algebra students meeting the technique for the first time (GCSE / US Algebra 1–2). Objective: connect each algebraic move to the geometry so the correction term is understood, not recited.

Key decisions: A four-stage reveal (pieces → rearrange → see the gap → complete it) with the algebra line synced to the figure, and a slider over b so the structure generalizes instead of being one worked example.

How I would evaluate it: Before the final stage, ask the learner to predict the correction term for an unseen b; success = correct prediction and a one-sentence reason referencing the corner square.

Why does a negative times a negative make a positive?

A rule everyone memorizes and no one is shown. Build the pattern first, then prove it has to be true.

Step the staircase. Each line multiplies by −2, and the first number drops by one each time:

3 × (−2) = −6
2 × (−2) = −4
1 × (−2) = −2
0 × (−2) =  0
−1 × (−2) =  ?
Each answer climbs by 2 as the first number drops. Keep stepping and predict the last line before it's revealed.

The pattern is convincing — but here's why it can't be anything else. We only need two things the learner already accepts: anything times zero is zero, and multiplication distributes over addition.

Start true:   −1 × 0 = 0
Rewrite 0 as (2 + −2):   −1 × (2 + −2) = 0
Distribute:   (−1×2) + (−1×−2) = 0
Simplify:   −2 + (−1×−2) = 0

Read the last line as a question: what must (−1×−2) be so that −2 plus it gives 0? It has to be +2. There's no other choice — the "rule" is forced by arithmetic the learner already believes.

Design notes — problem, learner, decisions, evaluation

Design problem: The sign rule is memorized without justification, so it is misapplied under pressure and erodes trust that mathematics makes sense.

Learner & objective: Middle-grades learners (US grades 6–8). Objective: replace “because the rule says so” with a pattern the learner extends themselves, then a two-line proof from facts they already accept.

Key decisions: Predict-before-reveal stepping (the learner commits to the next line before seeing it), then an optional distributivity proof kept behind a click so the pattern comes first and the formalism second.

How I would evaluate it: Ask the learner to rebuild the argument with different numbers; success = the pattern and the proof both reproduced without prompting.

The derivative, from first principles A-Level · calculus

Slide h toward zero from either side and watch the secant slopes approach the tangent slope. At h = 0, the quotient is undefined; the exact limiting value is established algebraically.
Design notes — problem, learner, decisions, evaluation

Design problem: Learners meet the derivative as a rule to apply and never see the limit process it names, which surfaces later as brittle understanding in applications.

Learner & objective: Precalculus / early calculus students (A-Level, US grades 11–12). Objective: experience the secant-to-tangent limit as an observable process in graph and symbols simultaneously.

Key decisions: One control drives the graph and numerical readout together. The visualization makes the approach observable; the algebra establishes the exact limit.

How I would evaluate it: Pause near h = 0 and ask the learner to state the exact slope the secant slopes are approaching and explain why the difference quotient is evaluated only for nonzero h. Success means identifying the limiting slope and distinguishing the limit process from direct substitution at h = 0.

Proof you can see: 1 + 3 + 5 + … always makes a square proof · visual reasoning

My examiner specialty is Further Pure and mathematical proof — but a good proof should be enjoyable for a beginner too. Slide n and watch each odd number wrap the square in a new layer.
Design notes — problem, learner, decisions, evaluation

Design problem: Proof is usually introduced symbolically, which excludes learners who could reason structurally before they can write induction.

Learner & objective: Any learner meeting proof for the first time. Objective: build the conviction that the result must hold — a bridge into formal proof, not a replacement for it.

Key decisions: Each odd number is drawn as a colored L-shaped layer wrapping the previous square, with the running sum synced beneath, so the identity is visible layer by layer.

How I would evaluate it: Ask why the next layer always adds an odd count of cells; success = an answer referencing the two sides plus the corner (2n−1), which is the seed of the formal argument.

Approach · inclusive by design

Make structure visible
Connect visual, verbal, and symbolic representations.
Reduce avoidable friction
Use predictable sequencing, persistent labels, keyboard-operable controls, and alternatives to drag-only input.
Make feedback actionable
Respond to the likely error without treating every mistake as a conceptual failure.

Across secondary mathematics and a broad ability range: proof and Further Pure (my examiner specialty), enrichment for high-achievers, and a new alternative senior course I designed for non-traditional pathways. Alongside my own materials, I used IXL with my classes for 5+ years, so I know adaptive practice from the teacher’s seat. The approach draws on universal design and accessibility (Accessibility & Inclusive Design, University of Illinois).

Course I designed · Online learning

Getting Started with Web3: Setting Up a Wallet designed & built

A self-paced module for adult beginners with no technical background (~60 min): scaffolded concept pages, written reflections, formative knowledge checks, and a final assessment. Designed end to end as part of my instructional-design portfolio work (IDOL Academy).

THE LEARNING PATH — concept → reflect → check, repeated

Build the groundWhat is a blockchain?
Introduce the toolWhat is a Web3 wallet?
Connect it upHow wallets reach networks & dApps
Make it safeWallet security: seed phrases & keys
Situate itDecentralized finance in context
Prove it stuckReflections + final assessment

The module never opens with the tool. It builds the idea first, then introduces the wallet as an access point into that system — every concept page followed by a short reflection or check so understanding is tested while it's fresh.

SAMPLE CONCEPT PAGE

What is a blockchain?

A blockchain is a distributed digital ledger that records transactions across a network of computers — rather than storing records in one central place, the system shares them among many participants.

A model the learner can hold onto:

user initiates an action → it becomes a transaction → the network validates it → it's added to the ledger

FORMATIVE KNOWLEDGE CHECK — try it

Which action best protects a wallet's seed phrase?

✓ Correct. A seed phrase belongs offline and on paper, away from anything connected — never typed into cloud docs, notes apps, or shared with anyone.
Not quite — anything digital or shared can be reached by someone else. The seed phrase is the master key: offline, private, on paper. Try again.

Reflection (text entry, ~5 min): In 3–5 sentences, explain how a blockchain differs from a traditional centralized system — covering what a distributed ledger is, how validation works, and why it matters for Web3 tools.

Walk the full course →
One module also authored in Genially (tool-fluency sample) ↗
In development: a self-paced course on autogenic training (guided relaxation), launching fall 2026.
How this site is built: designed with accessibility in mind — keyboard-operable controls, semantic headings, a visible focus indicator, a text description for every visual, live-updating explanations for screen readers, and respect for reduced-motion preferences. Formal assistive-technology testing remains part of publication QA. Technical note: every page is a single self-contained HTML file with no framework, build step, or third-party libraries — each interactive is hand-written vanilla JavaScript and SVG. That keeps them fast, dependency-free, easy to drop into an LMS or CMS, and functional offline.
© 2026 Christopher Welch · All rights reserved. Everything in this portfolio — the case studies, item specifications, interactives, course materials, text, and code — is Christopher’s original work, published so prospective employers and collaborators can evaluate it. No license is granted by this site or its source repository being public. Hiring conversations are always welcome; reproduction or adaptation without written permission is not.