Webサイトからアニメの抜取り → 分解 → Flash へ変換 (安倍) 07/12/29
Flashファイル(.swf )はスマホに対応しないので、MP4などの他のファイル形式に変換する必要がある。
アニメの抜き取り |
・ 一般のGIFアニメ
下図のように、位置を殆ど変えずに動くアニメは大部分「GIFアニメ」です。 これは一般画像と同じく
画像を右クリック → 「名前をつけて画像を保存」で分離できます。
・ PowerPoint 内のGIFアニメ
PowerPoint 内のアニメも殆ど
GIFアニメです。
部品画像を選択 → 画像枠を適当に移動 → 「画像として保存」で分離できます。
・Flashアニメ
ネット広告に使われているアニメの殆どがこれです。画面全体が動くFlashアニメ(ページ下の図)の場合は、専用のフリーソフトを使って分離します。
・JAVAアニメ
JAVAのような複雑な動きのアニメ の場合は、ソースコードからファイル名(.class)を調べ、そのパスをURL に入れて分離しますが、ソースコードの知識が必要なのでここでは省略。
GIFアニメの画像分解 |
GIFアニメソフトによって操作は違いますが、HomepageBuilder 付属 WEB アニメーターの場合
GIFアニメ読込み後、各フレームを右クリック → 「フレームの保存」
で各分割画面が保存できる。 上の犬の場合6枚、馬の場合7枚の画像が保存される。
分解画像をFlashに読込み、GIFアニメと同じ動きをFlashに変換 |
1)Flash(Adobe)の場合 :
・分解された画像をライブラリに読込み。
・GIFアニメの動きをそのままFlash変換。
・ 「シンボル」として保存。
2)FlashMaker3の場合:
・分解された画像を c:\Program Files\FlashMaker3\parts にコピー。
・これを使って、 GIFアニメの動きをそのままFlash変換。
・「ファイル」→「クリップとして保存」する。
クリップファイルの名前は、***.fmc という名になる。
3)WebEffect の場合:
・このソフトの場合、GIFアニメは分解せずにそのままインポートしてFlash加工できる。
即ち、既存のGifアニメを利用してFlashを作成する場合はこのソフトを使うと便利である。
移動するFlashを作成 |
1)Flash(Adobe)の場合 :
・ ステージに、上記「シンボル」を配置して 移動するFlashを作成する。
2)FlashMaker3の場合:
・編集画面のメニュー 「クリップ」で、クリップファイルを読み込むと画面下のメニュー「クリップリスト」内に表示されるから、これを編集画面にドラグして移動するFlashを作成する。
3)WebEffect の場合:
・Gifアニメをそのままインポート
以上で冒頭の犬が疾走するFlashができる。
さらに、画像を分解、再構成する |
画像ソフトを使って、下図のように馬を部品に分け、角度を変えて再構成すると、いろいろなアニメができる。
馬のGIFアニメからFLASH変換で動きを加えた
さらに、4本足の他、頭部の上下動、尾の動きを加えて走る姿へ変換した例
背景をスクロールさせる方法 |
背景画像をスクロールさせるには
横長画像(パノラマ)をスクロール
アニメで背景をスクロールさせる応用例
このページで使用したGIFアニメ ソフト: HomepageBuilder付属 WEB アニメーター
| Flashの基本 | ホームページ作成体験 |