ウェブデザイン

指導先:茨城県立土浦工業高等学校（茨城県）

ＩＴマスター:佐藤 俊秀さん

茨城県立土浦工業高等学校

茨城県内で３番目に開校した工業高校で、今年創立60周年を迎えた歴史のある学校です。「自律・独創・寛容・奉仕」を校訓として掲げ、人が幸せに生きていくために必要なものを創ることを教育の原点としています。学科は機械科、電気科、情報技術科、建築科、土木科の５学科で構成されています。

実技指導を依頼した背景

時代にあったITスキルを、専門的な視点で指導してほしい

本校では、以前から電子機器組立ての技能習得を行うために「ものづくりマイスター等事業」を活用していました。しかし、ICT分野 が急速に進化してきた近年の時代背景を受けて、IT領域の実習内容を検討すべきではないかという議論が行われ、プログラミングやウェブデザインの指導を行うことが決定しました。それに伴い、教員たちもウェブに関する勉強を行いつつ手探りで授業を進めてきましたが、生徒たちが正しく理解できているのか不安がありました。その中で、情報技能関連の優れた技能を持つ「ITマスター」の認定が始まったことを知り、技能振興コーナーに相談し、佐藤マスターに指導いただけることになりました。

実技指導を受けたことによる効果

実践的なウェブデザインの指導が生徒たちの関心を高め、技能習得の近道に

私たち教員の指導方法は、教科書などのテキストに沿った教え方が一般的であるため、佐藤マスターには実践的な技能を教えていただきたいと依頼しました。佐藤マスターは、オープンソースを活用した実習プログラムを組んで、基礎知識だけではなく実際にコンピュータ上で動くプログラミングを生徒たちが体験できるように指導してくださいました。指導をいただく中で、生徒たちは「お絵かきソフト」などのプログラミングが組めるようになりました。ウェブデザインの楽しさや面白さを実感することができ、生徒たちの満足度も大変高いものでした。

茨城県立土浦工業高等学校
情報技術科 教諭

正影（ まさかげ ） 裕昭（ ひろあき ） さん

ウェブデザインへの興味を高める指導が
生徒一人ひとりの成長に繋がる

すべての生徒が、ウェブデザインを好きになる仕掛けが必要

ウェブデザインの指導において、理解度の異なる生徒たち全員がプログラミングなどを理解できるように、どのような点を工夫されましたか。また、生徒の皆さんはその講義を受講して、どのようなことを感じましたか。

佐藤　私はこれまで、企業を中心に少人数に対して指導を行うことが多かったため、今回のような生徒たち40名程に行う実習はどのように実施すべきかをしっかりと考察しました。その中で大切にしたことは、理解度が異なる生徒たち全員にウェブデザインに興味をもってもらうためのプログラムです。また、生徒たちを３班に分けることで、一人ひとりにまんべんなくコミュニケーションが図れるように工夫しました。

高桑　私は、ウェブデザインの専門的な知識があまりなく、ソフトウェア開発のための統合開発環境（Visual Studio）を使用したプログラミングも初めてだったため最初は不安でした。しかし、佐藤マスターはウェブデザインの基礎知識だけではなく、ソフトウェア開発環境の活用方法も丁寧に教えてくださったため安心して受講することができました。

木本　私がこれまで学んできたことのない「JavaScript」を使用したプログラミングだったため、技能を習得できるか不安な気持ちを抱えた状態で受講しました。佐藤マスターは、そんな私の不安を察してくれたかのように、常に巡回しながら声を掛けてくださいました。私の書いたコードにミスがあった場合も、解決まで一緒に伴走していただけたので、とても助かりました。

適した難易度のプログラミングで、生徒たちの向上心を育む

教科書に沿った基礎的な指導ではなく、実践的な技能を指導してほしいという学校側からの依頼に、どのようなプログラムを組んだのでしょうか。また生徒のお二人は、佐藤マスターの指導で印象に残っていることを教えてください。

佐藤　ウェブデザインの基礎は私が作成したオリジナルのテキストを使用し、パソコン画面上に映してレクチャーを行いました。実技指導では、ウェブ上に公開されているオープンソースを活用して、チュートリアルを参考にしながら実際にプログラムを組むといった実践ベースの指導を行いました。中でも、「JavaScript」と呼ばれるブラウザで動かせる言語を中心に使用して、生徒たちに適した難易度を意識しました。今回は、班ごとに「お絵かきツール」を制作し、実際にパソコン上で動かせるプログラムを組めたことで、生徒たちのウェブデザインに対する興味や関心がさらに高まりました。

