シェーダー少しやった感想とその他（就活寄り）


#目次
[1.はじめに](#1-はじめに)
[2.自分が作ったもの](#2-自分が作ったもの)
[3.どんな工夫したほうがいいか](#3-どんな工夫したほうがいいか)
[4.実際の反応や所感](#4-実際の反応や所感)
[5.参考になりそうな情報](#5-参考になりそうな情報)
[6.布教と趣味枠](#6-布教と趣味枠)
[7.おわりに](#7-おわりに)

#1. はじめに
初めて記事を書くからぐちゃぐちゃかもしれない。目次ちゃんと動いとるかー？

今回はシェーダーについて色々書いていきたいと思います。自分がゲーム会社に内定もらったの
シェーダーが半分くらい要因占めてると思うんで。
#2. 自分が作ったもの
一言でいうとシェーダーの技術デモ群を作りました。

主にトゥーン調の描画を勉強と就活に使える材料を作りたかったので、
#####原神みたいなトゥーンシェーディング作ってみたり...
![フィッシュル完成Ver.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/ce126c23-6d5e-7f9f-ac70-02c94867c75b.png)

#####マリオカ〇トにありそうなアイテムボックス作ってみたり...
![itembox.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/c5c1f0bf-3762-617d-9fdc-0d9ca81350e8.png)

他にも何個かあるけど原神好きなんで原神によってたりします。
自分好きなものこだわれますアピールとベクトル計算とか少し理解してますアピールできれば役満かと。

#3. どんな工夫したほうがいいか
まず最初に理解すべきなのは
・シェーダーを使う人はプランナーやデザイナーなどが主、プログラマーはシステムを作るのみ。
これを念頭に置くべきだと自分は思います。

上記のことから考えるべきなのが
・シェーダーを使う人の負担を減らしつつ、拡張性も高める（いろいろな表現をできるようにする）
ということです。

昔のアニメみたいに絵を一コマ一コマデザイナーに作ってもらえばお終いですが、そんな時間はありません。
少ない素材を活かして表現を自由に調整できるのがシェーダーの良いところです。

###例１：トゥーンシェーダー
![フィッシュル初回作成時Ver.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/bd08f710-33fb-850a-d7bd-5b0115a916b5.png)

上の画像は実際に自分が作ったシェーダーですが、かかる影をただ数値で段階的に分けているだけです。
見た目も最悪だし数値で分けるだけなので感覚的にわからないですね。

なので下の画像のX軸をサンプリングして影の量を調整するようにしました。
![Rampmap.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/a1ccac15-3fd5-2eb5-c129-9d3299fc2944.png)
![フィッシュル未完成Ver.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/549fb889-2757-ee49-833c-01737689defc.png)
するとこの通り、一気に原神に近づきました。そして、上のようなサンプリング画像はペイントや
illustratorがあればだれでも一瞬で作れるので、調整に時間がかからず直感的にいじれます。
####トゥーンシェーダーの+α
![image0.jfif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/c10ff10a-cacd-2098-1a60-01fee645c893.jpeg)
トゥーンシェーダー作ってるとどうしても思った通りに影がかからないんですよね...
本当は上画像のようにまっすぐに影を付けたいところですが...
![フィッシュル未完成Ver.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/549fb889-2757-ee49-833c-01737689defc.png)
普通に入れてみるとコレジャナイ感があります。
それはメッシュ毎の法線を変えずに参考にしているからです。

原神のモデルは公式が無料配布していますが、顔の法線を見てみると下画像のようになっています。（コワッ）
![顔メッシュノーマル改造前Ver.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/f2ef9396-cd7d-5c7f-5556-98cd98a04c71.png)
それを...
![顔メッシュノーマル改造後Ver.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/fd800ee0-34bf-10a1-d408-13729242a9fd.png)
このように球体状に向きを変えたモデルを使うと...
![フィッシュル完成Ver.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/52fd1cdd-5d5e-b227-c399-189cce58830f.png)
このようにまっすぐ影がかかるようになりました。
シェーダーには関係ないところですが、就活ではこだわる力をアピールできます。
###例２：SkyBoxシェーダー
![Videotogif (1).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/53715f16-2b42-d451-bcad-d58120738c6e.gif)
先ほどから出している画像の背景も自分で作ってみたやつです。
朝から夜までをサイクルさせることが可能です。
![空素材.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/dd964cb4-8935-d1ea-15c1-c651ead95f7d.png)
最初は昼、夕、夜の画像を作って合成させていましたが、正直ゴミでした。
デザイナーからしたら環境とか時間帯変わるたびに絵を描かなきゃいけないので殴られても文句言えません。

そこで、上の画像見たらわかると思うんですけど、雲の大まかな位置は変わらずに色が大きく変わっているだけなんですよね。
じゃあどうするかというと...
#####「色だけ後で着色したらええやん」
![空マスク.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/ca12e29b-b6f9-9928-2d9c-43affca72b19.png)
これで後になって「夜もっと青っぽくしたい」だとか「ゼルダのブレワイみたいに赤い月の夜作って赤黒くしよう」
ってなってもすぐに変更して理想の色を探すことが出来ます。

こんな感じでデザイナーからの少ない素材で色々な表現をできるようにしたり、光や影などの情報を
感覚的に分かりやすく変更できるようなシェーダーを作ることが必要だと思います。

#4. 実際の反応や所感
結構褒めてくれるところは多かったしアドバイスもたくさんもらって嬉しかった。


説明会とかでどんなもの作ったほうが良いですかって言うテンプレ質問投げて
#####「好きなの作ってください！」
っていうテンプレ回答投げ返されるルーティーンあるけど、割とゲーム関係だったら
何作ってても評価してくれるんだって思いました。

新卒で入る以上、今まで勉強したこと使う機会あんまりないと思うんで、
・好きなことを追求できる
・いろんなことに興味がある
これが分かる作品を向こうは欲してそうですね。

#5. 参考になりそうな情報
シェーダーに関してはググったら大体出るから自分で調べたらヨシッ！
シェーダーは大まかにSurfaceシェーダーとFragmentシェーダーがあるけど特徴としては

| |Surface|Fragment |
|---|---|---|
|難易度 |簡単|困難|
|自由度|少ない|無限|

なんで最初はSurfaceで感覚をつかんだ方がいいと思います。
スマホのゲームは3Dが増えつつあるけどそれでもカメラシェーダーの方が機会が多めです。

シェーダーを就活作品にするなら鏡とかガラスとか作りつつ好きなやつも作れば多分何とかなる。
（フレネル反射とか色収差とかも表現できたらかなり良し）

Unityのシェーダーに関する本も一応あります。
![41hs3jKoFQL.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2325647/7e0e8bc9-e566-e27b-1f24-8e3e8da838ce.jpeg)
じっくり学びたいとか関数とかすぐ確認できるようにしたいってなったら買った方がいいかも。


#6. 布教と趣味枠
上でも原神好きって言ったけどみんなは原神やっとるか？やってなかったらやろうな。
トゥーン調の時代ぞ、決して乗り遅れるな。

そして来年あたりにMihoyoから新しいゲーム出そうだからそれもやろうな、崩壊シリーズだぞ。

あとVALORANTもやってるんだけどチェンバー強すぎじゃない？何あれスキル全てにおいて範囲広すぎやろ。
レディアントクライシスが今までのスキンと違いすぎて初めて課金してしまった。
ヴァンダル派とファントム派がいると思うけど、ヴァンダル派はファントム使おうな。

ポケモンに関しては懐かしさのおかげで楽しめてるけどバグのオンパレードで正直笑えんわ。
地下は無限に楽しめて神。アルセウス外伝に期待


#7. おわりに
今はShaderGraphとかVFXとかビジュアルスクリプティングが多いからそれを拡張するやつ作りたいなーとか思ったり
原神の見た目粗方できてるから原神の模作作ってみたくなったりとかいろいろ考えてます。

作品に注力するのはいいけど結局内定もらうのは面接が大部分占めてるんで作品ある程度完成したらどんどんエントリーしてください。
エントリーもじもじしてると一生進まないから脳みそが就活の苦痛に慣れるまで我慢しろな。

以上、シェーダーについてのお話を終わります。あざましたー。