Link:INB Home|INB English| INB русский язык|INB العربية|INB Türkiye|INB فارسی|INB Español|INB Français|INB Português|INB Deutsch|INB 國語|INB 中文|INB 日本语|INB 한국어|INB ภาษาไทย|INB tiếng Việt||IR チュートリアル Image Readyのヒント
INB 日本語掲示板
ようこそ(産業・自然科学者)ここでは、工業化時代のファイティングスピリットに満ちている、あなたと私の両方を通してこのネットワーク空間の自国の生物学的精神科学者と狂気の所に来ました。ホームinbforum.com、永久の名前:jp-inb.forumotion.com
INB 日本語掲示板

ようこそ(産業・自然科学者)ここでは、工業化時代のファイティングスピリットに満ちている、あなたと私の両方を通してこのネットワーク空間の自国の生物学的精神科学者と狂気の所に来ました。ホームinbforum.com、永久の名前:jp-inb.forumotion.com


You are not connected. Please login or register

《《《《《《《上一页INBforum   Go down

上一页INBforum》》》》》》》前のトピックを表示 次のトピックを表示 Go down  メッセージ [Page 1 of 1]

1 IR チュートリアル Image Readyのヒント on Sun Mar 20, 2011 6:11 am

Admin


Admin
目次


  1. 課題!
  2. ImageReady のアニメの原理
  3. ImageReady の起動方法
  4. 重要な3つのウィンドウ
  5. 作業の手順
  6. 理屈面での補足




課題!


次の課題を「画像」について勉強した成果として、作成して欲しい。

GIFアニメーションを制作する。制作ソフトは何を使っても構わない。

条件

  1. アニメのコマ数(フレーム数)は2つとする。
  2. サイズは 100 pixel × 100 pixel とする。
  3. フレームの提示の時間間隔は任意。速いアニメだけが良いとは限らないから、表現意図にしっかりと合った時間間隔を見つける。
  4. 原則として、無限に繰り返すアニメにする。






ImageReady のアニメの原理



ImageReady は Adobe 社が開発したGIFアニメ制作ソフトであり、Adobe 社の看板ソフトである Photoshop と操作にかなりの互換性がある。Photoshop に馴れていれば、操作自体は比較的簡単である。

GIFアニメの原理は、複数の絵を定められた時間で切替えていくことである。つまり、1つのファイルに複数の絵を持っており、それらを切替える「イ
ンターバル時間」の情報を持っているのである。ということは、ImageReady は複数の絵を管理する何らかの方法を持っているのである。

Photoshop
というペイント系画像加工ソフトの特徴は、「レイヤー」があることである。「レイヤー(層)」とは、あたかもアニメを作るときのように、背景が透明なセル
に絵を描き、それを重ねて表示することで、1枚の絵を作り上げる。つまり、複数のレイヤーに絵を描き、それらを重ね合わせ、位置を微調整して1枚の完成し
た絵を作り上げるのである。

Photoshop の子供に当る ImageReady は、この「レイヤー」を転用して GIFアニメを作る。つまり、アニメの1コマ(フレーム)が1つのレイヤーに相当する。つまり、

  1. 1コマ目はフレーム1を表示
  2. 2コマ目はフレーム2を表示
  3. ......

のように、複数のレイヤーを切り替えて表示して、アニメを実現するのである。だから、ImageReady では、レイヤーを単位として作業をしていく。このことを今しっかりと理解して欲しい。



ImageReady の起動方法


本学コンピュータラボにインストールされている ImageReady の起動方法は次の通り。
[スタートボタン] → [すべてのプログラム] → [Adobe] → [Adobe ImageReady 7.0.1]


である。起動したら通常は、[ファイル]メニューから定石通り「新規」を選ぶ。ここで次のダイアログボックスが開く。
[You must be registered and logged in to see this image.]

課題条件の通り、「幅」と「高さ」にそれぞれ100を入れる。



重要な3つのウィンドウ



そうすると、いくつものウィンドウが開いている。そのうち、重要なのは3つである。
[You must be registered and logged in to see this image.] ●描画ウィンドウ

まず、直接画像を描くことができるウィンドウがこれである。この解説では「描画ウィンドウ」と呼んでおこう。
描画ウィンドウに描画をすると、同じ絵が他のウィンドウにも現われる。まず、



[You must be registered and logged in to see this image.] ●レイヤーウィンドウ

である。つまり、描画ウィンドウに描かれた絵は、実際にはどれかのレイヤーに描かれている。どのレイヤーに描くのか、どのレイヤーを表示するのかを制御す
るのが、この「レイヤーウィンドウ」である。このウィンドウは Photoshopにもあるので、知っている人もいるかも知れない。



