Gemini Canvasでアプリ作成する手順|作れるものと限界・プロンプトのコツを解説

その他、業種
公開日:2026.08.27

Geminiに指示を出したものの、返ってきたコードをどこに貼れば動くのか分からず止まってしまう。その手間をなくしたのがCanvasです。生成した画面がその場で動き、操作しながら直していけます。

手軽に試せる一方、作れるものには範囲があります。何が向いていて何が苦手なのかを先に押さえておくと、途中で行き詰まらずに済みます。

この記事では、Gemini Canvasの特徴と通常のチャットとの違いから、作れるアプリの範囲、実際の作成手順、精度を上げるプロンプトの書き方、店舗業務での作例、使ううえでの注意点までを順に整理します。

確認したいポイント

結論

詳細

Gemini Canvasとは?

成果物づくりに特化した作業スペース

画面が分割され、右側で生成物を見ながら左側で指示を重ねられる編集環境です。

アプリは作れる?

単機能のWebアプリなら作れる

日本語で要件を伝えるとコードが生成され、その場でプレビューして操作できます。

チャットとの違いは?

部分修正と即時プレビューができる

全体を作り直させずに、直したい箇所だけを指定して修正を重ねられます。

無料でも使える?

無料のプランでも利用できる

上位プランではより高性能なモデルと大きな文脈量を扱え、作り込み時の手戻りが減ります。

Canvasならではの点は?

AI機能の組み込みとデータ保存

作ったアプリの中で文章や画像を生成させたり、記録を残したりできます。

精度を上げるには?

目的・操作・結果を具体的に書く

曖昧な依頼では意図とずれるため、必要な画面要素まで列挙して伝えるのが基本です。

苦手なことは?

大規模な機能と長い作り込み

扱える情報量に上限があり、やり取りが長くなると以前の構造を保てなくなります。

顧客配信には使える?

試作向き。配信は別手段が現実的

会員管理やストア配信、継続的な保守まで含めると別の仕組みが必要になります。

▼ 顧客に配信するアプリをお考えなら、こちらもご確認ください

「店舗アプリDX版 raiten」は、会員証・スタンプ・クーポン・プッシュ通知をそろえたアプリプラットフォームです。iOSとAndroidの両対応、ストア申請のサポートまで含めて任せられます。

\ 30秒で入力完了 / サービス資料を無料でダウンロードする ▶

目次

Gemini Canvasとは?通常のチャットとの違い

成果物づくりに特化した作業スペース

Gemini Canvasは、Geminiの中に用意された編集用の作業領域です。指示を出すと画面が2分割され、左側で会話を続けながら、右側に生成された文章やコード、動作するプレビューが表示されます。

通常のチャットが一問一答で終わるのに対し、Canvasは1つの成果物を育てていくための場として設計されています。文章、コード、資料、簡易的なアプリまで、同じ画面で作り込めます。

アプリを作る場面では、生成された画面をその場で操作できる点が効いてきます。手元に開発環境を用意する必要がなく、思いついた内容をすぐ形にできます。

コードを書けない立場の人でも成果物にたどり着けるため、企画担当者や店舗のスタッフが自分で叩き台を用意し、それを開発側に渡すという進め方も現実的になりました。言葉だけで説明するより、認識のずれが起きにくくなります。

通常のチャットとの3つの違い

使い分けの判断がしやすいよう、違いを整理すると次のようになります。

  • 成果物が独立した領域に残るため、会話に埋もれない
  • 全体を作り直させず、直したい箇所だけを指定して修正できる
  • 生成したコードをその場でプレビューし、操作して確認できる

文章を扱う場合も同じ利点があります。導入だけ書き直す、結論だけ短くするといった部分的な調整が効くため、修正の往復が減ります。

通常のチャットが向くのは、短い質問への回答や下調べです。作り込む対象が決まっていない段階ではチャットで方向性を固め、形にする段階でCanvasへ移すと無駄がありません。

利用できるプランと扱える情報量

