Gemini Canvasの成果物をダウンロード・保存する方法：Docs/Word/PDFへレイアウトを崩さずにエクスポートする全手順

Gemini Canvasで資料のたたき台を作ったあと「どうやってWordやPDFにダウンロードできるのか」「コピーペーストしたら表が崩れた」という課題を持っている方に向け、本記事ではGemini Canvasで作成した文章や表を、Microsoft WordやPDFへレイアウトを崩さずにエクスポートする方法をご紹介します。

Gemini Canvasの使い方は「Canvasでプレゼンスライドのようなインフォグラフィックを作る方法」を、Gemini Canvasとは何か？を知りたい方は「GeminiアプリにCanvas機能が仲間入り！AIとの共同作業がもっと身近に！」をご覧ください。

Gemini Canvasから出力・ダウンロードできるファイル形式一覧

Gemini Canvasの強みは、資料やWebページ用のビジュアルを出力し、多様なファイル形式へ変換できる点にあります。

プレゼンテーション資料

Google スライド形式
（Canvasからワンクリックで直接エクスポート可能）
Microsoft PowerPoint形式（.pptx）
（Googleスライド経由でダウンロード可能）

ソースコード・Web制作データ

HTML / CSS / 各種プログラム言語（.py, .js, .go など）
（Canvas内のコードブロックから直接ファイル形式としてエクスポート・ダウンロード可能）

以下のようなテキスト・ドキュメント・表も可能ですが、これらは通常のGeminiで網羅できる内容です。

Google ドキュメント形式
Microsoft Word形式（.docx）
Google スプレッドシート形式

テキストや表をそのままコピペすると崩れる理由

Gemini Canvasで生成した文書を、全選択してコピー→WordやGoogleドキュメントに貼り付けで保存しようとすると、崩れてしまうことがあります。

3つ横並びの表をコピーし、Google Docsに貼り付け（ペースト）すると・・・

縦に並んでしまいました。

インデントや文字サイズが乱れる

HTMLコードに関しても、コピペではトラブルが起きてしまいます。貼り付け先のアプリが改行コードやインデントの仕様を独自に解釈するため、レイアウトが意図せず変わってしまいます。コピー後に手動で修正する作業が発生し、AIで効率化したはずの工数が手直しに消えていく、という状況になりかねません。

「エクスポート」を経由するのが基本

コピペで対応しようとすると上記の問題が起きやすいため、Canvasで出力されたものはエクスポート機能かダウンロードを使うのが推奨されるアプローチです。この機能を経由することで、見出し・表・文字装飾をそのままの状態でGoogleドキュメントに移すことができます。

Gemini CanvasからPCへダウンロード保存する方法

それでは、画面のスクリーンショットで手順をご紹介します。画面(UI)はバージョンアップなどで実際と異なる場合があります。予めご了承ください。

ステップ①：Canvas上で成果物を完成させる

まず、成果物を作成します。どんな形式のデータが欲しいかをプロンプトで指示することが大切です。

例：
#出力形式
・HTMLで出力するUIは16:9の比率で作成してください。
・スライドのようにページが送れるようなアニメーションを追加してください。

参照：Canvasでプレゼンスライドのようなインフォグラフィックを作る方法

ステップ②：希望の形式でエクスポートする

文書が完成したら、「スライドにエクスポート」か「ダウンロードボタン」をクリックします。

「スライドにエクスポート」→しばらく待つと画面下に「スライドを開く」が表示されます。

「スライドを開く」をクリックするとGoogleスライドが開くので、スライド上で編集も可能。

スライドから「ファイル」→「ダウンロード」でさまざまな形式にすることもできます。

注意

Canvas上のダウンロードボタン（上記画像オレンジの枠）は、AIが生成したコードやテキストの「中身が何であるか」を判断して最適な拡張子を選ぼうとします。同じプロンプトでも、ダウンロードボタンをクリックするとHTMLでダウンロードされたり、PDFでダウンロードされることがあります。

希望の形式が出力されない時はプロンプトで指示

希望の形式、例えばWebページを作るためのHTMLコードが欲しい場合は以下のように、プロンプトで「Webページを作成したい」「プレビューを出力」と指示します。（「プレビュー出力」という指示がない場合はコードのみが出力されました）

プロンプト例：
Gemini Canvas の説明をしたい。インフォグラフィックでWebページを作成したいのですが、プレビューを出力してください。

出力形式は以下の通りです。

#出力形式
・HTMLで出力するUIは16:9の比率で作成してください。
・アニメーションを追加してください。

そうすると下記の画像のように、コードが出力されます。