[You must be registered and logged in to see this image.] ●アニメーションウィンドウ

このアニメーションウィンドウは ImageReady 独自のウィンドウである。つまり、アニメーションを制御するウィンドウである。しかし、活躍はもう少し後である。

さて、これで重要なウィンドウはすべて解説した。




作業の手順



実際の作業は、想像の通り、まず「描画ウィンドウ」に1枚目の絵を描くところから始まる。描画ウィンドウに描かれた絵は、「レイヤーウィンドウ」「アニメーションウィンドウ」にも反映していることは述べた通りである。
1枚目の絵が描けたら、2枚目の絵に移るわけである。ということは新しいレイヤーを作って、そこに描くのである。アニメなので普通は、1枚目の絵と
2枚目の絵は大変似ている場合が多い。だから、1枚目のレイヤーを2枚目のレイヤーにコピーして作るのが良いだろう。この複製操作は「レイヤーウィンド
ウ」で行う。
[You must be registered and logged in to see this image.]
レイヤーウィンドウの右上にある小さな三角のマークをクリックすると、上の図で示すメニューが現われる。ここで、「レイヤーの複製」を選ぶ。


[You must be registered and logged in to see this image.] そうすると、「レイヤーウィンドウ」に新しいレイヤーが現われる。そして、その状態で「描画ウィンドウ」に絵を描くと、新しいレイヤーに描かれることになる。
どこで見分けるの?

さて、これで2枚の絵が完成した。今からこれらをアニメーションにする。ここで今まで登場しなかった「アニメーションウィンドウ」が登場する。今か
らすることは、「レイヤーをアニメーションのフレームに変換する」ことである。これもやはり、「アニメーションウィンドウ」の右上の小さな三角をクリック
すると、メニューが現われる。このメニューの「レイヤーからフレームを作成」を選択すると....
[You must be registered and logged in to see this image.]

「レイヤーからフレームを作成」機能は、自動的にレイヤーをフレームに変換し、2つのフレームが「アニメーションウィンドウ」に現われる。ここで
「アニメーションの再生」のチップが示す三角印を押すと、アニメがスタートする。つまり、「描画ウィンドウ」にアニメが表示される。
[You must be registered and logged in to see this image.]
また、「アニメーションウィンドウ」では、2つの絵の切り替わりの時間を設定することができる。各フレームの下の「0[]」のような記号をクリックすると、設定する時間のメニューが現われる。ここで表現意図に合わせた時間を見つけて欲しい。
[You must be registered and logged in to see this image.]

さて、出来上がったのならば、GIFアニメとして保存する。

[You must be registered and logged in to see this image.] 超重要!!! 間違えないように!

[ファイル]メニューから選択するのは、「保存」ではなくて、「最適化ファイルを別名で保存」である。これでないと、GIFアニメとしては保存されない。よく学生が「保存」で名前だけ.gifで保存して、「何で動かないんでしょう?」と質問に来るケースが過去によくあったから、皆さんも気をつけるように。

保存したら、「ImageReadyは終了せずに」、IEなどのブラウザを起動し、ブラウザの中に今作成したファイルをドラッグ&ドロップして確認するのが手順的には良かろう。




理屈面での補足


「描画ウィンドウ」と「レイヤーウィンドウ」の関係について、もうすこし補足する。「レイヤーウィンドウ」は「どのレイヤーが表示され」「どのレイヤーに描かれる」のかを制御するのが役割である。
[You must be registered and logged in to see this image.]
「眼」のマークが付いているレイヤーが、現在表示されているのである。表示は複数フレームが重ね合わせになる場合もあるので、複数のレイヤーが同時
に表示されることもある。しかし、レイヤーには上下関係があるので、今回のように不透明な背景を使っている場合には、下のレイヤーを表示しても、上のレイ
ヤーを消さない限り表示は変わらない。

[You must be registered and logged in to see this image.]
「筆」のマークで示されるレイヤーが現在描画がなされるレイヤー、つまり「描画ウィンドウ」で絵を描くと、それが描かれるレイヤーである。どのレイヤーに描いているのか注意して描画すると良かろう。]

ユーザーのプロフィールを表示 http://jp.inbforum.com

上一页INBforum   Go down

上一页INBforum前のトピックを表示 次のトピックを表示 トップに戻る  メッセージ [Page 1 of 1]

Permissions in this forum:
返信投稿: 不可

Copyright ©2009-2010 LTD Creative Commons License
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.

IT:SINGLESERVGoogle谷歌翻译TranslateFORUMSOFTLAYERGoogle谷歌广告联盟AdSenseAsia

 

Free forum | © PunBB | Free forum support | 連絡先 - | Report an abuse | Sosblog.com