Canvas自体はGeminiを使えるユーザーであれば利用できます。無料のプランでも、簡単なWebツールの試作までは十分に届く範囲です。

違いが出るのは扱える情報量です。上位のプランではより高性能なモデルと大きな文脈量を利用でき、やり取りが長くなっても構造を保ちやすくなります。作り込みを重ねる使い方をするなら、この差は無視できません。

Gemini Canvasで作れるアプリの範囲

精度が安定しやすいもの

画面数が少なく、処理の流れが単純なものほど結果が安定します。入力した値をもとに計算する、条件に応じて表示を切り替える、一覧を並べ替えるといった処理が代表例です。

具体的には、電卓のようなシミュレーター、チェックリスト、簡易的な集計表、選択式のテストなどが該当します。1つの画面で完結する道具を作る場面と相性がよい機能です。

既存の業務をそのまま置き換えようとするより、詰まっている工程を1つ切り出すほうが成功しやすくなります。毎回電卓を叩いている計算、毎日同じ項目を書き写している記録などが着手しやすい候補です。

Canvasで作るアプリならではの2つの特徴

単なる画面の生成にとどまらない点が、Canvasの特徴です。Googleの案内では、Canvasで作ったアプリについて次の2つが挙げられています。

  • アプリの中でGeminiの機能を使い、文章や画像を生成できる
  • 複数のセッションや端末をまたいでデータを保存できる

出典:Google「Canvas でドキュメントやアプリなどを作成する – Gemini アプリ ヘルプ」

2つ目は、記録を積み重ねる用途で効いてきます。開いたときに前回までの内容が残っているため、その場限りで終わらない道具として使える可能性が広がります。

向かないもの・作れないもの

複数の画面をまたぐ複雑な状態管理、外部システムとの本格的な連携、大量データの処理は苦手な領域です。要件が増えるほど、一度の指示で意図どおりに揃う確率は下がります。

アプリストアで配信するスマートフォンアプリも、Canvasの範囲では作れません。ブラウザで動く形が前提である点は、企画段階で押さえておく必要があります。

Canvasの範囲を超えたときの次の一手

試作を進めるうちに、社外の人に使ってもらいたい、複数人でデータを入力したい、といった要望が出てくる場面があります。その段階に来たら、手段を切り替える判断が必要です。

  • URLで公開して社外の人にも使ってもらいたい:Google AI Studioでの構築とデプロイ
  • 社内の複数人で入力・共有したい:AppSheetのような業務アプリ向けのツール
  • 不特定多数の顧客に配信したい:アプリプラットフォームの活用

Canvasで作ったものは、要件を固めるための下書きとして活きてきます。何が必要で何が不要かを見極めたうえで移行すれば、次の工程での手戻りを減らせます。

▼ 作りたいものが決まっている方は、無料相談で実現方法を整理できます

自社で作るべきか、既存の仕組みを使うべきかは、必要な機能と運用体制で変わります。要件をお聞きしたうえで、現実的な進め方をご提案します。

オンライン相談のご予約はこちら ▶

Gemini Canvasでアプリを作る手順

STEP1:Canvasを有効にする

ブラウザでGeminiを開き、入力欄の周辺にあるツールからCanvasを選びます。入力欄にCanvasの表示が出れば準備は完了です。細かい設定は必要ありません。

画面の広さが作業効率に直結するため、パソコンでの操作をおすすめします。プレビューと指示欄を並べて確認できると、修正の指示も出しやすくなります。

STEP2:目的を一文で伝えて土台を作る

最初の指示では、完成形を書き切る必要はありません。「来店客数を入力すると日別の平均が出る画面を作って」といった、一文で伝わる範囲から始めます。

指示を出すと画面が分割され、コードの生成が始まります。まず動く状態を作ることを優先し、細かい要望は次の手番で足していきます。

STEP3:プレビューで動作を確認する

生成が終わったら、プレビュー側で実際に値を入力して試します。確認するのは見た目よりも、想定した数値が出るか、空欄のまま進めたときにどう反応するかという点です。

