About this site
このサイトについて
「情報リテラシー学習ラボ」は、中学校技術・家庭科（技術分野）の授業で使えるインタラクティブな学習教材です。 インストール不要でブラウザから動作し、生徒が主体的に操作しながら情報活用能力を育てることができます。
動作環境
ブラウザのみ
Chrome・Safari・Edge対応
インストール不要
インストール不要
対応デバイス
PC・タブレット・スマホ
レスポンシブ対応
1人1台端末に最適
1人1台端末に最適
クラス機能
リアルタイム共有
4桁PINで即参加
全員の回答を一画面に表示
全員の回答を一画面に表示
テーマ数
全16テーマ
情報モラルからプログラミングまで
体系的にカバー
体系的にカバー
📘 対象となる学習指導要領の領域
| 教科・領域 | 主な対応内容 |
|---|---|
| 技術・家庭科（技術分野） D 情報の技術 |
(1) 生活や社会を支える情報の技術 (2) ネットワークを利用した双方向性のあるコンテンツのプログラミング (3) 計測・制御のプログラミング |
| 総合的な学習の時間 | 情報活用能力の育成・情報モラル教育・メディアリテラシー |
| 道徳 | 節度・節制 / 公正・公平 / 法やきまりの尊重（著作権・プライバシー） |
How to use
使い方（基本操作）
「ひとりで」モードと「クラスで」モードの2種類があります。目的に合わせて使い分けてください。
👤 ひとりでモード
1
テーマを選ぶ
トップページのカード一覧から学びたいテーマを選ぶ
2
「👤 ひとりで」をタップ
個人学習モードでスタート。ページをめくりながら進む
3
インタラクションを操作
タップ・スライダー・クイズなどに答えながら進む
4
まとめページで振り返る
最終ページでポイントを整理して学習完了
👥 クラスでモード（リアルタイム共有）
1
先生が「クラスで」を押す
「👩🏫 先生として始める」を選択 → 4桁PINが発行される
2
PINを生徒に伝える
黒板に書く、または口頭で4桁の数字を共有
3
生徒が「クラスで」を押す
「🎒 生徒として参加する」→ PINを入力して参加
4
全員の回答をリアルタイムで表示
先生画面に全員の結果がリアルタイムで集計される
💡 クラス機能はFirebase Hostingへのデプロイが必要です。ローカルファイル（file://）では動作しません。
Lesson Guide
各テーマ活用ガイド
各テーマの学習内容・学習指導要領との対応・授業の進め方を掲載しています。
LESSON 01
生成AI・プロンプトデザイン
生成AIとのつきあい方
生成AIの仕組みと可能性・限界を体験的に学ぶ。プロンプトの「役割・対象・範囲・形式」4要素を組み合わせることで回答の質がどう変わるかをリアルタイムで比較し、AIを道具として使いこなす力を育てる。
📘 学習指導要領との対応
| 区分 | 内容 |
|---|---|
| 教科・領域 | 技術・家庭科（技術分野）D(1)ア・イ / 総合・情報活用能力 |
| 内容項目 | AIの活用・プロンプトエンジニアリング・情報の信頼性評価 |
| 関連道徳 | 真理の探究・節度・節制（依存しない主体的な判断） |
🌱 育成できる資質・能力
📖 知識・技能：生成AIの仕組みと限界
💡 思考・判断：プロンプト設計と回答品質の関係
💡 思考・判断：AI出力の批判的評価
🔥 学びに向かう力：AIを道具として主体的に活用する態度
📋 推奨授業フロー（50分）
-
1導入 ５分「AIに何でも聞けるとしたら、どんな質問をする？」と問いかけ、AIへの期待と疑問を引き出す
-
2展開① １５分「ざっくり」「絞る」「上級」の3段階プロンプトを比較。同じテーマでも回答の質・量が大きく変わることを体感文化祭企画・環境問題・レシピの3テーマで役割・対象・範囲・形式の組み合わせを試す
-
3展開② １５分「AIは嘘をつく？」セクションでハルシネーション（幻覚）の具体例を確認し、情報の検証方法を学ぶ
-
4展開③ ５分クイズで学習内容を定着させる
-
5まとめ １０分「AIをどう使うか」ではなく「AIと自分の役割分担」を考える視点でまとめる
LESSON 02
情報モラル・SNS
デジタルタトゥー
ネットに投稿した情報は「どこまで広がり、いつまで残るのか」を拡散シミュレーターで体感する。「消せない」という事実を数値とアニメーションで可視化し、投稿前に立ち止まる習慣を育てる。
📘 学習指導要領との対応
| 区分 | 内容 |
|---|---|
| 教科・領域 | 技術・家庭科（技術分野）D(1)ア / 総合・情報モラル |
| 内容項目 | 情報の信頼性・安全性、個人情報の保護 |
| 関連道徳 | 節度・節制、法やきまりの尊重 |
🌱 育成できる資質・能力
📖 知識・技能：拡散のしくみを理解
💡 思考・判断：投稿前のリスク評価
💡 思考・判断：情報発信の責任と影響
🔥 学びに向かう力：自分事として考える
📋 推奨授業フロー（50分）
-
1導入 ５分「ネットの投稿って消せると思う？」と問いかけ、生徒の意識を確認する
-
2展開① １５分個人でサイトを操作。拡散シミュレーターで投稿が広がる様子を体験「② 出した後」のページで拡散数アニメーションを見せる
-
3展開② １０分（クラス機能使用）「クラスで」機能を使い、先生が投稿例を提示→全員が「リポストする／しない」を投票→クラス全体の拡散数をリアルタイム表示クラス全員がリポストしたと仮定した場合の拡散数が画面に積み上がり、「自分1人の行動の影響」を可視化する
-
4展開③ １０分「③ 消せる？」ページで削除の限界を確認。スクリーンショット・キャッシュの概念を説明
-
5まとめ １０分「自分がいまSNSに投稿するとしたら？」ワークシートに記入して振り返り
LESSON 03
プライバシー・個人情報
写真の落とし穴
「何気ない写真」に潜む個人情報の危険性を発見体験で学ぶ。制服・校舎・駅・時刻表など「普通の写真」から個人が特定できることを、インタラクティブな探索で体感する。
📘 学習指導要領との対応
| 区分 | 内容 |
|---|---|
| 教科・領域 | 技術・家庭科 D(1)ア / 総合・情報モラル |
| 内容項目 | 個人情報の保護、プライバシーの意義 |
| 関連道徳 | 相互理解・寛容、公正・公平 |
🌱 育成できる資質・能力
📖 知識・技能：個人情報の種類と範囲
💡 思考・判断：写真投稿前のリスク評価
🔥 学びに向かう力：他者の視点に立つ
📋 推奨授業フロー（50分）
- 1導入 ５分「この写真から何がわかる？」と写真1枚を見せて考えさせる
- 2展開① １５分サイトの「探偵モード」で写真上の危険ポイントをタップして発見制服・校章・時刻・駅名・背景の建物など8カ所のリスクを自分で発見する
- 3展開② １０分「投稿するとどうなる？」ストーリーで個人特定の流れを体験
- 4まとめ ２０分「投稿前チェックリスト」を活用し、自分のSNS行動を振り返る
LESSON 04
コミュニケーション・情報モラル
テキストの誤解
同じ文字でも受け取り方は人それぞれ。クラス全員でリアルタイムに「どう読んだか」を送信し、解釈のバラつきをその場で可視化する。文字コミュニケーションの限界を体感的に理解する。
📘 学習指導要領との対応
| 区分 | 内容 |
|---|---|
| 教科・領域 | 技術・家庭科 D(1)ア / 国語・伝え合う力 |
| 内容項目 | 情報の表現と伝達、メディアの特性 |
| 関連道徳 | 礼儀・思いやり・相互理解 |
🌱 育成できる資質・能力
📖 知識・技能：テキスト特有の誤解リスク
💡 思考・判断：発信の意図と受信の乖離
🔥 学びに向かう力：多様な解釈の受容
📋 推奨授業フロー（50分）
- 1導入 ５分「LINEでのすれ違いを経験したことはある？」と問いかける
- 2展開① ２０分（クラス機能）先生がPINを発行→全員でメッセージの受け取り方を投票→全体結果を画面共有「そうだね」「まあいいけど」「なんかやだ」など5段階の感情投票が集計される
- 2展開② １５分結果のバラつきをもとに「なぜ違って伝わったか」をグループで考える
- 3まとめ １０分テキストで伝える工夫（絵文字・句読点・言い換え）をまとめる
LESSON 05
メディアリテラシー・情報の見極め
フェイクを見破れ！
SNS・LINE・YouTube・メールなど実際の場面に近いリアルなフェイク投稿を見分けるクラス対戦型ゲーム。「本物そっくり」の情報を提示し、判断の根拠を考えながら情報リテラシーを高める。
📘 学習指導要領との対応
| 区分 | 内容 |
|---|---|
| 教科・領域 | 技術・家庭科 D(1)ア / 総合・探究的な学習 |
| 内容項目 | 情報の信頼性の評価・情報収集と吟味 |
| 関連道徳 | 真理の探究・公正・公平 |
🌱 育成できる資質・能力
📖 知識・技能：フェイクの見分け方・チェックポイント
💡 思考・判断：根拠をもとにした真偽判断
💡 思考・判断：情報を鵜呑みにしない批判的思考
🔥 学びに向かう力：情報を発信・拡散する前に立ち止まる
📋 推奨授業フロー（50分）
- 1導入 ５分「フェイクニュースを見たことある？どうやって見分ける？」
- 2展開① ２５分（クラス対戦）先生がPINを発行→全5問のフェイク投稿に全員が「本物/偽物」を投票→答え合わせをリアルタイムで実施Amazon偽メール・気象情報・健康デマ・LINE詐欺など現実的なシナリオ5種類を出題
- 3展開② １０分各問題の「見分けるポイント」をチェックポイントとして全体で確認
- 4まとめ １０分「情報を見るときの3つの問い（誰が・何のために・根拠は？）」を整理
LESSON 06
著作権・知的財産
著作権を知ろう
著作権の基本的な概念から、学校でよく起こりがちな具体的なケーススタディまでをインタラクティブに学ぶ。クラス機能でケース判断を全員で投票し、意見を比べながら理解を深める。
📘 学習指導要領との対応
| 区分 | 内容 |
|---|---|
| 教科・領域 | 技術・家庭科 D(1)ア / 総合・情報モラル |
| 内容項目 | 知的財産権の保護と活用、著作権法 |
| 関連道徳 | 法やきまりの尊重・勤労・創造 |
🌱 育成できる資質・能力
📖 知識・技能：著作権の基本概念と範囲
💡 思考・判断：グレーゾーンのケース判断
🔥 学びに向かう力：創作物を大切にする態度
📋 推奨授業フロー（50分）
- 1導入 ５分「YouTube動画を学校の発表で使ってもいい？」と問いかける
- 2展開① １５分「ひとりで」モードで著作権の基礎を学ぶ（著作物の定義・保護期間・例外規定）
- 3展開② ２０分（クラス機能）ケーススタディを全員で投票→正解と解説を提示→グレーゾーンを議論
- 4まとめ １０分「使っていい？チェックフロー」を整理し、実際の創作活動に活かす
LESSON 07
情報セキュリティ・フィッシング対策
情報セキュリティ
フィッシングメール・SMS詐欺・偽サイトなどの実例を用いて「本物か偽物か」を見分ける訓練をする。パスワード強度チェッカー・シーザー暗号など複数のインタラクティブ体験を通じてセキュリティ意識を高める。
📘 学習指導要領との対応
| 区分 | 内容 |
|---|---|
| 教科・領域 | 技術・家庭科 D(1)ア・イ / 総合・情報モラル |
| 内容項目 | 情報セキュリティの基礎、暗号化の考え方 |
| 関連道徳 | 節度・節制、法やきまりの尊重 |
🌱 育成できる資質・能力
📖 知識・技能：フィッシング・暗号化の基礎知識
💡 思考・判断：不審な通信の見分け方
🔥 学びに向かう力：セキュリティ意識の向上
📋 推奨授業フロー（50分）
- 1導入 ５分「パスワードを盗む方法って何種類あると思う？」と問いかける
- 2展開① ２０分（クラス機能）フィッシング判定ゲーム：5つの実例メール・SMSを全員が本物/偽物で投票→解説Amazon偽メール・国税庁SMS・楽天偽サイト・Apple正規メールなどリアルなシナリオ
- 3展開② １５分パスワード強度チェッカーで「強いパスワード」の条件を体験的に理解する文字種・長さを変えるごとに「何年で破られるか」がリアルタイム表示
- 4まとめ １０分シーザー暗号体験で「暗号化」の概念を理解し、通信セキュリティの入口を学ぶ
LESSON 08 〜 16 概要一覧
⚖️
LESSON 08 ｜ D(1)ア
アナログとデジタル
連続する波（アナログ）と0と1（デジタル）のちがいを音・光のシミュレーションで体験。標本化・量子化・符号化の流れを視覚的に理解する。
🌱 育成する力：デジタル化の仕組みの理解、アナログ/デジタルの特徴比較
🔢
LESSON 09 ｜ D(1)ア
ビットと2進数
0と1だけで数を表す2進法を、LEDランプの点灯パターンで直感的に理解。ビット・バイトの概念とデータ量の計算まで体験的に学ぶ。
🌱 育成する力：2進数の概念、データ量の単位と換算
🖼️
LESSON 10 ｜ D(1)ア
解像度と画質
画素数・解像度・ファイルサイズの関係をスライダー操作でリアルタイムに確認。「なぜ画質が落ちる？」を数値で理解する。
🌱 育成する力：画像データの構造理解、ビット深度と容量の関係
🔊
LESSON 11 ｜ D(1)ア
音のデジタル化
音の波形をサンプリングしてデジタルに変換する過程を、波形グラフのアニメーションで体験。サンプリング周波数と音質の関係を理解する。
🌱 育成する力：音データの仕組み、サンプリング定理の概念
🌐
LESSON 12 ｜ D(1)ア・イ
ネットワークの基礎
LAN・ルーター・WAN・サーバ・データベースの全体図をインタラクティブな図で確認。「データを送る」「返事を受け取る」アニメーションで通信の流れを体験する。
🌱 育成する力：ネットワーク構成の理解、IPアドレス・パケットの概念
👥
クラス機能あり：人間ネットワークゲーム
生徒が「ルーター役」「サーバ役」などを演じるロールプレイ型クラスゲームで、パケット転送の仕組みを全員参加で体験する。
🫧
LESSON 13 ｜ D(1)ア / 総合
フィルターバブル
SNSアルゴリズムが「見せたいものだけ見せる」フィルターバブル現象を、クラス全員の情報選択結果を比較することで体験的に理解する。
🌱 育成する力：アルゴリズムの社会的影響、多面的な情報収集の大切さ
👥
クラス機能あり：クラス全員の選択を一覧比較
各自がニュース選択をした結果をリアルタイムでクラス全体に表示。「自分と友達の見ている情報が全然違う」ことをデータで実感させる。
📐
LESSON 14 ｜ D(1)イ・プログラミング
アルゴリズム
順次・分岐・反復の3つの制御構造を、バブルソート・二分探索などの可視化アニメーションで体感。フローチャートの読み書きも練習できる。
🌱 育成する力：プログラム的思考、アルゴリズムの効率性比較
💬
LESSON 15 ｜ D(2)：双方向性のあるコンテンツ
双方向性のあるコンテンツ
「書きこんだ言葉がなぜみんなに見える？」をクライアント・サーバ・データベースの流れで理解。実際に疑似掲示板に投稿して仕組みを体感する。
🌱 育成する力：入力→処理→出力の流れ、サーバ・DBの役割理解
⚙️
LESSON 16 ｜ D(3)：計測・制御
計測・制御
「暗くなると点く街灯」を題材に、センサ→判断→アクチュエータ→くり返しの流れをフローチャートで組み立て、スライダーで実際に動かして確認する。1日の明るさ変化も早送り再生で体験できる。
🌱 育成する力：計測・制御の仕組み、しきい値・センサ・アクチュエータの概念