UI ToolkitだけでUnityのWebゲームを作る(uGUIを外して分かったこと)
3本目のゲームで uGUI をプロジェクトから外し、UI を UI Toolkit だけで作りました。EventSystem が使えない問題、シーンに設定を保存できない問題、Web ビルドだけ出るエラー、テーマが無いと文字が出ない話を、踏んだ順に残します。
公開 2026年9月19日
この記事の要点4 points
- EventSystem は uGUI の型。 uGUI を外すと使えないが、Unity 6.1 以降は PanelInputConfiguration でボタンが反応する。
- PanelSettings をエディターからシーンに割り当てても保存されなかった。 アセットにすると Web ビルドで別のエラー。結局実行時に作る形にした。
- テーマ(
.tss)が無いと文字が出ない。 中身は@import1行でよい。 - Web ビルドの起動時に出ていた serialization のエラーは、別の修正で作り直したビルドで消えた(原因は特定できていない)。
目次6章
検証した環境最終確認 2026年9月19日
- Windows 11
- Unity 6.6(6000.6.0f1)・WebGL ビルド
- パッケージ11件(com.unity.ugui を入れていない)
- Claude Code(Opus 5 / 思考レベル 高)
書いてあるのは、この環境で実際に試した結果です。ツールの仕様や料金は変わるので、重要な判断の前には公式の情報も確認してください。
3本目のゲームで、uGUI をプロジェクトから外しました。UI は UI Toolkit だけ。動くところまで行きましたが、道は平らではありませんでした。
11件
パッケージ
uGUI は入れていない
3手
PanelSettings の置き方
2つは失敗した
1行
テーマ(.tss)の中身
無いと文字が出ない
1件
消えたエラー
作り直したら出なくなった
EventSystem は uGUI の型だった
最初に書いたシーン生成スクリプトは、こうでした。
using UnityEngine.EventSystems; // ← ここでコンパイルエラー
using UnityEngine.InputSystem.UI;
new GameObject("EventSystem", typeof(EventSystem), typeof(InputSystemUIInputModule));
error CS0234: The type or namespace name 'EventSystems' does not exist in the namespace 'UnityEngine'
EventSystem は uGUI パッケージ(com.unity.ugui)が持っている型です。uGUI を外したプロジェクトには存在しません。「UI Toolkit のボタンには EventSystem が要る」という話を前提にしていたので、ここで詰まりました。
調べ直すと、Unity 6.1 以降には PanelInputConfiguration があります。これをシーンに置くだけで、ボタンはブラウザでも反応しました(UNDO / RETRY / 面の選択、すべて実機の Chrome で確認)。
「UI Toolkit には EventSystem が必要」は、いまのバージョンでは当てはまらない。
PanelSettings を置く場所で2回失敗した
UI Toolkit を実行時に使うには PanelSettings が要ります。ここで3手かかりました。
1手目問題
エディターのスクリプトから document.panelSettings に代入 → 保存したシーンでは空のまま。SerializedObject 経由で書いても applied=False
2手目要注意
アセットにして Resources から実行時に読む → UI は出たが、Web ビルドの起動時に serialization のエラー
3手目
実行時に ScriptableObject.CreateInstance で作る → 割り当ても保存も要らなくなった
最終的にはこれだけです。
static PanelSettings CreatePanelSettings()
{
var settings = ScriptableObject.CreateInstance<PanelSettings>();
settings.themeStyleSheet = Resources.Load<ThemeStyleSheet>("DefaultRuntimeTheme");
settings.scaleMode = PanelScaleMode.ScaleWithScreenSize;
settings.referenceResolution = new Vector2Int(1080, 1920);
settings.match = 0.5f;
return settings;
}
テーマ(.tss)が無いと文字が出ない
PanelSettings にテーマを割り当てないと、文字が表示されません。テーマのファイルは自分で置けます。中身はこの1行だけで足りました。
@import url("unity-theme://default");
消せていないエラーを、そのまま書いておく
3手目まで来ても、Web ビルドの起動時に出るエラーは消えていません。
A scripted object (probably UnityEngine.UIElements.PanelInputConfiguration?) has a different serialization layout when loading. (Read 32 bytes but expected 60 bytes)
やったことと結果:
試したこと(どれでも消えなかった)
表示も入力も正常で、遊びには影響していませんでした。Unity 側の作り(エディターと実行時で持っている情報が違う)に見えますが、確かめきれなかったので、ここは「未解決」として公開しました。
追記(2026-09-19):この後のビルドで消えた
公開した数時間後、UI とは関係のない2か所(保存データの形・古くなった API の置き換え)を直してビルドし直したところ、このエラーは出なくなりました。本番のページを新しいブラウザで開いて、コンソールの全出力を数えた結果が下です。
RESULT 全件=77 serialization=0
原因は特定できていません。コードの2か所が効いたとは考えにくく、ビルドをやり直したこと自体で、古い状態が作り直された可能性が高いと見ています。同じエラーに当たったら、まず作り直してみるのは試す価値があります。
画面はこうなった