動作が想定と違う場合は、どの操作でどうなったかを具体的に伝えると修正が早くなります。「うまく動かない」だけでは、原因の特定に往復が増えます。

STEP4:範囲を限定して修正する

修正は、全体を作り直させるのではなく対象を限定して依頼します。「合計欄の下に平均欄を追加して」「日付の表示を和暦にして」といった単位で伝えると、他の部分が崩れにくくなります。

一度に複数の変更を頼むと、片方だけ反映される結果になりがちです。1回の指示につき1つの変更を基本にすると、確認も簡単になります。

STEP5:共有・エクスポートする

完成したものは、Canvasパネルの共有機能からリンクで共有できます。共有されたリンクを開いた相手は自分用の複製を作って編集を続けられるため、社内で叩き台を回す使い方に向いています。

書き出しにも対応しており、文章はGoogleドキュメントへ、Pythonのコードは実行環境へ送り出せます。手元に残す手段を確保しておくと、後から探し直す手間がなくなります。

共有した内容は、設定によってGeminiアプリの利用履歴に保存されます。社外の相手に渡す場合は、含まれている情報を事前に確認しておく必要があります。

手元に控えを残す場合は、何ができる版なのかを一行添えておきます。後から見て用途がわかる状態にしておくと、次に作るときの土台としても使い回せます。

精度を上げるプロンプトの書き方

誰が・何をして・どうなるかを書く

「いい感じのアプリを作って」という依頼では、意図と違うものが出てきます。利用者、行う操作、得られる結果の3点を明示すると、生成される内容が一気に近づきます。

利用する端末も添えておきます。店頭のスマートフォンで使うと書くだけで、ボタンの大きさや入力欄の配置の前提が切り替わります。

使う場面まで書ければさらに精度が上がります。片手で操作する、レジ横で短時間だけ触る、といった条件は、入力方法や画面の情報量に直接影響する要素です。

必要な画面要素を列挙する

入力欄、ボタン、表示エリアなど、画面に置いてほしい要素を項目として並べます。文章で長く説明するより、箇条書きのほうが漏れが起きにくくなります。

計算のルールがある場合は、式や条件を明記します。四捨五入の桁や端数の扱いまで書いておくと、後から数値が合わない問題を避けられます。

小さい単位で機能を足していく

最初から10個の機能を並べると、どれも中途半端な状態で出てくることがあります。中心となる機能だけで動く版を作り、確認してから次を足すほうが、結果的に早く仕上がります。

各段階で動作確認をすると、不具合が出た際にどの追加が原因かを特定できます。まとめて足した後では、切り分けに時間がかかります。

修正は場所と変更後の状態をセットで伝える

「見にくいので直して」では、どこをどうすればよいかが伝わりません。対象の要素と、変更後にどうなっていてほしいかを組にして伝えると、一度で意図に届きます。

うまくいった段階のコードは書き出して残しておきます。戻れる場所を作っておくことが、試行錯誤を続けるうえでの前提になります。

そのまま使えるプロンプトの型

毎回ゼロから書くより、型を用意しておくほうが安定します。次の5項目を埋める形にすると、必要な情報が揃います。

  • 目的:何のために使うか(例:日別の来店数を集計するため)
  • 利用者と端末:誰がどの端末で使うか
  • 画面要素:入力欄、ボタン、表示エリアの一覧
  • 処理のルール:計算式、並び順、条件分岐
  • 優先度:必須の機能と、あとで足す機能

この型を土台にして、2回目以降は差分だけを伝える進め方にすると、やり取りが短くなります。

デザインについても一行だけ添えておくと結果が変わります。配色の系統や文字の大きさ、店頭で使うなら明るい場所でも読めることといった条件を書くと、装飾より実用を優先した画面になります。

▼ 集客に使う機能は、そろっているものを選ぶ手もあります

デジタル会員証、スタンプ、クーポン配信、会員ランク、分析ダッシュボードまで標準で用意。設計や実装を挟まずに、運用の検討へ進めます。

機能詳細を含むサービス資料を無料でダウンロードする ▶

