投稿記事

2022年 12月の記事 (5)

ゆたゆたゆた 2022/12/31 20:30

ARplane用shaderの改良版

どうですかね?

揺らぎを入れてみました。
大げさに揺らすと目がチカチカするので、細かく揺らしてみました。
適当にコード合体させて、書いてるので、どこかおかしい部分があるかもしれません・・・
本当はグリッチ効果にしたいんだけど、むずかしそうだ・・・

スマホに入れて、ARでチェックしてみます。

shaderのコード
↓↓

Shader "Unlit/hexagon5"
{

Properties
{
    _MainTex ("Base(RGB)", 2D) = "white" {}
    _MainColor("Color", Color) = (1,1,1,1)

}
SubShader
{
    Tags {"RenderType"="AlphaTest" "Queue" = "Transparent"}
    LOD 100

    Pass
    {

        CGPROGRAM
        #pragma vertex vert
        #pragma fragment frag
        // make fog work
        #pragma multi_compile_fog

        #include "UnityCG.cginc"

        

        struct appdata
        {
            float4 vertex : POSITION;
            float2 uv : TEXCOORD0;
        };

        struct v2f
        {
            float2 uv : TEXCOORD0;
            UNITY_FOG_COORDS(1)
            float4 vertex : SV_POSITION;
        };

        uniform sampler2D _MainTex;
        float4 _MainTex_ST;

        float4 _MainColor;

        v2f vert (appdata v)
        {
            v2f o;
            o.vertex = UnityObjectToClipPos(v.vertex);
            o.uv = TRANSFORM_TEX(v.uv, _MainTex);
            UNITY_TRANSFER_FOG(o,o.vertex);
            return o;
        }

        float mod(float x, float y)
        {
            return x - y * floor(x / y);
        }
        float2 mod(float2 x, float2 y)
        {
            return x - y * floor(x / y);
        }
        float3 mod(float3 x, float3 y)
        {
            return x - y * floor(x / y);
        }
        float4 mod(float4 x, float4 y)
        {
            return x - y * floor(x / y);
        }

        float HexDist(float2 p){


            p = abs(p);
            
            float2 c = dot(p,normalize(float2(1.0,1.73)));

            c = max(c, p.x);

            return c;

        }

        float4 HexCoords(float2 uv){
            float2 r = float2(1, 1.73);
            float2 h = r * 0.5;
            float2 a = mod(uv, r) - h;
            float2 b = mod(uv - h, r) - h;

            /*float2 gv;
            if(length(a) < length(b)){
                gv = a;
            }else{
                gv = b;
            }*/

            float2 gv = dot(a, a) < dot(b,b) ? a :b;

            float x = atan2(gv.x, gv.y);
            float y = 0.54 - HexDist(gv);
            float2 id = uv - gv;

            return float4(x, y, id.x, id.y);

        }

        fixed4 frag (v2f i) : SV_Target
        {

            float2 uv = i.uv;

            
            float x = 2 * uv.y + sin(_Time.y * 10);
            float distort = sin(_Time.y * 15) * 0.001 * sin(5 * x) * (-(x-1) * (x-1) + 1);
            uv.x += distort;

            
            uv *= 10;

            float4 hc = HexCoords(uv);

            float c = step(0.05, hc.y);
            
            clip(-(c - 0.02));

            return c + (_MainColor * 100);

        }
        ENDCG
    }
}

}

この記事が良かったらチップを贈って支援しましょう!

チップを贈るにはユーザー登録が必要です。チップについてはこちら

ゆたゆたゆた 2022/12/30 03:29

UnityのUnlit Shaderでタイリングされた六角形を作る Hexagonal Tiling

今日一日かけてやっとでけたー

どこもかしこも、shader graphばっかりだったので、
コード書く奴は、↓ここ見ながら、やりました。

vec2とかvec3は、float2,float3に置き換え。
いちばんわからなかったのが、mod関数(剰余演算ですね)
Unityにはfmodがありますけど、なんかバグるので、
ググってたら、
こちらのサイトに行きつきました。

ないなら作っちゃえってことで、
float mod(float x, float y)
{
return x - y floor(x / y);
}
float2 mod(float2 x, float2 y)
{
return x - y
floor(x / y);
}
float3 mod(float3 x, float3 y)
{
return x - y floor(x / y);
}
float4 mod(float4 x, float4 y)
{
return x - y
floor(x / y);
}

コピペする。

あとは、こちらのサイトも参考にしながら、やっと完成したのでした。

あとはこいつに何かしらのアニメーションをつけてやればいいんですね!!
いやー、ハニカム、いいですよね~。やっぱ、ハニカムですよw

気づいたらこんな時間になってましたー。


コードの全文はこちらになります。(なんかブログの表示がおかしいけど・・・HTMLいじれないのかな)
↓↓↓

