# ユーザーのチャット画面

{% hint style="info" %}
ジェラート作成で内容を更新して保存すると、チャットボットにすぐに反映されます。
{% endhint %}

## **ユーザー会話画面とは？**

「ジェラート作成」でジェラートを作成し、設置を行うと、顧客がジェラートを使用できるようになります。\
最終顧客に表示される画面を「ジェラートユーザー会話画面」と呼びます。\
ジェラートAIチャットボットでは、モーダル型とフルページ型の2種類のユーザー会話画面タイプを提供しています。

{% hint style="success" %}

* **モーダル型**：現在の画面上に小さなウィンドウとして表示され、ページ移動なしにすぐに対話できる会話画面です。
* **フルページ型**：専用ページで集中して深い対話や業務を行うことができる会話画面です。
  {% endhint %}

### **モーダル型**

モーダル型は、チャットウィンドウとチャット履歴の2つの画面に分かれています。

<figure><img src="/files/3g0ATVXtr2gDAqj7RiAN" alt=""><figcaption></figcaption></figure>

#### **1. チャットウィンドウ**

チャットウィンドウは、実際のユーザーがAIチャットボットと質疑応答を行う画面です。

<figure><img src="/files/qVsAOVKNbCzsUuNN8K8n" alt=""><figcaption></figcaption></figure>

a. プロフィール領域：「ジェラート作成 > 基本設定 > 設定タブ」で設定したプロフィール設定および基本値設定の内容が反映されます。カラーテーマは「ジェラート作成 > スタイルタブ」で設定したテーマカラーが全体に適用されます。

b. 拡大ボタン：クリックするとチャット画面が拡大されます。

<figure><img src="/files/8AMdxNfmb0qeluMEqqVR" alt=""><figcaption></figcaption></figure>

c. 新しい会話ボタン：クリックすると新しいチャット画面で新しい会話を始められます。

d. 閉じるボタン：クリックするとチャット画面が閉じられます。

e. チャット履歴へ移動ボタン：クリックするとチャット履歴画面に移動します。

f. 初回メッセージ：「ジェラート作成 > 基本設定 > 基本値設定 - 初回メッセージ」で設定した内容が表示されます。

g. 注意文：「生成AIは誤った回答をする可能性があります。」という固定メッセージが表示されます（このメッセージは削除できません）。

h. 推奨質問：「ジェラート作成 > 基本設定 > 基本値設定 - 推奨質問」で設定した内容が表示され、クリックするとその内容で質問が送信されます。

i. 質問入力欄：ユーザーが質問を入力する領域です。回答中は別の質問を送信できません。\ <sub>- 最大500文字まで入力可能です。</sub>

j. ジェラートラベル：クリックするとジェラートのホームページが開きます。

{% hint style="info" %}
ラベルの削除をご希望の場合は、別途お問い合わせください。
{% endhint %}

k. ジェラートウィジェット：クリックでチャット画面が開き、もう一度クリックすると閉じられます。

#### **2. チャット履歴**

チャット履歴は、ジェラートチャットボットとの過去の会話記録を確認できるリストです。チャット履歴はクッキーIDを基準に確認でき、ログイン状態の場合は会員IDを基準に履歴が表示されます。

{% hint style="warning" %}
同一ユーザーであっても、非ログイン状態での会話（クッキーID）**と**ログイン状態での会話（会員ID）の履歴は共有されません。
{% endhint %}

<figure><img src="/files/MRuPl0iFm8cnRQGfAbEl" alt=""><figcaption></figcaption></figure>

a. チャットリスト：クッキーIDまたは会員IDを基準にしたチャット履歴リストを確認できます。\
履歴には直近の会話の一部が表示され、チャットが行われていない場合は「質問を入力してください。」と表示されます。

b. 新しい会話ボタン：クリックすると新しいチャットウィンドウに移動します。

{% hint style="info" %}
上部のアイコンボタンはチャット画面と同様の動作をします。
{% endhint %}

### **フルページ型**

フルページ型では、チャットボットウィジェットをクリックすると、ジェラートチャットボットの画面が新しいタブで開きます。\
フルページ型は、基本画面と会話画面の2つの画面に分かれています。

<figure><img src="/files/oFF5RyG999POmAx8YNyi" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
フルページ型の画面はレスポンシブ対応で提供されます。
{% endhint %}

#### **1.** 基本画面

基本画面は、新しい会話を開始する際にユーザーに最初に表示される画面です。

<figure><img src="/files/rzbFnVCYBAusBs0B1M02" alt=""><figcaption></figcaption></figure>

a. プロフィール領域：「ジェラート作成 > 基本設定 > 設定タブ」で設定したプロフィール設定および基本値設定の内容が反映されます。 カラーは「ジェラート作成 > スタイルタブ」で設定したテーマカラーが全体に適用されます。

b. 代表文句：画面中央にメインとして表示される文言です。

c. 初回メッセージ：「ジェラート作成 > 基本設定 > 基本値設定 - 初回メッセージ」で設定した内容が表示されます。

d. 質問入力欄：ユーザーが質問を入力する領域です。回答中は別の質問を送信できません。\ <sub>- 最大500文字まで入力可能です。</sub>

e. 推奨質問：「ジェラート作成 > 基本設定 > 基本値設定 - 推奨質問」で設定した内容が表示され、クリックするとその内容で質問が送信されます。

f. 注意文：「生成AIは誤った回答をする可能性があります。」という固定メッセージが表示されます（このメッセージは削除できません）。

#### **2. 会話画面**

会話画面は、実際にユーザーがAIチャットボットと質疑応答を行う画面です。

{% hint style="warning" %}
同一ユーザーであっても、非ログイン状態での会話（クッキーID）**と**ログイン状態での会話（会員ID）の履歴は共有されません。
{% endhint %}

<figure><img src="/files/QYB7X8LkbrjWvw7W2VlM" alt=""><figcaption></figcaption></figure>

a. 新しい会話ボタン：クリックすると新しいチャット画面で新しい会話を始められます。

b. チャットリスト：クッキーIDまたは会員IDを基準としたチャット履歴リストを確認できます。\
履歴には直近の会話の一部が表示され、会話がない場合は「質問を入力してください。」と表示されます。

c. ジェラートラベル：クリックするとジェラートのホームページが開きます。

{% hint style="info" %}
ラベルの削除をご希望の場合は、別途お問い合わせください。
{% endhint %}

d. 折りたたみ／展開：クリックするとチャットリストを折りたたんだり展開したりできます。

### **回答の例画面**

<figure><img src="/files/YVxh7xx4Me6OUyNJXh7g" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/siCviJv6anoEhgW7cIYn" alt=""><figcaption></figcaption></figure>

* 回答を待っている間にローディング効果が表示されます。
* テキスト、画像、表、リンクなど、さまざまな形式の回答が可能です。

{% hint style="warning" %}
回答内のリンクをクリックすると**新しいウィンドウ**で開きます。モバイル環境では、リンククリック時に新しいウィンドウで開くには、別途イベントの実装が必要な場合があります。
{% endhint %}

* ユーザーが回答に対して「良いです／残念です」でフィードバックできる回答フィードバック機能があり、フィードバック内容は「分析レポート」メニューで確認できます。
* 回答コピー（複製）ボタンにより、回答をコピーできます。


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://groobee.gitbook.io/gelatto/ja/ai-chatbot/create-gelatto/chat-interface.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
