事例266
Monaca EducationでPythonを実践して
千葉県立船橋啓明高校 谷川佳隆先生

Monaca Education(※1)は、アシアル情報教育研究所が提供する、有料で利用できるブラウザ上のサービスになります。3つまでのプロジェクトは無料で利用できます。
JavaScriptやPythonなどを学ぶことができ、冊子が付いてくるので副教材として導入できます。「情報I」に対応した教員研修プログラムも多く用意されています。Slackでやりとりもでき、多くの教科書をサポートしています。

Monaca Educationを活用した理由です。
Pythonが今年から利用できるようになったこと、EdTech導入補助金に応募ができ、無料で利用できる機会をいただいたことがあります。また、千葉県ではGoogle Workspaceが先生にも生徒にも割り当てられていないため、インストールしなくてもブラウザ上でできるという点が利用しやすかったためです。

Monaca Education の使い方
こちらがMonaca Educationのサイトです。右上の青いボタンからログインします。ログインにはIDとパスワードが必要になりますが、今回はアシアルから生徒分のIDとパスワードをいただき、利用できました。

ログインをすると出るのがこの画面です。今まで作成したプロジェクトが左側に表示され、左上ボタンで新しいプロジェクトを作ることができます。
既存のものを選び、右にあるクラウドIDEからコードを見ることができます。
※クリックすると拡大します
「新しいプロジェクトを作る」というアイコンを押すとこの画面が出ます。今回は、6つの中からPython(Brython)を選び、プロジェクト名「newproject」を入力します。
※クリックすると拡大します
すると、このような画面になります。先ほど作ったプロジェクトを選び、クラウドIDEで開きます。
index.htmlからPython.pyを選んでコードを入力していきます。
※クリックすると拡大します
コードを入れて保存すると実行できます。実行した画面は右側に表示されます。
※クリックすると拡大します
全6回のPythonの授業~説明を最小限にして、プリントを見ながら各自進める
今回、私はこのような6回の授業を実施しました。画面右側が「Pythonで学ぶプログラミング入門」という冊子です。

各回の工夫についてお話します。
1回の授業を1つのプロジェクトとして、授業ごとにプリントを用意しました。テキストは授業中に使用しませんし、配布もしていません(冬休み前にテキストは配付しました)。
説明を最小限にして、プリントを見ながら各自進める形式にしたので、ひたすら机間巡視をして、困っている生徒や質問に対応しました。プロジェクトの提出は、振り返りと一緒にFormsにコードを貼る形で行いました。

0回目として、メールアドレス(ID)とパスワードを配布し、ログインの仕方とプロジェクトの作成の仕方を紹介しました。

こちらは0回目に配ったプリントです。
※クリックすると拡大します
1回目は、順次実行と変数を扱いました。文字の表示や、変数を利用した文字の表示、数値と計算をした結果の表示や、Inputを利用した表示という内容を実施しました。

こちらがコードを入力した画面です。実際には24行目から入力をしていきます。保存して右側に実行した結果が出ています。
※クリックすると拡大します
2回目は、条件分岐による選択です。
真のときの表示、真偽ともに表示を行い、次にelifを使った条件分岐、randomを使ったデジタルさいころを作っていきました。

こちらがコードを入力した例です。
※クリックすると拡大します
3回目は配列を学びました。
リストから曜日を表示する、リストの要素を置き換える。また空のリストを用意して要素を加える、リストの要素を追加・削除するといった内容です。

こちらがコードを入力した例です。
対象の曜日についてはそのまま写してもらいましたが、リストに追加したり削除したりする時の内容は、生徒に言葉を入れてもらって、自由度を設けました。
※クリックすると拡大します
4回目は繰り返しです。
forを活用したリスト内の要素の表示、forを活用した連続数の表示。Whileを活用した、条件を満たすまでの繰り返し。確率1%のガチャを100回作成しました。

こちらがコードを入力した例です。
今回、生徒に確率1%100回ガチャをさせるにあたり、「必ず当たるかどうか」を質問し、生徒の意見を聞いてから実際に作成しました。
右のほうに矢印を2つ組み合わせて円の形になったアイコンがありますが、こちらを押すと何回も実行することができ、何回当たって何回当たらないかなど、生徒同士で楽しむ者もいました。
※クリックすると拡大します
5回目は、関数の定義と利用です。
日付の表示、時刻の表示、関数の定義と呼び出し、関数の引数と戻り値を扱いました。

こちらがコードを入力した例です。定義を利用する場面では、表示する内容等について、生徒に自由に変えてよいと指示しました。
※クリックすると拡大します
6回目は繰り返しと選択の組み合わせです。
奇数偶数の判断、倍数・公倍数を判断して数または言葉をいうFizzBuzz、1重ループによる7の段の表示、2重ループによる九九の表示といった内容を行いました。

