0521089-20090202

「サバイバル・ゲーム」のための
Web ページの制作
-Webデザインコンテスト参加作品(2007/2008)-
北海道情報大学 情報メディア学部
情報メディア学科 新井山ゼミ
0521089 小林 敦志
目次
•
•
•
•
制作概要
制作目的
制作手順
開発成果
•
•
•
•
評価
考察
今後の課題
参考文献
制作概要
• 制作目的
– 「サバイバル・ゲーム」を紹介するための
Webページ制作
• 制作手順
– 基本的なHTMLの技能の習得
– 動画撮影・編集技術の習得
• 研究成果
– 2008年度・・・Webデザインコンテストへ出品
制作目的
• 制作目的
– 個人的趣味・・・「サバイバル・ゲーム」
– HTML技法の再習得
– 動画コンテンツの導入
– 「サバイバル・ゲーム」への認知度向上
制作手順
• HTMLの基礎を再習得
– 制作支援ツール“HTML Maker AZUKI”により
タグ打ちを効率化
– Webページの壁紙はフリー素材を使用
• 「HP素材のおすそわけ。」
http://hide.kanari.info/01.php
– バナーの作成
• ロゴ作成ソフト「LOGO!」を使用
http://www5a.biglobe.ne.jp/suuta/
制作手順
• 写真・動画撮影機材
– カシオ製携帯電話 W53CAのカメラ機能を利用
・静止画:有効画素数約515万画素
・6軸手ブレ補正+高感度撮影
・ズーム最大デジタル16倍/40段階
・動画:最大撮影時間最大180分
制作手順
• 動画撮影
– ページ内コンテンツ「武器庫」
• エアソフトガン紹介動画にて使用
– ゲーム・フィールド紹介
• 現地で撮影した動画を編集掲載
– ゲーム・ルール解説
• “3ds max” CG動画によりルールを解説
制作手順
• 動画編集
– Corel VideoStudio 12 を使用し編集
• 動画変換制作
– 編集した動画をFLV形式に変換
• MEDIA-CONVERT
http://media-convert.com/ja/
• 動画コンテンツ
– FLVプレーヤを埋込み⇒ Webページ上で視聴
作品紹介
• Webページ
– どらぐのぶ
作品紹介
• 「武器庫」
作品紹介
• ゲーム・ルール解説
作品紹介
• フィールド紹介
評価
• Webページ
– 全体
• HTMLのみで作成
– 「エアソフトガン」
• 動画コンテンツ未実装
– 他のページ
• FLV形式動画と静止画をふんだんに使用
考察
• Webページ
– HTML基礎知識の再習得
– 動画の撮影・編集技術の習得
– FLVプレーヤの埋め込み方法習得
– コンテンツ数
• 制作当初の目標数に到達
• ある程度の“情報密度”を達成
今後の課題
• HTMLの学習継続
• デザイン性の向上
– 視認性の向上
• 内容の充実
– 「エアソフトガン」ページの拡充
• 知識・技術の向上
– CSSなどを利用し,Webページを洗練
参考文献
• 北海道情報大学Webデザインコンテスト
– http://wdc.do-johodai.ac.jp/
• カシオ携帯電話W53CA
– http://k-tai.casio.jp/products/w53ca/
• Ulead VideoStudio 11
– http://www.corel.com/servlet/Satellite/jp/jp/Product/
1175714228541
• 3ds max 2008:
– http://www.autodesk.co.jp/adsk/servlet/index?siteID=
1169823&id=10004315