こんにちわ、オオバです。

UnityのUI表現力はアップしています。

しかし、まだまだやりたくても
簡単には実装できないことがあります。

デザインをする上で重要なことは制限の把握 です。

Unityのできるできない を知ることで、
より効率よくUIデザインできます。

本記事では前回に引き続き
uGUIでは難しいUI表現について解説していきます。

uGUIはソフトマスクを表現できない

uGUIではソフトマスク(半透明マスク)は使えません。

※Maskコンポーネントを使用
ソフトマスクの理想

【リスク】uGUIが表現できない致命的なこと_0

ソフトマスクは本来このように
キレイに縁が消えていってほしいのです。

uGUIの現実マスク描画

【リスク】uGUIが表現できない致命的なこと_1

しかしuGUIでは表現されません。
半透明の部分は1または0に区分けされ、
表示 or 非表示状態になります。

Unity2020.3からマスクが改善

Unity2020.3から四角形のマスクに限り、
ソフトマスクが使えるようになりました。

またそれに伴い、
端がキレイに消えるスクロールは可能 になりました。

Unity2020.3以降はソフトマスクスクロールが可能

【リスク】uGUIが表現できない致命的なこと_2

あわせて解説していますので、
ぜひ読んでみてください

四角形以外は専用シェーダーが必要

どうしても四角形以外で
ソフトマスクを使いたい場合
シェーダーを書いて解決させます。

ひとつの答えを自分なりに出しています。
↓コチラの記事をどうぞ。

uGUIが表現できないことまとめ

前回に引き続きuGUIではできないことを紹介してきました。

ソフトマスクは
UIデザインによく出てくる表現方法です。

「このプロジェクトでは絶対ソフトマスクをは使いません。」

と、決めて進めることはできますが、
デザイン制作していく中でどうしてもパズルのピースが合わなくなり、
ソフトマスクが必要になることはあります。

UIデザイナーのため、
クオリティの高いゲームを作るために
ぜひともソフトマスクを実現したいところです。

冒頭で紹介しましたが、
デザインをする上で重要なことは制限の把握 です。

Unityのできる、できない を知っておくことで、
より高い効率でUIデザインができる でしょう。

特に作り直しリスクは大きく減らせます。

uGUIのリスク を先に頭に入れて、
UI設計してみてはいかがでしょうか。


フォローすると UIデザイナー力の上がるTwitter やってます!
今日から使えるテクニックを発信中。
ぜひフォローしてみてください!
👉フォローはこちら!

最後まで読んでいただきありがとうございました!
すばらしいuGUIライフをお過ごしください。

オススメ記事
検証環境