Adobe XDでPBLを実践――足立学園の事例に学ぶ「準備」と「評価」のポイントは？
基調講演に続いて、足立学園中学校・高等学校で情報科の主任教諭を務める杉山直輝氏による事例発表が行われた。「どうする？ 情報デザイン… ～Adobe XDでの取り組み～」と題されたこの発表では、「情報I」で課題発見および解決のためのツールに挙げられている「情報デザイン」の学習について、PBL（Project Based Learning、課題解決型学習）形式の授業の中でどのように取り組めるかの事例が紹介された。
杉山氏は、「情報科」の授業開始にあたって「PCの使い方を学ぶのではなく、ITを使って自己表現するためのスキルを学ぶ授業である」ことを、生徒に伝えているという。その一方で、既存の教科書では、2ページ程度しか割かれていない「情報デザイン」が、新しい「情報I」では重要なキーワードになっていることを知り、これまでの授業の進め方を変えるべきかどうか、検討を続けていた。その中で、アドビが「Adobe XDを用いた授業プラン」を公開していることを知る。これは「Adobe XDを使ったプロジェクト学習『防災アプリを作ろう』」というもので、杉山氏は、これをひな型として採用し、実際に授業を行った。
十分な「事前準備」がスムーズに授業を進めるためのコツ
授業を始める前に杉山氏が検討したのは「PCの環境は対応できるか」「Adobe XDを使いこなせるか」そして「授業における生徒の評価はどのように行うか」という点だった。足立学園では、生徒1人に1台のWindows PCをBYAD（Bring Your Assigned Device：学校指定購入機器の持ち込み）で整えており、その点では「Adobe XD」の利用に問題はなかったという。
「PC教室の環境では、生徒が授業で利用した後のPCを標準状態に戻す機能なども導入しているが、アドビのツールにはクラウド環境も含まれるため、そこにデータを保存することで、授業後に他の環境からでも問題なくデータにアクセスできた。また、アカウントについては、すでに導入しているMicrosoft 365のアカウント情報に、アドビのアカウントを関連付けることができたので大きな問題はなかった」（杉山氏）
「Adobe XDをツールとして使いこなせるか」については「事前にある程度の練習は必要だった」とする。杉山氏は、アドビが公式に公開しているAdobe XDのチュートリアルビデオ「Adobe XD Trail」を見て使い方を学びながら、自分の授業で使うことを前提とした「簡易マニュアル」を作成。生徒が「宿題」として、自宅でも使い方を学べる環境を用意したという。
なお、3番目の「評価」の方法については後述する。
全6回の授業で「防災アプリ」のプロトタイプ作成を実践
実際の授業は、アドビの授業プランをもとに全6回で行われた。全体の流れとしては次のような構成になっている。
- 1時間目：オリエンテーション、ツールを使うための準備
- 2時間目：目標とテーマの発表、情報収集
- 3時間目：集めた情報からチームでアイデアを生みだす
- 4時間目：チームのアイデアをまとめる
- 5時間目：プロトタイプの作成とフィードバックに基づく改善
- 6時間目：プレゼンテーションと評価
1時間目には、今回の授業の進め方とあわせて、Adobe XDの使い方について説明が行われた。この授業では、グループで出したアイデアを、最終的にAdobe XD上で「プロトタイプ」にまとめ、プレゼンテーションするところまで行う。「プロトタイプ」という言葉が、あまり聞き慣れないものだったため、生徒には説明が必要だったという。
「プロトタイプは完成した“作品”ではなく、それをもとに試行錯誤を繰り返すための“試作品”であることを強調した。また、具体的なAdobe XDの使い方については、簡易マニュアルをもとに、宿題として、各自が自宅で習得しておくよう指示した」（杉山氏）
2時間目には「地域特化型の防災アプリづくり」というテーマを発表。東京都と足立区がそれぞれ公開している防災アプリをダウンロードし、実際に使ってみて「良いと感じた点」「悪いと感じた点」をメモしつつ、自分なりの「防災アプリ」のアイデアを出すことに時間を割いた。
3時間目から4時間目は、各班に分かれての作業だ。他のメンバーとのコミュニケーションの中で、自分のアイデアを具体的な「ページ」として表現し、各自が作成したページを、Adobe XDでプロトタイプにまとめあげていくという作業を行った。この段階では、チームでリモートワーク的な共同作業も行っている。
5時間目は、グループで作成したプロトタイプをクラス内で公開。他の班の生徒からのフィードバックを得て、改善していく作業を行った。この過程では「Adobe XDで作ったプロトタイプをスマートフォン上に表示して、実際のアプリに似た形で動く様子を確かめられる」という機能が生徒に好評だったという。
授業の締めくくりとなる6時間目には、各班が作成したプロトタイプをもとにプレゼンテーションを行った。このプレゼンテーションは、最終的にクラス全体の投票で順位を決める「コンペティション」形式で行っている。授業の評価には、この投票での順位も影響する。順位は「班」の評価となり、加えて班のメンバーでの「相互評価」、班長を務めた生徒に対する加点などを総合的に加味して評価を行ったそうだ。
「現実の社会では、複数のアイデアから採用されるのは1つという状況が当たり前にある。授業として、チームで楽しくものを作るということも重要だが、それだけではなく、現実にはその中で勝ち抜いて選ばれる必要があるという要素も、学びの一部として加えたかった」（杉山氏）
この授業を実施して得られた気づきとして、杉山氏は「ツールの使い方に慣れるまでに若干の時間が必要」「PBLの重要さ」「チームの大切さ」といった点を挙げた。特にPBLについては「生徒たち自身も、コミュニケーションを通じてアイデアをまとめ、フィードバックを得て改善を行うことによる完成度の向上を実感している。教員の立場で見ていても、その過程は楽しかった」と振り返る。その上で、今後の改善点としては「作業のためにより多くの時間を割きたい」「フィードバックの回数を増やして、PBLを深めたい」「ツールの操作に早く慣れるための方法を検討したい」とした。
また、将来的な発展の方向性として「地域との連携や自治体とのコラボレーション」「HTMLを軸にしたプログラミング学習との接続」「プログラミング言語による実際の防災アプリとしての実装」などを挙げた。
「情報デザイン」の学びに活用できるAdobe XDと関連リソース
杉山氏による事例発表に続き、アドビからは「Adobe XD」と、アドビが教育機関向けに行っている取り組みを紹介した（アドビ株式会社 松本聖子氏）。
足立学園でのPBL事例でも使われた「Adobe XD」は、Webサイト開発、アプリ開発の現場などで使われている「プロトタイピング」および「情報共有」のためのツールである。Adobe XDを通じて「アイデアや完成イメージをメンバーで共有し、コミュニケーションをしながら仕上げていく」という作業の進め方は、そのまま教育現場における「情報デザイン」や「PBL」の実践にも適用が可能だ。
「情報デザインで使われる“プロトタイピング”という手法では、 “作りながら考える”“考えながら作る”というプロセスを繰り返すことがポイントになる。このプロセスでは、思いついたアイデアを素早く形にして公開し、得られたフィードバックをもとに改善していくことが必要。Adobe XDには、そうした試行錯誤に必要な機能がそろっている」という。
アドビでは、Adobe XDのスタータープラン（共有できるプロトタイプ数などに制限がある無料プラン）とあわせて、今回、足立学園での実践のベースとなり、文部科学省の高等学校「情報」実践事例集にも掲載されたPBLの授業プランを、教育関係者向けに無料で提供している。
松本氏は「Adobe XDの公式チュートリアルとして公開している“Adobe XD Trail”なども参考にしながら、まずは触ってみてほしい」とした。
実際に学校の授業にAdobe XDを導入するにあたっては「Adobe Creative Cloud」ライセンスの購入が必要だが、アドビでは1ユーザーあたり年間約500円（※1）～という安価な「小中高校向けライセンスプラン」を用意している。
そのほか、アドビでは、今回のセミナーを共催したアシアル情報教育研究所と連携を深め、オンライン研修や教材開発の取り組みを進めていることを紹介した。
- 参考リンク：先生のための【情報デザイン】お役立ちサイト
なお、本セミナーの模様はアーカイブされており、イベントページから申し込むことでオンデマンドで視聴することができる。本稿で取り上げられなかったセミナー全体の様子に加え、アシアル情報教育研究所や、岩田学園でMonaca Educationを活用した事例の発表パートなども視聴できるため、ぜひ併せて参考にしていただきたい。
※1
小中高校サイトライセンス/ユーザー指定ライセンス 250本の場合の1本あたり、メーカー参考価格（税込/十の位四捨五入）です。詳しくは販売店にお問い合わせください。
