ひと頃、特許問題で使用敬遠が起こった GIF は、その後 SWF に取って変わられた。容量と画質から汚く重たい GIFは直ぐ見捨てられた2000年代後期。変換形式の選択から GIF は除外され、更に動画コンテンツの充実で価値は下がったように思える。先日、youtube にアクセスした時、右カラムに妙なサムネを見つけたので視聴してみた処、
"アニメーションGIF" とある。
何気に見ていくと、近年のサイトロゴを挙げ、依然使われ活用される GIF の素晴らしさを綴っているらしい。その中にあったシネマグラフに興味を持って早速検索した。どこかで見たことあるが気を惹かなかった。いや、その時は「へ～こんなものがあるんだ」と見過ごしたのだろう。で、早速作った奴のサイトを探す。以下の２名が挙がってきた。
A photography blog From Me To You | Photographer Jamie Beck, Motion graphics artist Kevin Burg.
http://fromme-toyou.tumblr.com/tagged/gif
 |
| URL はブログ内のGIFまたはCINEMAGRAPHSカテゴリ |
同スタジオ制作のシネマグラフは以下のサイトURLで継続掲載されています
Cinemagraphs | Ann Street Studio
http://annstreetstudio.com/category/cinemagraphs/
**
IWDRM ~ IF WE DON'T,REMEMBER ME.
http://iwdrm.tumblr.com/
 |
