豊島区との連携もパワーアップ！「池袋デジタル寺子屋2023」開催レポート

エクストリームは2018年より、豊島区在住・在学の子どもたちにデジタルクリエイティブの面白さを伝え、未来のデジタルクリエイターを育成するためのワークショップ「池袋デジタル寺子屋」を開催しています。

これまでも「3Dホログラム映像を作ろう」「AR（拡張現実）体験」「3Dプリンター体験」など様々なテーマで実施し、制作した作品は池袋西口公園 extremeイルミネーションとのコラボレーション、公募美術展「第16回まちかどこども美術展」への出展など、地域連携・地域交流にも積極的に取り組んできました。

このような取り組みの結果、池袋デジタル寺子屋は「豊島区国際アート・カルチャー特命大使 / SDGs 特命大使自主企画事業」に採択されました。これは豊島区が目指す「国際アート・カルチャー都市構想およびSDGs 未来都市に賛同する事業者および企画が選出されるものです。

今回は、大好評に終わった池袋デジタル寺子屋2023の模様をレポートします。今回のテーマは「世界でひとつのホームページを作ろう！」です。「夏休みの思い出」の写真を挿入したホームページ制作の体験を通して、インターネットやWebデザインについての知識を学びます。

イベントの模様や参加者様の感想を紹介しているので、次回以降に参加をお考えの方は、ぜひ参考にしてください。

※自己紹介ホームページ内の個人情報はプライバシーに配慮し、保護者の方から承諾を得たものを掲載しました。

エクストリーム本社でデジタルクリエイティブを体験！

連日記録的な猛暑が続いた2023年8月後半。池袋駅直結のエクストリーム本社に参加者のみなさんが集まりました。

まずはエクストリーム代表取締役社長CEOの佐藤昌平から、開催の挨拶をさせていただきました。

「今年は皆さんも御存知の通り、AIが色々なところで使われはじめて、テレビでも取り上げられています。いつか人間ではなくAIが世の中を動かしていくのではという声も聞こえます。でも感情をもってものを創造していくことは人間にしかできないことです。ぜひ今日の体験を通じて、デジタルクリエイティブの面白さに触れていただければ幸いです」

ホームページってそもそも何？デジタルクリエイターが基礎から解説

▲研修室に移動してワークショップスタート！普段は社員の自己学習や社内勉強会に活用されています。

今回の講師はエクストリーム社員でWebデザイナーのryokoさん。池袋デジタル寺子屋は、現役のデジタルクリエイターが講師を務める点も特長です。様々な職種のデジタル人材が集まる「デジタルクリエイタープロダクション」であるエクストリームの強みが、池袋デジタル寺子屋にも活かされています。

制作を始める前に講師のryokoさんから、ホームページの役割や、インターネットの仕組みについての説明がありました。ゲームやアニメなど、子どもたちに身近な題材を用いながら解説することで、子どもたちは楽しくIT技術について学ぶことができます。

解説が終わったあとはいよいよ制作のスタート。

「デザイン」「コーディング」「インターネットへのアップロード」の3項目で、ホームページ制作の流れを学んでいきます。

夏休みの思い出を紹介する、世界でひとつのホームページを作ってみよう！

今回はWebデザインで使用されるツール「Adobe XD」を使って、ホームページ制作を体験します。

まずはホームページ用のデザイン制作から開始。フォルダからXDファイルを開き、好きな背景デザインを選択していきます。

まったくゼロの状態からホームページを制作するのは難しいため、今回はあらかじめエクストリーム社員が準備したテンプレートファイルを使います。プログラミングやデザインが未経験でも、楽しく学べるように工夫しています。

普段はスマートフォンやタブレットなど、タッチパネル操作のデジタル機器を操作している子どもたちはマウスの操作やキーボードでのローマ字入力にちょっと苦戦している様子。そんな時はすかさずエクストリームのスタッフがサポートに回り、わからない部分を教えます。

夏休みの思い出をテーマに、持ってきてもらった写真や動画をXDを使って挿入したり、夏休みの思い出のテキストを考えたりしてデザインの完成を目指して作業を進めます。写真が90度回転してしまうなど思い通りにいかない場面もありましたが、講師に質問しながら自分の力で克服していました。

htmlファイルを編集してみよう！

デザイン制作がひと段落したところで、続いては「コーディング」です。htmlファイルの編集にチャレンジします。

Visual Studioという編集ソフトでhtmlファイルを開き、指定された部分のコードを編集してデザインを反映していきます。英語や記号が並ぶ画面にちょっと戸惑う子どもたちですが、講師のryokoさんが優しい言葉で作業内容を解説していきます。

ryoko「まずは背景の画像を変更します。指定した部分のコードを、みんなが選んだ背景画像に合うようにコードを編集してみましょう」

キーボードを操作しながら、指定された部分のコードを変更する子どもたち。編集したhtmlファイルをブラウザで確認してみると、背景の画像が自分の選んだものに早変わり！「すごい、変わったよ！」「こうなるんだ！」研修ルームのあちこちから驚きの声が上がります。

その後も、htmlを編集して思い思いのテキストや画像を設定し、だんだんとホームページが出来上がっていきます。さっきまで戸惑っていたhtmlのソースコードの仕組みも、すぐに理解して進められるようになりました。パソコンの操作もずいぶん上達し、巧みにキーボードやマウスを扱って作業を進めていきます。

夏休みの思い出の写真や動画を掲載したり、自分の好きな物の紹介文を書いたり、保護者の方と楽しく会話しながら作業すること約1時間半。ホームページが完成し、インターネットへのアップロードが完了しました。

専用のQRコードをスマートフォンで読みとると、画面には先ほどまでPCで編集していたホームページが登場！

自分の手で作ったホームページがスマートフォンに表示されたことに、思わず歓声を上げる子どもたち。研修ルームを出たあともスマートフォンで自身のホームページの動画を再生してみたり、思い思いに楽しんでいました。

最後は「デジタルクリエイター認定証」と参加賞、そしてホームページのQRコードが印刷された名刺をお渡ししました。ご家族や親戚、お友達に名刺を渡すことで自身のホームページを見てもらう事ができる、名前入りの特製名刺です。

参加したお子様の声

「キーボードで文字を入力するのが難しかったけど、色や文字が変わるところが面白かった！」

参加した保護者様の声

「学校で行うIT教育の授業よりも実践的な内容で驚きました。『ウチの子の年齢にはちょっと難しいかも』と、最初は思ったのですが、わかりやすく学べるように工夫されていたので、とても楽しそうに作業していました。参加してよかったです！」

講師のryokoさんのコメント

「今回の体験を通じて、IT業界のお仕事に少しでも興味を持ってもらえれば大変嬉しいですし、この池袋デジタル寺子屋で子どもたちにどのように伝えていけばわかりやすく楽しい講義になるか私自身も勉強になりました。」

ご参加いただいたみなさま、ありがとうございました！

池袋デジタル寺子屋は豊島区国際アート・カルチャー特命大使およびSDGs 特命大使自主企画事業として、今後も地域連携の取り組みを推進していきます。

次回の池袋デジタル寺子屋は2024年に開催予定です。みなさまぜひご参加ください！