Unityでライブのステージがつくりたいな・・・(~shader編 ~)

ステージどんなのがいいかな・・・・
ぐるっと一周のステージがいいか、普通のステージがいいか・・・。
背景は・・うーん自然がいいか、SFっぽくするか・・・もう悩むね。
自然のステージだとネオンとかいらないよね・・・って気もするけど、

ということで、今回はステージ演出に使えそうなShaderの選出！
どうせ私のモデリングなんてたかが知れているのでShaderに頑張ってもらおう！

というわけで私の宝の持ち腐れShaderコレクションの入場です!

##Sinuous Sci-Fi Signs
これはお気に入りのアセット。
前はUnity5に対応してなくて最近は動かなくてかなしかったですが、Unity5対応してる！
<a href="https://www.assetstore.unity3d.com/jp/#!/content/26856" target="_blank">Sinuous Sci-Fi Signs</a>
![SciFiSigns1.gif](https://qiita-image-store.s3.amazonaws.com/0/46444/b1bd5398-5a8e-62f4-f2a3-2614b0c18b3b.gif)


##Glam Glitter Shaders
こちらグリッターとかみたいなことができるshader。ぴかぴかして綺麗です。
レアカードのホロ？みたいなのもできますよ〜。
こちらも綺麗でお気に入り。あ、カードゲームつくりたくなった〜w
<a href="https://www.assetstore.unity3d.com/jp/#!/content/20921" target="_blank">Glam Glitter Shaders</a>
<img height="150" alt="スクリーンショット 2016-08-27 01.42.03.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/ae5e81d9-269b-7fc4-9c41-d475f236772a.png"><img height="150" alt="スクリーンショット 2016-08-27 01.41.32.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/c7fd2888-9b21-55c2-6f84-1df0b18cc475.png"><img height="150" alt="スクリーンショット 2016-08-27 01.42.28.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/b398c87c-4278-7a9b-7602-a7db0d372200.png"><img height="150" alt="スクリーンショット 2016-08-27 01.42.39.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/bdb202b8-a035-75f8-8421-7d51f66925f4.png"><img height="150" alt="スクリーンショット 2016-08-27 01.42.57.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/f97f6ce1-39d1-68e3-d92c-ce09f7c88bbb.png">


あゆめぐちゃん版カード作ったー。
Demoにカードのやつがあるのでその画像を修正しただけです。
<img src="https://qiita-image-store.s3.amazonaws.com/0/46444/03fb836c-7f3a-663f-2421-f5d10e41cd60.gif" width="300px">


##SE Natural Bloom & Dirty Lens
綺麗なブルーム
<a href="https://www.assetstore.unity3d.com/jp/#!/content/17324" target="_blank">SE Natural Bloom & Dirty Lens</a>

##Ghost Shaders
つかうかわかんないけど、とりあえず。
ゴーストみたいなのができますよ。スマホでもバッチリ動きます。
<a href="https://www.assetstore.unity3d.com/jp/#!/content/38092" target="_blank">Ghost Shaders</a>
<img src="https://qiita-image-store.s3.amazonaws.com/0/46444/9c0a54d2-cbf4-3d1f-0d33-50e43f6f3265.gif" width="400px">

##NextGen Sprites
こちらどちらかというと一枚絵とかようだけど
<a href="https://www.assetstore.unity3d.com/jp/#!/content/47482" target="_blank">NextGen Sprites</a>

##Ultimate Unlit & UI
こちらもどちらかというと一枚絵とかようだけど。
iosとかandroidだと一部しか動かなくて悲しかった思い出がある・・・。
<a href="https://www.assetstore.unity3d.com/jp/#!/content/33940" target="_blank">Ultimate Unlit & UI</a>
![uiUltimeteDemo.gif](https://qiita-image-store.s3.amazonaws.com/0/46444/4e36e43a-9879-c483-85c5-616f0cc40f5a.gif)


基本的にどれもインポートすればわかるから
Sinuous Sci-Fi Signsをちょっと解説

インポートしたところ
<img width="150" alt="スクリーンショット 2016-09-02 15.47.57.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/9e8d40bc-50b9-f002-3e2a-70fe5649898b.png">

インポートするとこんな感じでエラーでますが、
Assets->ImportPackage->Effectをインポートしてあげれば解消します。
<img width="637" alt="スクリーンショット 2016-09-02 15.44.36.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/777aa8d2-5df0-c56e-4de0-cf8dbc121d0b.png">

そのあともこんな感じでエラーでますがこれはマウスのヒント周りみたいだからいらないので無視。
このまま動きます。Demoシーンは操作は左右キーボードでエフェクトを切り替えられます

<img width="351" alt="スクリーンショット 2016-09-02 15.46.25.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/1c9e9ba0-094d-717d-4746-c5266b50d46b.png">

###何か作ってみる
マテリアルが幾つかあるのでとりあえずこれを表示してみよう。
<img width="191" alt="スクリーンショット 2016-09-02 15.52.04.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/2d108476-a7c6-616d-d0dd-ecf9416a2b58.png">

3DObject->Quadつくってマテリアルをドラッグドロップするだけで完成。

インスペクタはこんな感じでタブになっており、アニメーションの開始位置とか速度とか色とかいろいろ設定できます
<img width="300" alt="スクリーンショット 2016-09-02 15.54.01.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/6844f73d-c561-0926-38ff-5f48d26e332f.png"><img width="300" alt="スクリーンショット 2016-09-02 15.59.03.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/ed9ab4f0-24de-6a7e-ac22-41c845d1fdaa.png"><img width="300" alt="スクリーンショット 2016-09-02 15.59.08.png" src="https://qiita-image-store.s3.amazonaws.com/0/46444/fe36a93e-9c01-d3f5-ef2c-dc4be3f6ada2.png">


scriptをアタッチしないとアニメーションを繰り返すだけです。
![SciFiSignTest3.gif](https://qiita-image-store.s3.amazonaws.com/0/46444/b515305e-5df1-6fcd-7395-6ab108657303.gif)

出現や消えるときはmaterialの_Phaseの値をUpdateなどで更新してあげればOKです

```csharp
renderer.sharedMaterial.SetFloat( "_Phase" , cphase );
```

![SciFiSignTest2.gif](https://qiita-image-store.s3.amazonaws.com/0/46444/e4110c7d-e6b0-2cc0-b8f1-18003e7e038d.gif)

あとはもっとDemoみたいに光らせたければカメラにBloomをつけてあげればOK
iphone系では動くのを確認。

今回はここまで。