| こちらは往年の名画から作成。 キューブリック映画GIFの出所はこの人 |
続きは、出来るかどうかの取り組みについてグダグダ書き置く。
追記 ：
Cliplets現行バージョンで、GIFのエクスポートが可能になりましたので、本記事の続きは不要となります。
2013年時点の意見感想を追記しました
アニメーション GIF や Cinemagraphy について1
http://redo-chan.blogspot.jp/2013/03/gif-cinemagraphy.html
チュートリアルに関しては、youtube に沢山挙がっている。昨年（2011年）の晩春にはまとめ動画がアップされているので前者彼らが始めたシネマグラフは最近のものではない。しかし、こんなにも綺麗な画像が GIF であり、しかも500KB前後（以下）であるのは信じられない。低サイズに抑えているのは、まずtumblr.のアップロード制限があったと思われる。動画像を担当する人物がいるので工夫と技術を投入した GIF だろうし、それなりの機材とソフトを使っているだろう。話題の浸透速度から供給物量が少ないと思われる。真似るのは容易いが掲載出来る容量に抑えるのが困難（フォロワーの作成シネマグラフ画像はMBクラスのものが少なからず多い）か。こういう発想はあっただろうが最近の加工物らしい。これは近年発売されたソフト性能によって生まれたものかも知れない、と憶測に耽る。
チュートリアルでは Adobe Photoshop CS5 Extended だけを使った解説が多い。まず所有してない。シネマグラフをやってみよう！の為に買えるものじゃない。だから取り敢えず、と云うか、まずはフリーソフトが候補に挙がる。それにPhotoshop Extended 30日間限定の体験版を登録して落としてイキナリやってみる！も無茶だ。「やってみる」ブログを多数拝見したが「やっぱ素材が・・・」という後記を多数拝見した。 Photoshop CS5 Extended 以外で出来ない事は無いが期待通りの仕上がりにはならない感想が明白。フリーソフトで作業や加工感触を得てからでも良い。丁度タイミング良く、マイクロソフトリサーチから以下のツールが発表されていた。
Microsoft Research "Cliplets" ※フリーダウンロード
http://research.microsoft.com/en-us/um/redmond/projects/cliplets/
チュートリアル（youtube、英語解説）
http://research.microsoft.com/en-us/um/redmond/projects/cliplets/tutorials.aspx
紹介記事： 窓の社｜Microsoft Research、「Cliplets」を公開。一部だけ時が流れる印象的な動画を作成 (2012/03/06)
http://www.forest.impress.co.jp/docs/news/20120307_517032.html
Microsoft Research Cliplets は動画にシネマグラフ効果を与える専用ツール。海外記事で以下のコメントを見つけてウケてしまった。"At first I thought they were talking about a new version of Microsoft GIF Animator!!"
記事より "出力可能な動画形式はWMV/MP4となっている。入力に関しては、WMV/MP4形式を確認" とある。出力形式が WMV/MP4 なのは仕方ないが、ここに GIF が無いことが今回の大問題となる[*1]。次期的に swf や マイナーなアニメーションPNG は仕方ないとして、GIF が無いのは困った。何故 GIF にコダワるかと云うと「そこに GIF があるからだ！」と答えるしかない。ともかく GIF なのだ。
[*1] ver.1.1.1よりgif出力可
"Cliplets" の使い方は動画で把握できる。実際やってみるとスンナリ理解出来た。まずは触れてみると良い。
さて、吐き出された WMV/MP4 を GIF に変換する作業が必要だ。動画だとループはプレイヤー設定に依る。ブラウザ上でのループには GIF が適当だがコレが無いので mp4 で出力。要素的に10秒程度で充分だ。しかも吐き出す動画は 1280x720サイズで 396KB である。非常に軽量だ。これが実は重要なヒントであり答えなのだが。
MP4 - GIF 変換の問題
次のフリーソフトを試した。Giam / free video to gif / Photoscape / VirtualDub 他
AVI 系編集ソフトは codec 不一致が多発し、変換して用意した AVI を中々読み込まない。VFW に関連するコーデックセットが必要（ffdshow,Avisynth）。落としたコーデックは設定画面を備えている。スタートアップまたはフォルダから本体を探してクリック、見慣れない画面と英語と解説記事を眺めてセットアップすると、どうにか読み込みはする。Giam は AVI を読み込むようになった[後日談]。VirtualDub は上手くいかない、 WMVプラグインも上手くいかない。AVI を読んでもエクスポートから吐き出す GIF はサムネが真っ黒だ、ブラウザに放り込めば再生はする。「 AVI 読めます」は読み込むソフト向けのコーデックマッチングが必要になり手間が掛かる。free video to gif は非常に軽快で簡単な操作で変換は出来る。オススメではある。Photoscapeはインストール時の印象に少々欠けるものがあったが基本的にカメラ写真整理と、写真からのアニメーションGIF作成に使える。MP4 動画をフレーム毎に静止画として切り出すツールには Free Video to JPG Converter を使った。Photoscape を起動し、分割したフレーム画像フォルダを指定するとHDDがガコガコ読み込みを始める。サムネじゃなく全部吸い上げてくる所が鈍重。しかしアニメーションGIF作成面は良い。全コマ一括フレーム/秒指定が出来、尚且つコマ毎に設定出来る。つまり待機時間を与えることが出来る。左下フォルダから取り込んだアニメ作成用サムネは上部に配置されドラッグ＆ドロップでの挿入と削除が楽。これで軽快且つ動画編集に富んでいるなら結構人気が出そうと思った。写真画像の編集機能も当然備えているんだし。けれどこう云った良いソフトもこれまでのGIF作成には通用するが、今回シネマグラフ用に使えるかと云うと難しい。変換されて出てきた GIF は 7~8MB 級の大容量サイズだ。
つまり、やはり Adobe Photoshop CS5 Extended が最適なのか？と思い始める。
体験版は最終手段だ。30日を無駄をしない準備があって活きると考えた。結果からココに書く必要がなくなった数々のフリーソフトを機械的にインストしては試して駄目ならアンインスコ。出来たシネマグラフ動画像を読み込ませるようにする問題、吐き出した GIF が大容量過ぎる問題に始終する。
さて、どうしたか
まず、"Cliplets" で仕上げた動画像を見直し、短縮したり色調を抑えて容量を抑える。有名どころがアップした本家GIF の色調を見よう。身の回りにあるカメラで撮れるハッキリしたカラー写真画像ではなく、欧州風の褪せたようなポラロイドのような色調だ。これが減色の意味を成している、作風にも合い 一石二鳥だ。動画をAVI変換する際にフィルターや設定を加え、なるべく減色させた低サイズの動画を作ることにした（こうなるとMr.IWDRM の加工技術が凄いと思えてくる実際凄い）。
MP4（10sec/396KB）を AVI（codec:mpeg4（AVC）/ 7sec/500x281px/44KB）まで落とす。使った動画変換ソフトは Avidemux 、紹介しておこう。
Avidemuxダウンロード（OS別、32or64bit毎に用意）｜Avidemux.berlios.de
http://avidemux.berlios.de/download.html
Avidemux日本語化パッチ｜TiltStr::不定期版: 日本語言語ファイル
http://tiltstr.seesaa.net/article/36217139.html
日本語化パッチは無いとされていたが、作って尚且つ修正もしてくれている素晴らしい人がいらっしゃいます。
Avidemux 使い方｜Freesoft Zone ～ E.I.Zone
http://senryaku.sengoku-jidai.com/Freesoft/Avidemux.html
Avidemuxの使い方｜avidemux.web.fc2.com
http://avidemux.web.fc2.com/
形式を変換（コーデック組み合わせについて）｜avidemux.web.fc2.com
http://avidemux.web.fc2.com/i/format.html
これを Giam で GIF変換。最適化/ウェイト10/同一パレット256色で吐き出したものは GIF(798KB)となった。
AVI ( 44KB)
GIF (798KB) 、、、、何この徒労感。
さて、テストアップロードしてみる。
tumblr.の制限は横500px縦700px、容量は500KBだったが今は1MBらしい（確かに GIF/1MB がアップロードされているが）。この条件に沿っているが結局 upload error となった。各所で GIF の容量を抑える記事を見ては試した。参考の動画像は230フレーム、12秒で何と 295KB ・・・遠い。
16:9 (500x281)/12sec/295KB なんて無理。MBいく。加工済動画10sec/396KBを削って7sec/44KB/avi、GIF加工で676KB。やはり素材＞ソフト加工＞ソフト吐き出しが最も軽量且つ画質劣化軽度。ソフト次第ってことじゃないか。とツイート。GIMP や AviUnitでの可能性も拝見はしたがトライする元気が無くなっていた。その後、再度ハウツー動画を観ていて回答となるものを見つけた。実に呆気ない結果がそこにあった。以下の youtube 動画を見て頂くと納得されるだろう。
How to Make a Cinemagraph： http://www.youtube.com/watch?v=lC8g6F7wHYE
Photoshop CS を使ったチュート。
飛ばして 7:45~以降、web用に保存する工程画面が映る。色数128色/横1280px 時で 3.68MB。これを横300px に縮小すると一気に 308.5KB まで落とす Photoshop CS Extended。やはりソフトが成せる技でもありそう。工程が少なければ容量は抑えられるとも結論ス。"Cliplets" が低容量＆良画質の動画像を吐き出すのと同じ。これが GIF変換搭載した処でフリー提供されるとは思わない。この辺世間は甘くないと感想。
諦めないでやってみる
500KB を目指すことにした。1MB制限は許された者の特権かも知れない。Giam は中々性能が良いと思うのでコレを活用する。フォトショやクリプレッツでやってるのは動く部分のトリミング、他はマスクだ。動かさない部分はそのまま透過させてポンっと吐き出してるんだろう。ひとコマ毎で追えば、この辺 Giamもキチンとやっている。ウェイト（待機時間）を触る。コマ毎に待機時間を設定出来る。ひとコマ目をウェイト500（とか1000とかに）に設定。動き出すまでのコマを削除する。始終時間が維持されたようにウェイトで調整し、472KBまで落とした。黒ツブ発生が防げないので256色。tumblr.に上げてみる。毎回時間が掛かるので「またかダメか」と思ったが何とかアップロードされて問題なく、シーーーン・・モソモソ・・している。「なんだ、500KBまでじゃん」と云う事で完了。さっさとフォトショを使えば良いのだろうけど、フリーソフトでも手が届く域だ。では、お世話になった Giam の紹介。
Giam｜furumizo氏
http://homepage3.nifty.com/furumizo/giamd.htm
今時の透明感ある UI ではなく無骨で操作画面サイズが固定なので見難さはある。黒ツブ発生は大体低容量化に発生。Giam で低サイズにするのでは無く、まず素材動画を見直す方が良い。Giam は軽快且つシッカリ編集してくれる役割と取ろう。フレーム/秒の設定でブラウザ毎に見栄えが違ってくる。Firefoxなら0.02～0.03秒でスムーズ素早く動いて見える（これはPhotoscapeのお陰）。Giam ではウェイト（待機時間）で表現する。Firefoxならウェイト4辺りが良いかも。他のブラウザではどうか分らないがガクガクになるならウェイト6辺り、という記事を拝見した。選択したコマ毎にウェイトや透過色を選択出来る。どのソフトよりも軽快で仕上がりは中々良い。
作業の流れ：Cliplets（シネマグラフ作成）＞ Avidemux（avi変換と軽量化）＞ Giam（最適化とコマ編集、再生時間の操作と調整、GIF作成）
他のフリーソフトを「使えない」と書いたが、使ったことでココに至る知識を得た。今回も中々いい経験でした。
補足：Blogger に GIF アップする時はクリボーさんのブログを参考にドウゾ。
http://www.kuribo.info/
おまけ
 |
| TM and © 2012 Fox and its related entities. All rights reserved. |
0 件のコメント:
コメントを投稿