質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Unity3D

Unity3Dは、ゲームや対話式の3Dアプリケーション、トレーニングシュミレーション、そして医学的・建築学的な技術を可視化する、商業用の開発プラットフォームです。

Unity

Unityは、Unity Technologiesが開発・販売している、IDEを内蔵するゲームエンジンです。主にC#を用いたプログラミングでコンテンツの開発が可能です。

Q&A

解決済

2回答

2549閲覧

特定のオブジェクトを目立たせる演出の実装

SeiSeis

総合スコア12

Unity3D

Unity3Dは、ゲームや対話式の3Dアプリケーション、トレーニングシュミレーション、そして医学的・建築学的な技術を可視化する、商業用の開発プラットフォームです。

Unity

Unityは、Unity Technologiesが開発・販売している、IDEを内蔵するゲームエンジンです。主にC#を用いたプログラミングでコンテンツの開発が可能です。

0グッド

1クリップ

投稿2020/07/18 15:47

編集2020/07/19 02:16

現在スマートフォンのアクションゲームで、プレイヤーに画面上にある特定のオブジェクトがタッチできることを知らせるようなエフェクトを実装したいと考えています。

エフェクトの方針としては、↓画像のようなタッチできる特定のオブジェクトの後ろにパーティクルを発生させる、というものを考えています。
イメージ説明

3Dのパーティクルを実際のシーンに置くにあたり、ここで問題が起こります。
例えば後ろに壁等がある場合、壁にエフェクト対象オブジェクトが密着していた場合、↓画像のようにパーティクルがめり込んでしまいます。
イメージ説明

そこで、パーティクルとエフェクト対象オブジェクトのレイヤーを変更し、それのみを移すカメラを用意して実装しようと考えたのですが、そうするとどんな状況でも壁を貫通してしまい、画面上で不自然に描画されてしまいます。
イメージ説明
イメージ説明

実装したいイメージとしては、ゲームでよくあるゲームオブジェクトのアウトラインUIがパーティクルで表現されているようなイメージなのですが、このような「特定のオブジェクトの前だけ描画されないエフェクト」を作成するには、どのような方法があるでしょうか?
イメージ説明

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

SeiSeis

2020/07/19 05:03

ありがとうございます。 そちらも確認したのですが、取得したデプステクスチャに新たにパーティクルを描画することができるのでしょうか? また、この方法では4枚目画像のようにどこから見ても対象オブジェクト+エフェクトが描画されてしまうのではないでしょうか?
sakura_hana

2020/07/19 05:47

シェーダーではなくパーティクル必須ということですか?(「エフェクト」だとその辺の区別が付かないので条件があるなら質問文に記載した方がよいかと思います) 私はそこまで詳しくないので、「unity outline shader」などで合わせて検索すると参考になるかもしれません。(何を調べて試したかを記載すると回答する方の二度手間にならないと思います)
SeiSeis

2020/07/19 06:15

今回はパーティクルで表現したいと思っています。 分かりました。自分でももっと調べてみます。 ありがとうございます。
guest

回答2

0

ベストアンサー

パーティクルやオブジェクトのマテリアルに変更を加えてもかまわなければ、それらにステンシルの設定を追加することで何とかならないでしょうか?
bboydaisukeさんの案のようにパーティクルをモデルの全身から放射させるようにした上で、モデル側の描画時にはステンシルバッファに何らかの値を書き込み、パーティクル側の描画時にはステンシルバッファ上の値が書き換えられていないピクセルだけに描画を行うことにすれば、モデルの前面にかぶらせずにパーティクルを描画できるんじゃないかと思います。

たとえば下記のようにパーティクル側、モデル側の双方にステンシル設定を調整できるように改修を加え(いずれもメイン部分には手を加えておらず、単にプロパティとStencilブロックを追加しただけです)...

ShaderLab