こちらがコードを入力した例です。すべての結果を1画面では表示できませんが、実行結果が正しいかどうかを、生徒にも判断しやすい内容にしました。
※クリックすると拡大します
本校のコンピュータ教室には中央モニターがないので、生徒は手元のプリントを見ながらどんどんコードを打っていき、その間私は巡回します。
生徒が間違えるポイントは…
Monacaは、入力を間違えるとエラーメッセージが表示されますが、11月18日以降、日本語での細かい表示がされるようになりました。
何行目が違っているかなどを教えてくれるようになったため、6回のうち、既に3回とか5回が終わっているような場面ではありましたが、後半は楽になっていきました。
日本語エラーメッセージが入る前と、入った後の表示を比較してみます。
※クリックすると拡大します
生徒が間違えるポイント1 です。
日本語エラーメッセージが入る前(before)はスペルミスをしても、右のように色でアシストしてくれるのみで、エラー表示はされませんでした。
日本語エラーメッセージが入った後(after)は、右のようにデバッグアシスタントで「エラーが何行目」と出るようになりました。
※クリックすると拡大します
※クリックすると拡大します
※クリックすると拡大します
生徒が間違えるポイント2 (before)です。
こちらもスペルによるミスですが、random_intが間違っています。これはデバッグアシスタントでエラーがありますと表示された画面です。
※クリックすると拡大します
Afterがこちらです。
デバッグアシスタントでは1行目が違っていると出ました。何回か同じようなパターンのエラーメッセージを見るうちに、ここかなと予想がつけられるようになり、私から生徒への対応も楽になりました。
※クリックすると拡大します
生徒が間違えるポイント3-1 (after)です。
インデントルールを無視してどんどん打ってしまったり、中にはインデントを取ってしまったりする生徒もいます。エラーメッセージ画面では、実行するとデバッグアシスタントでエラーを起こしてる行を表示してくれます。
※クリックすると拡大します
生徒が間違えるポイント3-2(after)です。
バックスペースで先頭に戻し切れずにスペースが残ってしまうというようなミスもよく見られました。
※クリックすると拡大します
生徒が間違えるポイント4-1 (after)です。
半角・全角の間違いは画面でアシストがあるものの、生徒がこのアシストを理解できずにそのままエラーになってしまうことがありました。特にプログラムの途中に日本語入力が出て来る場合には、半角・全角がどうしても交じりがちになります。
Monacaが搭載する「もなかこみフォント」は、一部の全角記号などを枠で囲むことで、プログラミングのミスを減らせる機能で、これを使うと2回目からは注意する必要がなくなるため、とても助かりました。
※2 https://anko.education/tool/monacakomi
※クリックすると拡大します
生徒が間違えるポイント4-2 (after)です。
「”(ダブルクォーテーション)」やかっこ、「:(コロン)」などのコードの一部欠落も頻出していました。
※クリックすると拡大します
今後に向けて
実践をした振り返りです。
前半、エラーやデバッグアシスタントが出なかった頃は、生徒の画面から間違いを見つけるのがとても大変でしたが、日本語で細かいエラーメッセージが出るようになってからは楽になりました。
ただ、文字が大きくなったわけではないので、近くに行ってみないとよく分からないという感じでした。
全角での入力ミスは見つけやすくて助かりました。「もなかこみフォント」はとても便利です。また、単語の色の違いが、私にはコントラストが弱くて見つけづらく感じました。

また、1回の授業を一つのプロジェクトにして4つの課題に取り組みましたが、利点と欠点に悩みました。
課題が自由に設定できるのはとてもよかったです。生徒もプリントを見ながら、友達と教え合いながらよく取り組んでいました。Pythonならではのプロジェクトをもっと作りたかったとも思いました。

もう一点は、困っていても自分から聞けない生徒を早く見つけて対応してあげることが授業を進める上で大切だと感じています。生徒同士がうまく教え合えると教員の負担も減るので、席順なども大切です。
今回は私自身も6時間という授業時間もあまりゆとりがなかったので、もっとゆとりを持って行えたらと思いました。

今年はMonacaとEdTechの導入補助金を使って、無料で利用することができましたが、次年度以降は有償となって生徒に負担をかけることになるので、来年も同様に活用するかどうかについては、アンケート結果をもとに決めていきたいと思っています。
魅力的だったのは、ドリル型ではないため課題が自由に設定できることです。また、今後はペアプログラミングをうまく活用できればと思いました。

参考として、Monaca EducationとEdTech導入補助金のサイトを載せます。

神奈川県情報部会実践事例報告会2022オンライン オンデマンド発表より