Creative Cloudを駆使してAR（拡張現実）デジタルアートを制作〜ドルトン東京学園

03-14-2024

概要

ドルトン東京学園では、2023年度後期のカリキュラムとして、Adobe Creative Cloudの様々なアプリケーションを駆使してAR（拡張現実）のデジタルアートを制作する探究ラボが実施されました。選択科目として自らの意思で参加した高等部1年・2年の生徒たちは、プロクリエイターが使用するツールの習得に戸惑いながらも、それぞれがオリジナル作品を完成させることで学ぶ楽しさと創る喜びを経験しました。担当講師よりその詳細をレポートします。

ドルトン東京学園中等部・高等部

東京都調布市の美しい景観に恵まれたドルトン東京学園は、2019年に開校した中高一貫校です。総生徒数は530名強、同校の教育方針を具現化すべく設計されたカリキュラムと機能的な校舎、経験豊富な教育者が集う先進校として名を馳せています。

床, 屋内, テーブル, 窓が含まれている画像自動的に生成された説明 — *機能的にデザインされた教室*

学ぶ楽しさから、創る喜びを引き出す

学園名の由来にもなっているドルトンプランとは、20世紀初頭にアメリカで詰め込み型の教育に対する問題意識から提唱された学習者中心の教育メソッドです。「自由」と「協働」の２つの原理に基づく｢ハウス｣「アサインメント」「ラボラトリー」を軸とし、一人ひとりの知的な興味や旺盛な探究心を育て、個人の能力を最大限に引き出すことを大きな特徴としています。

2つの原理

自由：一人ひとりの興味を出発点に自主性と創造性を育む
協働：様々な人々との交流を通じて社会性と協調性を身につける

3つの柱

ハウス：多様性に触れ、社会性を育む異学年のコミュニティ
アサインメント：自主的・計画的な学習に導く「学びの羅針盤」
ラボラトリー：興味と関心の幅を広げ、深める「小さな研究室」

創造性を育む探究ラボ

そうしたコンセプトに基づいたラボラトリーは、それぞれが関心を持ったテーマを深く探究するための環境とプログラムを提供する場です。テーマは6つの分野、STEAM、国際理解・文化、地域社会・公共、スポーツ・健康、言語・メディア・コミュニケーション、環境・エネルギーに紐づけられて設置されています。学びの主体は生徒であり、自らテーマを選択し課題をみつけて探究をしていきます。教員は助言者として、問題の答えではなく「学びの方法」を教える役割に徹します。

テキスト, ホワイトボード自動的に生成された説明 — *Media Arts授業が行われたSTEAM棟デジタルデザイン室*

DALTON x Adobe STEAM Lab・Media Arts

2023年度後期のテーマの一つとして提供されたのが、STEAM Lab・ Media Artsです。STEAMとは文部科学省が以下のとおり定義して推進する教育方針です。

AIやIoTなどの急速な技術の進展により社会が激しく変化し、多様な課題が生じている今日、文系・理系といった枠にとらわれず、各教科等の学びを基盤としつつ、様々な情報を活用しながらそれを統合し、課題の発見・解決や社会的な価値の創造に結び付けていく資質・能力の育成が求められています。

文部科学省では、STEM（Science, Technology, Engineering, Mathematics）に加え、芸術、文化、生活、経済、法律、政治、倫理等を含めた広い範囲でAを定義し、各教科等での学習を実社会での問題発見・解決に生かしていくための教科等横断的な学習を推進しています。

（文部科学省：STEAM教育等の各教科等横断的な学習の推進について）

こうしたSTEAMの考え方に基づき、テクノロジーとアートの接点を探究するためのMedia Artsが、同校の新井先生とアドビ、そして講師を担当する吉崎誠多（ソプラノプラン）の協力体制によって企画・設計されました。それは、Adobe Creative Cloudの様々なアプリケーションを駆使してAR（拡張現実）のデジタルアートを制作するというものです。

シラバスに記載された目標は「プロから複数のAdobeツールを学び、次の4つの力を身につける」こと。