1// Unity built-in shader source. Copyright (c) 2016 Unity Technologies. MIT license (see license.txt) 2 3Shader "Particles/Alpha Blended Premultiply (Stencil)" { 4 Properties { 5 _MainTex ("Particle Texture", 2D) = "white" {} 6 _InvFade ("Soft Particles Factor", Range(0.01,3.0)) = 1.0 7 8 // ステンシル用プロパティを追加 9 _StencilComp ("Stencil Comparison", Float) = 8 10 _Stencil ("Stencil ID", Float) = 0 11 _StencilOp ("Stencil Operation", Float) = 0 12 _StencilWriteMask ("Stencil Write Mask", Float) = 255 13 _StencilReadMask ("Stencil Read Mask", Float) = 255 14 15 // _StencilCompはUnityEngine.Rendering.CompareFunctionの値をとる 16 // 0: Disabled 17 // 1: Never 18 // 2: Less 19 // 3: Equal 20 // 4: LessEqual 21 // 5: Greater 22 // 6: NotEqual 23 // 7: GreaterEqual 24 // 8: Always 25 26 // _StencilOpはUnityEngine.Rendering.StencilOpの値をとる 27 // 0: Keep 28 // 1: Zero 29 // 2: Replace 30 // 3: IncrementSaturate 31 // 4: DecrementSaturate 32 // 5: Invert 33 // 6: IncrementWrap 34 // 7: DecrementWrap 35 } 36 37 Category { 38 Tags { "Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" "PreviewType"="Plane" } 39 Blend One OneMinusSrcAlpha 40 ColorMask RGB 41 Cull Off Lighting Off ZWrite Off 42 43 // ステンシル設定を追加 44 Stencil 45 { 46 Ref [_Stencil] 47 Comp [_StencilComp] 48 Pass [_StencilOp] 49 ReadMask [_StencilReadMask] 50 WriteMask [_StencilWriteMask] 51 } 52 53 SubShader { 54 Pass { 55 56 CGPROGRAM 57 #pragma vertex vert 58 #pragma fragment frag 59 #pragma target 2.0 60 #pragma multi_compile_particles 61 62 #include "UnityCG.cginc" 63 64 sampler2D _MainTex; 65 fixed4 _TintColor; 66 67 struct appdata_t { 68 float4 vertex : POSITION; 69 fixed4 color : COLOR; 70 float2 texcoord : TEXCOORD0; 71 UNITY_VERTEX_INPUT_INSTANCE_ID 72 }; 73 74 struct v2f { 75 float4 vertex : SV_POSITION; 76 fixed4 color : COLOR; 77 float2 texcoord : TEXCOORD0; 78 #ifdef SOFTPARTICLES_ON 79 float4 projPos : TEXCOORD1; 80 #endif 81 UNITY_VERTEX_OUTPUT_STEREO 82 }; 83 84 float4 _MainTex_ST; 85 86 v2f vert (appdata_t v) 87 { 88 v2f o; 89 UNITY_SETUP_INSTANCE_ID(v); 90 UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(o); 91 o.vertex = UnityObjectToClipPos(v.vertex); 92 #ifdef SOFTPARTICLES_ON 93 o.projPos = ComputeScreenPos (o.vertex); 94 COMPUTE_EYEDEPTH(o.projPos.z); 95 #endif 96 o.color = v.color; 97 o.texcoord = TRANSFORM_TEX(v.texcoord,_MainTex); 98 return o; 99 } 100 101 UNITY_DECLARE_DEPTH_TEXTURE(_CameraDepthTexture); 102 float _InvFade; 103 104 fixed4 frag (v2f i) : SV_Target 105 { 106 #ifdef SOFTPARTICLES_ON 107 float sceneZ = LinearEyeDepth (SAMPLE_DEPTH_TEXTURE_PROJ(_CameraDepthTexture, UNITY_PROJ_COORD(i.projPos))); 108 float partZ = i.projPos.z; 109 float fade = saturate (_InvFade * (sceneZ-partZ)); 110 i.color.a *= fade; 111 #endif 112 113 return i.color * tex2D(_MainTex, i.texcoord) * i.color.a; 114 } 115 ENDCG 116 } 117 } 118 } 119}

ShaderLab

