テラシュールブログ

旧テラシュールウェアブログUnity記事。主にUnityのTipsやAR・VR、ニコニコ動画についてのメモを残します。

【Unity】低解像度に設定したRenderTextureを使いつつ、クリックした位置にキャラクターを動かす

f:id:tsubaki_t1:20170718221658g:plain

今回はRenderTexturerを使用しつつ、クリックした位置にRayを飛ばし移動させるアプローチについて色々と見てみます。

低解像度なRenderTextureでゲームを描画する

ゲーム画面を低解像度に設定する為にRenderTextureを使うのは良いアイディアの一つです。このアプローチを使えばUIは高解像度のままハイクォリティで描画不可の高いシェーダーやポストエフェクトを割りと安く使用できます。

個人的な考えで言えば、モバイルのような小さな画面で軽いシェーダーをFHD(1920×1080)で描画するより、リッチなシェーダーをHD(1280×720+MSAA)で描画するほうがハイクォリティと見られるんじゃないかって気がしてます。*1

 

f:id:tsubaki_t1:20170718224401j:plain

低解像度StandardShader vs 高解像度Mobile Shader

 

ただ、画面全体を低解像度化するとUIが低解像度になります。低解像度なUIはエッジ部分が目立ってしまうので余りやりたくない事の一つです。特に文字が目立ちます。

ので、描画負荷の上がりやすいゲーム画面は少し低解像度で、エッジの見えやすいUIは高解像度で描画するアプローチを使います。

f:id:tsubaki_t1:20170718223246j:plain

Camera.main.ScreenPointToRayがおかしくなる

さて、このアプローチを行った場合Camera.Main.ScreenPointToRayの値がおかしな値を返して来ます。
例えば下のようなコードです。640x480の画面に対して320x240のRenderTextureを使用して描画していると、クリックの位置に向かうはずが、違う位置で動いてしまっています。

var ray = Camera.main.ScreenPointToRay ( Input.mousePosition);
if (Physics.Raycast (ray, out hit)) {
    agent.SetDestination (hit.point);
}

f:id:tsubaki_t1:20170718224928g:plain

 理由はシンプルで、Input.MousePositionはフル解像度の位置を示していますがRenderTextureで画面は縮小されているので、位置がズレています。

Input.MousePositionの位置を補正してやる

思いつく解決方法は二つ。Input.MousePositionの位置を補正してやるか、ViewPort座標を使用するかです。
今回は手っ取り早い解決法でViewport座標を使用してみます。

 

Input.MousePositionで取得した位置をScreenのサイズで割り、位置を0~1の値に正規化します。後は、正規化したInput.MousePositionの座標を使用してViewportPointToRayでRayを生成、Raycastに与えます。

 

下のコードでは、cursorに動かしたいオブジェクト、rtCameraにRenderTextureをセットしたカメラを指定すると、低解像度化したRenderTextureを使用してもマウスの位置までCursorを動かしてくれます。

gist.github.com

f:id:tsubaki_t1:20170718231109g:plain

tsubakit1.hateblo.jp

関連

tsubakit1.hateblo.jp

tsubakit1.hateblo.jp

tsubakit1.hateblo.jp

www.slideshare.net

*1:ちなみに最近のスマホは「解像度を変更できる」機能があったりするみたいです。galaxys7とか

【Unity】"Default Playables"で、VideoPlayerやTextをタイムラインで制御したりFadeoutやTweenしたり

f:id:tsubaki_t1:20170714204325j:plain

Timelineのサンプルが公開されました。

Default Playablesの入手

UnityのTimelineに、幾つかのサンプルPlayableを追加するアセットが公開されました。

以下のURLからダウンロードできます。

https://www.assetstore.unity3d.com/en/#!/content/95266

 

なお、サンプルシーンは含まれません。マニュアル(英語)も中途半端なので、Timelineの使い方を覚えてから見る事をお勧めします。

Default Playablesで出来ること