UI Toolkit を触ってみて、良かったところと引っかかったところを並べます。
良かった
引っかかった
サイズについて、言えることと言えないこと
このビルドは 6,963,556 バイト(Brotli・Managed Stripping High・IL2CPP サイズ優先)でした。2本目(uGUI のみ)は 7,524,439 バイトです。
ただし、これを「UI Toolkit のほうが軽い」とは書けません。2本のゲームは中身が違い、パッケージの数も違います(11件 と 16件)。
⚠️ 比べるなら、同じゲームで UI だけ入れ替える
サイズの差を主張したいなら、同じプロジェクトで UI の実装だけ差し替えて測る必要があります。まだやっていないので、ここでは「3本目は 6,963,556 バイトだった」という事実だけ書きます。
ちなみに、ビルド設定の効果ははっきり出ました。unity projects create の直後(Stripping 最小・速度優先)が 9,080,745 バイト、2本目と同じ設定(Stripping High・サイズ優先・スプラッシュ停止)にして 6,958,566 バイト。−23.4% です。
まとめ
- EventSystem は uGUI の型。uGUI を外したら使えないが、
PanelInputConfigurationで入力は届く PanelSettingsは実行時に作るのがいちばん確実だった(シーンに保存できない/アセットだとエラー)- テーマ(
.tss)が無いと文字が出ない。中身は@import1行 - 起動時の serialization エラーは、作り直したビルドで消えた(原因は不明・動作に影響は無かった)
- サイズの比較は、同じゲームで UI だけ入れ替えないと言えない
FAQ
よくある質問
UI Toolkit のボタンに EventSystem は必要ですか?
Unity 6.1 以降は不要でした。EventSystem は uGUI(com.unity.ugui)の型なので、uGUI を入れていないプロジェクトではそもそも使えません。代わりに PanelInputConfiguration をシーンに置けば、ボタンはブラウザでも反応します。
PanelSettings はどう用意すればいいですか?
このプロジェクトでは実行時に ScriptableObject.CreateInstance で作り、テーマだけ Resources から読み込みました。エディターからシーンへ割り当てる方法は保存されず、アセットにする方法は Web ビルドでエラーが出たためです。
UI Toolkit にすると軽くなりますか?
このプロジェクトのビルドは 6,963,556 バイトでした。ただし前の2本とは中身が違うので、これを「UI Toolkit のおかげ」とは言えません。同じゲームで UI だけ入れ替えて測らないと、差は出せません。
文字が出ないときは?
PanelSettings にテーマ(.tss)を割り当てているか確認してください。中身は @import url("unity-theme://default"); の1行で足ります。
この記事は役に立ちましたか?
NEXT
あわせて読む
効果音と画像を素材ファイルなしで作る(Unityでコードから生成)
AI にゲームを作らせると、コードは書けても素材が出てきません。画像も音もファイルを1つも置かず、四角・丸・三角と、計算した波形だけで1本作りました。実装と、増えたビルドサイズ(+111KB)と、この方法でできないことを残します。
Unity WebGLビルドの容量を27%削減した方法(10.1MB→7.4MB)
まず設定2つで 10,143,315 → 7,945,839 バイト。次に未使用パッケージ39件を外して 7,374,207 バイト。さらに使っていないシェーダー9本を落として 7,311,364 バイト。合計 −27.9% です。効かなかった施策(スプラッシュ停止)も数字ごと残します。
Webゲームの進行を保存する(何を保存しないか・壊れても落ちない形)
ブラウザで遊ぶパズルに「どこまでクリアしたか」と自己ベストを保存しました。盤面は保存しません。保存先がブラウザの領域であること、壊れた保存データで落ちない書き方、記事を書いていて気づいた「版が無い」という穴と、その直し方を残します。