ROスキンの作り方5(透過色の説明)
今回からスキンのそれぞれのウィンドウを作っていきましょう
スキンづくりで知っておきたい大事なこと
透過色(とうかしょく)について
ROスキンでは、時には表示したくない場所が出ることもあります。
どういうこと?って思ったひとは、このスキン画像を見てみてください。
ROスキンの作り方2でも出てきた、このnewskinさん。
newskinにまた画像を入れて反映してみようと思います。
この画像はなんでしょうか?
そう、前回配布したテンプレートの中のサインボードの画像です。ファイアアルパカでの編集中です。
これを、こんな風にめちゃくちゃなカラーに改造しちゃいます。
わ~すっごい最悪に目に悪い笑
わたし的にはありえないカラーリングなんですけど、説明のためにあえて目立つようにこういうのを作りました。
で、これをROの中で反映するとどういう風に映るんでしょうか?
こう映ります。
ナニコレ???ってかんじですよね。
ここで注目してほしいのが、ウィンドウの周りを囲っている
この青色の部分なんです。
明らかにこの囲いって、いらないですよね?
この青色の囲いが無かったら
こんな風にいつものちゃんとしたウィンドウが表示されます。
じゃあなんでこの
青色の邪魔な部分が表示されてしまうのかというと、この青色は透明に表示されないからなんです。色付きで邪魔な表示をされてしまいます。
そんなときは、この話のポイントである透過色(とうかしょく)の出番です。
(これスキン作りですごく重要なのでぜひとも覚えてくださいね)
透過色は、「表示したくない場所を透明にして消す」という役割を持っています。
どうすれば透過色を使えるの?
透過色は、ROのクライアントの仕様で、色が指定されています。簡単に言うと、ある決まった色をスキンに使うと自動的に色が無色透明になるんです。
その色は、赤:255 緑:0 青:255、#FF00FFの色です。
画像はファイアアルパカから切り取りました。
この色で画像を作ると、ROのゲーム内で反映時に無色透明になります。
この無色透明になるのを、スキン制作者は「透過(とうか)」と呼んでいます。
この透過色を使ってスキン画像を作るとしたら、
「表示したくないところ」を透過色で全部塗ります。
そうすると、こうなります。
作ったスキンの画像ファイルを見るとこうなっています。
表示したくない所(余白)をぜんぶ透過色で塗っています。これによって、スッキリスリムなウィンドウになって表示されるんです。
どうでしょう??
透過色が大事だってことが伝わりますでしょうか?
これはクイックショートカットスロットの画像です。
これも
こっちの丸バージョンだと角っこが丸まって、4隅に透過色が使われています。
スミッコが丸くなって見えるのは透過色でスミッコを消しているからなんです。
これで、ふんわりやわらかい雰囲気を出すことができると思います。
だいたいどのパーツでも使うことが多いから、これは覚えておくと画像制作ですごく役に立つと思います!(例えROじゃなくても、現実の画像制作でもね?)
おまけ
ボタンのほとんどに透過色使ってる・・・
次回はメインウィンドウとか、各パーツを詳しく作っていきます。