割とあったら便利機能が含まれてます。

何故これをエディターに含めなかったし

VideoPlayerのTimeline制御

任意のタイミングで任意のClipを再生する事ができます。挙動的に複数のムービーのフェード切り替えも出来るハズですが、うまく動作しませんでした。

f:id:tsubaki_t1:20170714210745g:plain

tsubakit1.hateblo.jp

LightのTimeline制御

ライトの色や輝度、範囲を指定出来ます。

f:id:tsubaki_t1:20170714210831g:plain

なお、Lightmapにauto generateが付いてると物凄い勢いでライトの再構築が走るので、auto generateは外しておくが吉です。

まぁ、auto generateはシーン読込時に読まれない致命的なバグ(Unity5リリース時からある)があるので、殆どの人はdisableにしてると思いますが。

シーケンスのタイミング内にある時にSetDestinationしまくるだけです。

TimelineのPreviewも使えず、移動中に向きが変わると移動が破綻します。

TextSwitcher

指定したタイミングで指定した文字にテキストを切り替えます。字幕等の制御に使えるかもしれません。

色とサイズをフェードする事が可能ですが、この方法でフォントのサイズをフェードすると、一瞬でフォントテクスチャの再構築が走るので、サイズのフェードは使ってはいけません(モバイルは)

f:id:tsubaki_t1:20170714212728g:plain

tsubakit1.hateblo.jp

Transform Tween

オブジェクトのTween制御です。

開始点・終了点を指定するとTweenしてくれる他、シーケンスを混ぜることで2つのTweenの中間点を行ってくれます。要するに下のようにカーブします。

Timelineの謎仕様の一つである「一つ前のシーケンスを取れない(取れるには取れるが物凄い大掛かりになる)」により、全てのシーケンスに開始点と終了点をセットする必要があります。

f:id:tsubaki_t1:20170714213248g:plain

tsubakit1.hateblo

ScreenFader

UIの色を変えます。

UIのImageを画面全体に設定しておくと、フェードっぽい事が出来ます。

但し、Imageの値を操作しているので「UIの再構築」が普通に走ります。本当はこれはCanvasGroup(UIの再構築が走らず、α 0でUIが消える)でやるべきなのですが…

色指定でのフェードなので、フェード先の色は自由に決められます。

f:id:tsubaki_t1:20170714214129g:plain

Time Dilation

TimeのSpeedを制御します。Fixed Time stepを操作しないので、物理演算が入っていると酷い絵になります。

一応フェードも可能なので、ゆっくり時間の速度を戻すことも期待出来ます。

f:id:tsubaki_t1:20170714213932g:plain

tsubakit1.hateblo.jp

感想

いくつか微妙な所もありますが、サンプルとしては分かりやすいかもしれません。幾つかのサンプルはゲームを再生しないと動かないので、実際に使うのはかなりシンドイかもしれません。

今回はParticleの制御は含まれていませんでしたが(フォーラムで公開されてる)VideoPlayerのTimeline制御は、実際かなり良い所をついていると思うので、とても期待があります。

関連

www.youtube.com

【Unity】Unite Europe 2017の動画が公開

Unite Europe 2017の動画が公開されました。

ちなみに内容は英語です。

動画

www.youtube.com

内容