店舗業務で使えるCanvasの作例

数字を扱うツール

原価率の計算ツールは実用性の高い例です。材料費と販売価格を入力すると利益率が出る仕組みがあれば、メニューや商品の価格を検討する場でそのまま使えます。

値引き企画の試算にも応用できます。割引率と想定利用数から粗利への影響を出せる画面があると、感覚ではなく数字で判断できるようになります。

現場の記録・確認に使うツール

開店前の点検チェックリスト、清掃記録、備品の在庫確認といった作業は、紙で運用されている場面が多く残っています。画面数が少ないため、試作との相性は良好です。

データを保存できる特徴を使えば、前回の記録を引き継ぐ形にもできます。継続して使う道具として設計するなら、保存の要否も最初の指示に含めておきます。

企画・検討に使うツール

会員ランクの条件を変えたときに、どのランクに何人が入るかを試算する画面なども作れます。制度設計の議論を、具体的な数字を見ながら進められるようになります。

ランク制度そのものの考え方は、リピート強化で売上アップ!会員ランクを活用した顧客の囲い込み方で整理しています。試算と設計を組み合わせると、検討の精度が上がります。

社内共有・教育に使うツール

接客手順の確認テスト、新人向けの用語クイズ、よくある質問の検索ページなども作れます。内容の更新を自分たちで行えるため、印刷して配る資料より運用が続きやすくなります。

選択式のテストは、正誤の判定と解説の表示までを一度に生成できます。採点の集計まで含めた形にしておくと、理解度の把握にもそのまま使えます。

作ったものは共有リンクで配れます。店舗ごとに内容を変えたい場合は、複製して編集する運用にすると管理しやすくなります。

Gemini Canvasを使うときの注意点

長いやり取りでは構造を保てなくなる

扱える情報量には上限があるため、修正を重ねるうちに以前の仕様が抜け落ちる場面があります。「直したはずの箇所が元に戻る」といった現象は、この上限が関係しています。

対策は、1つのCanvasで作り込みすぎないことです。区切りのよいところで書き出し、新しく作り直す進め方にすると、崩れにくくなります。

作り直す際は、それまでに固まった仕様を箇条書きにして最初の指示へ含めます。会話の流れに頼らず、必要な情報を毎回そろえておくほうが結果は安定します。

入力する情報の範囲を決めておく

顧客の個人情報、取引条件、未公開の売上データをそのまま入力してよいかは、社内の方針として決めておく必要があります。プランや設定によってデータの扱いは変わります。

デジタル庁は、生成AIを利活用する際に想定されるリスクと留意点を整理した資料を公開しています。行政向けの内容が中心ですが、自社の業務改善で導入を検討する際の参考としても示されています。

出典:デジタル庁「テキスト生成AI利活用におけるリスクへの対策ガイドブック(α版)」

業務に組み込む前に確認したいこと

動いているように見えても、想定外の入力に弱い場合があります。日付の入力形式、極端に大きい数値、空欄のままの送信など、実際に起きうるパターンで試しておきます。

継続して使うなら、不具合が出たときに直せる人を決めておくことが前提です。作った本人しか触れない状態では、担当者が変わった時点で使えなくなります。

共有リンクの扱いに気をつける

共有リンクを開いた相手は、内容を複製して編集を続けられます。社外に渡す場合は、想定より広く伝わる可能性を踏まえて内容を確認しておきます。

社内で配る場合も、どのCanvasが最新版なのかが分からなくなりがちです。共有時に用途と日付を添えるだけでも、混乱をかなり防げます。

商用で使う場合の責任範囲

AIが生成したものであっても、公開した内容の責任は提供する側にあります。計算結果の誤り、表示の不備、情報の取り扱いに関する問題は、いずれも自社の責任として扱われます。

顧客の目に触れる形で使うなら、動作確認の担当と手順を決めてから進めます。社内の試作として使う場合とは、必要な準備の量が変わってきます。

▼ 実際の運用イメージは、導入事例からご確認いただけます

