[Home]
[Next]
第1回 イントロダクション
担当者 : 斎藤進也 (saitos@fc.ritsumei.ac.jp)
講義について
★進め方について
- 実習形式
*シラバス通りにはいかないこともある。
- 出席重視
- ペアプログラミング
- 前提となる知識・技術
本講義は、全くの初心者を想定して進めるので、特に前提となる知識・技術は必要ない。
ただし、インタラクティブ映像制作実習II(1)
では、プログラミングの基礎知識が必要となる。変数、分岐、ループといったプログラミングの基礎を復習しておくこと。
★講義資料について
- 講義毎にWebで配信する。自学自習をする時のために、各自URLをひかえて おくこと。URLは下記。
http://www.ritsumei.ac.jp/~saitos/interactive2012/practice_1.html
[注意!] ritsumei.jpではなく、ritsumei.ac.jp
[注意!]誤って昨年度のページを見ないように。シラバスの参考サイトに記載されているのは昨年度のサイト。
- 毎回、講義の開始時に、教材フォルダshinya_saitoの中にあるurl.txtを開き、ブラウザにurlをコピペするとよい。
- (紙媒体の)レジュメなどは基本的に配布しない。
※補足的な参考資料として紙媒体のものを配布する場合はある。
★持参するもの
- 教科書
- USBメモリー : データの保存やペアでデータ交換を行う時のため
- QRコード
★教科書・参考書について
- [インタラクティブ I] 原一浩、境祐司、タロアウト、林拓也『Flash 逆引きデザイン事典CS4/CS3対応』翔泳社、2009.
- [インタラクティブ II] Rich Shupe、Zevan Rosser著、永井勝則訳『初めてのActionScript 3.0 : Flashユーザーのためのステップアップガイド』オライリージャパン、2008.
★グループ/ペアをつくる
グループ:4名1組
さらに、グループ内でペアをつくる。
(1)グループでひとつの課題に取り組むケース、(2)ペアでひとつの課題に取り組むケース、(3)個人(ひとり)でひとつの課題に取り組むケースの3パタンがある。
目的: メンバー間で知識の共有をはかることで、学習効果を高める。
協力して課題をこなすことで、よりレベルの高い成果を提出する。
- くじびき
*くじびきで決定したグループ/ペアで、課題に取り組む。
- 席替え
*毎回、グループ/ペアで着席すること
- グループメンバー表の作成
全部で5部作成のこと。提出用1部+各メンバー分4部
必ず、各自デジタル・データを保存しておくこと。
グループメンバー表フォーマットのダウンロード →[click]
★課題について
- 毎回、flaファイルを教材フォルダ(shinya_saito)内の講義日の日付が名前となっているフォルダに保存。
- 上記フォルダ内にグループ用のフォルダを作成。グループ名をフォルダ名と
する。ex)group_a
- [グループで一つの課題を提出する場合]
ファイル名は、グループ名.拡張子とする。ex)group_a.fla
- [ペアで一つの課題を提出する場合]
ファイル名は、名字1_名字2_日付.拡張子 とする。ex) murakami_takahashi_120413.fla
- [一人で一つの課題を提出する場合]
ファイル名は、名字_日付.拡張子とする。ex)murakami_120413.fla
- 課題が複数ある時は、日付のあとに識別するためのアルファベットを付ける。
ex)murakami_takahashi_120413_a.fla
- 課題の提出は、翌回の講義の終了時まで受け付ける。
★ファイルアップロードの方法
- アップ先:
URL : http://www.ritsumei.ac.jp/~ユーザ名/interactive/
- FFFTPの使用方法:
RAINBOW GUIDEに詳細な説明あり。
Flashの概説
★Flashとは
基本的にWeb上で動くコンテンツをつくるための開発環境。
Adobe社によって提供される。
「Flashとは、Webコンテンツ制作やシステムのインターフェースデザイン、ビデオ配信、アニメーション制作などを行うための総合開発環境。(p.20)」
<参考サイト>
「Flash
だとここまでできる!」(HTML5との比較)
Flashでつくれるもの
- アニメーション
- 音声、音楽、ビデオなどのWeb配信システム
- デザイン性の高いWebページ
- ゲーム
- ユーザ・フレンドリーな商用サイト
などなど。創作は、作り手の発想次第で無限。
汎用性、普及率、コストパフォーマンスなどの観点からいうと現在もっとも強力なコンテンツ制作ツールだといえる。
たとえば、こんなコンテンツが作れる
将来、こう役立つ
Flashによるコンテンツ制作を生業としている人は、「フラッシャー」と呼ばれ、現在、さまざまな業界でとても重宝されている。
特に、下記の職業に就職希望の学生は、Flashをマスターしておいて絶対ソンはない。
- Webデザイナー
- プログラマー
- ゲームクリエーター
- コピーライター
- 映像制作関連
- (情報系の)研究者、学者
本講義で使用するFlashオーサリングツールのバージョン
参考サイト
補足:Adobe AIR
Flashを利用したアプリケーションソフトをデスクトップで実行するための実行環境。FlashコンテンツはWebページに埋め込まれ、Webブラウザに内蔵されたFlash Playerという実行環境によって再生された。Adobe AIRはOSにFlashの実行環境を追加する技術で、FlashコンテンツをOSのデスクトップ上で直接実行することができる。
→iPhoneアプリ、Androidアプリも作れる。CS5.5以上では、同一のソースコードからiPhone用かAndoroid用かを任意に選択しコンパイルできる。
★Flashでコンテンツ制作を行うために必要なことがら
必要なスキル
- Flashオーサリングツールの使用方法の習得 (→インタラクティブI)
- ActionScriptの習得 (→インタラクティブII)
プログラムの実行に必要な環境
★Flashオーサリングツールのよるファイル作成の手順
- Flashの起動(p.24)
- 新規ファイルの作成(スタートアップスクリーン)(p.25)
- Flashドキュメントの編集
- 保存の方法(p.31-36)
★Flashムービー(swfファイル)の作成方法
flaは、編集用のファイル。swfは、ムービーを再生するためのファイル。
- Flashドキュメントを編集
- ムービープレビュー or パブリッシュを実行(p.27)
★ワークスペースの概説
- ステージ(p.38)
- タイムライン(p.39)
- ツールパネル(p.40)
★ツールの基本(1)
- 線を引く(pp.68-69,pp.92-100)
- 直線を引く
ペンツール
ペンツールでステージをクリックすると、アンカーポイントができ、クリックする度に、線が作られる。
線ツール
線ツールでドラッグすると、ドラッグの開始位置から終了位置まで
の直線ができる。
- 曲線を引く
ペンツール
1) ペンツールで、画面上をドラッグすると、ドラッグする方向とその
反対方向にハンドル(方向線)と呼ばれる線がのびる。