英語だとパっと見たいものが見つからないかもなので、簡単にGoogle先生に翻訳してもらった物を少し調整した物を置いておきます。

  • VRefugees - Building empathy for refugee journeys through VR
    VRefugees - VRによる難民の旅の共感を構築する

  • State of play: Modern game development
    遊びの現状:現代ゲームの開発

  • Get the most out of Vulkan and MGD in Unity 5.6
    Unity 5.6でVulkanとMGDを最大限に活用する

  • Latest Samsung immersive technologies empowering Unity devs
    Unityデベロッパーに力を与える最新のSamsung の没入型テクノロジー

  • How Unity's Serialization system works
    Unityのシリアライゼーションシステムのしくみ

  • Extending Timeline with your own playables
    独自のPlayableでTimelineを拡張する

  • War Child: How gaming is changing children's lives
    戦争の子供:どのようにゲームは子供の生活を変えている

  • Visualizing geospatial big data in Unity
    Unityで地理空間のビッグデータを視覚化する

  • Bake it 'til you make it: An intro to Lightmaps
    Lightmapsの紹介

  • Protecting your games from threats
    ゲームを”脅威”から守る

  • Native video playback in Unity
    Unityでネイティブビデオ再生

  • See how Cinemachine can revolutionize your cameras
    CinemachineがCameraに革命を起こす

  • A walkthrough of Morph 3D character creation
    Morph 3Dキャラクター作成のウォークスルー

  • Designing AR experiences in real environments
    実環境でのAR体験の設計

  • Photon vs UNet: multiplayer architecture explained
    Photon vs UNet:マルチプレイヤーアーキテクチャの説明

  • Squeezing Unity: Tips for raising performance
    Squeezing Unity:パフォーマンスを高めるためのヒント

  • Building a better Unity
    Unityを良くする方法

  • The AAA graphics of Spellsouls: achieving 60FPS on mobile
    Spellsouls:モバイルでAAAグラフィックスを60FPSで

  • Beyond novelty: Creating compelling VR content
    Beyond novelty:魅力的なVRコンテンツを作成する

  • The potential of Unity WebGL with AirConsole
    AirConsoleを使用したUnity WebGLの可能性

  • Build your team with Unity Connect
    Unity Connectでチームを作る

  • Breathing life into physical objects through AR
    ARを通して物理的なオブジェクトに命を吹き込む

  • Shadow Fight 3: forming a style
    Shadow Fight 3:スタイルを形成する

  • VRTK - Making VR development easier for all
    VRTK - すべての人に、簡単にVR開発を

  • Building native games for Facebook Gameroom
    Facebook Gameroomのネイティブゲーム開発

  • Every millisecond counts: How to render faster for VR
    Every millisecond counts:VRレンダリングの高速化

  • Optimizing our Workflow for Lightfield
    Lightfieldのワークフローの最適化

  • Steam platform overview and upcoming store updates
    Steam プラットフォームの概要と今後のストアの更新

  • The Unity particle system: features and tips
    Unityパーティクルシステム:機能とヒント

  • Creating interactive 360 experiences in Unity
    Unityでインタラクティブな360体験を作成する

  • Deep dive into Git and Git LFS
    GitとGit LFSの深淵

  • C# job system & compiler
    C#Job Systemとコンパイラ

  • Assault Android Cactus postmortem
    アサルト・アンドロイドカクタスのポストモーテム

  • Looking back at Arizona Sunshine
    Arizona Sunshineを振り返る

  • VR Techniques, Tips and Tricks
    VRテクニック、Tips & Tricks

  • How to be a resourceful Unity developer
    便利なUnity開発者になる方法

  • Let's build an EditorVR tool together!
    EditorVRツールを一緒に作りましょう!

  • How Futureplay's F2P mobile games soared
    FutureplayのF2Pモバイルゲームがどのように急増したか

  • Character to player: a 12-step program
    キャラクターからプレイヤーへ:12ステップのプログラム

  • VR and AR applications in car development
    車開発におけるVRおよびARアプリケーション

  • The Real-time VFX of Spellsouls
    SpellsoulsのリアルタイムVFX

  • Practical guide to profiling tools in Unity
    Unityにおけるプロファイリングツールの実践ガイド

  • Making a business case for HoloLens: dev & sales
    HoloLensのビジネスケースを作る:開発とセールス

  • Use Timeline and Cinemachine to mix game & cutscenes
    Timeline とCinemachine を使ってゲームとカットシーンをミックスする

  • AR prototyping for the HoloLens with Unity
    Unityを使用したHoloLensのARプロトタイピング

  • Can VR enhance myoelectric prosthetic training?
    VR筋電義手レーニングを強化できますか?

  • Finding the path: New navigation features
    パスの検索:新しいナビゲーション機能

  •  Building an easy to use menu system
     使いやすいメニューシステムの構築

  • 10 tips to monetizing games to millions across SEA
    SEAでゲームを収益化するための10のヒント

  • Streamlining Game Development with Unity Teams
    Unity Teamsによるゲーム開発の合理化

  • Overview of Timeline & Cinemachine
    Timeline とCinemachineの概要

  • Performance optimization for beginners
    初心者のためのパフォーマンスの最適化

  • Multi-scene editing in Unity for FAR: Lone Sails
    Unity for FARのマルチシーン編集:Lone Sails

  • How we got GoNNER on Nintendo’s latest console
    任天堂の最新コンソールでGoNNERを入手した経緯

  • What's new from Daydream and Tango
    Daydream とTangoの新機能

  • Shadow Tactics: Blades of the Engine
    Shadow Tactics: Blades of the Engine

  • Making Lions Dance: Wooga’s workflow and tools
     メイキングLions Dance:Woogaのワークフローとツール

