🏫 先生向け プログラミング授業ガイド

ひなテックGamesとは

ひなテックGamesは、すべてHTML・CSS・JavaScriptで作られた無料のブラウザゲーム集です。 インストール不要・アカウント登録不要で、学校のChromebookやタブレットからすぐに遊べます。

ただのゲーム集ではありません。50本以上はScratchでも作り直してあり、ブロックを開いて中を読めます。 さらに全ゲームのソースコードを解説つきで公開し、そのコードをブラウザ上で書きかえて即座に動かせるようにしています。 「遊ぶ」から「作る」までを、同じ教材で地続きにたどれるのが特徴です。

校種・用途べつのページ

🪜 遊ぶ → 読む → 変える → 作る の6段階

同じ1本のゲームを、学年や習熟度に応じて6つの段階で使い分けられます。 「2048で遊んだ子が、2048のブロックを読み、2048のコードを書きかえる」—— 教材を替えずに深めていけるので、同じ教室で進度が違っても同じ題材で話ができます。

②③のブロックと④⑤のコードは、ScratchとJavaScriptの対応表でつなげられます。 「ずっと」は requestAnimationFrame、「もし〜なら」は if、自作ブロックは関数—— Scratchで身につけた考え方がそのまま使えることを実感できると、コードへの抵抗が一気に下がります。

①の手前でキーボード入力そのものが壁になる学級には、 タイピング練習コースの先生向けガイド（ホームポジションから1キーずつ・時間無制限・ 文科省の目標値との比べ方・授業での使い方）を用意しています。

📖 学習指導要領との対応

本サイトの教材がどこに当てはまり、どこには当てはまらないかを整理しました。 指導計画を立てるときの目安にしてください。

小学校

小学校では、プログラミングは教科として新設されたのではなく、各教科等の中で実施されます。 ねらいは「プログラミング的思考」の育成で、 小学校プログラミング教育の手引（第三版）では次のように定義されています。

自分が意図する一連の活動を実現するために、どのような動きの組合せが必要であり、一つ一つの動きに対応した記号を、どのように組み合わせたらいいのか、記号の組合せをどのように改善していけば、より意図した活動に近づくのか、といったことを論理的に考えていく力

同手引は実施の場面をA〜F分類に整理しています。本サイトの教材が向いているのは主にB分類・C分類です。

中学校 技術・家庭科（技術分野）

現行の学習指導要領（平成29年告示）では、内容「D 情報の技術」が4つの項目で構成され、 プログラミングを扱うのは(2)と(3)です。 本サイトが当てはまるのは(1)・(4)と、(2)に入る前の「コードを読み書きする力」の準備で、(3) 計測・制御には対応しません。 項目ごとの位置づけ、2〜4時間の単元案、中学生向けの教材の選び方（コードが読みやすい順）、つまずきと手立て、評価の観点は専用ページにまとめました。

→ 中学校 技術・家庭「D 情報の技術」での使い方

高等学校 情報Ⅰ

(3) コンピュータとプログラミングの段階④⑤に当たります。アルゴリズム、分岐と反復、配列、関数といった要素が、実際に動くゲームの中でどう使われているかを読めます。 たとえば2048は、盤面を回転させることで4方向の移動を1つの処理にまとめています。 2048・迷路・ブロック崩し・リズムゲームの実際のコードを題材にした読解問題5問（解答つき）を専用ページに用意しました。

→ 情報Ⅰ プログラミング問題（実際のゲームのコードで解く）

※ 学習指導要領の項目名は文部科学省の公開資料に基づいています。各段階への当てはめは本サイト運営者による整理であり、文部科学省が示したものではありません。実際の指導計画に合わせて取捨選択してご利用ください。

✅ 授業で使いやすい理由

