No.004 空を自分の好みの色に変える


* 以下の解説は「Vue 5 Esprit」を前提に書いています。


新規にVueで作品を作り始めるとき、皆さんはどうしているのだろうか。取りあえずVue起動とともに出て来たデフォルトの画面をもとに画面作りを始めるか、新規作成のボタンをクリックし出て来た大気テンプレートの中から自分のイメージに一番近いものを選ぶか、いずれかの方法でスタートするに違いない。

Vueに最初から用意されている大気のテンプレートには様々な種類のものがあり、多くの場合は、ここから選べば何とか間に合うのだろうが、例えば、空の色が頭の中のイメージと微妙にくい違うとか、緑色の空を作りたいといった場合には、自分で空の色をカスタマイズするしかない。今回は、この基本中の基本である空の色の変え方について解説してみたい。



● シーンの設定

実例にそって解説していくため、何はともあれ、まずはベースとなるシーンを作り、オブジェクトを配置しよう。




Vueを起動して、左上の「新規作成」アイコンをクリックすると、左のような大気のテンプレート画面が立ち上がって来る。これは毎度おなじみの画面のはずだ。


今回は、「デイタイム」の「基本」の中から、「暑い夏の日」を選んだ。
「暑い夏の日」を立ち上げて、「No.002」でライブラリに登録した「Vue」の立体文字を読み込んで配置した。

さて、これをもとに空の色を変えていこう。


● あらかじめ用意されているカラーバリエーションから色を選択して変更する

空の色を変更するのに私がよく使っている方法は2つある。一つは、あらかじめVueの中に用意されている天空カラーのバリエーションから色の組合せを選んで指定し変更する方法、もう1つは、全て自分で色を指定していく方法である。

まずは前者の、あらかじめ用意されているカラーバリエーションから色の組合せを選択する方法を紹介しよう。



Vueの画面の上段から「大気」をクリックし、表示された小ウィンドウから「大気エディタ」をクリックする。

大気エディタは重要なツールなので、多くの方にとってすでにおなじみであろう。



出て来た「大気エディタ」の中から「天空」のタブをクリックすると、左図のような画面が出てくるはずだ。

ここに表示されている「天空カラーマップ」(赤い丸で囲んだバー)というのが、空の色を表している。従って、ここを変えれば空の色が変わる。話はきわめて単純である。


では、この「天空カラーマップ」にマウスのカーソルを合わせて、ダブル・クリックしてみよう。


「天空カラーマップ」をダブル・クリックすると、左図のようなカラーマップ選択画面が表示される。

画面左のコレクションの欄に、いくつかにグループ分けされたカラーマップが収められている。色々あるので、ひととおり見てみればよい。


今回は「日没の空」から「レッド」を選んでみることにした。

まず、コレクションの欄から「日没の空」をクリックして、表示されたサムネイルから「レッド」を選択する。

「OK」を押せば、さきの「天空カラーマップ」に色が反映される。

では、レンダリングしてみよう。こんな感じで空の色が設定される。

ここでは、夕焼けに合わせて太陽の位置を左斜めに移動してある。空の色の変化は、天頂と地平線の差だけでなく、太陽の位置によっても変わる。色々試してみよう。



● 天空カラーマップで個別に色を指定して変更する

空の色を変更するもう1つの方法をご紹介しよう。

先ほど出て来た「天空カラーマップ」から、空の色を自分で一つ一つ指定していく方法である。こちらの方が、自分の好みに合った空の色にしやすい。



先ほどと同じように、大気エディタを呼び出し、「天空」のタブをクリックする。

今現在は「天空カラーマップ」に、さっき指定した「日没の空」の「レッド」が選択されている。

この「天空カラーマップ」にマウスのカーソルを合わせて、キーボードの「Ctrl」キーを押したままクリックする。


そうすると、左図のような「天空カラーマップ」のウィンドウが表示される。

一番上の色の組合せを示したバーの下に、小さなマルが3つ付いているのが分かるだろう(左図で赤いマルで囲った部分)。

このマルの付いているところで色が指定されている。左図では、一番右端のマルが選択されているが(黒マルになっている)、このとき、すぐ下の「現在の色」(赤い矢印で示したところ)にこの色が表示される。

各指定色の間は、自動的にグラデーションでつながれるようになっている。

つまり、空の色を自分好みに変えようとすれば、この指定された色を変えていけばよいということになる。




では、早速やってみよう。今選択されている一番右端の色から変えていく。

「現在の色」をダブルクリックすると、左図右側のような「色の選択画面」が出て来る。ここで、カラー表から好きな色を指定し、クリックすればよい。

順次、残りの指定色についても「色の選択」画面を呼び出して変えていく。



今回は、それぞれ左図のように色を指定して、緑色の空を作ることにした。

ちなみに色の指定箇所は、「天空カラーマップ」の一番上のカラーマップ上で、

@好きな場所をダブルクリックするか、

A好きな場所でクリックし、下の囲みの「新規キーカラー」のアイコンを押す、

のいずれかの方法で増やしていくことができる。

なお、消すときは、既にある色指定箇所を選択して、下の囲みの「キーカラー削除」をクリックすればよい。




新たに作ったカラーマップをもとにレンダリングし直せば、このとおり、空が緑色になった。

簡単でしょ?




Back to Top Back to Home