小売・飲食・サロンなど業種別に、どの機能をどう組み合わせて成果につなげたかを事例集にまとめました。必要な体制の規模感もつかめます。

導入事例を含むサービス資料はこちら ▶

顧客向けアプリはCanvasの範囲を超える

配信するアプリに必要になる機能と運用

来店客に使ってもらうアプリでは、会員登録とデータ管理、ポイントやクーポンの発行、来店を促す通知、アプリストアでの配信といった要素が求められます。いずれも継続的な運用を伴う仕組みです。

業種によって必要な機能の優先順位も変わります。小売業で重視される機能は小売業のアプリであると便利な機能7選|独自アプリの活用例とメリット、サロン業態での考え方は美容室の顧客管理をデジタル化!ヘアサロン向けアプリ活用術で確認できます。

注文や受け取りまでアプリで完結させたい場合は、既存の仕組みとの連携が前提になります。実務は公式アプリでモバイルオーダー|非接触で注文・決済を完了させる仕組みで解説しています。

作る範囲と任せる範囲を分ける

自社で使う小さなツールはCanvasで素早く作り、顧客に配信するアプリは既存のプラットフォームを使う。この分け方にすると、どちらも無理のない形で運用できます。

ポイントやスタンプのように定番の機能は、既製のサービスで十分に賄えます。選択肢の比較はポイントカードアプリおすすめ10選|無料で作成する方法と導入メリットが参考になります。

Canvasで作った試作は、こうした検討の場でも役に立ちます。実際に動く画面があれば、必要な機能と不要な機能を関係者で見極めやすくなり、依頼する内容が具体的になるぶん見積もりの精度も上がります。

まとめ|Canvasは試作を速くし、配信は別の手段で用意する

Gemini Canvasは、思いついたものをその場で動く形にするための機能です。部分修正と即時プレビューが使えるため、試して直すまでの往復が短くなり、企画の検討そのものが進みます。

使いこなす要点をまとめると、次の4点になります。

  • 利用者・操作・結果を明示し、必要な画面要素まで列挙する
  • 中心の機能だけで動く版を作り、確認しながら足していく
  • 1つのCanvasで作り込みすぎず、区切りで書き出して残す
  • 入力してよい情報の範囲を、社内であらかじめ決めておく

社内で使う道具であれば、この流れだけで十分な成果が出ます。判断が変わるのは、不特定多数の顧客に配信するアプリを用意する場面です。

会員管理、通知、ストア配信、継続的な保守まで必要になると、作る作業より運用を続ける体制のほうが重くなります。自社で担う範囲と任せる範囲を分けたうえで、手段を選んでみてください。

▼ 試作はCanvasで、配信するアプリはプラットフォームで

「店舗アプリDX版 raiten」なら、ストア申請やOSアップデート対応まで含めて対応します。自社はクーポン配信や分析といった運用に集中できます。

サービス資料の無料ダウンロード・オンライン相談はこちら ▶

    店舗アプリサービス資料
    STEP 1 会社名・氏名(必須)

    この記事を監修した人

    店舗アプリ アプリ開発・集客コンサルティング
    店舗アプリ アプリ開発・集客コンサルティング

    店舗アプリ公式。累計1,000社以上の導入実績を誇る店舗アプリ構築プラットフォーム。 単なる集客に留まらず、リピーター創出による売上最大化を得意としている。

    >>運営メディアトップへ
    お問い合わせ 資料ダウンロード

    まずはお気軽にご相談ください

    店舗アプリについてのご不明点やご相談がある方はお気軽にお問い合わせください。

    サービス資料ダウンロード

    サービス資料ダウンロード

    導入事例など店舗アプリサービスを網羅した詳しい資料はこちら!

    資料をダウンロード
    ご相談・お問い合わせ

    ご相談・お問い合わせ

    機能の確認や見積もりなど何でもお気軽にお問い合わせください。

    お問い合わせ
    オンライン相談

    オンライン相談

    オンラインで導入検討の方やサービス詳細のご相談を受け付けております。

    ご予約はこちら

    TOP