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

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

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

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

Unity

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

Q&A

解決済

1回答

3004閲覧

Cubeにひびが徐々に入っているように見せたい

kimkim

総合スコア142

Unity3D

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

Unity

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

0グッド

1クリップ

投稿2018/09/09 04:37

編集2018/09/09 06:31

前提・実現したいこと

Scene内に配置してあるCubeにひびが徐々に入っていくように見せたいと思っています。

そこで、Cubeのすぐ手前にひびの画像を配置して、それをマスクのような物を利用して
徐々に見せていこうかと思ったのですが、うまくできません。

何かいい方法はあるでしょうか。

イメージ説明
イメージ説明
↑このひびを左から右に徐々に見えるようにしてひびが入っていくようにしたいです。

情報不足などありましたら随時追記していくのでご指摘お願いいたします。

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

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

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

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

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

guest

回答1

0

ベストアンサー

ご質問者さんのおっしゃる方針でよさそうに思いますが、「うまくいかない」とはどういった状況でしょうか(実現方法が思いつかない...など)?
スプライトへのマスク掛けでしたらスプライトマスク - Unity マニュアルがご参考になりそうです。

マニュアルをもとにちょっとやってみましたところ、下図のような構成にして、マスク用スプライトを動かしてやれば徐々にひび画像を表示できそうです。

スプライトマスク

追記

上記のやり方ですと、ひびが平坦で、キューブの上にひびの絵が描かれただけのように見えてしまってご不満かもしれません。
下図のような濃淡のあるひび画像を作っておいて...
ひび
キューブの前面にQuadを配置し、そのマテリアルを下記のような濃淡をもとに面の向きを決定するような形にすると...

ShaderLab

1Shader "Custom/Crack" 2{ 3 Properties 4 { 5 _Color ("Color", Color) = (1, 1, 1, 1) 6 _MainTex ("Albedo (RGB)", 2D) = "white" {} 7 _BumpMap ("Normal", 2D) = "bump" {} 8 _Glossiness ("Smoothness", Range(0, 1)) = 0.5 9 _Metallic ("Metallic", Range(0, 1)) = 0.0 10 _CrackTex ("Crack (Grayscale)", 2D) = "white" { } 11 _Progress ("Crack Progress", Range(0, 1)) = 1.0 12 _CrackHeight ("Crack Height", Range(0, 0.1)) = 0.05 13 } 14 15 SubShader 16 { 17 Tags { "Queue" = "AlphaTest" "RenderType" = "Opaque" } 18 LOD 200 19 20 CGPROGRAM 21 22 #pragma surface surf Standard fullforwardshadows 23 #pragma target 3.0 24 25 sampler2D _MainTex; 26 sampler2D _BumpMap; 27 sampler2D _CrackTex; 28 float4 _CrackTex_TexelSize; 29 30 struct Input 31 { 32 float2 uv_MainTex; 33 float2 uv_BumpMap; 34 float2 uv_CrackTex; 35 }; 36 37 half _Glossiness; 38 half _Metallic; 39 fixed4 _Color; 40 float _Progress; 41 float _CrackHeight; 42 43 #define PROGRESS_EXPONENT 2.0 44 #define CAVITY_EXPONENT 2.0 45 46 inline float getAlpha(float2 uv, float2 edge) 47 { 48 return 1.0 - saturate(tex2D(_CrackTex, uv).r + smoothstep(edge.x, edge.y, uv.x)); 49 } 50 51 void surf(Input IN, inout SurfaceOutputStandard o) 52 { 53 float2 edge = pow(_Progress, float2(PROGRESS_EXPONENT, 1.0 / PROGRESS_EXPONENT)); 54 float alpha = getAlpha(IN.uv_CrackTex, edge); 55 clip(alpha - 0.00001); 56 float cavity = 1.0 - pow(alpha, CAVITY_EXPONENT); 57 float alphaYP = getAlpha(IN.uv_CrackTex + float2(0.0, _CrackTex_TexelSize.y), edge); 58 float alphaXP = getAlpha(IN.uv_CrackTex + float2(_CrackTex_TexelSize.x, 0.0), edge); 59 float alphaYN = getAlpha(IN.uv_CrackTex + float2(0.0, -_CrackTex_TexelSize.y), edge); 60 float alphaXN = getAlpha(IN.uv_CrackTex + float2(-_CrackTex_TexelSize.x, 0.0), edge); 61 float3 tx = float3(_CrackTex_TexelSize.x * 2.0, 0.0, (alphaXN - alphaXP) * _CrackHeight); 62 float3 ty = float3(0.0, _CrackTex_TexelSize.y * 2.0, (alphaYN - alphaYP) * _CrackHeight); 63 float3 normal = normalize(normalize(cross(tx, ty)) + UnpackNormal(tex2D(_BumpMap, IN.uv_BumpMap))); 64 fixed4 c = tex2D(_MainTex, IN.uv_MainTex) * _Color; 65 o.Albedo = c.rgb * cavity; 66 o.Metallic = _Metallic; 67 o.Smoothness = _Glossiness; 68 o.Alpha = c.a; 69 o.Normal = normal; 70 o.Occlusion = cavity; 71 } 72 ENDCG 73 74 } 75 FallBack "Diffuse" 76}

下図のように陰影の付いたひびにすることもできるかと思います。
陰影付きひび

投稿2018/09/15 07:52

編集2018/09/16 19:53
Bongo

総合スコア10807

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問