プログラミングによるWeb ページ
第23回・Java Script
*Java Script*
特別なツールがなくても、動的なものを作ることができるということで、
Java Scriptを扱いました。
まずは、背景色がランダムに変わるものや、文字が動くものなどをデモンストレーションし、
どんなことができるのかというイメージを持ってもらいました。
次にエディターで、HTML文書の基本形を作ってもらい、ブラウザで確認、修正、更新の仕方も復習しました。
復習といっても、エディターのみでWebページを作成していくのは
２学期のはじめにやったきりで、以後ビルダーを使っていましたので、ほとんど新規のようなものでした。
その次にJava Scriptの書式を示し、サンプルプログラム（日時の表示と時間により変化するメッセージ）
を説明しつつ、入力をしてもらいました。
きちんと入力されていると、日時とメッセージが表示されるはずなのですが、
なかなかうまくいきません。
デバッグは根気がいる作業ですが、
プログラムソースをじっくり見ることで多少なりとも命令文の意味を知ります。
たかだか日時とメッセージなのですが、
きちんと表示されると、うれしいものです。
うまくいかない生徒は画面とにらめっこをして、どこがいけないんだろう？ と悩んでいます。
早く終わった生徒には、他の生徒のデバッグを手伝ったもらう、
または、設定条件やメッセージを変えてみてもらいました。
たった１回（２時間）の授業ですので、体験するというのがやっとの状態です。
最後に、Java Scriptに関するサイトをいくつか紹介して、
関心のある人はそれを参考に勉強してください、ということにしました。
第24回・Flash(1)
*Flash*
Flashを使ったアニメーションの作成に挑戦してもらいました。
まずは、flash（トライヤル版を使用しました。）の起動から。
アニメーション作りの感覚をつかんでもらうため、
絵を描くのは次回ということにして、私の方で用意した女の子のオブジェクトを使いました。
ライブラリからもってきて、キーフレームの挿入、モーショントゥィーンの挿入として、
アニメーションを作ります。
ここまでの簡単な操作でとりあえずアニメーションができてしまうのには、
驚いている様子でした。
（以前にやったgifアニメーションは１コマ１コマ絵を描きましたので・・・）
モーショントゥィーンも、単に位置を変えるだけでなく、
傾きを変えたり、大きさを変えたりしました。
*レイヤー*
レイヤーの意味と扱いを説明しました。
背景用のレイヤーを追加し、そこに（こちらで用意した）
山と雲のオブジェクトを配置しました。
*ガイドレイヤー*
今度は動きをもっと自由に設定しようということで、ガイドレイヤーの扱いを説明しました。
ガイドレイヤーを追加し、オブジェクトが動くコースを設定していきます。
最後にガイドレイヤーを非表示にして、再生してみると、
きれいにアニメーションができています。
*パブリッシュ*
webで公開するためには、そのような形式で保存しなければならず、
それが「パブリッシュ」であり、パブリッシュを行うと、
実体である「swf」ファイルと、「html」ファイルができあがります。
「html」ファイルを開き、動きを確認したあとソース表示をして、
＜object＞＜/object＞
を確認してもらいました。
初めてFlash に触れ、盛りだくさんの２時間でした。
第25回・Flash(2)
*画像*
今回は、それぞれ自分のオリジナルキャラクターを描いてもらおうということで、
Flashによるお絵かきをしてもらいました。
ペイント系ソフトとドロー系ソフトの違いを説明した後、
主なツールを使って、私の方で簡単なデモをしました。
その後は、自由に描いてもらいました。
ペイント系のものと使い勝手が違うところも含めて、いろいろさわって失敗して
覚えた方がいいかなと思いましたので、
とにかく１時間で何かキャラクターを描くことを課題としました。
それぞれ試行錯誤をしながらも、かなり真剣（？）に取り組んでいました。
ペイントよりもおもしろいという生徒もいました。
最後シンボルとして登録をしてもらいました。
*アニメーション*
後半は、前回の復習を兼ねて、それぞれが描いたオリジナルキャラクターによるアニメーションを
自由に作ってもらいました。
２時間だけですから充分なものは作れませんが、それなりにがんばっていました。
生徒の作品を紹介します。
レイヤーで背景やキャラクターを独立させて動かすということ、 キャラクターや部品をシンボルとしてライブラリに登録をして活用すること、 キーフレームを設定してモーショントゥィーンを入れていくことなど、 アニメーションの基本的な作り方はわかったかなという程度でした。
*最後に*
１年間、必ずしも完璧だったわけではありませんが、
期待に応えて取り組んでくれたことに対する感謝の気持ち、
また、この授業で学んだことをこれからの人生に活かしてほしいという願いなどを伝えました。
そして、生徒にも感想を書いてもらいました。
評価について
この単元について、観点別の評価規準と具体的な評価方法をまとめてみました。
| 関心・意欲・態度 | 思考・判断 | 技能・表現 | 知識・理解 | |
|---|---|---|---|---|
| 評 価 規 準 | ・情報を効果的に伝えるための様々な工夫をはかろうとする。 | ・情報を効果的に伝えるための様々な技法を理解し、適切に用いることができる。 | ・Webページ作成における様々な表現技法を身につけている。 | ・情報を効果的に伝えるためのデザイン上の工夫の意義を理解し、 そのための様々な工夫についての技法を身に付けている。 |
| 評 価 方 法 等 |
出席状況 観察 感想文 など |
Flashによる作品 など |
Flashによる作品 など |
Flashによる作品 など |
生徒の感想
２年生
- １年間とても楽しかった。アニメーションやFlashは、自分で好きなように作れるので特に楽しかった。 でも、もう少し時間がほしかった。もっと長い時間をかけていろいろなことをやりたかった。
- 情報の授業は本当におもしろいし、１週間に２時間というのは、少ない。もっとやりたかった。
- １年生のときからやっていたから楽しかったです。これから生きていくにはコンピュータはとても 必要だと思うから、とても役に立ったと思います、今までありがとうございました。
- 普段、パソコンもいじらず、機械が苦手だったので、わからないところだらけでしたが、 少しは使えるようになったかな？ 楽しくできました。
- すごくおもしろかった。めちゃがんばったし！！ ちょっとめんどくさいのもあったけど自分のためになったのもあったし良かった。
- Flashを充分にできなかったのが残念。
- 情報はすごく楽しかった。１年間お世話になりました。
- どれも全部むずかしかったけれど、とても勉強になりました。ありがとうございました。
３年生
- ２年生と一緒の授業だったので楽しくできました、１歳若くなった気さえしました。
- おもいろい７０％、大変だった２９．５％、その他０．５％
- １年間お世話になりました。
- とてもためになった。
- パソコンをいじるのは昔から好きだったので結構がんばって一つ一つ出来たと思う。 自分としては、集中出来た授業だと思う。
- 楽しかった、お世話になりました。
- やることがたくさんあって大変だったけれど、楽しかった。
- 自分の身になるものばかりでとても良かった。
プレゼンテーション
本校は、この３月に閉校ということで、３月１３日（土）閉校式を行いました。
その席で、本校の教育活動の紹介ということで時間をもらい、
生徒の代表が、「ヴァーチャル弘明寺タウン」の取り組みについての
プレゼンテーションを行いました。
戻る