感想

こう見ると、Timeline とCinemachineは結構推してますね

関連

ちなみにUnite 2017 Tokyoの動画も公開されてます。

www.youtube.com

 

【Unity】パーティクルのテクスチャアニメーションをSpriteで行う

f:id:tsubaki_t1:20170711233742g:plain

今回はUnity 2017.1で搭載された「Particle Animation」のスプライト版についてです。

Spriteのパーティクルアニメーション

 Unity 2017.1より、パーティクルアニメーションにSpriteが使用できるようになりました。

使用できるのは同一のAtlasに格納されているSpriteのみといった制限がありますが、Spriteの順番の一部を変更したり、パーティクル用のアニメーションをSpriteから作成出来たりと、割と良い感じです。

f:id:tsubaki_t1:20170711234645j:plain

細かいパーティクルの順番制御が可能に

順番にスプライトを指定する事で、アニメーションの順番制御…だけでなく、一枚のテクスチャから複数のパターンを作り出す事が可能になりました。

例えば爆発でも、そのまま爆発する物、一瞬収束して爆発するもの、爆発する際に破片を飛び散らせる物、肉片を飛び散らせる物等色々あるかもしれません。

 

今まで使用してきたGridベースののアニメーションは、テクスチャをX/Yで分割しUV移動でアニメーションを実現してきた為、上のような細かい制御は出来ませんでした。

f:id:tsubaki_t1:20170711234221j:plain

しかしSpriteベースのアプローチでは、設定するSpriteを差し替えるだけなので、割と柔軟にスプライトの差し替えが期待出来ます。

オーバードローの抑制

パーティクルで問題になりやすいのが、オーバードローです。

Gridベースのアニメーションは透明抜きは出来ずグリッドで指定した範囲を全て描画するので、特に「小さい火種から大きな爆発に至る」ようなパーティクルは非常に高コストで描画する必要がありました。

f:id:tsubaki_t1:20170712000328j:plain

Spriteベースではポリゴンごと差し替える処理が入るので、その辺りは非常に低コストで実現出来ています。

下の絵は上の絵と同じような構成のパーティクルですが、アルファで抜かれている部分(特に小さな火種のタイミング)では描画面積は小さく抑えられており、フィルレートをかなり節約出来ている事が伺えます。

ポリゴンではなくQUADなのは、パーティクルのアップロードコストを下げるためのように思います。MeshでやるとUploadが凄いことになりますし

f:id:tsubaki_t1:20170712001203j:plain

f:id:tsubaki_t1:20170712001526g:plain

設定方法

  1. Texture Sheet AnimationのModeをGridからSpritesへ
  2. +ボタンを押してセットするSpriteのスロットを追加
  3. Spriteを登録

f:id:tsubaki_t1:20170712001753j:plain

関連

tsubakit1.hateblo.jp

tsubakit1.hateblo.jp