Skip to content
Hadi Scharbrodt

← All projects

2024 · Live

Watch sorting algorithms think out loud.

Role

Solo build

Year

2024

Status

Live

Stack

TypeScriptCanvas APIHTML/CSS

(01) Problem

Sorting algorithms are taught as pseudocode and Big-O tables. Students memorize the complexity but never feel why merge-sort is O(n log n). Nothing about the recursion is visible.

(02) Build

Hand-rolled a Canvas2D engine that animates each comparison, swap, and merge step with eased motion. Splits the array recursively in real time so the divide-and-conquer tree becomes visible. Configurable array size, animation speed, and color states (compared / merging / settled).

(03) Result

Used live in tutoring sessions. Students consistently report 'it clicked' the moment they see the recursion play out — exactly the goal.

(04) Live demo

Live merge-sort. Pause / shuffle / change speed.