はじめに

生成系AIを使ったチャットアプリケーションを開発するにあたって、ユーザーに対してどのようなUIを提供するのが適切か検討することが多いと思います。
検討材料として本家となるOpenAIのChatGPTのUIをもとに実装することが多いので、ChatGPTのUIについて整理しました。


外観

ChatGPTのアプリの外観は以下の通り。

出力はストリーミングで応答されます。

gif


サポート対象ファイル

原則全ファイルのアップロードが可能

UI上はアップロードファイルに制限はなく、どのファイルでもアップロード可能です。

ただし、下表の通り、ファイルの種類によってはLLMから正しい回答が得られないようになっています。

ドキュメント PDF
Html
Word
PowerPoint
Excel
画像 PNG
JPEG
WEBP
GIF
SVG
アーカイブファイル ZIP
実行ファイル EXE

ドキュメントファイル

各種ドキュメントファイルのアップロードが可能です。

  • PDF (.pdf)
  • Html (.html)
  • Word (.docx)
  • PowerPoint (.pptx)
  • Excel (.xlsx)

画像ファイル

サポートされているファイルは本件には明記なし。
Azure OpenAIの場合は画像ファイルに関しては、以下のファイルがサッカーされているとの記載あり。

  • PNG (.png)
  • JPEG (.jpeg and .jpg)
  • WEBP (.webp)
  • GIF (.gif).

Azure公式ドキュメント: 画像ファイル

SVGなどの上記以外のファイルはアップロードはできるが、LLMがファイル名をもとに推測した内容を回答するため、ファイルの中身と異なる内容を説明するというハルシネーションが発生してしまいます。

ZIPファイル

ZIPファイルをアップロードすると、ZIPファイルを展開して中身について回答してくれます。


Exeファイル

アップロードするとファイル名は認識していますが、中身を閲覧できないとう回答が返ってきます。


アイコンセット

OpenAIで使われている各種アイコンは以下の通りです。


おわりに

この記事では、ChatGPTのUIについてまとめました。
この記事が、生成系AIを開発されている方の参考になれば幸いです。