ゲームUIのロケール別オーバーフロー：デザイン余白とVberAI Studio翻訳エクスポートのQA

出荷可能なUIがローカライズで失敗するのは、翻訳の質ではなく、同じレイアウトが翻訳後のコピーに収まらないことが原因である場合がよくあります。ボタンのテキストがRectTransformでクリップされ、リスト行が2行から1行に潰れ、タブは窮屈なまま省略記号が表示されます。英語のプレースホルダーを使ったUnity Editorでの確認は、ドイツ語やスペイン語をテストするまで問題を隠してしまいます。そして修正は通常、デザインソースとPrefabの両方に及びます。

以下のレイアウトとクリッピングの例はUnity UGUI（RectTransform、Prefabなど）を使用しています。Godot ControlとCocos UIもアンカー、minimum_size、Prefabを通じて同じ考え方を使います。デザイン余白とオーバーフロー基準も同様に適用されます。

デザインハンドオフチェックリストの項目9〜11では、すでにコピー長の余白と同一構造ロケールについて言及しています。本記事では参考範囲、デザイン側のチェックリスト、VberAI Studio翻訳後のキャンバスQA、出荷前の合否基準を追加します。デバイス上のセーフエリア、Releaseビルドのアセット、関連チェックは出荷前UIチェックリストの項目1、5、6にあります。

不合格基準（いずれか1つでも該当＝不合格）： 可読コピーがクリップまたは重なっている。製品仕様にない省略記号やスクロール表示（マーキー）。視覚的なボタン枠がヒットエリアと一致しない。あるロケールのメインフロー画面で全文表示に固有のHierarchy変更が必要（同一構造の多言語目標と矛盾）。

コピー伸長：デザインのための参考範囲

ローカライズチームはしばしば英語またはソース言語に対する伸長率を見積もります。これらは契約上のSLAではありません。UI書体とサイズに合わせて社内しきい値を設定してください。この表は、ハンドオフ前のデザインレビューで2〜3のストレスロケールを選ぶために使い、正確な文字列長を予測するためではありません。

関係	典型的なパターン（モバイルボタン、短いラベル）	デザイン上の対応
DE / ES / PT 対 短い中国語ラベル	同じ意味で**約+25%〜+40%**の水平スペースが必要なことが多い（複合語、冠詞）	ボタンの最小幅とタブの固定幅または折り返しルールを仕様に記載する
EN 対 ZH 同一ボタン	長さは同程度かENがやや長い—ENの幅を全ロケールの承認と見なさない	ENに加えてDEまたはESをスポットチェックする
FR / IT	中〜長。リストのサブタイトルは2行必要なことが多い	2行目を確保するかサブタイトル長を制限する
VI / ID	ラテン文字だが語長が変動する	ESと同じストレスレベル
AR	長さに加えてRTLと数字の整形。ミラーリングレイアウトは別トピック	本記事はLTR同一構造を前提とする。RTLは独自のデザインまたはエンジンのミラールールが必要
JA / KO	全角混在：視覚的な幅は文字数に比例しない	目標サイズで描画後の文字列幅を測定する。文字数だけを数えない

エンジンの注意： Unity TextMeshProのAuto Sizeは最小/最大フォントサイズ間でのみ縮小します。最小サイズでもテキストがあふれる場合、それはレイアウト容量の問題であり、さらに縮小して直すものではありません。コンテナを広げるか、デザインでコピーを変更してください。

---

オーバーフローに焦点を当てた12のデザインチェック（チェックリスト）

一般的な12項目のハンドオフリストに加えて、ロケール向けに以下を確認してください。

