GoogleスライドでDALL-E3の画像生成を実行する方法【テンプレート公開】
OpenAIが提供する画像生成AIのDALL-E3は、プロンプトに応じた高精度・高画質な画像を生成できます。
DALL-E3を活用したいツールの１つがGoogleスライドですが、現時点でDALL-E3のモデルで画像生成できるアドオンはありません。
そこで、GoogleスライドのメニューからDALL-E3による画像生成を実行可能にするスクリプトを用意しました。
DALL-E3実行のためのOpenAIのAPIキーがあれば誰でも利用可能なので、導入方法を説明します。
※予めDALL-E3を利用できるようスクリプトをセットしたGoogleスライドのテンプレートも公開しています。
高性能な画像生成ができるDALL-E3
OpenAIのChatGPTなどのテキスト生成AI以外に、画像生成AIも開発しています。
OpenAIの画像生成AIの最新モデルは、2023年9月に発表されたDALL-E3です。
このDALL-E3は2023年11月にAPI経由での利用ができるようになりました。
これによって、DALL-E3による画像生成があらゆるサービスやアプリに組み込めるようになりました。
GoogleスライドでDALL-E3が使えると便利
DALL-E3と連携することで効率化が図れるサービスの１つがGoogleスライドです。
プレゼン資料などを作成するGoogleスライドでは、多くの画像を用意します。
これまでは自分で画像を作成したり、フリー素材を検索して用意して配置する必要がありました。
しかし、DALL-E3を使えば、求める画像をプロンプトで入力すれば、その指示に従った画像を作成してくれます。
※まだまだ求める水準の画像が生成されないケースもあります。
それゆえに、Googleスライド上でDALL-E3が使えるようになると、とても便利です。
わざわざ有料版のChatGPT Plusや、Bing AIにアクセスしなくてもGoogleスライド上で画像生成ができれば、スライド作成の効率が格段にアップします。
DALL-E3を使えるアドオンはまだない
Googleスライドの標準機能には画像生成はありませんが、アドオンという拡張機能を追加することができます。
Google Workspace Marketplaceには、Googleスライドで生成AIを利用した画像生成機能を追加するアドオンが公開されています。
しかし、現時点ではOpenAIのDALL-E2のモデルを使ったものが多く、DALL-E3で検索しても該当するアドオンはありません。
そのため、アドオンを追加してもGoogleスライドでDALL-E3は使えない状態です。
GoogleスライドでDALL-E3の画像生成を簡単実行
そこで、GoogleスライドでDALL-E3による画像生成AIを利用できる方法を用意してみました。
Googleが提供するGoogle Apps Script(GAS)を用いたプログラムをGoogleスライドに設定し、OpenAIのAPIキーをセットするとDALL-E3の画像生成がGoogleスライド上で利用できます。
一度セットアップすれば、以下の動画のようにプロンプトを入力して簡単にDALL-E3の画像生成が可能です。
Googleスライドで資料作成を行いながら、必要な時に画面を切り替えずに画像生成できます。
DALL-E3のGoogleスライド導入手順
GoogleスライドでDALL-E3を使えるようにする導入手順を解説します。
１．事前準備としてDALL-E3のAPIリクエストが必要になるので、OpenAIのAPI利用登録を行い、APIキーを取得します。
※OpenAIのAPIキーの取得手順は下記の記事で解説しています。
２．DALL-E3を使えるようにしたいGoogleスライドのファイルを開きます。
３．メニューバーにある「拡張機能＞Apps Script」を選択します。
４．Apps Scriptのスクリプトエディタが表示されるので、記載されたmyfunctionを削除して、下記スクリプトを貼り付けます。
//Googleスライドを開いた際に実行する関数
function onOpen() {
//GoogleスライドのメニューUIを取得する
const ui = SlidesApp.getUi();
// メニューを作成し、アイテム名と実行関数を定義する
ui.createMenu('DALL·E3')
.addItem('初回認証','menuItem0')
.addItem('APIキー設定(初回のみ)', 'menuItem1')
.addItem('画像生成', 'menuItem2')
.addToUi();
}
//GASの初回認証を実行するための関数(メッセージを出すだけ)
function menuItem0(){
SlidesApp.getUi().alert('認証されています');
}
//OpenAIのAPIキーの入力とユーザープロパティへの登録する関数
function menuItem1() {
//GoogleスライドのメニューUIを取得する
const ui = SlidesApp.getUi();
//APIKEYがすでに設定済みか確認する
if (PropertiesService.getUserProperties().getProperty('APIKEY')) {
ui.alert('APIキーはすでに設定済みです');
}
//APIKEYが未設定の場合のみ、APIキーの入力と登録を実施
else {
//GoogleスライドにAPIキーを入力するプロンプトを表示し、入力テキストを取得
const apiKey = ui.prompt('OpenAIのAPIキーを入力してください').getResponseText();
//OpenAIのAPIキーの仕様から一定文字数以下は処理しない
if (apiKey.length < 40) {
ui.alert('APIキー形式が不正のため登録できませんでした');
}
else {
//ユーザープロパティに入力されたAPIキーを登録
//スクリプトプロパティだと他の人のAPIキーで画像生成して費用が請求されるため
PropertiesService.getUserProperties().setProperty('APIKEY', apiKey);
ui.alert('APIキーが設定されました');
}
}
}
//入力されたプロンプトをAPI経由でDALL·E3の画像生成し、Googleスライドの現在のページに挿入する関数
function menuItem2() {
//GoogleスライドのメニューUIを取得する
const ui = SlidesApp.getUi();
//APIKEYがすでに設定済みか確認し、設定済みの場合にAPIリクエスト実行
if (PropertiesService.getUserProperties().getProperty('APIKEY')) {
//事前にユーザープロパティに登録したOpenAIのAPIキーを取得
const apiKey = PropertiesService.getUserProperties().getProperty('APIKEY');
//DALL-E3で画像生成するためのプロンプトの入力を受け付けて、入力テキストを取得
const prompt = ui.prompt('DALL·E3で生成したい画像のプロンプトを入力してください').getResponseText();
//DALL-E3の画像生成を行う関数を実行し、戻り値で画像(blob形式)を取得
const image = generateImage(prompt, apiKey);
//今表示しているスライドにDALL-E3で生成した画像を挿入
const currentSlide = SlidesApp.getActivePresentation().getSelection().getCurrentPage();
currentSlide.insertImage(image);
ui.alert('画像生成しました。');
}
//
else {
ui.alert('APIキーが未設定です');
}
}
//プロンプトとAPIキーを引数にしてDALL·E3にAPIリクエストして画像生成する関数
function generateImage(prompt,apiKey){
//画像生成AIのAPIのエンドポイントを設定
const apiUrl = 'https://api.openai.com/v1/images/generations';
//OpenAIのAPIリクエストに必要なヘッダー情報を設定
let headers = {
'Authorization':'Bearer '+ apiKey,
'Content-type': 'application/json',
'X-Slack-No-Retry': 1
};
//画像生成の枚数とサイズ、プロンプトをオプションに設定
let options = {
'muteHttpExceptions' : true,
'headers': headers,
'method': 'POST',
'payload': JSON.stringify({
'model' : 'dall-e-3',
'n' : 1,
'size' : '1024x1024',
'prompt': prompt})
};
//OpenAIの画像生成(Images)にAPIリクエストを送り、結果を変数に格納
const response = JSON.parse(UrlFetchApp.fetch(apiUrl, options).getContentText());
//生成された画像のURLにフェッチして画像データを取得して、名前をつける
const image = UrlFetchApp.fetch(response.data[0].url).getAs('image/png').setName('DALL-E生成画像');
return image;
}５．スクリプトエディタのタブを閉じて、Googleスライドを再度読み込みます。
６．メニューバーに「DALL·E3」が表示されるので、「初回認証」を選択します。
※下記の記事に従って、GASの初回認証を行って下さい。
７．「DALL·E3＞APIキー設定(初回のみ)」を選択し、OpenAIのAPIキーを入力します。
以上でGoogleスライドでDALL-E3による画像生成のセットアップは完了です。
メニューバーにある「DALL·E3＞画像生成」を選択すると、プロンプト入力画面が表示されます。
ここにプロンプトを入力してOKをクリックすると、少し待つとDALL·E3の画像が生成されて、現在表示しているスライドに挿入されます。
試しに「黒板に板書した内容を熱弁する教授」というプロンプトを入力してDALL-E3で画像生成してみました。
DALL-E3が画像を生成するのに少し時間がかかります。
DALL-E3からの生成された画像が帰ってくると、現在開いているスライドに生成画像が挿入されます。
一度スクリプトの配置や初回認証、OpenAIのAPIキーを設定すれば、それ以後はすぐに画像生成が可能です。
ただし、別のGoogleスライドでDALL-E3を使いたい場合は、再度導入手順を実施する必要があります。
DALL-E3実行できるスライドの雛形も用意
なお、スクリプトの配置が面倒な人向けに、DALL-E3が使えるGoogleスライドのテンプレートも用意しています。
GoogleスライドでDALL·E3利用(配布テンプレート)
こちらのテンプレートを「ファイル＞コピーを作成」してもらうと、スクリプトの配置しなくてもコピーしたGoogleスライドでDALL-E3が利用可能です。
初回認証やAPIキーの設定は必要ですが、2枚目のスライドに利用方法を説明しています。
新しくGoogleスライドでプレゼン資料を作る際にDALL-E3を使いたい場合はこちらをご利用ください。
まとめ・終わりに
今回、Googleスライド上でDALL-E3による画像生成を利用できるようにする方法を紹介しました。
Google Apps Script(GAS)によるスクリプトをセットし、OpenAIのAPIキーを設定することでGoogleスライドの画面でDALL-E3の高精度の画像を生成することができます。
Googleスライドでは画像を用いる機会が多いので、Googleスライド上でプロンプト入力して画像生成できればとても便利です。
DALL-E3を利用できるようにするGASスクリプトの配置から、初回セットアップ方法も解説しています。
また、あらかじめプログラムが入ったテンプレートのGoogleスライドもあります。
GoogleスライドでDALL-E3の画像生成を利用したい人は、ぜひOpenAIのAPIキーを取得してお使いください。