活用プロンプト例

エージェント：ドキュメントエージェント

<aside> <img src="notion://custom_emoji/be6005d7-8302-4c8e-93fe-03d0d3d71970/12f3c107-d7a8-8009-8054-007a9b09b0b8" alt="notion://custom_emoji/be6005d7-8302-4c8e-93fe-03d0d3d71970/12f3c107-d7a8-8009-8054-007a9b09b0b8" width="40px" />

@会員情報更新 のユースケースドキュメントを参考に、必要な画面を設計し、 @Android画面設計書テンプレート の様式に沿って出力して。

</aside>

テンプレート

Android画面設計書テンプレート.md

# Androidアプリ画面設計書

## 1. 基本情報

- 画面ID:
- 画面名:
- 機能概要:
- 対応OSバージョン:
- 対応端末:

## 2. 画面レイアウト

### 2.1 レイアウト構成

以下の凡例に沿って当該画面の構成をMermaidで作成すること。具体的なファイル名を分析した依存関係を元にファイル名ごとにオブジェクトを作成すること。

```mermaid
%%{init: {'theme': 'neutral', 'themeVariables': { 'fontFamily': 'arial', 'fontSize': '16px'}}}%%
flowchart TD
    A["画面/ページ"] 
    B>"コンポーネント"]
    C{"条件分岐"}
    D[["フォーム要素"]]
    E[("データ表示")]
    F(["アクション/ボタン"])

    classDef page fill:#d0d1ff,stroke:#333,stroke-width:2px,color:#000
    classDef component fill:#ffe680,stroke:#333,stroke-width:2px,color:#000
    classDef condition fill:#c2e0c2,stroke:#333,stroke-width:2px,color:#000
    classDef form fill:#ffcce0,stroke:#333,stroke-width:2px,color:#000
    classDef data fill:#c6c6ff,stroke:#333,stroke-width:2px,color:#000
    classDef action fill:#ffb3b3,stroke:#333,stroke-width:2px,color:#000

    class A page
    class B component
    class C condition
    class D form
    class E data
    class F action

    %% スタイルを各ノードに適用して文字を中央寄せにします
    style A text-align:center
    style B text-align:center
    style C text-align:center
    style D text-align:center
    style E text-align:center
    style F text-align:center
線種 表記 意味
--> 実線矢印 画面遷移、親子関係、直接的な関係
-.-> 点線矢印 イベント発火、アクション実行
--- テキスト --- ラベル付き線 関係性の説明（遷移、含む、表示など）
--o 白丸終端 関連付け（弱い結合）
--\* 黒丸終端 集約関係（強い結合）

2.2 画面方向

2.3 レイアウトリソース

2.4 デバイス対応

3. UI構成要素

3.1 コンポーネント一覧

No コンポーネントID 種類 表示テキスト 表示条件 レイアウト位置

3.2 入力項目定義

No 項目ID 表示名 入力種類 入力制限 最大長 必須 初期値 IMEタイプ

3.3 入力検証ルール

3.3.1 テキスト入力

3.3.2 数値入力

3.3.3 選択入力

3.4 リスト表示定義

3.4.1 リスト構成

3.4.2 リストアイテム

3.5 アニメーション・トランジション

4. アクション定義

4.1 ユーザーアクション一覧

アクションID トリガー 対象コンポーネント 表示条件 有効条件

4.2 クリックアクション定義

4.2.1 ボタン1

4.3 タッチアクション定義

4.3.1 スワイプ

4.3.2 長押し

4.4 システムアクション定義

4.4.1 バックキー

4.4.2 メニューキー

5. データバインディング

5.1 データモデル

5.2 バインディング方式

5.3 LiveData定義

6. 通信・データ連携

6.1 API連携

  [ヘッダ情報]


  [パラメータ形式]


  [リクエスト形式]

6.2 レスポンス仕様

  [レスポンス形式]


  [エラーレスポンス形式]

6.3 ローカルデータ

7. エラー・メッセージ定義

7.1 検証エラー

コード メッセージ 表示方法 表示位置

7.2 システムエラー

コード メッセージ 表示方法 リトライ可否

7.3 通信エラー

シナリオ メッセージ 表示方法 リカバリー方法

7.4 メッセージ表示方式

8. パフォーマンス最適化

8.1 UI描画最適化

8.2 メモリ管理

8.3 バッテリー効率

9. セキュリティ要件

9.1 データセキュリティ

9.2 入力値検証

9.3 アクセス制御

10. アクセシビリティ対応

10.1 コンテンツ記述

10.2 入力補助

10.3 TalkBack対応

11. 画面遷移・状態管理

11.1 遷移元画面

11.2 遷移先画面

11.3 状態保存

11.4 ライフサイクル処理


### アウトプットイメージ

```markdown
# Androidアプリ画面設計書：会員情報更新画面

## 1. 基本情報

- 画面ID: member\\_profile\\_update
- 画面名: 会員情報更新画面
- 機能概要: 会員が「メールアドレス」「パスワード」「プロフィール画像」の変更を安全に行う更新インターフェイス
- 対応OSバージョン: Android 8.0以上
- 対応端末: 標準スマートフォン、タブレット

