環境：UE5.4
作成マテリアル：M_FirstShader

前書き

UEでマテリアルを開いたことがない方向けのセクションです。特にインターフェースを理解していたり、マテリアルファイルを作成したことがある方は、このチャプターを飛ばしていただいて構いません。

シェーダーとマテリアルって違う？

両方の用語を耳にするかもしれませんが、UEでは同じものを指します。マテリアルエディターを使用してシェーダーを作ります。シェーダーはマテリアルに限らず、より広範な概念だと考えてください。マテリアルを聞くと「アセットに割り当てる」という印象が強いです。３Dならキャラクターの衣装や肌などは主にテクスチャを使ったマテリアルです。HLSL/GLSL（シェーダーのプログラミング言語）で作られたシェーダーはマテリアルとは呼ばれません。

シェーダーの作成方法

任意UEプロジェクトのコンテンツブラウザーから右クリックし、サイドメニューが開かれます。
Materialを選択し、ファイルが追加されます。


追加されたファイル

ダブルクリックして中身を見てみましょう。

インターフェースの解説

こちらがマテリアルエディターです。作業はすべてこのウインドウ内で行います。青いエリアはノードを組み合わせてシェーダーを作成するワークスペースです。
左側にプレビューと詳細パネルがあります。右側にノードパレットがあり、そのパレットからを直接ノードを探すか、ワークスペース上で右クリックして検索ウインドウからノードを呼び出すこともできます。

赤いエリアのツールバーは便利なパラメーターいくつかあります。TIPS章で一部紹介する予定です。
最後に、黄色いエリアはログや情報パネルです。ノードを組んでいる際にエラーが発生した場合は、ここでエラーの原因を確認することができます。

ノードとは、GPUが処理できる命令のようなものです。見た目は色付きのヘッダーとタイトル名がついた箱のような形で、左右に丸い接続ポイントとパラメーター名が表示されています。
例としてはこれが「Add」ノードです。シェーダー作業では日常的に使用するノードの１つです。

初設定

マテリアルを制作するときに最初にやるべきことは、マテリアルの環境設定です。これから基本的な2Dシェーダーを作成するため、左の「Details」パネルよりマテリアル環境を「User Interface」に変更し、透明度を有効にするためにブレンドモードを「Translucent」に設定します。

設定が正しければ、ワークスペース上にある出力ノードのインプット（白い丸）が大幅に減少します。
「Final Color」と「Opacity」のみ使ってUIのシェーダーが作れます。

プレビューにまだ何も表示されていませんが、最初の設定として完成しました！
次のチャプターで初めてノードを組み始めます。