3
0

Effekseerを使って案内や看板を作る!

Last updated at Posted at 2023-12-17

はじめに

Vキャスでルームを作成する際、スタジオとは異なり、作製主が居ない状態でご覧いただくこととなるため、案内や看板が必要となる場面が多くなるかと思います。
Vキャスには、画像やPDFからアイテム化できる優秀な機能があるため、簡単に案内や看板を作製することができますが、プレートに画像を貼った簡素な状態となります。
ここでは、簡素な案内や看板から、ちょっとリッチな状態にグレードアップするために、Effekseerを使った案内や看板作りをご紹介します。

コンセプトを考える

今回は、こちらのエフェクトを例に挙げて、説明していきます。
ダウンロード (4).gif
こちらのエフェクトは、ルームのVCIすべてローディングされるまで、その場で待っていただくためのエフェクトになります。
待っていただくための仕組みはこちらをご参照ください。

このエフェクトの役目は、

  • VCIがローディング中であることを伝えること
  • ルームの雰囲気を阻害せず、エフェクトの下の注意文を読んでいただくこと

です。

そうすると、作りたいエフェクトイメージがおおよそ決まってきます。

  • ルームや音楽に合わせて、文字の動きは小さめに、また、ゆっくりと。文字の色もルームの色と同系色に。
  • ただし、注目してもらうために、目を引くものを使う(今回は黄色い星)
  • エフェクトには、注意文と関係性のある星のエフェクトを使う

こんな感じで、エフェクトのイメージが出来上がったら、実装していきます!

エフェクトの構成

文字幅に注意が必要なプロポーショナルフォント

文字のエフェクトを入れる際には、文字の”それぞれ”の横幅に注意しなければなりません。
例えば、下の画像の「I」は横幅がかなり小さいですが、その左右の「D」や「N」は縦と同じくらいの幅があります。
これを知らずに文字を等間隔に並べると、バランスの悪い文字列になってしまいます。
フォントには、実はプロポーショナルフォントというものがありまして、「MSゴシック」と「MS Pゴシック」というように「P」が付くものがプロポーショナルフォントにあたり、文字ごとに文字幅を個別に設定しているフォントになります。
プロポーショナルフォントを、等間隔に並べてもバランスが悪くならない場合もありますが、基本的にはバランスがよく見えるように文字ごとに文字幅を設定しているので、この文字幅を守ったまま文字の配置を行ったほうが綺麗に見えます。
ペイントソフトなどから出力した文字画像と、エフェクトとして使うように文字を等間隔に並べた画像を、それぞれ準備し、文字画像をベースにエフェクトの文字の位置調整をしていくとよいです。
image.png

文字のアニメーション

文字をアニメーションさせる際、最後、もしくは、途中で、文字のアニメーションを止める必要があります。(文字を読んでいただく必要がありますので。)
今回は、黄色の光の玉が横切ると、NOW LOADINGの文字がクルクルと回転・減速・停止し、文字列が表示されるというエフェクトにしています。
Fカーブを使う方法もありますが、Fカーブは使いにくいので、回転・ブレーキをかけて減速させるエフェクト停止させたエフェクトをそれぞれ準備してエフェクトを表現します。
例えば、「N」の文字のエフェクトですと、「N」と「Nstop」がそれぞれ、それにあたります。
これをすべての文字で準備します。
参考までに、「N」の回転・減速・停止までのエフェクトの設定値を載せておきます。
これで、100フレームかけて回転が停止するエフェクトとなります。
スクリーンショット (165).png

エフェクト用の画像の準備

エフェクト用の画像は、それぞれの文字を別個に準備してもいいのですが、ひとつの画像にまとめて管理しやすいようにしましょう。
文字の参照にはUV機能を使うので、1枚の画像に文字を等間隔に並べる必要があります。
優秀なペイントソフトなどでは、そういった機能があるのかもしれませんが、自分はフリーソフトしか持っておらず、綺麗に並べそうになかったので、ブラウザのツールを使いました。
一応、使用したツールのリンクを置いておきます。
こちらのツールを使用して、横幅に違いがある文字に空白を入れて、すべて500x500となるようにしました。

案内や看板用のエフェクトならスクリプトはいらない!(場合が多い)

ここまで読んで頂いた方の中で、もしかしたら、スクリプト何もわからん!という方もいるかもしれません。
そんな方には朗報です!
案内や看板用であれば、エフェクトは常にONの場合が多いので、そういった場合にはスクリプトを書く必要はありません。
というのも、エフェクトはVCIを読み込んだ際に再生されてしまうので、以下の画像のように、「Effekseer Emitter」をオブジェクトにつけ、エフェクトを入れ、「Is Looping」にチェックを入れるだけで、常に繰り返し再生されるようになります。
image.png

おわりに

これで、あなたのルームにも、エフェクトを使った少しリッチな案内や看板を飾れるようになりました!
エフェクトは見えているだけでも、楽しいものですので、みなさんのルームにもオリジナルのエフェクト案内や看板を是非飾ってみてくださいね!

3
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0