初めてでもやさしい Monaca Education 女子校での実践 カリタス女子中学高等学校 情報科教諭 山本侑

本日の内容 1.自己紹介 2.本校での実践 3.まとめ

自己紹介

自己紹介 山本 侑（やまもと ゆう） • 新卒から教員3年目 • 2019年4月～ カリタス女子中学高等学校 技術科・情報科教諭 – 初の技術科・情報科の専任教員なので大変だったことも色々… • 出身学部は教育学部（技術教育） • 所有免許 中学校技術科・数学科（2種）、高校情報科・工業科

カリタス女子中学高等学校とは • 川崎市多摩区にあるカトリックの女子校 • 1960年創立 • 併設型中高一貫校（高校からの入学はなし） • 学年170人前後、5クラスを基本としている

本校の情報科の特徴 • 中学校技術科と高校情報科で一体でカリキュラムを構成 • ものづくりや手を動かす経験を通して、技術を学ぶことを大切にしている – 「社会と情報」と「情報の科学」の間くらいの内容を目指している

本校での実践

本校のカリキュラムについて ➢ 履修カリキュラム • 「社会と情報」を高校１年と３年で分割履修 • どちらも週１時間ずつの授業 • 中学校技術科（中２のみ）ではマイクロビットによるプログラミングを実施 ➢ 今年度はMonacaを使った授業を高１および高３で実施 • 高１は「情報Ⅰ」を意識したカリキュラム • 高３は従来の「社会と情報」＋αのカリキュラム

生徒の環境 • 情報科の授業は原則、PC教室で実施 • 高1以上の生徒は一人一台iPad(第8世代32GB Wi-Fiモデル)を所有 • 普段からICTツール（Googleやロイロノートなど）を授業で使用 • オンライン授業はやりこんでいるのでかなり慣れている • PCの扱いには不慣れ • キーホルダー入力は苦手な生徒は多い。iPadをフリック入力する生 徒も少なくない！？

プログラミングを授業に導入 • 情報技術についてものづくりや手を動かす経験を通して学ばせたい • 女子校であることもあり、情報に興味のある生徒より苦手意識を持つ生 徒がおおい • 簡単なプログラミングをやってみる • プログラミングを難しく思わせない！ • 色々なものを試してMonaca Educationにいきついた

授業の進め方 1. １時間につき1章分進める。 ① 簡単にトピックの説明 ② とりあえずテキストの内容をトレイスしながら構文を習得 ③ 簡単にそこで解説 2. まとめの課題 一通りの範囲を習得した後、まとめの課題を出した。 ① HTML・CSSの範囲 ② JavaScript 授業でインプット、課題でアウトプット

授業の計画（高１の場合） 回 章・トピック 内容 １ 1章 ログイン ２ 2章 HTML HTMLの基本 ３ 3章 CSS CSSの基本 ４ 4章 Javascript Javascriptの書き方・変数 ５ 5章 条件分岐 Ifやelseなど条件分岐 ６ 10章 いろいろな演算子 演算子の種類と使い分け ７ 6章 関数 関数をつかってみる ８ 12章 繰り返し 効率よく同じ動作をしてみる 全８回の授業を実施。MonacaEducationの冊子の章立てをベースに毎回1 章ずつ進行するスケジュールで実施した。

オンラインでの授業実施 • 授業期間中、コロナウイルス感染症の影響で、 オンラインでの授業を行うことがあった。 • ブレイクアウトセッションを使って、生徒だけ で自由に入れる部屋、教員へ自由に質問する部 屋を作り、授業時間中は、生徒たちが割と自由 に授業を受けられる環境を作った。

まとめの課題 単元がある程度終わったタイミングで、生徒たちにまとめの課題を課した。 基本的に授業 • HTMLとCSS ひな形を教員が作って、配布。生徒はそれをもとに自作のものをつくる • Java script おみくじ、ブロック崩しアプリの改良 あんこエデュケーションからひな形をインポートし、自分好みに改良

まとめの課題 エクスポート機能を使って、教員が作ったものを配布 生徒は必要な個所だけ打ち換える。 課題でも１からコーディングをするわけではなく、改良することにとどめる。 プラスαで作り込んだ生徒には加点する。

Monaca educationのよさ① あんこエデュケーション • MonacaEducation向けの教材 サイト • かなり様々な教材見本がある。 • Monacaにインポートすること も可能 • https://anko.education/

Monaca educationのよさ② Slack • アシアルさんがslackを開設し てくれている。気軽な情報交換 やちょっとした質問ができる。 • 情報が専門じゃない（⁉）情報 科の先生の助けになる。 • 学校に少数の情報科教員にとっ て、横のつながりは大切。

MonacaEducationを使ってみて... • 開発環境ベースのため、生徒は最初戸惑う ⇒現実社会のリアルなプログラミングを体験できる。 ⇒授業の枠を超えてプログラミングをできる可能性 • 難しいイメージをいかに植えつけないようにするかの工夫 ⇒やっぱり、最初は見た目が難しい。生徒は拒否反応？ やさしく、根気強く生徒に教える。 • 実は、自分も苦戦、、、 ⇒Javascriptをちゃんとやったのは初めてだったがテキストを見ながらどうにか知識 をつけて乗り切った。 ⇒生徒も同じ状況だから、説明をより丁寧にするようになった。 ⇒最初は生徒のミスに気づけない。ただ何回もやっていると間違えの法則（？）が見 えてくる

MonacaEducationを使ってみて... 課題の質問が多いのでオリジナル サイトを作ってみたりしました。 説明は画面キャプチャで収録し、 YouTubeに流して、生徒が課題を やりながら、必要な箇所を見れる ようにしました。

情報Ⅰをみすえて • 今年度実施した授業をベースに他の先生方の実践や教科書の内容、各種 研修を織り込みながら授業を組み立てる予定 • 次年度の高校３年生「社会と情報」を通して、情報Ⅰにより近い授業を 実施予定

まとめ MonacaEducationを使ってみて

Monacaをつかってみて • プログラミングを学ぶ意味 – 手を動かして、コンピュータを動かし、情報技術を理解する – 情報技術をより主体的に使えるようにする • プログラミングを体験する機会の提供 どの生徒もプログラミングをしたことがあるという状態にするには、授業での実施はとても有用。 その授業でいかにプログラミングへの抵抗感（⇔親近感）を植え付けないようにできるか • 教員が指導できる教材を用いる 教員が教科のすべての知識を持つことは簡単ではないので、いかに生徒に学ばせることができる 環境を整えるか。また、生徒がいかに自発的に授業の枠を超えた学びをすることができるか

ありがとうございました。