２枚の画像を用意して、これを部分的に表示範囲を変えながら表示させる アニメーション ですね。
これは、単純に、６枚程度のレイヤーからアニメーションを生成しています。 結果は、約 90 フレームのアニメです。
ここでは、 その雛形をご紹介します。 GIMP 2.8 系対象。
他の２種類の 写真 等と 交換して、アニメーションを作成する雛形として公開します。 .xcf ファイルです。
先ず、お断りして置きますが、 別 Blog のものとは、サイズ と 幕に連れて動く煌きの形状 を変えています。
画像（キャンバス）サイズ 600 px x 400 px の出来上がりです。 コマ数も減らしてあります。 約 23 or 46 フレーム。
ブラウザに .出来上がった GIF ファイルをドロップすれば、確認･再生も可能です。
ご自分用に、 ２枚の画像を選んで置いて下さい。
別 Blog では、１枚の写真を そのまま と 白黒化して着色したもの との ２種類 を使いましたが、
全く別の２枚でも結構です。
最初に、 画像１ から 画像２ へ、 幕が上がって行く 動画 を作りましょう。
AnimStack の Script-Fu は導入済みですよね。
まだの方は、 投稿： GIMP AnimStack 紹介 (1) 手始めに を参照の上、導入して下さい。 投稿最後に Link あり。.
また、 別投稿： GIMP xcf File AnimStack_Shiro_Sample2 から .XCF ファイルをダウンロード、入手して下さい。
この 別投稿 のリンク は 転載禁止！ です。
それでは、 実際に、サンプル画像を使って、アニメを生成して見ましょう。 AnimStack は入っていますよね！。.
ダウンロードした .XCF ファイル を開いて下さい。
そして、 次の手順で、 ごぅ！ (Go !) 。
- フィルター(R) > アニメーション(I) > Process AnimStack tags をクリック
- 画像(I) > Flatten Layer Group をクリック
- フィルター(R) > アニメーション(I) > 再生(P)... をクリック
- 画像(I) > モード(M) > インデックス(I)... > ディザリング を ポジションに変更 > 変換(O) をクリック 再生ボタンで出来上がり確認.
- フィルター(R) > アニメーション(I) > GIF 用最適化(G) をクリック 新規に別画像が生成され 以降はこれ.
- フィルター(R) > アニメーション(I) > 差分最適化(O) をクリック （省略可）
- ファイル(F) > 名前を付けてエクスポート... > xxx1.gif と入力して 無限ループ にチェック > エクスポート（E) をクリック
いよいよ、アニメの 作成です。 さぁ、ご自分の写真等で、 どうぞ。.
先ずは、素材になる画像の調整です。
レイヤーとして取り込み、サイズ調整が行える方は、この部分は読み飛ばして下さい。
新規画像として、キャンバスサイズ 600 px x 400 px で画像を作成します。
選んだ写真等の画像を レイヤーとして開きます。
レイヤー構成は、 画像1（下敷きになる画像） が上 画像２（入れ替わる画像） が下 です。
出来上がりのアニメで、最初に表示されるのが、画像１になります。 ループ化するので、最初等無くなりますが ... 。
余白が入らない様に各レイヤーをトリミングします。 レイヤー(L) > レイヤーの拡大縮小.
トリミングが決まれば、 各レイヤーを画像に合わせてリサイズします。 レイヤー(L) > キャンバスサイズに合わせる.
暫定的な名称 (ex. AnimeBase.xcf) を付けて、保存して置きます。
次に、差し替える画像を弄りましょう。
XCF ファイルの 画像１ の上に 使う画像を レイヤーとして追加します。 ２レイヤー。
見本のレイヤー 画像１ (Sample1) をレイヤー選択画面で選択（アクティブ化） します。
暫定的な名称 (ex. AnimeBase.xcf) のファイルをレイヤーとして開きます。
この２レイヤーのサイズは 600 px x 400 px になっていますよね。
それでは、 見本のレイヤーに従って、 レイヤー名の変更 をして下さい。
画像1（下敷きになる画像） 見本では画像1 (Sample1) レイヤー名： Image1 [bg] [;mask:-1]
画像２（入れ替わる画像） 見本では画像２ (Sample2) レイヤー名： Image2 [bg]
Image1 / image2 は別の名称でも可。
但し、英数半角を推奨。 今回の機能では日本語｢画像｣は問題なし。.
通常と異なり、下敷きになるレイヤーを 上 に配置します。
上に重ねた画像のレイヤーマスクの透過部分の割合を順次変える事で下のレイヤーが徐々に現れるのですね。
レイヤー構成が次の図の様にになっていれば、OKです。
つまり、画像のレイヤーを ご自分のものと入れ替え、レイヤー名に [bg] [;mask:-1] あるいは [bg] と書き加える です。
変更前 |
 |
