2013年06月17日

Flashで3D! その1

開発部だより 第204回


こんにちは。
そろそろ気温も上がり始め、冬に買い溜めしたチョコレートが溶けないか不安な日々を送る、開発部Blackです。
溶ける前に消費しきらねば!

さて、恥ずかしながら、つい最近までFlashの3D機能を使ったことがありませんでした。
しかし、使ってみると意外とおもしろかったので、今更ですがご紹介したいと思います。

Adobe Flashに3D機能が追加されたのは、CS4のバージョンからです。
3Dといっても、疑似的な3Dです。
いきなり3D的なオブジェクトを作れるのではなく、自分でパーツを組み立てて3Dにする感じです。

主な作業手順:
・矩形ツールで正方形を描画し、ムービークリップに変換します
 (今回は各辺を100pxの正方形にしました、塗りは透けて見えるようアルファを50%にしてあります)
・さらにそれをムービークリップに変換します
 (一つの立体ムービークリップ内に6つの面ムービークリップを入れてあります)
・面の数分のレイヤーを作成し、各レイヤーに面ムービークリップを配置します
 (この時、展開図の形にしておくと組み立てやすいです。また、レイヤーの重ね順通りになるので注意します)
cube_01.jpg


・3D回転ツールで、各面に基準点を設定します
cube_02.jpg

・変形の「3D回転」で各面に角度をつけます
 横面:Y軸を90°、-90°
 縦面:X軸を90°、-90°
 フタ、底になる面:プロパティの「3D位置とビュー」のZ軸を面の大きさにします(手前に来る面を-100に設定/奥にする場合は100px)
cube_03.jpg

・立体が組み立てられたら、メインのタイムラインに戻り、立体のアニメーションを設定します
 モーショントゥイーン、3Dトゥイーンを設定し、モーションエディタで好きに角度を設定します







これで、このような立体が回るアニメーションが作成できました。

このサンプルのように、360°ぐるぐると回転させるとレイヤーの重ね順の問題で別の面の線が見えてしまうので、大きく回転させる場合は骨組みのように常に中が見える状態だと良いと思います。
posted by 開発部Black at 15:32
開発部だより | コメント(0) | トラックバック(0)
この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック