元はFlashで作られていましたが、iPhone・iPadでも見ることができるように、HTML5で実装しています。
サーバーからは格子状に切って混ぜた(スクランブルした)データが送られてきます。ユーザーは事前にAES鍵を持っておき、それを使って解錠します。
以下のサンプルではパスワードを1字入力するごとに画像が変化し、最終的に正しいパスワードが入力されると画像がつながります。バインディングにはKnockoutJSを使っています。 *
なお、ChromeとFirefoxでは、以下のようにHTML5 Canvasの実装にだいぶ差があります:
このため、処理の速さも違います。遅い方(Firefox)に合わせるためには、あまり細かく画像をスクランブルしないことが必要です。