見本で入っていた レイヤー Sample1 （画像１） と Sample2 （画像２） の２レイヤーを削除して、
ファイルを 別名保存して下さい。 .xcf ファイルです。
この状態で、最初にやった サンプル画像を使ってのアニメ生成 をすれば、もう、出来上がり です。 フレーム数 23 。
ここでは、その .gif ファイル名を xxx1.gif としましょうか。
もし、画像の入れ替わりが速い様でしたら、 GIF ファイルのエクスポート画面で以下の指定をして下さい。
指定しない場合のディレイ(D) を 100 > 200 以上に変更 コマ間隔が2倍以上に延びスローになります。
全フレームのディレイにこの値を使用 にチェック.
これだけ です。
さて、続き があります。 GIMP の画像（キャンバス）は、 皆、 閉じず！ にお待ち下さい。
さて、慌しい 片道 の動画が出来ましたね。
別 Blog で示したのは、 往復運動でした。 そう、帰り を 作りましょう。
最初に示した 手順 で言う処の 4．画像(I) > ... > ディザリング を ポジションに変更 > 変換(O) をクリック で出来ている画像。
そうです。 GIF 最適化 をする前の 画像 に戻って下さい。 レイヤー名が + frame #nn のものですね。
ここには、 透過処理をする前の 23 フレームのレイヤーがあります。
次に、 この順番を入れ替えて、 帰り に しましょう。
普通、レイヤー順を全て変えるのは大変です。
でも、AnimStack は全レイヤー順を逆転する コマンド （機能） があります。 ボタン(?) ひとつ で裏返ります。
画像(I) > Reverse/Mirror layers... をクリックし、
表示されるダイアログで Opelation Reverse になっているのを確認し、 OK(O) です。
レイヤー順が逆になっている筈です。
そして、 以前と同じ様に、 5. GIF 用最適化 から作業を再開し、 .gif ファイル xxx2.gif を生成保存します。
さぁ、最後に、連結です。
モニター画面が一杯になっている筈なので、一旦、全ての画像を閉じましょう。
xxx1.gif を開き直し、 ファイル(F) > レイヤーとして開く(E)... で xxx2.gif を開きます。]
作業手順で言う処の 3. 再生(P)... でお試し あれ ... 。
作業手順 4 & 5 & 6 の 最適化 等は既に済んでいるので、作業は不要です。
後は、 自由な名前の GIF ファイルとして、エクスポートして （同 7. 名前を付けてエクスポート... ）、 おしまい！。
xxx1.gif および xxx2.gif そして AnimeBase.xcf は作業用のファイルですので、削除してしまっても構いません。
どうも、長い時間、 ご苦労さま でした！。
どうぞ、珈琲でもビールでも召し上がって下さいませ。 そうそう、セルフサービスで、どうぞ。 :) 。.
[追補]
画像サイズの拡大縮小も可能です。
移動量をそのままで、1.5 倍の画像サイズにする場合には、
画像（I) > 画像の拡大・縮小 (S)... で 幅を 600 から 900 に変更して、 600x1.5=900
一番上のレイヤー名 Frame [*23] を Frame [*35] に変更するだけです。 23*1.5=35 (切上整数)
つまり、このふたつの数値に倍率を掛けたものに変更するだけで済みます。
画像を大きくした方が、移動変遷の総時間が大きくなる為、ゆっくりと動いているかの様な印象になります。.
0 件のコメント:
コメントを投稿