このページでは、Google Workspace ユーザー インターフェース（UI）を拡張するためのオプションについて説明します。Google Workspace の UI は、さまざまな理由で拡張できます。
- アプリやサービスを Google Workspace に統合して、ユーザーが 1 つ以上の Google Workspace アプリから直接アプリを使用できるようにします。たとえば、Google ドキュメント内でサービスのスマートチップとリンク プレビューを作成する Google Workspace アドオンを作成します。
- Google Workspace ユーザーの生産性を高め、ワークフローを改善できるように支援します。 たとえば、ユーザーが Google Chat から直接週次タイムシートを報告できる Google Chat アプリを作成します。
- Google Workspace ではネイティブに利用できない機能を追加できます。 たとえば Google ドキュメント、スプレッドシート スライドでカスタムメニューを追加できます
Google Workspace UI を拡張するオプションの大部分は、Google Workspace Marketplace に公開できます。Google Workspace Marketplace は、ユーザーが Google Workspace と統合するサードパーティ アプリを検索してインストールできるオンライン ストアです。
Google Workspace UI の拡張オプションの概要
次の表は、Google Workspace UI を拡張するためのオプションを、これらの特性で比較したものです。
- 拡張されたアプリ: 指定されたオプションで拡張できる Google Workspace アプリが一覧表示されます。
- コーディング オプション: 以下のようなビルド方法が一覧表示されます。
- AppSheet: コード不要の開発プラットフォーム。
- Apps Script: JavaScript をベースにしたクラウドベースのローコード開発プラットフォーム。
- 完全な開発: 任意のコーディング言語をサポートする独自の技術スタック。
- UI フレームワーク: 各オプションのビルドに使用できる UI フレームワークのタイプを示します。以下はそのタイプです。
- カードベース: カード インターフェースは、Apps Script を使用してカードサービスで作成されるか、適切な技術スタックでカードをレンダリングするために適切にフォーマットされた JSON を返すことにより、事前定義されたウィジェットとカードです（フル開発）。カードベースのインターフェースは HTML や CSS の知識を必要とせず、デスクトップ クライアントとモバイル クライアントの両方で適切に機能します。
- HTML: Apps Script は、サーバーサイドの Apps Script 関数とやり取りできるウェブページを開発するための HTML サービスを提供します。HTML サービスで開発されたインターフェースは高度なカスタマイズが可能ですが、優れたユーザー エクスペリエンスを実現するには、多くの手作業が必要です。
- iFrame: iFrame は、Google Workspace に外部コンテンツを埋め込み、ユーザー インターフェースを高度にカスタマイズできます。
次の表に、各オプションの説明を示します。
| 作成できるもの | プレビュー | アプリの拡張 | コーディング オプション | カードベースの UI | HTML UI | iframe UI |
|---|---|---|---|---|---|---|
| Google Workspace アドオン |
|
Gmail  ドライブ
カレンダー
ドキュメント
スプレッドシート
スライド |
Apps Script
フル開発
|
|||
| リンク プレビューとスマートチップ | Google Workspace アドオン |
|
ドキュメント
スプレッドシート
スライド
|
AppSheet
Apps Script
フル開発
|
|||
| メールの下書き | Google Workspace アドオン |
|
Gmail |
Apps Script
フル開発
|
|||
| カレンダー会議 | Google Workspace アドオン |
|
カレンダー
|
Apps Script
|
既存の UI を使用 |
||
| エディタのアドオン |
|
ドキュメント
スプレッドシート
スライド
フォーム |
Apps Script
|
|||
| Google Chat アプリ |
|
チャット
|
AppSheet
Apps Script
フル開発
|
|||
| カスタム関数 |
|
スプレッドシート
|
Apps Script
|
既存の UI を使用 |
||
| マクロ |
|
スプレッドシート
|
Apps Script
|
既存の UI を使用 |
||
| カスタム メニュー、ダイアログ、サイドバー |
|
ドキュメント
スプレッドシート
スライド
フォーム |
Apps Script
|
|||
| Google ドライブ用アプリ |
|
ドライブ
|
フル開発
|
既存の UI を使用 |
||
| Google Classroom アドオン |
|
 Classroom