• ✅ インストール不要 — URLをGoogle Classroomに貼るだけ
• ✅ アカウント不要 — 会員登録・メールアドレス等の入力は一切ありません
• ✅ ソースコード公開 — 全ゲームのHTML・CSS・JavaScriptを作り方の解説つきでサイト上に公開しています
• ✅ Scratch版が50本以上 — 中を見て作りかえられます。.sb3ファイルのダウンロードも自由です
• ✅ 本家Scratchでも公開 — 同じものを scratch.mit.edu（アカウント hinatech）でも公開しています。本サイトが開けない環境でも授業に使えます

動作環境

• ブラウザだけで動きます — Chrome・Edge・Safari。学校のChromebookでそのまま使えます
• 1人1台端末を想定 — タブレットでも遊べますが、④⑤のコードを書きかえる段階はキーボードのある端末が向いています
• プラグイン・拡張機能は不要です。Flashのような追加ソフトも使っていません
• Scratch版は初回に読み込みがやや大きいため、一斉に開くときは時間に余裕を見てください

校内フィルタで本サイトが開けないとき

学校のフィルタリング設定によっては本サイトが開けないことがあります。その場合でも、 段階①②③（遊ぶ・ブロックで見る・作りかえる）は本家Scratchだけで完結できます。 scratch.mit.edu は多くの自治体で許可されているため、hinatech の作品一覧を Google Classroom に貼れば同じ授業ができます（遊ぶ版と学習用で94作品）。 段階④以降のコードを読む・書きかえる工程は本サイトが必要なので、 許可リストへの hinata-ya.tech の追加をご検討ください。

🚫 広告なしで使えるページ

ゲームのページには広告が表示されますが、子どもに配る学習用のページと先生向けのページには広告を表示していません。 学校・自治体のリンク集や学習ポータルに載せるときは、こちらのURLをお使いください（リンクのご連絡は不要です）。

※ 上のページから「やってみよう」「腕だめし」で開くゲームのページには広告が表示されます。 2026年12月4日に終了する Yahoo!きっず のタイピング・学習へのリンクを張り替えるときの候補にもお使いください （本サイトは LINEヤフー株式会社とは関係ありません）。

🔒 安全性について

本サイトで児童・生徒が入力してサーバーに送られるのは、スコアランキングに登録する12文字までのニックネームだけです。 文章や画像を投稿できる機能はなく、児童・生徒どうしが直接やりとりする手段はありません。

実装していない機能

• ❌ チャット・コメント欄・掲示板
• ❌ ダイレクトメッセージ、フォローなどのSNS機能
• ❌ 画像・動画・ファイルのアップロード
• ❌ 会員登録、プロフィール、メールアドレスの入力

教室ランキングについて

先生が教室ランキングで教室コードを作ると、そのURLから遊んだ子どもの記録だけでクラスの順位表が出せます。 ここでも入力できるのはニックネームだけで、全国ランキングと同じく不適切な言葉や学校名は登録のときに止めます。 教室コードで登録した記録は全国ランキングには載りません。 期限が来ると子どもの画面からは見えなくなり、次の朝にはニックネームを「#1」のような番号に置きかえて消します（残るのはスコアだけです）。 不適切な名前は、先生の管理画面から1人ずつ隠せます。

学習ページのふりかえりについて

都道府県の学習ページの「ふりかえり」に子どもが書いた文は、サーバーに送信しません。 「提出用にコピー」は子どもの端末のクリップボードに写すだけで、提出は Google Classroom など先生が決めた場所で行います。名前を書く欄はありません。 端末に残るのは、たしかめ（5問）の点数とタイピングのタイムだけです。

コードを実行できるページについて

AI時代のゲームの作り方と各ゲームのソースページには、 コードをその場で実行できるプレイグラウンドがあります。次の設計で安全性を確保しています。