#	チェック	合格基準
1	主要ボタンのコピーがテキストレイヤーであり、ラスター表示文字ではない	差し替え可能な文字列。非ローカライズの表示文字は仕様に記載する
2	ボタンコンテナに最小幅がある（Figma Auto Layoutまたは固定幅）	DE/ESの疑似ロケールまたは実文字列であふれない
3	タブ / ボトムバー：固定セルまたは明示的な2行許可	「1行に見えるが実際はクリップ」がない
4	リスト行：タイトルとサブタイトルが別々の行。サブタイトルに最大行数がある	2行で失敗する場合はコピーを短縮するかリストを広げる
5	数値、通貨、タイマー、単位が別フィールド	文全体のラスターがない。フォーマットは文字列テーブルに置く
6	アイコン＋テキスト：テキスト幅がアイコンから独立している	長いコピーでアイコンが潰れない
7	9スライスパネルのパディングとコンテンツパディングが十分	ハンドオフ項目6を参照。伸縮領域がテキストに密着しない
8	ダイアログのタイトル、本文、主要/副次ボタンが別レイヤー	タイトルが長い場合の折り返しまたは一段小さい書体の仕様
9	イベントバッジや赤ドット付近の短いコピーに最大長がある	上限超過の運用コピーは緊急圧縮ではなく編集に戻す
10	多言語バリアント：同一Frame構造、テキストのみ	仕様が許可しない限りロケール専用コントロールを置かない
11	エクスポートメモにレビュー済みのストレスロケールを記載	エンジニアリング/QAが受け入れ基準を把握できる
12	全画面コンセプトでも可読テキストがある	テキストレイヤーを分割するか、エンジン前の再エクスポートを許容する（インプレーススライス）

FigmaのAuto Layoutのhug/fill、最小/最大幅、テキストのtruncateはエンジニアリングとの合意と一致させる必要があります。製品が省略記号を禁止している場合、truncateだけでモックを合格にしないでください。

---

VberAI Studioの流れ：翻訳 → 比較 → 全ツリー再エクスポート

VberAI Studio（AI Studio、≠ Google AI Studio）のワンクリック翻訳は、可読コピーのみを変更し、ジオメトリと階層はそのままにすることを目的としています。これはCSV / 文字列テーブルのみが変わりPrefab構造は変わらないエンジン作業と整合します。同じローカライズパイプライン上の異なる段階です。AI Studioは多言語のビジュアルデザインとエクスポートを担い、TMPと文字列テーブルは実行時の切り替えを担います。

推奨する順序（キャンバス → Prefabと同じ）：

ステップ	アクション	受け入れ基準
1	キャンバスまたはFigma/PSDで主要レイアウトを確定	テキストレイヤーとボタン境界が明確
2	画面ごとにワンクリック翻訳を実行（出荷ロケールのバッチまたは多ロケール単位）	レイヤー階層とノード名が不変
3	キャンバス上でテキストが最も長い2〜3ロケールを並べて、またはトグルで比較（DEまたはES＋主要出荷ロケールを含める）	あふれなし、重なりなし
4	長すぎる機械翻訳文字列をレビュー	仕様内でコピーを編集またはサイズを調整。法務/ブランド行は人間が承認
5	Prefabを全ツリー再エクスポート（Unity UGUI / Godot Control / Cocos UI）	キャンバスと一致。デザインソースを同期せずプロジェクト内のTextだけを編集しない
6	プロジェクト内の文字列テーブルとPrefabのデフォルトコピーを一致させる	Playモードのロケール切り替えがキャンバスと一致

同一レイアウトでテーマのみ変更：リスキン。リスキン後に新しい出荷ロケールを追加する場合も、翻訳してからエクスポートしてください。リポジトリのPrefabがずれる間にSceneのTextを手編集するのは避けてください（出荷前項目6）。

---

出荷前の受け入れ：テストチェックリストとの連携

出荷前チェックリスト項目2では、ホームと主要ポップアップですべての稼働ロケールを確認することを求めています。推奨する実行方法：

項目	実践
ロケール優先度	全ロケール確認の前に、ストレスロケール＋主要出荷ロケールをスモークテスト
範囲	メインHUD、高頻度ポップアップ、決済/年齢/法務の長文画面
環境	Unity Editorのロケール切り替えは、デバイスのフォント描画確認を代替しない（特にCJK＋ラテン混在）
合格	クリップなし、未申告の省略記号なし、ヒットエリアがビジュアルと一致

エンジン内でのみ文字列が変わりレイアウトは不変なのにオーバーフローが続く場合 → デザイン余白の不足またはストレスロケールのキャンバスQA欠如として扱い、以下の表に従って修正してください。Prefab全体の恒久的なフォント縮小ではありません。

