BallPicture－Torii

　　アニメーション動画　「BallPicture」シリーズ－「Torii」

「BallPicture － Torii」は、３Ｄ画面内に配置した大鳥居と百本鳥居の周囲、もしくは中で、Ball を動かすアニメーション動画です。
百本鳥居は、伏見稲荷大社の千本鳥居をイメージして作成しました。

この動画は、YouTubeで公開しています。

　動画の作成方法

1．開発環境
IDE ： Visual Studio 2010 Professional Edition － WPF（C#）
.NET Framework ： .NET Framework 3.5 Client Profile

2．Ballの構成方法
「David Sackstein's Blog」で紹介されている SphereMeshGenerator クラスを使って、Ball の３Ｄオブジェクトを作成しました。
その Material に自作の画像ファイルを読み込んで、Ball を作成しました。

3．鳥居と通路の構成方法
鳥居と通路は、３Ｄモデリングソフト「 Metasequoia 4 」で３Ｄオブジェクトを作成し、そのデータファイルを、アニメーションツール「 Identity 」で XAML 形式へ変換して、WPF のプロジェクトに取り込みました。
「 Metasequoia 4 」で通路を作成するときに、通路の各点の３Ｄ座標をデータファイルに書き込んでおき、百本鳥居が通路の所定の座標位置に配置できるようにしました。
また、百本鳥居内の Ball 回遊アニメーションの設定時にも、その３Ｄ座標データが利用できるようにしました。

4．BGM
BGMには、フリー音楽素材サイト H/MIX GALLERY の『 SpringWalk 』を使用させていただきました。

　動画の構成

1．動画の基本的な構成
この動画の前半部では、大鳥居の周辺で回遊する Ball の様子を捉えて描画します。
後半部では、百本鳥居（実際には 158 本）の中を通過する Ball の様子を、カメラが追従して描画します。
前半部、後半部を通じて、Ball の自転は（ 1, 1, 1 ）軸を中心として行いました。

2．Ball の導入部
　
大鳥居の奥から Ball を登場させます。
また、画面に変化をもたせるために、視点（カメラ）の位置を変更します。
Ball のアニメーションは、TranslateTransform3D の DoubleAnimation で、カメラのアニメーションは、AxisAngleRotation3D の DoubleAnimation で、行いました。

3．大鳥居笠木部への Ball 移動
　
Ball を大鳥居の笠木部へ移動します。この際、カメラの位置も移動させます。
Ball のアニメーションは、Ball の軌跡を試行錯誤でデータ化した後、このデータを用いて作成した DoubleAnimationUsingKeyFrames を Ball の TranslateTransform3D に適用して行いました。
カメラのアニメーションも、Ball の方法に準じて作成した DoubleAnimationUsingKeyFrames をカメラの TranslateTransform3D に適用して行いました。

4．大鳥居笠木部での Ball バウンド
　
Ball を大鳥居の笠木部上でバウンドさせながら、左右に移動します。
Ball のアニメーションは、Ball の軌跡を放物線軌道でデータ化した後、このデータを用いて作成した DoubleAnimationUsingKeyFrames を Ball の TranslateTransform3D に適用して行いました。
カメラについてもアニメーションを行っていますが、前項の延長線上の処理なので、記載は省略します。

5．大鳥居島木部－貫部間での Ball の回遊
　
大鳥居の島木部－貫部間の空間で、Ball を左右に回遊させます。
Ball のアニメーションは、Ball の軌跡を円軌道でデータ化した後、このデータを用いて作成した DoubleAnimationUsingKeyFrames を Ball の TranslateTransform3D に適用して行いました。

6．大鳥居笠木部－貫部周囲での Ball の回遊
　
大鳥居の笠木部－貫部周囲で Ball を回遊させた後、笠木部上空で自転以外の動作を停止します。
Ball のアニメーションは、Ball の軌跡をらせん状の軌道でデータ化した後、このデータを用いて作成した DoubleAnimationUsingKeyFrames を Ball の TranslateTransform3D に適用して行いました。

7．大鳥居笠木部上空の Ball 背面へのカメラ移動
　
大鳥居の笠木部上空で自転している Ball の背面にカメラを回り込ませます。
このアニメーションは、カメラの Position プロパティと LookDirection プロパティのアニメーションで行いました。
Position プロパティのアニメーションは Point3DAnimationUsingKeyFrames を使って、LookDirection プロパティのアニメーションは Vector3DAnimationUsingKeyFrames 使って行いました。

8．百本鳥居入口部への Ball の移動
　
Ball を百本鳥居入口部へ移動させます。
Ball のアニメーションは、Ball が適正な軌跡をたどるように試行錯誤でデータ化した後、このデータを用いて作成した DoubleAnimationUsingKeyFrames を Ball の TranslateTransform3D に適用して行いました。
カメラについては、Ball －カメラ間の距離が適正範囲に入り、かつカメラが常に Ball の方向を向くように、Position プロパティと LookDirection プロパティのアニメーションを設定しました。

9．百本鳥居内の Ball の回遊
Ball を百本鳥居内の通路上で前進させ、途中の分岐点を右に折れた後、頂上位置（「 TOP 」）まで坂道を登ります。
頂上位置で Ball を一回転させた後、坂道を下って、最終地点（「 FINISH 」）へ到達します。
この Ball のアニメーションは、通路の３Ｄ座標データをもとにして、所定の時間に所定の位置に Ball が配置されるように DoubleAnimationUsingKeyFrames を作成して行いました。
カメラのアニメーションは前項と同様に行いました。

この工程のスクリーンショットを以下に紹介します。

　
　
　
　
　