プロクリエーションツールを使用できるようになる
メディア芸術の作品をつくることができる
学校や世代を超えた「交流」「学び」の場を創出できる
学んだことを自発的に発展させていく

この目標を起案された新井先生は、Media Artsの成り立ちについて次のように語ります。

「開校4年目でSTEAM棟竣工という貴重なタイミングで着任し、カリキュラムを提案する機会をいただきました。ハウスを活かし、校内でアートのアクションを起こすOur Art授業とセットで提案をしたのがMedia Artsです。生徒たちがARを使ってバンド活動をアピールするアドビのPR動画や、25年間の歴史を持ちながらも幕を閉じることになった文化庁メディア芸術祭を設計のヒントにしています。」

テキスト, 手紙自動的に生成された説明 — 神山まるごと高専デザイン教員スタッフ。2020年よりAdobe Education Leaderとして活動。2022年度にドルトン東京学園で美術科主任を務め、現在は四国からSTEAMアドバイザーとして遠隔勤務を続けている。

Media Artsの内容

新井先生の考えをベースに新たに設計されたシラバスは、半年間にわたって多くの先端技術やツールに触れながら、テーマをみつけ、オリジナル作品を制作するという流れになりました。

参加生徒全員がそれぞれの作品を創るというチャレンジ。これには、短時間で慣れないツールを学びながらアウトプットをしていく困難さが伴いました。アプリケーションごとにレクチャー→チュートリアル体験→オリジナル制作にチャレンジのサイクルを繰り返すことで、少しずつスキルを上げていきます。

グラフィカルユーザーインターフェイス, アプリケーション自動的に生成された説明 — *Media Artsで実践した、AR（拡張現実）を含む動画制作のプロセス*

素材制作

まずは、作品に登場させる素材を作成します。Adobe Photoshopでは写真から背景を削除して切り抜いて合成する方法、Adobe Illustratorでは図形を組み合わせてグラフィックを作る方法を体験し、それぞれが自分にあったスタイルで素材制作に挑みます。また、最新の画像生成AIであるAdobe Fireflyを利用して、シンプルな日本語からプロクオリティのグラフィックを瞬時に生み出せることも体験し、作品に活用しました。

デスクトップコンピューターのスクリーンショット低い精度で自動的に生成された説明 — *自ら学んだオープンソースアプリのBlenderでオリジナル3Dキャラクターを作成*

AR制作

このようにして作られたグラフィックオブジェクトを、AR制作アプリケーションのAdobe Aeroを用いて3D空間に配置していきます。Aeroは、位置関係や大きさなどが現実空間でどのように表示されるかを指定することができます。生徒は、慣れない奥行きの概念に苦労しながらも、思い描いたイメージに近づけていく作業に集中しました。

さらに画面のタップや距離、他のオブジェクトの連携などをトリガーとして、移動や回転、表示/非表示など様々な動作（アクション）を設定することで、インタラクティブで魅力的なARコンテンツとして発展させます。これはプログラミングの概念に近いので、すぐに理解して複雑な設定を楽しむ生徒も現れました。

キーボードの上にあるノートパソコン自動的に生成された説明 — *これまでに制作した絵画作品を撮影・切り抜いてフレームにはめ込み、Aeroで円状に配置*

コンピューターゲームの画面中程度の精度で自動的に生成された説明 — Fireflyで生成した平面のキャラクターを奥行きを持つAeroの三次元空間に配置。慣れない奥行きの概念に苦労しながらも、思い描いたイメージに近づけていく

コンピューターの画面のスクリーンショット自動的に生成された説明 — 自作の3Dキャラクターにトリガーとアクションを設定。複数のキャラクターを関連づけ、タップによって回転、移動などが行われるようにプログラミングされている

AR撮影

Adobe AeroのiOS版では、iPhoneやiPadのカメラを通して自分の作品を現実の空間に映し出すことができます。作品を表示させる平面を決定するだけで、設定した通りの大きさで目の前に表示され、アクションが実行されます。二次元的な映像合成とは異なり、オブジェクトが平面に固定されているので、歩いて近づいたり回り込んだりすることも可能です。さらに録画ボタンをタップすると動画として撮影することができます。特別な環境が不要なため、動画化することはAR作品を多くの人に見てもらうのに最適な手段です。