• 隔離された環境（sandbox）で実行します — 実行されたコードは本サイトの他のページやCookie、保存データに一切アクセスできません
• 入力したコードはサーバーへ送信されません — すべて児童・生徒の端末のブラウザ内だけで動きます。サーバーに保存されることも、他の人に共有されることもありません。「HTMLで保存」ボタンは、使っている端末にファイルを1つダウンロードするだけです
• 他の人が書いたコードが流れ込む仕組みはありません — 表示されるのは、本人が貼り付けたコードか、当サイトが用意したサンプル・公開ソースだけです
• 作品の受け渡しは学級のルールに任せています — 作ったゲームを友だちに見せる方法として、ファイルやコードをGoogle Classroom・Teamsなどで先生が決めた方法で渡すよう案内しています。インターネット上に公開する手順は載せていません

ニックネームの安全対策

• 入力は任意 — 遊ぶだけなら不要です。ランキングに載せたいときだけ入力します
• 12文字までの短いテキストで、HTMLタグは自動的に除去されます
• NGワードフィルタをサーバー側で常時適用 — 性的表現・差別語・侮辱表現など110語を、登録の時点でブロックします
• フィルタ回避の手口にも対応 — 記号で文字を区切る、見えない文字を挟み込む、字形の似た別の文字に置き換える（例：漢数字の「二」でカタカナの「ニ」を偽装する）といった手口を、文字を正規化したうえで検出します
• 公開後の点検・削除も実施 — 公開中のランキングを定期的に走査し、フィルタをすり抜けた不適切な名前は見つけしだい削除しています
• ランキングに表示されるのはニックネーム・スコア・登録日時のみです

取得している情報

• 氏名・メールアドレス・学校名など、個人を特定する情報は一切取得していません
• スコアの不正登録を調査する目的で、登録時のアクセス元IPアドレスをサーバー内部にのみ記録しています（ランキング上には表示されません）
• アクセス解析にGoogleアナリティクスを利用しています。詳細はプライバシーポリシーをご覧ください

導入の判断にあたって追加の情報が必要な場合は、 運営元のひなテックまでお気軽にお問い合わせください。

📚 教科・学年別おすすめゲーム

各ゲームのページには、遊び方のすぐ下に「🏫 授業で使うなら」（教科・学年のめやす、所要時間、身につく力、配るURL）を載せています。 モードを指定して配るURLは下の一覧にまとめました。

🗾 社会

📖 国語

🔢 算数・数学

💻 プログラミング的思考

🔬 理科（物理の感覚）

⏰ 45分授業の進行例

1コマ45分で完結する授業案を5本、それぞれ専用ページにまとめました。 ねらい・準備・進行表・発問例・つまずきの手立て・ふり返りと評価の観点・配るURLまで入っています。 どれも先生が答えを知っている必要がない組み立てです。

📋 Google Classroomでの配布方法

1. Classroomで「授業」→「課題を作成」を選択
2. 「リンクを追加」で使いたいゲームのURLを貼り付け
   例: https://hinata-ya.tech/games/games/2048/
3. 指示欄に「目標スコアを目指してプレイしよう」などの課題を記入
4. 「配布」をクリック

💡 課題文ごと貼るなら：授業パックの各ページと、ゲームのページの「🏫 授業で使うなら」には「📋 課題文をコピー」ボタンがあります。子ども向けの課題文とURLがまとめてコピーされるので、そのまま指示欄に貼れます。

💡 ヒント：ゲーム一覧ページ（https://hinata-ya.tech/games/）を配布すれば、生徒が自由にゲームを選べます。

学習ページ（授業1回分）を配るURL

めあて → 知る → ゲームでやってみる → 5問でたしかめる → ふりかえりを提出用にコピー まで、子どもが1人で進められるページです。1回10〜15分・広告なし。 ふりかえりの文が Classroom などの提出物として返ってきます。課題文は各ページの「🏫 先生へ」でコピーできます。

段階に合わせて配るURL

2048 の部分を他のゲーム名に置きかえれば、そのまま使えます。 Scratchの学習用ファイル（.sb3）は課題に添付して配ることもできます。 各Scratch版ページの「学習用ファイル(.sb3)をダウンロード」から取得してください。ダウンロードも改造も自由です。

モードを指定して配るURL

