Shader Graphに対応したUnity UIについて、ユニティ・テクノロジーズ・ジャパンが紹介動画を公開

2024.02.21
ニュースUnity
この記事をシェア!
Twitter Facebook LINE B!
Twitter Facebook LINE B!

この記事の3行まとめ

  • 2023.2 Tech StreamでUnity UIがShader Graphに対応、ユニティ・テクノロジーズ・ジャパンが紹介動画を公開
  • ボタンなどのUI部分に対して、シェーダーを用いた演出を加えられるようになった
  • 画像とボタンが配置されたシーンを例に、モザイク処理や光のアニメーションなどを追加する様子が紹介されている

ユニティ・テクノロジーズ・ジャパンは2024年2月5日(月)、YouTubeでUnity UI が Shader Graph に対応! UI 用シェーダーを作ってみよう!と題した動画を公開しました。

2023.2 Tech Streamでは新たにUnity UIにShader Graphが適用できるようになりました。これにより、ボタンなどのUI部分にシェーダーを使った演出を加えることが可能です。

公開された動画では、例として画像とボタンが配置されたシーンが用意。ボタンは光るアニメーションが適用されており、画像のほうは四隅が丸くマスクされ、モザイク処理がかけられています。これらの処理にShader Graphが使われています。

動画の29秒時点から、サンプルについて紹介されている

Unity UIにおけるShader Graphは、従来のShader Graphと同様に操作できます。なお、Vertexの操作ができないなどの細かな違いがあるほか、Unlitを前提としているため、光源を用いたアニメーションはできないとのこと。

動画の1分40秒から、Unity UIにおけるShader Graphの実際の作り方

Unity UIにおける既知の弱点としては、マテリアルプロパティをアニメーションさせられない制約があります。

動画では、スクリプティングで対応するか、サードパーティ製のソリューションを利用するなどの解決法が推奨されています。

動画の2分32秒から、制約・注意点について。簡単なスクリプトの例も確認可能

動画内では、実際に動作が確認されているサードパーティのアセットとして、「Animate UI Materials」の紹介も行われています。

詳細は、動画をご確認ください。

YouTube動画『Unity UI が Shader Graph に対応! UI 用シェーダーを作ってみよう!』

関連記事

Unity公式イベント「U/Day Tokyo 2024」現地レポート!Unity 6以降のロードマップやHTML/CSSライクにUIを作れる新機能など全9セッション情報から気になる情報をお届け
2024.07.11
ゲーム開発者必見のカンファレンス10選【GDC・CEDEC・Unreal Fest・U/Dayなど】
2024.07.11
サイバーエージェント主催のUnity勉強会「CA.unity #8」から、6セッションのスライド&動画が公開。『学マス』のライティングやソースコード自動生成機能などを解説
2024.07.05
『呪術廻戦 ファンパレ』シナリオパート制作に迫る開発者インタビュー。Live2Dキャラクターの実在感を高める3Dライティングと作品愛あふれるワークフロー【CAGC2024】
2024.07.03
『桃鉄ワールド』にUnityを導入した理由や役立った機能は?ユニティ・テクノロジーズ・ジャパン、シニアプロデューサーの岡村 憲明氏にインタビューした記事を公開
2024.06.27
『呪術廻戦 ファントムパレード』の「夢幻廻楼」背景演出について、サムザップが技術ブログで解説。無限に続く塔、天候の変化を表現する方法とは
2024.06.26

注目記事ランキング

2024.07.08 - 2024.07.15
VIEW MORE

連載・特集ピックアップ

イベントカレンダー

VIEW MORE

今日の用語

レベル(Level)
レベル
  1. ゲーム開発において、位置情報を持つオブジェクトが配置されている地形。
  2. RPGなどのゲームにおいて、キャラクターの成長度合いを示す数値。レベルアップなど。
VIEW MORE

Twitterで最新情報を
チェック!