AIエージェントアプリは、チャット画面を付けるだけでは完成しません。 利用者の入力、エージェントの計画、外部操作、確認、進捗、結果を一つの体験として設計します。 開発では、短い対話は同期処理、時間がかかる仕事はバックグラウンド処理へ分け、重要な操作の直前で利用者が内容を確認できるようにします。
AIエージェント開発を体系的に学びたい方は、AIエージェントが学べるおすすめスクールで、AI活用、Python実装、マンツーマン支援の違いを比較できます。
| 画面状態 | 利用者へ示す内容 | システムの処理 |
|---|---|---|
| 入力待ち | 必要な情報と例 | 入力検証 |
| 実行中 | 現在の段階 | 道具呼び出し |
| 確認待ち | 対象と変更内容 | 処理を一時停止 |
| 完了 | 結果と根拠 | 状態を保存 |
| 失敗 | 原因と次の選択肢 | 再試行または終了 |
利用者のゴールから画面状態を設計する
先にチャット画面を作ると、質問と回答だけで仕事が完了したように見えます。たとえば出張手配なら、条件入力、候補比較、選択、予約前確認、完了報告という状態が必要です。
OpenAI Apps SDKのBuild資料では、モデルが使う道具、画面部品、ChatGPTとの接続を分けてアプリを構成します。W3CのWCAG 2.2 Quick Referenceも参照し、色だけに依存しない状態表示、キーボード操作、明確なラベルを用意します。
画面状態の設計順。
- 利用者が得たい最終状態を決める
- 必要な入力と不足時の質問を決める
- 時間がかかる段階を分ける
- 確認が必要な操作を指定する
- 完了と失敗の表示内容を決める
対話とバックグラウンド実行を分ける
数秒で終わる検索と、複数の資料を調べて成果物を作る処理では、適切な画面が異なります。長い処理を一つの通信で待たせず、タスクIDを発行し、進捗を保存して、利用者が画面を離れても再開できる構成にします。
OpenAI APIのBackground mode資料では、長時間の処理を非同期で実行し、状態を確認する方法が説明されています。OpenAI APIのWebhook資料は、処理完了などのイベントをサーバー側で受け取る方法を示しています。
| 処理方式 | 向く仕事 | 画面上の扱い |
|---|---|---|
| 同期 | 短い質問、入力補助 | その場で結果表示 |
| ストリーミング | 長めの文章生成 | 途中経過を表示 |
| バックグラウンド | 調査、複数ファイル処理 | 進捗と通知 |
| 定期実行 | 監視、集計 | 履歴と次回予定 |
重要な実行は確認画面で止める
送信、予約、削除、公開、購入などは、対象と変更内容を自然文で再表示し、確定前に止めます。モデルが作った要約だけでなく、実際にAPIへ渡す主要項目も表示すれば、取り違えを見つけやすくなります。
OpenAI Apps SDKのSecurity and Privacy資料では、最小権限、明示的な同意、信頼できない入力への対策などが説明されています。画面に表示した内容と実行パラメータを結び付け、確認後に内容が変わった場合は再確認を求めます。
確認画面に置く項目。
- 実行する操作名
- 対象となる相手やデータ
- 変更前と変更後
- 金額、日時、公開範囲
- 取り消し可能か
- 実行しない選択肢
完了と失敗を次の行動へつなげる
完了画面には、実行した内容、処理ID、参照した根拠、保存先を示します。失敗画面では「エラーが発生しました」だけで終えず、入力修正、再試行、担当者への引き継ぎのどれが可能かを表示します。
Reactの状態管理資料は、画面状態を重複させず、必要最小限の状態として管理する考え方を説明しています。エージェントの内部ログをそのまま画面へ出すのではなく、利用者が判断できる状態へ変換します。
AIエージェントの作り方では、画面開発に入る前の目的設定と試作範囲を整理できます。
AIエージェントアプリ開発でよくある質問
AIエージェントアプリにはチャット画面が必須ですか?
必須ではありません。定型入力、ボタン、進捗一覧の方が誤入力を減らせる業務もあります。自由な相談は対話、確定した条件はフォーム、継続する仕事はタスク一覧というように、利用者の判断へ合う部品を選びます。
長時間の処理中に画面を閉じても大丈夫ですか?
バックグラウンド処理としてタスク状態をサーバーへ保存すれば、再訪時に進捗を表示できます。通信をつないだままにするだけでは切断時に結果を失うため、タスクID、状態、再開方法を設計します。
確認画面はどの操作に必要ですか?
取り消しにくい操作、外部へ影響する操作、金銭や権限に関わる操作には必要です。検索や下書きのような低リスク操作は確認を減らし、送信、公開、削除の直前で具体的な対象を示します。
良いアプリは実行の状態を利用者と共有する
AIエージェントアプリでは、自然な会話より、今どの状態で何を確認すべきかが明確であることが重要です。対話、実行、確認、結果を一つの状態遷移として設計します。
- 画面は利用者のゴールと業務状態から設計
- 長い仕事はタスクIDを持つ非同期処理へ分離
- 重要操作は実パラメータを示して確認
- 完了と失敗の両方に次の行動を用意
次の開発テーマを選ぶ場合は、AIエージェント開発の進め方で小さく検証できる対象を決められます。