人, 屋内, 女性, キッチンが含まれている画像自動的に生成された説明 — *教室でテスト後、それぞれが選んだ場所で撮影*

動画編集

Aeroで作成した動画をより魅力的に演出するために、編集を行います。まずは動画編集プロセスを理解し、その全てをカバーできるAdobe Premiere Proを学びました。プロの映像編集者が使用する高機能なツールなので、全てを短時間で習得することはできません。必要最低限のチュートリアルを体験したあとは、個々の疑問点を経験者や講師に積極的に質問し、学びあう、教え合うことで作品づくりを進めていきます。

時計が含まれている画像自動的に生成された説明 — *動画編集の流れと学習ステップ*

グラフィカルユーザーインターフェイス, Web サイト自動的に生成された説明 — *学校内の様々なスポットで撮影した素材をテンポよくカット編集し、タイトルグラフィックを合成*

コンピューターのスクリーンショット自動的に生成された説明 — *日常の中にCGオブジェクトが混在する世界を、編集によってショートストーリー化*

ノートパソコンの上に置かれた携帯電話自動的に生成された説明 — 「画面内を移動させたい」というアイデアがあってもやり方がわからなかった生徒に、他の生徒がキーフレームアニメーションを教え、最終的に思い描いた演出をみごと実現

作品の完成と発表

参加した生徒全員が脱落することなく、様々な表現手段でオリジナリティ溢れる映像を完成させることができました。最終日には、全員が自分の作品を上映しながらコンセプトや苦労した点などを解説し、フィードバックを得る機会が設けられました。一部の作品をスクリーンショットで紹介します。

写真, 小さい, 男, フロントが含まれている画像自動的に生成された説明 — *拡張現実によって学校の中庭をギャラリー化させた作品*

少し, 子供, 小さい, 持つが含まれている画像自動的に生成された説明 — *Illustratorで描いたパーツをAeroで組み合わせて作ったバスケットボールコートを、ビルのエントランススペースに出現させた作品*

ベンチでジャンプしている人中程度の精度で自動的に生成された説明 — *Adobe After Effectsのロトブラシ機能を用いてダンスする自分を切り抜き、背後に文字を合成した動画作品*

発表を終えて

授業を見守り、生徒たちのエンゲージメントを高めることに尽力された高島先生は、Media Artsについてこう語ります。

「今年度初めて設置されたMedia Artsの授業を選択した生徒たちは、新しい学びを楽しみに初日から授業に参加しているように感じました。授業では、体系立てて教えてもらっても、始めて使うソフトに難しさを感じる生徒もいましたが、講師の吉崎さんにすぐに聞ける環境があり、また生徒同士もお互いにわかる部分を教え合い、補いながら授業が進んでいきました。Media Artsに特化した授業だからこそじっくりと取り組むことができ、最後の発表では、学んだ技術を用い、それぞれが自分に合った表現方法で作品制作ができていました。この先、それぞれが自分に合った用途で今回の授業を役立てていけると感じました。」

グラフィカルユーザーインターフェイス中程度の精度で自動的に生成された説明 — 東京都生まれ。多摩美術大学工芸科ガラス専攻卒業、ストラスブール装飾美術高等学校卒業。大学卒業後は多摩美術大学で副手、助手として勤務。その後、地元の国際交流機関や絵画教室での勤務を経て、2022年より美術教員として勤務をはじめる。同年4月よりドルトン東京学園で非常勤講師として勤務を開始。2023年度から現職。

まとめ

DALTON x Adobe STEAM Lab・Media Artsは、自主性を重んじ創造性を育むドルトン東京学園の教育方針と、自発的に考え行動する生徒、クリエイティビティを尊重するアドビ製品の良好なマッチングが成果を産んだ、ユニークな取り組みだったと言えるでしょう。2024年度後期にも実施される予定ですので、今後もドルトン東京学園の動向に注目していきましょう。