2) 別の場所をドラッグする。

3) 曲線が引かれる。
- フリーハンド感覚で線を引く
鉛筆ツール
鉛筆ツールをつかうと、フリーハンド感覚で線を引くことができる。
- ストレート:直線をの組み合わせに修正
- スムース:なめらかな曲線に修正
- インク:自動修正せず、描いたとおりの絵になる
ブラシツール
ブラシツールは、フリーハンド感覚で線を引くことができ、また、
太さの強弱をつけることが可能。
- 線を追加する
インクボトルツール
インクボトルツールでオブジェクトをクリックすると、輪郭線を追加することができる。
→
- 塗る(pp.84-90)
- 塗りつぶす or 塗りの色を変える
バケツツール
バケツツールを使うと、特定の範囲を塗りつぶしたり、色を変更できる。
- 色をコピーする
スポイトツール
1) 転用したい色の上で、クリックする。

2)マウスポインタが「バケツ」に切り替わったら、変更したい色の上
で、クリックする。
- アルファ値(透明度)の設定(p.86)
[カラーパネル] のアルファ値を変更することで、塗りの透明度を設定
できる。

- グラデーション(p.87)
[カラーパネル]の[タイプ]を線状にし、[グラデーション定義バー]で色合いを設定する。

ツールを使いこなせるようになるには"慣れ"が必要なので、休み時間などを利用し、教科書を参照しながら、色んなものを書いてみよう。
★本日の課題
Flashを用いて、以下のいずれかの絵を描きなさい。
本日の課題については、グループ/ペアで1つではなく、各自取り組みなさい。
描画のアイデアが浮かばない場合は、Googleなどを利用して、参考になる写真、絵を見つけてください。
[Home]
[Next]