Shader "Unlit/hexagon2"
{

Properties
{
    _MainTex ("Texture", 2D) = "white" {}
}
SubShader
{
    Tags { "RenderType"="Opaque" }
    LOD 100

    Pass
    {
        CGPROGRAM
        #pragma vertex vert
        #pragma fragment frag
        // make fog work
        #pragma multi_compile_fog

        #include "UnityCG.cginc"

        struct appdata
        {
            float4 vertex : POSITION;
            float2 uv : TEXCOORD0;
        };

        struct v2f
        {
            float2 uv : TEXCOORD0;
            UNITY_FOG_COORDS(1)
            float4 vertex : SV_POSITION;
        };

        sampler2D _MainTex;
        float4 _MainTex_ST;

        v2f vert (appdata v)
        {
            v2f o;
            o.vertex = UnityObjectToClipPos(v.vertex);
            o.uv = TRANSFORM_TEX(v.uv, _MainTex);
            UNITY_TRANSFER_FOG(o,o.vertex);
            return o;
        }

        float mod(float x, float y)
        {
            return x - y * floor(x / y);
        }
        float2 mod(float2 x, float2 y)
        {
            return x - y * floor(x / y);
        }
        float3 mod(float3 x, float3 y)
        {
            return x - y * floor(x / y);
        }
        float4 mod(float4 x, float4 y)
        {
            return x - y * floor(x / y);
        }

        float HexDist(float2 p){

            p = abs(p);
            
            float2 c = dot(p,normalize(float2(1.0,1.73)));

            c = max(c, p.x);

            return c;

        }

        float4 HexCoords(float2 uv){
            float2 r = float2(1, 1.73);
            float2 h = r * 0.5;
            float2 a = mod(uv, r) - h;
            float2 b = mod(uv - h, r) - h;

            float2 gv;
            if(length(a) < length(b)){
                gv = a;
            }else{
                gv = b;
            }

            float x = atan2(gv.x, gv.y);
            float y = 0.5 - HexDist(gv);
            float2 id = uv - gv;

            return float4(x, y, id.x, id.y);

        }

        fixed4 frag (v2f i) : SV_Target
        {

            i.uv *= 10;

            float4 hc = HexCoords(i.uv);

            float c = smoothstep(0.05, 0.1 ,hc.y);

            return c;

        }
        ENDCG
    }
}

}

この記事が良かったらチップを贈って支援しましょう!

チップを贈るにはユーザー登録が必要です。チップについてはこちら

ゆたゆたゆた 2022/12/28 17:05

shader実験完遂

一通り実験は終わりました。
UnityでC#をいじっていて、
変数、関数あたりまでわかる人。
多少数学(三角関数あたりの仕組みがわかる人がいい)に知識があり
数学用語の英語スペルがわかる人なら、
案外簡単に、カスタムシェーダー作れますね。
食わず嫌いの人にもおすすめです。
結果がすぐレンダリング画面に現れるので、やってて面白いです。
さて、いったん数学のお勉強にもどりますかね。

https://youtube.com/shorts/DX-zrGrAS-c?feature=share

キャプチャ動画、Youtube shortになっちゃったw

この記事が良かったらチップを贈って支援しましょう!

チップを贈るにはユーザー登録が必要です。チップについてはこちら

ゆたゆたゆた 2022/12/27 23:04

shaderやばwww

数学のお勉強がなかなか手ごわいので、
ちょっとお先にShaderをいじってみましたら、

ふおおおおおおお!!!!
なんだこれw
おもしろwww

ってなったw
Unityでオリジナルゲームを作る10倍くらい面白いじゃないか!!!w

なんてったって、板ポリ一枚で、
結果がすぐ出るくせに、エモい動きもたたった数行のコードでできる。

このレスポンスの速さは、中毒性がありますね。。。

世の中に、shader楽しいよ楽しいよって言ってる人の意味がわかりましたw

母さん、俺、しばし、横道にそれそうです。。。


参考サイト:楽しい!Unityシェーダー お絵描き入門!

メモ:Visual Studioよりも、Visual Studio CodeにShaderlabVSCodeのアドオンを付けて使ったほうがコードが書きやすい。

この記事が良かったらチップを贈って支援しましょう!

チップを贈るにはユーザー登録が必要です。チップについてはこちら

ゆたゆたゆた 2022/12/13 23:12

「ゲームアプリの数学 Unityで学ぶ基礎からシェーダーまで」 を読むぞ!の巻

お久しぶりです。
仕事で大きなイベントが終わったので、
Unityをいじっています。

ARで、平面を探すときの、AR planeのシェーダーが気に入らないので、
自分で自作しようかと思っていて、
「ゲームアプリの数学 Unityで学ぶ基礎からシェーダーまで」という本を読んでます。

シェーダーが出てくるのが、9章になるので、まだまだ先が長そうです。
数学のお勉強は、基本C#でやってるみたいなので、
初心者向けではなさそうです。

Unityの操作方法と、ある程度のC#の知識。
数学の知識もちょっとあると、読めそうです。

ただ、Shaderを書くのは、どういった感じなのか未知数なので、
途中から、ドロップアウトしそうな予感はありそうですが・・・

まぁがんばります。

さて、明日は早起きをして、アルゼンチン対クロアチアでも見ますかね!
おやすみなさい。

この記事が良かったらチップを贈って支援しましょう!

チップを贈るにはユーザー登録が必要です。チップについてはこちら

月別アーカイブ

記事のタグから探す

記事を検索