• LCARS ってなに?
    “LCARS”の基礎知識。

  • オクダグラムってなに?
    “オクダグラム”の基礎知識。

  • LCARS ミュージアム
    LCARS の進化の歴史。

  • LCARS デザインガイド
    LCARS っぽく見せるためのちょっとした“コツ”教えます。

  • サウンドコレクション
    コンピュータ音声のダウンロード。

  • LCARS アニメーション
    Flash で作った LCARS アニメーションのダウンロード。

  • オクダパネル
    ついにオクダパネルを自作。その製作方法を紹介。

  • LCARS ダイアログ
    LCARS と人間との会話シーンの音声コレクション。

  • LCARS ギャラリー
    身の周りには LCARS がいっぱい!

  • リンク集
    世界の LCARS デザインなサイト達。

  • コンタクト
    質問・要望等はこちらからどうぞ。

HOME LCARSアニメ製作マニュアル 第 9 回 基本テクニック c
ここではLCARS フラッシュアニメーションにあるようなフラッシュを使ったLCARS アニメーションの作り方を紹介します。

9. 基本テクニック c

画面切り替え(モザイク)

左の拙作 LCARS No.054 [Nemesis Topographical Scan] を未見の人は、まずはダウンロードして再生してみてください。

地形が左のほうへ動いていって違う画像に切り替わるとき、モザイク処理が行われているのが見て取れると思います。 ここでは、この “モザイク切り替え” をどうやっているのかを説明していきます。

なんか難しそうな感じも受けるでしょう。 もちろん ActionScript なんてのは使ってませんよ。 なんの事はありません。 グラフィックソフトでモザイクの強度を変えた画像を作っておき、それをただ単純に並べるだけなのです。

この 2 枚をモザイク切り替えする

前々回(P9a キャプチャ画像を利用する)の例 2 のところで修正した地表画像。 これはそれぞれ違う α, β, θ の 3 種類ある(便宜上名前を付けた)のですが、このアニメーションでは α から β (左の画像の 2 枚)へのチェンジです。

グラフィックソフトのモザイクツール

モザイクツールでモザイクを掛けていきます。 グラフィックソフトによってウィンドウ画面等は違いますが、モザイクというのはどのグラフィックソフトにも備わっている機能だと思います。

α、β 2 枚の画像にそれぞれモザイクの強度を変えた 3 枚の画像を作ります。 今回は縦幅・横幅共に 4px, 6px, 8px でモザイクを掛けてみました。

まず、これが α 画像 4 枚。

元画像(無処理) モザイク幅 4 モザイク幅 6 モザイク幅 8

次に、これが β 画像 4 枚。

元画像(無処理) モザイク幅 4 モザイク幅 6 モザイク幅 8

もちろん、モザイクのピクセル幅数はこの数値にこだわる必要はありません。 例えばモザイクのピクセル数を 2, 4, 6, 8, 10 などと 5 枚作ってもいいわけです。 多くすればするほど、見かけ上滑らかになりますね。 今回は効果音とのタイミングと切り替えスピードから、このような 3 種類を選んだわけです。

キーフレームに沿って並べる

さて、あとはキーフレームに沿って並べていけばいいだけです。 順番は以下のようになりますね。

  1. α の元画像(無処理)
  2. α モザイク幅 4 px
  3. α モザイク幅 6 px
  4. α モザイク幅 8 px
  5.  

  6. β モザイク幅 8 px
  7. β モザイク幅 6 px
  8. β モザイク幅 4 px
  9. β の元画像(無処理)

これを再生すると・・・

このページのコンテンツには、Adobe Flash Player の最新バージョンが必要です。

Adobe Flash Player を取得

こうなるわけです!