I Built 4 Interactive Engineering Tools You Can Run in Your Browser

Dhananjay kumar Seth — Tue, 14 Jul 2026 20:06:01 +0000

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. 🔧

DEV Community: Dhananjay kumar Seth

I Built 4 Interactive Engineering Tools You Can Run in Your Browser