Day 3 - 生成AIで作るセキュリティツール100
インタラクティブなシーザー暗号（厳密にはシフト暗号）の暗号化・復号ツールです。 視覚的な暗号円盤インターフェイスで暗号化の仕組みを直感的に理解できます。
円盤の回転により、平文と暗号文の対応関係が一目でわかる教育的なツールとなっています。
👉 https://ipusiron.github.io/caesar-cipher-wheel/
以下はGitHub Pagesのデモページの表示になります。
シーザー暗号円盤ツールのスクリーンショット
- リアルタイム暗号化/復号: テキストを入力すると即座に結果が表示されます
- 視覚的な円盤インターフェイス:
- 外側の円盤：固定されたアルファベット（グレー）。平文文字。
- 内側の円盤：回転可能なアルファベット（ベージュ）。暗号文文字。
- シフト値の調整: 0〜25の範囲でシフト値を設定可能
- スライダーによる直感的な操作
- 数値入力による正確な設定
- 暗号化/復号モード切替: ラジオボタンで簡単に切り替え
- 文字の正立維持: 内側の円盤が回転しても、各文字は常に読みやすい向きを保持
- レスポンシブデザイン: モバイルデバイスでも快適に使用可能
- テキスト入力: 上部のテキストエリアに暗号化/復号したいメッセージを入力する。
- シフト値設定: スライダーまたは数値入力でシフト値（0-25）を設定する。
- モード選択:
- 「Encrypt」: 暗号化モード。テキスト入力欄に「平文」を入力する。
- 「Decrypt」: 復号モード。テキスト入力欄に「暗号文」を入力する。
- 結果確認: 下部の結果表示エリアに変換後のテキストが表示される。
古代ローマの歴史家スエトニウスは、ユリウス・カエサルが、本国の政治情勢を問い合わせるために遠隔地のガリアから友人に暗号の手紙を出したことを伝えています。
カエサルの『ガリア戦記』の一節には、以下の文（ラテン語）があります。
【平文】Gallia est omns divisa in partes tres. 「ガリア全体は三つの部分に分かれている」
この文を平文として、シーザー暗号で暗号化すると以下の暗号文が得られます。
【暗号文】JDOOLD HVW RPQV GLYLVD LQ SDUWHV WUHV.
※ラテン語の文字体系は、アルファベットと同じ文字であり、数も同じ26文字です。
- HTML5
- CSS3（アニメーション、グラデーション、レスポンシブデザイン）
- Vanilla JavaScript（フレームワーク不使用）
- Chrome（推奨）
- Firefox
- Safari
- Edge
- モバイルブラウザー
function caesarCipher(text, shift, decrypt = false) {
return text.toUpperCase().replace(/[A-Z]/g, c => {
const index = alphabet.indexOf(c);
if (index === -1) return c;
const offset = decrypt ? (index - shift + 26) % 26 : (index + shift) % 26;
return alphabet[offset];
});
}内側の円盤が回転する際、各文字要素に逆回転を適用することで、文字が常に正しい向きを保ちます。
innerRing.style.transform = `rotate(${angle}deg)`;
innerLetters.forEach(letter => {
letter.style.transform = `rotate(${-angle}deg)`;
});- モダンなUI: グラデーション背景とカード型のコントロールパネル
- 視覚的階層: 色分けされた円盤で内側と外側を明確に区別
- スムーズなアニメーション: cubic-bezier関数による自然な動き
- アクセシビリティ: 高コントラストで読みやすいフォント
CSSの以下の部分を編集して配色を変更できます。
.outer-ring-bg: 外側円盤の背景色.inner-ring-bg: 内側円盤の背景色body: 背景のグラデーション
.disk-containerのwidth/heightを変更して円盤のサイズを調整できます。
- 『暗号技術のすべて』 P.34-40
- 『シーザー暗号の解読法』
- 『Pythonでいかにして暗号を破るか 古典暗号解読プログラムを自作する本』 第5章 P.87-105
- 『安全な暗号をどう実装するか 暗号技術の新設計思想』 P.5
このプロジェクトはMITライセンスの下で公開されています。
本ツールは、「生成AIで作るセキュリティツール100」プロジェクトの一環として開発されました。 このプロジェクトでは、AIの支援を活用しながら、セキュリティに関連するさまざまなツールを100日間にわたり制作・公開していく取り組みを行っています。
プロジェクトの詳細や他のツールについては、以下のページをご覧ください。