1Shader "Custom/Standard Surface Shader (Stencil)" 2{ 3 Properties 4 { 5 _Color ("Color", Color) = (1,1,1,1) 6 _MainTex ("Albedo (RGB)", 2D) = "white" {} 7 _Glossiness ("Smoothness", Range(0,1)) = 0.5 8 _Metallic ("Metallic", Range(0,1)) = 0.0 9 10 // ステンシル用プロパティを追加 11 _StencilComp ("Stencil Comparison", Float) = 8 12 _Stencil ("Stencil ID", Float) = 0 13 _StencilOp ("Stencil Operation", Float) = 0 14 _StencilWriteMask ("Stencil Write Mask", Float) = 255 15 _StencilReadMask ("Stencil Read Mask", Float) = 255 16 } 17 SubShader 18 { 19 Tags { "RenderType"="Opaque" } 20 21 // ステンシル設定を追加 22 Stencil 23 { 24 Ref [_Stencil] 25 Comp [_StencilComp] 26 Pass [_StencilOp] 27 ReadMask [_StencilReadMask] 28 WriteMask [_StencilWriteMask] 29 } 30 31 LOD 200 32 33 CGPROGRAM 34 // Physically based Standard lighting model, and enable shadows on all light types 35 #pragma surface surf Standard fullforwardshadows 36 37 // Use shader model 3.0 target, to get nicer looking lighting 38 #pragma target 3.0 39 40 sampler2D _MainTex; 41 42 struct Input 43 { 44 float2 uv_MainTex; 45 }; 46 47 half _Glossiness; 48 half _Metallic; 49 fixed4 _Color; 50 51 // Add instancing support for this shader. You need to check 'Enable Instancing' on materials that use the shader. 52 // See https://docs.unity3d.com/Manual/GPUInstancing.html for more information about instancing. 53 // #pragma instancing_options assumeuniformscaling 54 UNITY_INSTANCING_BUFFER_START(Props) 55 // put more per-instance properties here 56 UNITY_INSTANCING_BUFFER_END(Props) 57 58 void surf (Input IN, inout SurfaceOutputStandard o) 59 { 60 // Albedo comes from a texture tinted by color 61 fixed4 c = tex2D (_MainTex, IN.uv_MainTex) * _Color; 62 o.Albedo = c.rgb; 63 // Metallic and smoothness come from slider variables 64 o.Metallic = _Metallic; 65 o.Smoothness = _Glossiness; 66 o.Alpha = c.a; 67 } 68 ENDCG 69 } 70 FallBack "Diffuse" 71}

モデル側はステンシルバッファの下1桁に1を書き込み...

図1

パーティクル側はステンシルバッファの下1桁が1でない場合だけ描画することにすれば...

図2

下図のような見え方になりました。

図3

※ちなみに、上から見たときにティーポットの注ぎ口やフタの縁の隙間からパーティクルや背景が見えてしまっているのは、モデルの作りのせいです...
これは単純に注ぎ口の内面やフタと本体の隙間に面が作られていないためなのです。メッシュ表面に破れがないモデルならば、どの方角から見ても大丈夫だろうと思います。

投稿2020/07/19 11:00

Bongo

総合スコア10807

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

SeiSeis

2020/07/19 12:19

ご提示していただいた通りに実践してみたところ、まさに思っていた通りの挙動になりました! ただ見よう見まねでただ実装しただけでそれぞれの設定の意味が分かっていないので、ステンシルバッファについても詳しく調べてみようと思います。 ありがとうございました!
guest

0

こんな感じでしょうか。

イメージ説明

設定のポイントとしては以下の通りです。

Shape モジュール
Shape: Mesh Renderer
Mesh: 自分自身のメッシュ
Type: Triangle

Collision モジュール
Type: World
Collide With: 自分の Layer には当たらず、相手(板)のレイヤーに当たるようにする

後は適当です。Shape モジュールにより「メッシュの表面から湧き出るような効果」を与え、Collision モジュールにより衝突判定をしています。

設定については「どのモジュールにどんな機能があり、各パラメータを操作すると何が起きるのか」といったことを一通り学ぶとよいでしょう。『Unity ゲームエフェクト入門』にそのあたりの事がステップバイステップで載ってます。
あとは Particle にテクスチャを使ったり重ねたりする事でさらに細かい表現ができます。

投稿2020/07/18 17:17

bboydaisuke

総合スコア5275

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

SeiSeis

2020/07/19 02:10

ご回答ありがとうございます。 『Unity ゲームエフェクト入門』を持っておらずどのようなことが載っているか正確に分からないので、回答者様の真意をくみ取れていないかもしれないですが推測でお返事します。 今回私が質問させていただいているのは「SIRENのようなエフェクトのつくり方」ではなく、「特定のオブジェクトの後ろに常に描画されるが、他のオブジェクトは貫通して描写される方法」についてです。 貼っていただいた画像を見る限りではオブジェクトの周り全体をエフェクトが覆っているようですが、私の投稿した最初の画像のようにアウトラインのような役割を果たす描画の実装の仕方が知りたいので、今回の質問の意図とは少し離れていると思われます。ご親切に回答していただいたのに申し訳ありません。 しかしゲームエフェクトについてもまだまだ知ることが多いので、おすすめいただいた『Unity ゲームエフェクト入門』についても調べてみようと思います。 ありがとうございます。
bboydaisuke

2020/07/19 08:20

質問の最後に貼ってある画像を見ましたが、こういうやつですか? https://www.youtube.com/results?search_query=outline+shader+unity これはパーティクルじゃないです。Outline Shader です。自分でいろいろ制御したいなら Shader Graph を作って自作しますが、それは公式に動画がいくつか https://www.youtube.com/c/Unity3DJapan/search?query=shader 上がっているのでそれを見るとよいでしょう。
SeiSeis

2020/07/19 09:39

一番下の画像は、アウトラインの役割であることをイメージしてもらうための参考画像です。 実際はこのアウトラインを単純な線としてではなくパーティクルの形状に表示したいです。 なるほど、シェーダーグラフですね。そちらも調べてみようと思います。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問