- Published on
CoinFlip Stats: An Interactive Probability Lab
- Authors
- Name
- Shuqi Wang
The Story
I needed a hands-on demo for a university open day — something that could explain probability concepts to visitors in under 30 seconds, without any math jargon. The classic "flip a coin many times and watch it converge to 50/50" seemed perfect, but I wanted it to feel satisfying. Real 3D coin flips, live charts updating, the whole thing.
So I spent a weekend building CoinFlip Stats.
What It Does
The idea is dead simple: flip 10 coins per round, count how many land heads, and plot the distribution over many rounds. As you accumulate data, the histogram converges toward the theoretical binomial distribution — a visual proof of the Law of Large Numbers.
Features
- Single Simulation (10 Coins) — Each round flips 10 coins with a 3D physics-style animation (powered by GSAP). You see each coin spin and land.
- Batch Simulation (100× / 1000×) — For the impatient. Run hundreds or thousands of rounds instantly — the last round still animates so you get the visual feedback.
- Real-time Distribution Chart — A dynamic bar chart (ECharts) updates after every round, with the theoretical normal distribution curve overlaid for comparison.
- Experiment History — The last 10 rounds are displayed in a live table so you can track recent results.
- One-click Reset — Clear everything. Coins return to a neutral "?" state, ready for the next visitor.
Tech Stack
Nothing fancy — just a clean, focused frontend app:
| Tool | Role |
|---|---|
| Vue 3 | Frontend framework (Composition API) |
| Vite | Build tool |
| Tailwind CSS | Styling |
| ECharts | Statistical charts |
| GSAP | 3D flip animations |
The entire project is frontend-only — no backend, no database. Everything runs in the browser. Deployed on Vercel with zero configuration.
Quick Start
Try it online:
Or run locally:
git clone https://github.com/howtousellm/coin-flip.git
cd coin-flip
npm install
npm run dev
Closing Thoughts
This was a weekend project — nothing groundbreaking. But it was satisfying to watch people at the open day spam the "Flip" button and realize on their own that "oh, it really does converge to 5 out of 10." Sometimes the simplest demos are the most effective.
Repo is here if you want to take a look. MIT licensed.