Most engineering concepts live in textbooks and MATLAB scripts — you read about a Fourier transform, a PID loop, or a constellation diagram, but you rarely get to touch one. I'm a game developer by day and an Electronics & Communication Engineer by training, and I kept thinking: why can't these be things you just open in a browser and play with?
So I built four of them. No installs, no accounts — click a link and start turning knobs. Each one is written from scratch in React + TypeScript with the actual math implemented by hand (no DSP or simulation libraries). Here's what I made and the interesting problem behind each.
🌊 DSP Signal Lab — real-time FFT in the browser
▶ Live demo: https://dsp-signal-lab.vercel.app/ · Code: https://github.com/Dhananjay-ku-seth/dsp-signal-lab
A signal generator (sine / square / sawtooth / triangle) feeding a live 2048-point FFT spectrum analyzer, with injectable white noise and switchable digital filters (lowpass / highpass / bandpass / notch).
The fun part: the FFT is real, not a fake animation. It uses the Web Audio API's AnalyserNode, so when you pick a square wave you can watch the odd harmonics appear in the spectrum, then sweep a lowpass cutoff down and see them get attenuated in real time. Switch to microphone mode and whistle — the peak tracker finds your pitch.
🤖 PID Control Playground — tune a line-follower robot live
▶ Live demo: https://pid-control-playground.vercel.app/ · Code: https://github.com/Dhananjay-ku-seth/pid-control-playground
A top-down robot follows a winding track using a real PID loop on its cross-track error. You drag the Kp / Ki / Kd sliders and watch the effect immediately.
Under the hood it's a double-integrator plant with sub-stepped Euler integration and integral anti-windup — so it behaves like a real control system. Set the derivative gain to zero and the robot oscillates around the line forever; add it back and the wobble damps out. There's a ⚡ disturbance button to kick it off course and watch the loop recover, plus a live error-vs-time strip chart.
🔌 Logic Circuit Simulator — drag, wire, and watch signals flow
▶ Live demo: https://logic-circuit-sim.vercel.app/ · Code: https://github.com/Dhananjay-ku-seth/logic-circuit-sim
Place gates (AND / OR / NOT / NAND / NOR / XOR / XNOR), wire them port-to-port, toggle the inputs, and see the signals propagate live — with an auto-generated truth table.
The tricky bit was supporting sequential circuits, not just combinational ones. A naive left-to-right evaluator deadlocks on a feedback loop like an SR latch. I used an iterative relaxation solver (40 passes) that evaluates combinational logic instantly and converges feedback loops, so latches and flip-flops actually settle. Load the SR-latch example and toggle Set / Reset to see it work.
📡 Comms Simulator — modulation, constellations, and BER
▶ Live demo: https://comms-simulator-pi.vercel.app/ · Code: https://github.com/Dhananjay-ku-seth/comms-simulator
Three tabs covering a communication systems course:
Analog: AM/FM modulation in the time domain, with the AM envelope and over-modulation shown live.
Constellation: BPSK / QPSK / 16-QAM ideal points plus the received cloud over an AWGN channel, with a live symbol-error rate.
BER curve: a Monte-Carlo bit-error-rate simulation (60,000 bits per SNR point) plotted against the theoretical Q-function on a semilog axis.
Everything uses unit-energy symbols, Gray-coded PAM-4 mapping, Box–Muller AWGN, and Q(x) = ½·erfc(x/√2). The satisfying moment is watching the simulated BER curve hug the theoretical one — and seeing it floor out at ~10⁻⁵ because 60k bits can't resolve errors any rarer than that.
How they're built
Stack: React + TypeScript + Vite, deployed on Vercel.
No black boxes: every FFT, filter, control loop, logic solver, and modulation/demodulation routine is hand-written. The goal was to understand the math, not import it.
Rendering: plain and SVG — no charting libraries.
Design: a shared dark "lab" aesthetic so they feel like one toolkit.
Why bother?
Because interactive beats static every time. You can read that a PID controller overshoots without derivative gain — or you can drag a slider and watch it happen. I wanted tools a student (or a curious recruiter) could open and immediately get an intuition from.
If you find these useful or spot something to improve, I'd love to hear it — the repos are open.
More of my work: https://dhananjay-kumar-seth.vercel.app/ GitHub: https://github.com/Dhananjay-ku-seth · LinkedIn: https://www.linkedin.com/in/dhananjay-kumar-seth-4a5b31283/
Thanks for reading — go break one of the demos. 🔧
Top comments (2)
I was particularly impressed by the PID Control Playground, where you've implemented a double-integrator plant with sub-stepped Euler integration and integral anti-windup, allowing for a realistic simulation of a control system. The ability to drag the Kp / Ki / Kd sliders and see the effect immediately is a great way to illustrate the concepts of PID control. I've worked with similar systems in the past, and I can appreciate the challenge of implementing a robust and stable control loop. Have you considered adding more advanced features, such as feedforward control or disturbance estimation, to further enhance the realism of the simulation?
Browser-native engineering tools are underrated because they reduce the activation energy for learning. No install, no environment drift, no “works on my machine” prelude. The challenge is making them honest about limits so users know when the toy model stops matching the real system.