Convolution Visualizer
Copy this iframe to your website:
1 | |
Description
This MicroSim shows how the convolution integral
\[y(t) = x(t) * h(t) = \int_{-\infty}^{\infty} x(\tau)\,h(t-\tau)\,d\tau\]
builds one output value for each time \(t\). The two small plots at the top show the input \(x(t)\) in blue and the impulse response \(h(t)\) in red. The middle plot uses the integration variable \(\tau\). It shows \(x(\tau)\), the flipped and shifted copy \(h(t-\tau)\), and their product, shaded green where it is positive and salmon where it is negative. The signed area of the shaded region is \(y(t)\), plotted as the purple dot in the bottom plot. The bottom axis lines up with the middle axis, so the dashed marker sits at the same horizontal position in both. The output is drawn only up to the present time, so you can predict the next part of the curve before you reveal it.
- Signals selects one of eight pairs of signals.
- Time t sets the shift \(t\) from \(-2\) s to \(7\) s in steps of 0.05 s.
- Play / Pause sweeps \(t\) automatically and Play speed sets the rate from 0.25× to 3×. The MicroSim starts paused.
- < Step and Step > move \(t\) by 0.25 s. Reset returns \(t\) to \(-2\) s.
The line under the plots gives the current \(t\) and the exact value of the area. This simulation is used in Chapter 4: Convolution and Correlation.
The Four Steps
- Flip. Plot \(h\) against \(\tau\) and reverse it to get \(h(-\tau)\).
- Slide. Shift the flipped curve by \(t\) to get \(h(t - \tau)\). The dashed line marks \(\tau = t\), the place where the origin of \(h\) now sits.
- Multiply. Form the product \(x(\tau)\,h(t - \tau)\), shown as the shaded region.
- Integrate. The signed area of the shaded region is \(y(t)\).
Signal Pairs
| Signal pair | What to look for |
|---|---|
| Rectangle * Rectangle | Equal widths give a triangle with its peak, 2, at full overlap (\(t = 2\) s) |
| Wide rectangle * Narrow rectangle | A trapezoid, flat at 1 from \(t = 1\) s to \(t = 3\) s while the narrow pulse is completely inside the wide one |
| Rectangle * Exponential (RC filter) | The output charges toward 1 and peaks at \(1 - e^{-2} = 0.865\) when the pulse ends at \(t = 2\) s, then decays |
| Exponential * Exponential | \(e^{-t}u(t) * e^{-2t}u(t) = (e^{-t} - e^{-2t})u(t)\), peak 0.25 at \(t = \ln 2 \approx 0.69\) s |
| Triangle * Rectangle | A 1 s average of a triangle: rounded corners, peak 0.75 at \(t = 1.5\) s, duration 3 s |
| Triangle * Triangle | A smooth bump, wider than either input: peak \(2/3\) at \(t = 2\) s, duration 4 s |
| Sine burst * Rectangle (averager) | A 0.5 s average (height 2, so unit area) passes a 1 Hz sine with gain \(2/\pi \approx 0.64\) and a 0.25 s delay |
| Rectangle * Edge detector | \(h(t)\) has zero area, so the output is zero wherever the input is constant |
All signals are zero for \(t < 0\). The integral is evaluated numerically with the midpoint rule and a step of 0.005 s. For the three pairs made of rectangles (Rectangle * Rectangle, Wide * Narrow, Rectangle * Edge detector) the result is exact at every position of the Time slider, to floating-point rounding.
Lesson Plan
Learning Objectives
By the end of this activity, students will be able to:
- Explain each step of the convolution integral: flip, slide, multiply and integrate.
- Identify the range of \(t\) over which two finite-duration signals overlap, and so where the output is non-zero.
- Predict the shape of the output for simple pairs of signals before stepping through them.
- Calculate \(y(t)\) at one time from the overlap region and its area.
- Describe how the shape of an impulse response determines what a system does to its input.
Target Audience
Undergraduate students in a first signals and systems or signal processing course. Allow 20-25 minutes.
Prerequisites
- Time shifting and time reversal of signals
- The impulse response of an LTI system
- Integration as signed area
Activities
- Exploration (5 min). Choose Rectangle * Exponential (RC filter). Press Reset, then press Step > repeatedly. The output stays at 0 until \(t = 0\), the first time the red curve touches the blue pulse. Compare the red curve with the small \(h(t)\) plot: it is mirrored left to right, with the sharp edge on the right at \(\tau = t\) and the tail on the left. Set Time t to 1.00, 2.00 and 3.00 s. The read-outs are 0.632, 0.865 and 0.318.
-
Guided Practice (10 min). Before moving the slider, sketch the output on paper, then check it.
- Rectangle * Rectangle: at \(t = 1\), \(2\) and \(3\) s the area is 1, 2 and 1. The output is non-zero for \(0 < t < 4\) s, which is the sum of the two pulse widths.
- Wide rectangle * Narrow rectangle: the flat top of the trapezoid starts at \(t = 1\) s and ends at \(t = 3\) s. The read-out is 1.000 at \(t = 1.5\) s.
- Exponential * Exponential: set \(t = 0.70\) s and read 0.250. Compare it with \(e^{-0.7} - e^{-1.4}\).
- Gain and delay (5 min). Choose Sine burst * Rectangle (averager) and set Time t to 0.50, 1.00, 1.50 and 2.00 s. The read-outs alternate between +0.637 and −0.637. The input has amplitude 1, so the output amplitude is \(2/\pi = 0.64\). Its peaks fall at 0.5 s and 1.5 s, a quarter period after the input peaks at 0.25 s and 1.25 s. Step through one full period and watch the green and salmon regions partly cancel.
- Zero-area impulse response (5 min). Choose Rectangle * Edge detector. The read-outs at \(t = 0.50, 1.00, 1.50, 2.00, 2.50\) s are +0.500, 0.000, 0.000, 0.000 and −0.500. Explain why the output is zero from \(t = 1\) s to \(t = 2\) s and where the positive and negative bumps come from.
Assessment
- Two rectangular pulses of duration 2 s and 3 s, both starting at \(t = 0\), are convolved. Over what range of \(t\) is the output non-zero? The output is non-zero for \(0 < t < 5\) s. Its duration is \(2 + 3 = 5\) s.
- For a rectangle \(x(t)\) of height 1 from 0 to 2 s and \(h(t) = e^{-t}u(t)\), find \(y(1)\) without the MicroSim. At \(t = 1\) the overlap is \(0 \le \tau \le 1\), so \(y(1) = \int_0^1 e^{-(1-\tau)}\,d\tau = 1 - e^{-1} = 0.632\).
- Why is the output of Rectangle * Edge detector exactly zero for \(1 \le t \le 2\) s? Over those times all of \(h(t-\tau)\), which spans \(\tau\) from \(t-1\) to \(t\), lies inside the flat part of \(x\). \(h\) has equal positive and negative areas, so the product has zero net area.
- What would a 1 s long averager do to a 1 Hz sine? It averages over exactly one full period, so the output is zero once the window lies completely inside the sine burst. Only the start-up and shut-down transients remain.
- Does flipping \(x\) instead of \(h\) change the answer? Which property of convolution does this show? No. Convolution is commutative, \(x * h = h * x\), so either signal can be the one that is flipped.
Common Misconceptions
- "Convolution multiplies the two signals point by point." The shaded product is a whole function of \(\tau\) for one value of \(t\), and only its area is one point of the output. Move Time t and watch the product change shape.
- "The output has the same duration as the input." In Rectangle * Rectangle two 2 s pulses give a 4 s output, and in Rectangle * Exponential the output keeps decaying long after the pulse has ended.
- "The impulse response slides without being reversed." In the exponential pair, \(h(t)\) decays to the right but the red curve \(h(t-\tau)\) decays to the left, because it is a function of \(-\tau\).
References
- Convolution - Wikipedia - definition of the convolution integral, its properties and its graphical interpretation
- Impulse response - Wikipedia - why \(h(t)\) characterizes a linear time-invariant system
- Linear time-invariant system - Wikipedia - why the output of an LTI system is the convolution of the input with \(h(t)\)
- The Scientist and Engineer's Guide to Digital Signal Processing - Steven W. Smith - free online textbook with a chapter on convolution
- Oppenheim, A. V., Willsky, A. S., & Nawab, S. H. (1997). Signals and Systems (2nd ed.). Prentice Hall. Chapter 2 covers the convolution sum and the convolution integral.