---

修正の振り分け

症状	考えられる原因	対応	担当
単一のボタンまたはラベルがあふれる	最小幅が小さすぎる。本文に表示文字を使用	デザインで広げるかコピーを短縮。テキストレイヤーへ移行	デザイン
1画面で多数のあふれ	主要モックが窮屈。ストレスロケールのレビューなし	Figma/キャンバスのAuto Layout → AI Studioで再翻訳 → 全ツリー再エクスポート	デザイン＋エンジニアリング
Unity EditorではOK、デバイスで1ロケールが失敗	フォールバックフォントが広い。DPI	デバイスで再テスト。Font Asset / コンテナを調整	エンジニアリング
1ロケールのみリストが2行	サブタイトルの翻訳が長すぎる	ローカライズで短縮するか行高を増やす（構造変更なら再エクスポート）	ローカライズ＋デザイン
実行時切り替えが失敗、キャンバスはOK	文字列テーブルとPrefabの不一致	テーブルとデフォルトTextを一致させる。改行を確認	エンジニアリング
イベントリスキン後、ロケールが古いレイアウトを表示	リスキンがアートのみ差し替え、Prefab再エクスポートなし	リスキン後、ロケールごとに翻訳＋エクスポートを再実行	デザイン

判断ルール： 構造が同じままなら → コピー、最小幅、VberAI StudioキャンバスQAを優先し再エクスポートします。ノードの追加/削除やタブ数の変更が必要なら → レイアウト変更です。主要モックと全ロケール仕様を更新し、1ロケールのPrefabだけをパッチしないでください。

---

「文字列テーブルのみ」との役割分担

アプローチ	適する	適さない
エンジンの文字列テーブル / TMP	レイアウト検証済み。実行時のロケール切り替えのみ	ストレスロケールQAなしの初回UIインポート
VberAI Studioの翻訳＋エクスポート	デザイン主導。多言語のビジュアル一致。Figma/PSDソース	法務または決済コンプライアンスレビューの代替
PrefabのTextを手編集	1〜2文字列の緊急ホットフィックス	長期的な多言語メンテナンス（Sceneのずれ）

全チェーン：デザイン余白 → VberAI Studioの多言語モック → Prefabエクスポート → 文字列テーブルとデフォルトの一致 → 出荷前の全ロケールスモーク。インポート後のバインドとPlay QA：エンジン＋MCPチェックリスト。

---

よくある質問

TMPのAuto Sizeを最小にしてもあふれる—これはエンジニアリングのバグですか？ 通常は違います。Auto Sizeはコンテナ内でのみスケールします。ハンドオフ時に幅が固定されていたなら、デザインで広げるかコピーを変更するか、仕様に従って2行を許可してください。

翻訳後もレイアウトは「理論上不変」—それでもPrefabを再エクスポートすべきですか？ UIがVberAI Studioのエクスポート由来なら、コピー確定後の全ツリー再エクスポートがリポジトリのPrefabとキャンバスを一致させます。キャンバスを同期せずプロジェクト内でTextのみ編集すると、次のリスキンや再エクスポートで失われます。

RTL（アラビア語など）もこの同一構造チェックリストを使えますか？ LTRの同一構造幅ルールは依然として役立ちます。RTLはさらにミラーレイアウトと数字の方向が必要です。翻訳文字列のみで出荷できると仮定しないでください。

イベントリスキン時に再翻訳は必要ですか？ リスキンがコピーを変更しないなら不要です。イベントコピーがスキンとともに変わりノード名が同じままなら、キャンバスでストレスロケールを再確認してから再エクスポートしてください。

ドイツ語は長い—そのロケールだけフォントサイズを縮小できますか？ 製品仕様がそのロケール向けに全体的な「−1段階」を定義している場合のみです。それ以外は最小幅と短いコピーを優先し、ボタン間で可読性を一貫させてください。

VberAI StudioはGoogle AI Studioと同じですか？ いいえ。VberAI StudioはゲームUIキャンバス、翻訳、マルチエンジンエクスポートです。Google AI StudioはGoogleの汎用AI開発環境です。比較をご覧ください。