高桑　受講する前は、「JavaScript」の難易度は高いと思っていましたが、佐藤マスターの親身な指導を受けたことで、苦戦を強いられることなくプログラムを組むことができました。そのため今では自宅に帰ってからも空き時間を見つけては、学校の授業や佐藤マスターから教えていただいたプログラミングを実践しています。

木本　私は、佐藤マスターの実習を通じて、自分が思い描いたものをパソコン上で動かせることの面白さや喜びを再認識することができました。今回は「お絵かきツール」を制作しましたが、ペイントなどのプログラムを少し加えるだけで、点だけではなく線を引けるようになるなど、実践ベースで活用できる技能やテクニックを学べたことで大きな達成感を得ることができました。

成長を続けるIT業界でクリエイティブ職を目指す生徒を増やしたい

今回の実技指導を受講した学生たちには、将来どのように活躍してほしいとお考えですか。また、それぞれどのような未来を描いているかお聞かせください。

佐藤　ITとは、現代社会において必要不可欠な領域であり、これから先もさらなる進化を遂げると感じています。そのため、ウェブデザインなどのITに関連したクリエイティブ職は、世の中のニーズも高く、必要とされ続けるといえます。今回受講した生徒たちも、受講を機にウェブデザインやプログラミングに対して、さらに興味や関心を持ち、社会に出てからもIT分野で活躍してくれることを願っています。

高桑　私は今まで情報分野の知識をただ幅広く習得したいという程度にしか思っていませんでした。しかし、今回ウェブデザインの実技指導を受けたことで、成長が目覚ましいITの分野に進みたいという思いが強くなりました。今後は、佐藤マスターに教えていただいた技能を活かして、大学進学に役立てたいと思います。

木本　私が進学予定の大学には、ウェブデザインのコースがあるため、今回の実技指導で佐藤マスターから学んだ「JavaScript」などのプログラミングを活かしていきたいと考えています。また、ウェブ領域は世界の様々な人やサービスと繋がることができるコンテンツで、必ず発展し続ける分野だと思っています。私もそのような世界との繋がりを生み出せる社会人になりたいと思っています。

茨城県立土浦工業高等学校
情報技術科３年

高桑（ たかくわ ） 莉玖（ りく ） さん

茨城県立土浦工業高等学校
情報技術科３年

木本（ きもと ） 凌雅（ りょうが ） さん

ＩＴマスター
佐藤 （ さとう ） 俊秀（ としひで ） さん

平成29年度 厚生労働省「ITマスター（ウェブデザイン職種）
（ITネットワークシステム管理職種）
（業務用ITソフトウェアソリューションズ職種）
（ロボットソフト組込職種）」認定

技能指導の実績
企業向けのIT基礎指導
学校向けのウェブデザインの指導 / 学校向けのネットワーク構築の基礎指導

中学３年生からプログラミングに興味を持ち、20歳でソフトウェア会社に就職。就職先では、受託開発をメインに茨城県にある原子力関係のデータ収集を担当していました。しかし、一般の人々には使われないソフトウェアが多かったため、多くの人たちに広く使用されるソフトウェアを開発したいという思いから平成18年に独立。平成29年にITマスターの認定を受け現在に至ります。
プログラム内容
実施課題 ウェブデザイン
目　　的 ウェブデザイン（ＪａｖａＳｃｒｉｐｔ）の指導
受講対象 情報技術科３年生40名　
  • 第1回
  • ウェブデザインの基本（HTML、CSS、JavaScript）
  • 第2回
  • JavaScript（基本、canvasの使い方）
  • 第3回
  • Bootstrap（レスポンシブウェブデザインの基本）
  • 第4回
  • お絵描きツールを作る
  • 第5回
  • ３Ｄモデル（three.jsの基本）
  • 第6回
  • ３Ｄモデル（three.jsの応用）
  • 第7回
  • 機械学習・ディープラーニング
    （TensorFlow.js、手書きの数字の推論）
茨城県立土浦工業高等学校

〒300-0051　茨城県土浦市真鍋六丁目11番20号

設 立 年 昭和34（1959）年
学 校 長 瀧ヶ﨑宗夫
学　　科 機械科、電気科、情報技術科、建築科、土木科
在校生数 240名（定員）