URLの最後の #〜 でモードが選ばれた状態で開きます。ロイロノート・Teams・L-Gate のリンクカードでも同じURLが使えます。 全員に同じモードで始めさせたいとき、モード選びで時間を使わせたくないときに。

※ 百人一首オンライン対戦かるたは対人戦にPCのキーボードが要ります。教室では2人1組で合言葉（4桁の数字）を決めて対戦させると、知らない相手とつながりません。

❓ よくある質問

費用はかかりますか？

かかりません。すべて無料で、会員登録もアカウント作成も不要です。ゲームのページには広告が表示されますが、教材として使う分に制限はありません。子どもに配る学習ページ・タイピング練習コース・先生向けのページは広告なしです。

授業で使うのに申請や許可は必要ですか？

不要です。URLをそのまま配って構いません。校内研修や公開授業での利用、資料への画面の掲載も自由です。出典として hinata-ya.tech/games と書いていただければ十分です。

プログラミングを教えた経験がなくても使えますか？

使えます。段階②③（Scratchで中を見る・作りかえる）は、先生が答えを知っている必要がありません。 「この数字を変えたらどうなると思う？」と問いかけ、児童生徒に試させて結果を確かめる進め方でそのまま授業になります。 上の45分授業の進行例はこの形で書いてあります。

1人1台端末（GIGA）で使えますか？

使えます。Chromebook・iPad・Windowsのいずれもブラウザだけで動きます。 ただしタブレットではキーボードを使うゲームが遊べません。段階④⑤のコードを書きかえる活動もキーボードが要ります。

Scratchのアカウントは必要ですか？

本サイトのScratch版で遊ぶ・中を見るだけなら不要です。 改造したものを保存・共有したい場合のみ、本家 scratch.mit.edu のアカウントが要ります（無料）。 アカウントなしで進めたい場合は、.sb3ファイルをダウンロードして端末に保存する方法もあります。

何時間の単元に組めますか？

1時間の単発でも、複数時間の単元でも組めます。1時間なら段階②③（ブロックを1つ変えて動きを確かめる）だけで完結します。 3〜4時間あれば②③→④→⑤とつなげられます。段階を飛ばしても構いません。学年や既習に合わせて選んでください。

児童生徒同士がやりとりできる機能はありますか？

ありません。入力してサーバーに送られるのはスコアランキングのニックネーム（12文字まで）だけで、チャット・コメント・画像投稿・DMのいずれも実装していません。 詳しくは安全性についてをご覧ください。

個人情報は取得されますか？

氏名・メールアドレス・住所などは一切取得しません。アクセス解析（Google Analytics）と広告配信のためのCookieは使用します。 ランキングに登録する場合のみ、入力されたニックネームとスコアが保存されます。

どのゲームから始めればよいですか？

迷ったら2048をおすすめします。ルールが1分で説明でき、Scratch版の中身も読みやすく、 「盤面を回転させて4方向の処理を1つにまとめる」という工夫がコードを読む段階まで一本でつながります。 低学年なら迷路や違う色さがしのような、ルールの説明が要らないものが向いています。

家庭学習でも使えますか？

使えます。URLを配れば自宅のパソコンやタブレットからも同じように遊べます。 インストールが要らないので、家庭の端末を選びません。

📝 評価（見取り）の観点

ゲームは点数が出ますが、スコアの高さは学習の評価にはなりません。 上手い子ほど高い点が出るだけで、何を考えたかは表れないためです。 段階ごとに「何が言えたら分かっている」と見るか、目安を挙げます。 指導要録の3観点（知識・技能／思考・判断・表現／主体的に学習に取り組む態度）に寄せた整理です。

ふり返りは1〜2行で足ります。「変えたところ／予想／実際どうなったか」の3点を書かせると、 試行錯誤の跡が残り、点数に頼らず見取れます。うまくいかなかった記録も同じ価値があることを、 先に伝えておくと書きやすくなります。

🛠 困ったときは

🔗 教材へのリンク