Hidden Message Challenge - 分置式暗号文解読チャレンジツール
Day036 - 生成AIで作るセキュリティツール100
Hidden Message Challenge は、分置式暗号の仕組みを楽しく学べるチャレンジ型Webツールです。
一見すると普通の文章に見えても、実は巧妙に隠された「本当のメッセージ」が潜んでいることがあります。このツールでは、そんな隠されたメッセージを見破るスキルを段階的に身につけることができます。
4つの異なる暗号方式による計20問のチャレンジを通じて、「行頭読み」「除去文字」「位置抽出」「ステンシル」といった古典的な情報隠蔽技術を体験できます。 各問題には段階的なヒント機能が用意されており、初心者から中級者まで楽しみながら学習を進められます。
進捗は自動的に保存され、最終的にはレーダーチャートによる成果分析とランク判定で、あなたの「隠されたメッセージを見抜く力」を評価します。 現代のサイバーセキュリティにも通じる「気づき」の感覚を、歴史ある暗号技術を通じて養いましょう！
👉 https://ipusiron.github.io/hidden-message-challenge/
行頭読みチャレンジ中
- 4つの分置式暗号方式による実践チャレンジ問題（各5問、計20問）
- インタラクティブなUI：問題選択、ヒント表示、リアルタイム進捗管理
- 視覚的フィードバック：正解・不正解・未回答の状態を色分け表示
- ステンシル暗号の実体験：実際の型紙操作（移動・回転）による解読
- 総合成果表示：レーダーチャート、スコア集計、ランク判定機能
- 学習支援機能：段階的ヒント、問題間の自由な移動、詳細ヘルプ
分置は 「分けて置くこと」 を意味し、分置式暗号（concealment cipher） とは、伝えたい言葉の間に別の置いて分けることで、元の言葉がわからないように暗号化方式です。
結果的に平文をカムフラージュ用の文章中に分散して配置することになります。 そのため、工夫することで、分置式暗号文は通常の暗号文のように見えず、一見すると意味のある自然な文章や、意味不明だが不自然ではない偽文になります。 つまり、「見えなくする」ことを目的とする ステガノグラフィー（情報隠蔽技術） の一種とも見なせます。
- 数学的処理や複雑な鍵を必要としない
- 多くの方式が 簡単なルールに基づく
- 平文に冗字（無意味な文字）を挿入する仕組みである、挿入法（insertion）が採用されている。そのため、Null暗号（null cipher）とも呼ばれる。
- ただし復号時に冗字を取り除くルールが必要。
- 書籍、日記、絵、文字列など、さまざまな媒体に応用可能
| 種類 | 概要 | 備考 |
|---|---|---|
| 位置抽出型 | 特定の位置を拾って読む | 歴史的な実例多数。 |
| 除去文字型 | 指定された文字を除くことで平文が現れる | ヒントのキーワードやイラストを暗号文の脇に描いておく |
| ステンシル型（グリル型） | 穴の空いた型紙を重ねて、見える部分を読む | 回転グリル暗号や砂時計暗号に応用 |
- 行頭を順に読む。
- アクロスティックとも呼ばれ、古今東西で使われている。「先頭で使われている文字」をつなげていくと、別の単語が浮き出てくる。
- 句読点の3文字後を読む。
- 文頭を順に読み、さらに文末を順（あるいは逆順）に読む
- 沓冠は、和歌や俳句の折句のひとつで、ある語句を各句の初めと終わりに一音ずつ詠み込むもの。
- 「狸（たぬき）」⇒「た」を抜く。
- 「とりい」⇒「い」を取る。
- 「けしごむ」⇒「ご」と「む」を消す。
- 「けむし」⇒「け」を無視。
- 「ちりとり」⇒「ち」と「り」を取る。
- 「虫眼鏡」⇒「め」「が」「ね」を無視。
- 「テントウムシ」⇒「て」「ん」「と」「う」を無視。
- 一人で読んでね⇒「ひとり」⇒「ひ」を取る。
- ステンシル（格子窓）を重ねて、その窓のところに通信文を書き、白紙の余白を偽文で埋める方法。
- 砂時計型の切り抜きを利用。クリントンの砂時計暗号として知られる。
- ピューリタン革命やスパイ戦などで、文章中に情報を隠す手法が使われていた。
- トレヴァニアンの小説や、一部の戦時通信文でもこの技法が登場した。
- 回転グリル暗号は、視覚的な型紙を用いる点で分置式的要素を持つが、構造上は転置式暗号に近い。
- 現代では、SNSの文章や画像キャプションなどに隠すソーシャルステガノグラフィー的応用もある。
分置式暗号文は見つけた敵は、それが暗号文であるという事実に即気づいてしまいます（解読できるかどうかは別として）。
一見して暗号文であることをわからなくすれば、安全性が高まります。 その1つのアプローチとして、何気ない文章の中に暗号文を埋め込むという方法があります。 この方法を分置式暗号に適用するには、適当な文字を冗字とするのではなく、全体的に通常の文章や手紙と変わらないよう工夫して文字を選びます。 この方法は、行頭読み型（位置抽出法型の行頭バージョン）やステンシル型で採用できます。
しかし平文が長くなると、全体的に自然な文章にすることは難しくなっていきます。 また、暗号化に手間がかかるという問題もあります。
分置式暗号は、現代の暗号学ではセキュリティ強度が低いとされますが、その代わりに気づかれずに伝えること（秘匿性）に特化した教育的・心理的効果があります。
現代の「混ぜ物とふるい分け」のような手法は、分置式暗号の進化系ともいえるでしょう。
- 各方式ごとのルールとヒントを読みながら解読に挑戦
- 「読み取れるか？」「気づけるか？」という気づき型スキルの訓練
- 「意味がなさそうな文の中に意味がある」逆説的な構造の理解
- ステガノグラフィーの原点とも言える体験
このツールは、以下のような方を対象としています。
- 暗号の仕組みや歴史に興味のある 初心者〜中級者
- ステガノグラフィー（情報隠蔽技術） を学びたい人
- 遊びながら学べる 言葉系パズル や チャレンジ型問題 が好きな方
- 学校・セミナー・イベント等での 教育コンテンツ活用 を検討している教育者
技術的な知識は不要で、直感的な操作で体験可能です。
設定: 高校の情報科「情報セキュリティ」単元（50分授業）
実施例:
- 導入10分: 分置式暗号の歴史的背景を説明（スパイ通信、戦時中の暗号）
- 体験30分: 4つのチャレンジをグループ単位で挑戦（2-3人1組）
- 振り返り10分: 各グループの成果をレーダーチャートで比較・発表
教育効果: 「隠された情報の発見」体験を通じて、現代のフィッシング詐欺やソーシャルエンジニアリングに対する気づき力を養成
設定: IT企業の新入社員研修（午後の部・2時間）
実施例:
- アイスブレイク: チーム対抗戦形式で「行頭読み」から開始
- スキルアップ: 段階的に難易度を上げ、チーム内での相談・協力を促進
- 成果共有: 各チームのランク結果をSlackで共有、優秀チームを表彰
研修効果:
- セキュリティにおける**「見落とし」の危険性**を体験的に理解
- チーム内コミュニケーションの促進
- 「小さな違和感に気づく重要性」をゲーム感覚で学習
設定: 暗号・パズル好きの社会人の隙間時間学習
実施例:
- 通勤時間: スマートフォンで1日1-2問ずつ進行（1問5-10分）
- 週末まとめ: 進捗をレーダーチャートで確認、苦手分野を重点的に復習
- SNS共有: TwitterでランクSを達成した画像を投稿、暗号愛好家コミュニティと交流
学習効果:
- 継続的なスキルアップ: 自分のペースで着実に「気づき力」を向上
- 知的好奇心の満足: 古典暗号の奥深さを段階的に体験
- コミュニティ参加: 共通の趣味を持つ人との繋がり形成
hidden-message-challenge/
├── index.html # メインHTMLファイル（5タブUI）
├── css/
│ └── style.css # 共通スタイル定義（レスポンシブ対応）
├── js/
│ ├── main.js # タブ切り替え・全体制御・ヘルプシステム
│ ├── challenges/
│ │ ├── headline.js # 行頭読みチャレンジ処理
│ │ ├── removeChar.js # 除去文字型チャレンジ処理
│ │ ├── position.js # 位置抽出チャレンジ処理
│ │ └── stencil.js # ステンシル型チャレンジ処理
│ ├── common/
│ │ ├── utils.js # 共通ユーティリティ関数
│ │ ├── storage.js # LocalStorage管理
│ │ └── dataLoader.js # チャレンジデータ読み込み
│ ├── data/
│ │ └── challenges.json # チャレンジ問題データ（全20問）
│ └── results/
│ ├── score.js # スコア計算・管理
│ ├── chart.js # レーダーチャート描画
│ └── share.js # 共有機能（Twitter・画像保存）
├── assets/
│ └── screenshot.png # スクリーンショット画像
├── README.md # このファイル
├── CLAUDE.md # Claude Code向けプロジェクト情報
├── TECHNICAL_NOTES.md # 開発者向け技術詳細ドキュメント
├── LICENSE # ライセンス情報（MIT）
├── .gitignore # Gitで管理しないファイル指定
└── .nojekyll # GitHub Pages用設定ファイル
| 方式 | 難易度 | 問題数 | 特徴 |
|---|---|---|---|
| 📝 行頭読み | ★ | 5問 | 各行の最初の文字を読む基本形式 |
| 🧹 除去文字 | ★★ | 5問 | だじゃれヒントから除去文字を推理 |
| 🎯 位置抽出 | ★★ | 5問 | 特定ルールに従った位置の文字を抽出 |
| 🎭 ステンシル | ★★★ | 5問 | 型紙操作による視覚的解読体験 |
- 問題選択: 進捗ドットクリックで任意の問題にジャンプ
- 段階的ヒント: 困った時の多段階ヒントシステム
- 状態管理: 正解・不正解・現在位置の視覚的表示
- 進捗保存: LocalStorageによる自動進捗保存
- 成果分析: レーダーチャート・ランク判定・共有機能
- フロントエンド: Pure HTML5 + CSS3 + ES6 Modules
- 状態管理: LocalStorage（進捗・スコア・設定）
- データ形式: JSON（問題データ・設定）
- レスポンシブ: モバイル・タブレット・デスクトップ対応
- モジュール設計: 各チャレンジが独立したクラス構造
- タブ型インターフェイス: 5つのタブ（4つのチャレンジ + 成果）
- 視覚的フィードバック: プログレスドット（緑=正解、赤=不正解、青=現在位置）
- インタラクティブ要素: ステンシル移動・回転、リアルタイムプレビュー
- ヘルプシステム: 包括的な使い方ガイドとモーダル表示
- 共有機能: X投稿・画像保存・URL共有
- 問題データ:
data/challenges.jsonに全20問を格納 - 進捗追跡: 問題別の正解・不正解・現在位置を記録
- スコア計算: チャレンジ別正答率とレーダーチャート表示
- ランク判定: 総合スコアによるS〜Dランク評価
総合正答率に基づいて以下の基準でランクが決定されます：
| ランク | 正答率 | 称号 |
|---|---|---|
| S | 95%以上 | 暗号解読マスター |
| A | 80%以上 | 暗号解読上級者 |
| B | 60%以上 | 暗号解読見習い |
| C | 40%以上 | 暗号初心者 |
| D | 40%未満 | これから頑張ろう！ |
計算方法: 総合正答率 = (全チャレンジの正解問題数 ÷ 全チャレンジの総問題数) × 100
- TECHNICAL_NOTES.md - 複雑な処理、技巧的な実装、コアアルゴリズムの技術詳細
- Grille CipherLab…回転グリル暗号の可視化ツール
MIT License - 詳細は LICENSE をご覧ください。
本ツールは、「生成AIで作るセキュリティツール100」プロジェクトの一環として開発されました。 このプロジェクトでは、AIの支援を活用しながら、セキュリティに関連するさまざまなツールを100日間にわたり制作・公開していく取り組みを行っています。
プロジェクトの詳細や他のツールについては、以下のページをご覧ください。