WEPPY

UI Studio ガイド

AIエージェントがゲームのスタイルに合うUIを作成するか、既存UIを分析して改善案を提案するワークフロー。

AIエージェントがRobloxのゲームスタイルに合うUIを直接作成するか、既存UIを分析して改善案を提案し、その結果をダッシュボードで確認するワークフローをまとめます。

UI Studio — ダッシュボードのUI Studioページ

概要

「UIを作って」のように依頼すると、次の流れが自動で進みます。

  1. 要件を整理 — 新しいUI作業の開始時に、AIが目的・画面・対象デバイスといった必須要件をガイド付き質問で整理します。
  2. UIを構成 — 整理された要件をもとに、メニュー、HUD、ボタン、ラベル、画像パネルなどのゲーム内UIを作成・更新・削除します。
  3. 結果を確認 — 現在の画面をキャプチャして結果を直接確認できます。
  4. 改善ポイントを提案 — タッチターゲットのサイズ・テキストのコントラスト・セーフゾーンなどの項目を点検し、AIに改善のヒントを提案します。

ダッシュボードの UI Studio ページでは、この流れの結果(リクエスト履歴、キャプチャ画面、提案された改善ポイント)を一か所でまとめて確認できます。

Roblox Studio — 実際のPlaceに生成されたUI

使い方

1. いつもの自然言語で依頼

特別なコマンドは不要です。普段どおりAIエージェントにお願いしてください。

モバイル横画面に合わせて、スタートボタンが中央にあるメインメニューUIを作って

不足している情報があれば、AIがガイド付き質問で確認した上で画面UIを作成します。

2. ダッシュボードで結果と点検内容を確認

ダッシュボードの UI Studio ページは2つのタブで構成されています。

History タブ

AIが処理したUIリクエストの履歴が時系列で並び、各リクエストごとにキャプチャ画面と適用された変更を確認できます。

History タブ — UIリクエストの履歴一覧

項目を開くと、同じUI対象のBefore/Afterキャプチャと記録された変更詳細を一緒に比較できます。

History 詳細 — Before/After比較

Analysis タブ

点検結果のサマリーとAIに提案された改善ポイント(タッチターゲット・コントラスト・セーフゾーンなど)を項目別に確認できます。

Analysis タブ — 点検結果のサマリー

カードをクリックすると詳細画面が開き、提案された改善ポイントはキャプチャ画面と一緒に項目別で表示されます。

改善ポイントの詳細 — 項目別の提案内容

Re-check Suggestions は同じ対象の改善提案を再計算します。新しいスクリーンショットは保存せず、現在の分析だけを更新します。

よくあるパターン

UI変更の確認

さっき追加したメインメニュー画面の結果を見せて

History タブで最新の項目を開くと、キャプチャされた結果と適用された変更を一画面で確認できます。

改善ポイントを反映して再依頼

さっき提案された改善ポイントのうち、タッチターゲット部分を反映してもう一度作って

Analysis タブで見た項目をそのまま自然言語で伝えれば、AIがその項目を反映してUIを構築し直します。

補足

  • UI Studio の結果はプロジェクト単位でディスクに保存されます。整理ポリシーはダッシュボードの Settings → Data & History → UI Studio で管理できます。
  • ダッシュボードでキャプチャ済みの結果を見直し、Design Check の提案を更新できます。
  • キャプチャは Edit モードを基準に動作します。プレイテスト中のキャプチャは Roblox プラットフォームの制約によりサポートされません。