## 2. 画面レイアウト

### 2.1 レイアウト構成

```mermaid
flowchart TD
    A["会員情報更新画面"] 
    B[["メールアドレス入力フォーム"]]
    C[["パスワード変更フォーム"]]
    D[["プロフィール画像アップロード"]]
    E(["バリデーションメッセージ表示"])
    F(["保存ボタン"])
    G(["キャンセルボタン"])
    H(["処理結果メッセージ枠"])

    A --> B
    A --> C
    A --> D
    B -.-> E
    C -.-> E
    D -.-> E
    A --> F
    A --> G
    A -.-> H

2.2 画面方向

2.3 レイアウトリソース

2.4 デバイス対応

3. UI構成要素

3.1 コンポーネント一覧

No コンポーネントID 種類 表示テキスト 表示条件 レイアウト位置
1 emailField EditText 現在のメールアドレス 常時 上段
2 newEmailField EditText 新しいメールアドレス 常時 emailField下
3 pwdCurrentField EditText 現在のパスワード パスワード変更時 メール欄下
4 pwdNewField EditText 新しいパスワード パスワード変更時 pwdCurrentField下
5 pwdConfirmField EditText 新パスワード再入力 パスワード変更時 pwdNewField下
6 profileImage ImageView プロフィール画像 常時 下部中央
7 uploadButton Button 画像を選択/変更 常時 image下
8 saveButton Button 保存 入力有効時 下部右
9 cancelButton Button キャンセル 常時 saveButton左
10 messageBox TextView バリデーション・結果メッセージ 状態に応じて 下部全体

3.2 入力項目定義

No 項目ID 表示名 入力種類 入力制限 最大長 必須 初期値 IMEタイプ
1 emailField 現在メール text メール形式 256 ○ 会員状態より email
2 newEmailField 新メール text メール形式 256 △ 空 email
3 pwdCurrentField 現パスワード password 8-32文字 32 △ 空 password
4 pwdNewField 新パスワード password 強度8-32文字 32 △ 空 password
5 pwdConfirmField 新パス再入力 password 一致確認 32 △ 空 password

3.3 入力検証ルール

3.3.1 テキスト入力

3.3.2 数値入力

3.3.3 選択入力

3.4 リスト表示定義

3.5 アニメーション・トランジション

4. アクション定義

4.1 ユーザーアクション一覧

アクションID トリガー 対象コンポーネント 表示条件 有効条件
actSaveProfile タップ saveButton 入力有効時 バリデーションOK
actCancelUpdate タップ cancelButton 常時 常時
actUploadProfile タップ uploadButton 常時 常時

4.2 クリックアクション定義

4.2.1 保存ボタン

4.3 タッチアクション定義

4.4 システムアクション定義

5. データバインディング

5.1 データモデル

5.2 バインディング方式

5.3 LiveData定義

6. 通信・データ連携

6.1 API連携

Authorization: Bearer ...
Content-Type: application/json


{
  "email": 新メールアドレス,
  "currentPassword": 現パスワード,
  "newPassword": 新パスワード,
  "profileImage": Base64エンコード等
}

6.2 レスポンス仕様

{
  "result": "success | error",
  "message": "詳細メッセージ",
  "errorField": "email | password | image | null"
}


{
  "result": "error",
  "message": "パスワード誤り/メール重複/画像不正 etc",
  "errorField": "該当フィールド"
}

6.3 ローカルデータ

7. エラー・メッセージ定義

7.1 検証エラー

コード メッセージ 表示方法 表示位置
E\_EMAIL\_FMT メール形式が正しくありません 下部ラベル newEmailField
E\_EMAIL\_DUP 既に登録済みメールです 下部ラベル newEmailField
E\_PWD\_WEAK パスワード強度不足 下部ラベル pwdNewField
E\_PWD\_DIFF 新パスワードが一致しません 下部ラベル pwdConfirmField

7.2 システムエラー

コード メッセージ 表示方法 リトライ可否
S\_TIMEOUT 通信タイムアウトが発生しました ダイアログ ○
S\_SERVER サーバー障害中 ダイアログ ○
S\_SESSION セッション切れ ダイアログ ×

7.3 通信エラー

シナリオ メッセージ 表示方法 リカバリー方法
通信失敗 ネットワークに接続できません Snackbar リトライ、キャンセル
画像失敗 画像アップロード不可 Snackbar 再アップロード

7.4 メッセージ表示方式

8. パフォーマンス最適化

8.1 UI描画最適化

8.2 メモリ管理

8.3 バッテリー効率

9. セキュリティ要件

9.1 データセキュリティ

9.2 入力値検証

9.3 アクセス制御

10. アクセシビリティ対応

10.1 コンテンツ記述

10.2 入力補助

10.3 TalkBack対応

11. 画面遷移・状態管理

11.1 遷移元画面

11.2 遷移先画面

11.3 状態保存

11.4 ライフサイクル処理