|
フル開発
|
|||
Google Workspace アドオン
Google Workspace アドオンは、Google Workspace アプリと統合されるアプリケーションです。Google Workspace アドオンは複数の Google Workspace アプリを拡張できますほとんどの場合、アプリは拡張された Google Workspace アプリ内のサイドバーで開きます。
Google Workspace アドオンのドキュメントを確認する
公開可能
コーディング オプション:
Apps Script
フル開発
以下のアプリを拡張します:
Gmail
ドライブ
カレンダー
ドキュメント
スプレッドシート
スライド
使用可能な UI フレームワーク:
カード フレームワーク
リンク プレビューとスマートチップ | Google Workspace アドオン
ドキュメントを拡張する Google Workspace アドオンを使用すると、サードパーティ サービスからカスタムリンク プレビューを作成できます。Google Workspace アプリケーション内のユーザー、ファイル、カレンダーの予定、その他のエンティティについてドキュメントが生成するスマートチップと同様に、アドオンではサードパーティのリンクのスマートチップを生成し、誰かがチップにカーソルを合わせるとプレビュー カードを表示できます。
既存の Google Workspace アドオンにリンク プレビューを追加できます。また、リンク プレビュー専用の Google Workspace アドオンを別に作成することもできます。
リンクのプレビューとスマートチップに関するドキュメントを表示する
公開可能
コーディング オプション:
AppSheet
Apps Script
フル開発
以下のアプリを拡張します:
ドキュメント
スプレッドシート
スライド
使用可能な UI フレームワーク:
カード フレームワーク
メールの下書き | Google Workspace アドオン
Gmail を拡張する Google Workspace アドオンは、ユーザーが新しいメッセージを作成するときや、既存のメッセージに返信するときに、カスタム インターフェースを提供できます。このインターフェースを使用するには、メールの下書きの下部または [その他のオプション] メニューからアドオンを開きます。
公開可能
コーディング オプション:
Apps Script
フル開発
以下のアプリを拡張します:
Gmail
使用可能な UI フレームワーク:
カード フレームワーク
カレンダー会議 | Google Workspace アドオン
ウェブ会議プロバイダは、会議ソリューションで Google カレンダーを拡張する Google Workspace アドオンを構築できます。このアドオンにより、カレンダーの予定に会議オプションが追加され、ユーザーはカレンダーから直接会議を作成して参加できるようになります。
公開可能
コーディング オプション:
Apps Script
以下のアプリを拡張します:
カレンダー
使用可能な UI フレームワーク:
既存の UI を使用
エディタのアドオン
エディタアドオンはドキュメント スプレッドシート スライド、フォームを拡張するアプリですエディタ アドオンで拡張できるアプリは 1 つのアドオンにつき 1 つのみですが、複数のエディタ アドオンを同じ Marketplace リスティングに公開できます。エディタ アドオンは、拡張するアプリの [拡張機能] メニューから開きます。
エディタ アドオンには次のインターフェースを使用できます。
公開可能
コーディング オプション:
Apps Script
以下のアプリを拡張します:
ドキュメント
スプレッドシート
スライド
フォーム
使用可能な UI フレームワーク:
HTML
iFrame
Chat 用アプリ
Chat アプリは、Chat にリソースとサービスを提供します。 Chat アプリは、さまざまな方法でユーザーとやり取りできます。以下はその例です。
- スラッシュ コマンドには、テキスト メッセージまたはカード メッセージで応答します。
- ユーザーが複数のステップ（フォームデータの入力など）を完了できるよう、ダイアログを開きます。
- リンクをプレビューするには、ユーザーが会話から直接操作できる有益な情報が記載されたカードを添付します。
公開可能
コーディング オプション:
AppSheet
Apps Script
フル開発
以下のアプリを拡張します:
チャット
使用可能な UI フレームワーク:
カード フレームワーク
カスタム関数
カスタム関数を使用すると、スプレッドシートに関数を追加できます。これらは、スプレッドシートで使用できる何百もの組み込み関数と同様に、それらを見つけて使用できます。カスタム関数は、エディタのアドオンとして公開できます。
公開可能
コーディング オプション:
Apps Script
以下のアプリを拡張します:
スプレッドシート
使用可能な UI フレームワーク:
既存の UI を使用
マクロ
マクロは、定義した特定の一連の UI インタラクションを複製するスプレッドシートの記録です。マクロをキーボード ショートカットにリンクしたり、[拡張機能] > [マクロ] メニューから実行することもできます。
マクロを記録すると、スプレッドシートで UI 操作を複製する Apps Script 関数が自動的に作成されます。マクロは Apps Script エディタ内で直接編集できます。Apps Script ではマクロを一から記述することも、作成済みの関数からマクロに変換することもできます。
コーディング オプション:
Apps Script
以下のアプリを拡張します:
スプレッドシート
使用可能な UI フレームワーク:
既存の UI を使用
カスタム メニュー、ダイアログ、サイドバー
ドキュメント、スプレッドシート、スライド、フォームのファイルに、カスタム メニュー、プロンプト、アラート、HTML ベースのダイアログとサイドバーを追加できます。カスタム メニューは、拡張するアプリのデフォルト メニューの横に表示されます。通常、ダイアログ、サイドバー、プロンプト、アラートは、メニュー項目のクリックなどのユーザー アクションや、イベント ドリブン トリガーなどのトリガーによって有効になります。
カスタム メニュー、ダイアログ、サイドバーに関するドキュメントを表示する
コーディング オプション:
Apps Script
以下のアプリを拡張します:
ドキュメント
スプレッドシート
スライド
フォーム
使用可能な UI フレームワーク:
HTML
iFrame
ドライブのアプリ
アプリがドライブのファイルをサポートしている場合は、ドライブのユーザー インターフェースと統合することで、ファイルを作成または開くオプションとしてアプリを表示できます。ユーザーがドライブ内のファイルを右クリックしたときに、[新規] > [その他] メニューと [アプリで開く] メニューにアプリが表示されます。ユーザーがいずれかのメニューからアプリを選択すると、アプリが新しいウィンドウで開きます。
公開可能
コーディング オプション:
フル開発
以下のアプリを拡張します:
ドライブ
使用可能な UI フレームワーク:
既存の UI を使用
Google Classroom アドオン
Google Classroom アドオンを使用すると 教育者は 課題、お知らせ、課題の資料に添付ファイルを作成できますこれらのファイルを添付すると、Classroom の iframe でサードパーティのコンテンツが開きます。iframe からは、ユーザーの種類や Classroom のコンテキストに応じて別々の URL が開きます。
公開可能
コーディング オプション:
フル開発
以下のアプリを拡張します:
Classroom
使用可能な UI フレームワーク:
iFrame