Geminiで手書きのスケッチからアプリを作るやり方は、写真を上げて1文を送るだけです。2026年11月6日に試すと、習慣トラッカーは19.1秒でチェックの位置まで手描きどおりのアプリになりました。すごろくはマスの順番を読み違えました。
- Geminiで手書きのスケッチからアプリを作るやり方は、写真を上げて1文を送るだけ。そのまま使えるプロンプトを4つ載せています
- 2026年11月6日の検証では、Canvasを選ばない普通の会話でも19.1秒でアプリのプレビューが開きました
- 習慣トラッカーのスケッチは、チェックの位置まで手描きのとおりに写りました。達成率はスケッチの60%ではなく約48%と計算して出ました
- 色とフォントの直しは同じ会話で19.1秒・138字の返事とともに反映されました
- すごろくは25.1秒で12マスの盤が出ました。ただし2段目の折り返しの順番は読み違えていました
- スケッチなしの文章だけで頼むと22.2秒で英語の返事が返り、紫の別の見た目になりました
GoogleでフォローするGoogle検索でAInformationの記事が出やすくなります
Geminiで手書きのスケッチをアプリにするやり方は写真1枚と1文で足りる
Geminiで手書きの絵からアプリを作るには、スケッチの写真を会話に上げて「このアプリをコードにできますか？」と送るだけです。AInformation編集部は2026年11月6日に、Google AI Proのアカウントでブラウザ版のGeminiを開いて試しました。画面のモデル表示はFlash-Liteでした。
手順は次の4つです。どれも画面のボタンを押すだけで、コードを書く場面はありません。
- 紙かタブレットにアプリの画面を描き、スマホで写真を撮る
- Geminiの入力欄の左にある「＋」からその写真を上げる
- 公式の手順どおりならここで「Canvas」を選ぶ（今回の検証では選ばなくてもプレビューが開いた）
- 下のプロンプトを送り、右に出たプレビューで動きを確かめる
AInformation編集部が送った文はこれです。スマホで使いたいので2文目を足しました。
このスケッチのアプリをコードにできますか？スマホで使える形にしてください。
Googleの公式ブログは2026年11月5日に、この使い方を紹介しました。スケッチの写真を上げてCanvasを選び、アプリをコードにできるか聞くという3つの手順です。例には習慣トラッカーとゲームの盤が挙がっていました。そこで編集部も同じ2つを手で描いて試しました。
描いたのは架空の習慣トラッカーです。11月の1週間に3つの習慣のチェック欄を並べ、上に「連続3日！」を赤で書きました。下には「＋習慣を追加」のボタンと「今週の達成率」のバーを置き、60%と書き込みました。□を押すとチェックが付き、もう一回押すと外れるという決まりも注記で書いています。
この写真と上の1文を送ると、Geminiは19.1秒で返事を返しました。返事は81字の短いもので、すぐ下にプレビューの窓が開きました。窓の上には「コード」「プレビュー」「エクスポート」のボタンが並び、罫線のノートの上に手描き風の枠でアプリが描かれていました。
スケッチを描くときに効いたこと
今回の2枚から分かった描き方の要点も書いておきます。1つ目は、文字をはっきり書くことです。習慣の名前や曜日のように、読みやすい字で書いた所はほぼそのまま写りました。2つ目は、強調したい所を色で描き分けることです。スケッチで赤く書いた「連続」の札と達成率は、プレビューでも赤のままでした。
3つ目は、動きの決まりを絵の中に文で書いておくことです。□を押すとチェックが付く決まりや、すごろくのルールは注記として書きました。Geminiの返事はその決まりを取り上げていました。ただ押して動くかまでは今回たしかめていないので、送ったあとは自分でプレビューを押してみてください。
結論はスケッチの写真から19.1秒で手描きの見た目まで写ったこと
手書きのスケッチは、Geminiに渡すと見た目ごとアプリになります。習慣トラッカーのスケッチを渡した回では、19.1秒でプレビューが開きました。チェックの付いたマスも手描きのとおりでした。
公式ブログの紹介は短いものです。写真を上げてCanvasを選び、コードにできるか聞くとだけ書いています。プレビューで色やフォントや機能を直せるとも書いていました。どこまで正しく読むかは書かれていないので、編集部は答え合わせの基準を先に決めて試しました。
手書きの習慣トラッカーには、チェックが10個入っています。水を2L飲むは月・火・木・金の4つです。15分読書は月・水・木の3つで、ストレッチは火・水・金の3つです。Geminiのプレビューはこの位置をそのまま写していました。週の21マスのうち10個がチェック済みなので、達成率は約48%になるのが正解です。プレビューの達成率は48%と出ていて、スケッチに書いた60%を写していませんでした。
一方で、うまくいかない所も見えました。すごろくのスケッチでは、2段目でマスの並びが右から左へ折り返すのを読めていませんでした。スケッチなしの文章だけで頼んだ回は、日本語で頼んだのに英語で返事が来ました。くわしくは章ごとに書きます。
Canvasを選ばない普通の会話でも19.1秒でプレビューが開いた
公式の手順では、写真を上げたあとにCanvasのツールを選びます。ただ今回の検証では、Canvasを選ばなくても同じようにアプリの窓が開きました。選び忘れても困らない、というのが編集部の判断です。
この点は2回たしかめています。1回目の習慣トラッカーは、編集部の操作の都合でCanvasを選べないまま送る形になりました。もう1回は、新しい会話でわざとCanvasを選ばずに同じ写真と同じ文を送りました。どちらの回もプレビューの窓が開いています。
1回目の画面では、Geminiが「どちらの回答がより有用ですか？」と聞いてきました。選択肢Aと選択肢Bの2つの答えが横に並び、それぞれにプレビューの窓が付いていました。Aの説明は「ローカルストレージへの保存機能」などを挙げていました。Bは手書き風ノートのデザインを再現したと書いていました。
この2択の画面は、Geminiが答えの良し悪しを利用者に選んでもらうためのものです。画面の文には、選択はGeminiの回答をより良くするために使われると書いてありました。いつもこの2択が出るのかは、この検証では分かりません。2回目の会話では2択は出ず、答えは1つでした。
なお1回目は、編集部の仕組みが返事の文字を取り込めませんでした。そのため1回目の秒数と文字数は測れていません。2回目は19.1秒・81字で、返事の文は次の一節でした。
「ご提示いただいたスケッチを元に、スマホにぴったりな手書き風の温かみがある「習慣トラッカー」アプリを作成します。」
返事の文は短く、仕様の説明はほとんどありません。説明を読むより、プレビューを触って確かめる作りになっています。
色とフォントの直しは19.1秒と138字の返事で反映された
公式ブログは、プレビューを見ながら色やフォントや機能を直せると書いています。編集部は1回目の会話に続けて、見た目と計算の2つを1文で頼みました。
色を落ち着いた緑系に、文字を丸ゴシックっぽくしてください。あと「今週の達成率」はスケッチの60%をそのまま出さず、チェックの数から自動で計算するようにしてください。
合格の線は3つ決めました。同じ会話でプレビューが更新されることと、色とフォントが変わることです。もう1つは達成率がチェック10個÷21マスの約48%で出ることで、60%のまま固定なら×です。
返事は19.1秒で、138字でした。Geminiは「色を落ち着いたセージグリーン・深緑を基調としたトーンに変更し、フォントを丸ゴシック風に統一しました。」と書いています。プレビューの枠線とチェックの色は深い緑に変わり、見出しの文字も丸みのある書体になりました。
返事には、達成率と連続日数もチェックのオンとオフに合わせて自動で計算すると書いてありました。ただ撮った画面では、達成率の欄が下に切れていて数字が読めません。この会話では達成率の数字を画面でたしかめられていません。チェックを押して数字が動くかも、今回は試していません。
スケッチの注記まで画面の文字になった
この版では、気になる点が2つありました。1つ目は、スケッチの欄外に書いた「（スマホの画面のつもり）」がタイトルの下にそのまま小さな文字で入っていたことです。描いた人へのメモのつもりの書き込みも、Geminiはアプリの文字として読みました。
2つ目は、習慣の名前が途中で切れていたことです。左の列が狭く、「水を2L」「15分」「ストレ」のように後ろが見えなくなっていました。各行には「削除」の小さなリンクが足されていました。これはスケッチに無かった機能です。上の「連続」の札の日数も、スケッチに書いた3日とは違う数になっていました。理由はこの検証では分かりません。
すごろくは25.1秒で12マスの盤が出たがマスの順番は2段目でずれた
2つ目のスケッチは、2人で遊ぶすごろくの盤です。12マスを3段に描きました。1段目は左から右へ進みます。2段目は右から左へ折り返し、3段目はまた左から右へ進む形です。スタートから2と3を通って1回休みへ進みます。そこから5と6と3マス戻るを通って8と9へ下ります。最後はもう1回と11を経てゴールに着く順です。下には「赤い駒と青い駒が交代で進む」「ゴールにぴったり着いたら勝ち」などのルールを書きました。
新しい会話でCanvasを選び、写真と次の文を送りました。
このスケッチのすごろくゲームをコードにできますか？書いてあるルールどおりに2人で遊べるようにしてください。
合格の線は4つです。
- マスの蛇行の順番を正しく読むこと
- 特別マス4つのルールが入ること
- 赤と青の駒があること
- 駒が交代で進むこと
返事は25.1秒で、205字でした。Geminiは「ルールを完全再現しました」と書き、プレビューに「すごろくゲーム（2人用）」の盤を出しました。スタートのマスには赤と青の丸い駒が置かれ、1回休み・3マス戻る・もう1回・ゴールのマスは赤い字で目立たせてありました。
2段目の折り返しを読めていなかった
問題はマスの左上に振られた小さな通し番号です。1段目は1から4まで正しく並んでいました。2段目も左から5・6・7・8と番号が振られていましたが、マスの中の字はスケッチの見た目のまま「8」「3マス戻る」「6」「5」でした。番号の5のマスに「8」と書かれ、8のマスに「5」と書かれている形です。
すごろくの2段目のマスの並び
| Geminiの通し番号 | マスの中の字 | スケッチでの順番 |
|---|---|---|
| 5 | 8 | 8番目 |
| 6 | 3マス戻る | 7番目 |
| 7 | 6 | 6番目 |
| 8 | 5 | 5番目 |
スケッチでは3マス戻るは7番目のマスです。Geminiの盤では6番目になっています。見た目は写せていても、どの順に進むかという意味は読み取れていませんでした。手描きの盤を渡すときは矢印を描くか番号をマスに書き込むと、読み違いを減らせるかもしれません。ただしこの方法は今回は試していません。
赤と青の駒は○、特別マスは盤の上に3つの文字が出ていて○としました。ゴールにぴったり着いたら勝ちの決まりは、返事の文には書いてありました。ただ編集部はサイコロを振って遊んでいないので、駒が交代で進むかとあわせて画面ではたしかめていません。
文章だけで頼むと22.2秒で英語の返事と紫の画面になった
スケッチを渡す意味があるかを見るため、同じ中身を文章だけで頼む回も作りました。新しい会話でCanvasを選び、スケッチは上げずに次の文を送っています。
習慣トラッカーのアプリをコードにしてください。スマホの画面で、上に11月と「連続3日！」、月〜日の7列に「水を2L飲む」「15分読書」「ストレッチ」の3行のチェック欄、下に「＋習慣を追加」のボタンと「今週の達成率」のバーを置いてください。□を押すとチェック、もう一回押すと外れるようにしてください。
合格の線は、スケッチから作った版と同じ9つの要素がそろうことです。あわせて見た目の近さと秒数も比べました。
返事は22.2秒で209字でした。ここで目立ったのは、日本語で頼んだのに返事の文が英語だったことです。返事は「I will now generate a responsive habit tracker web application designed for mobile screens」で始まっていました。プレビューの中の文字は日本語でした。
見た目はスケッチ版とまったく違いました。上の帯は紫で、白い字で「HABIT TRACKER」と英語の見出しが入っています。11月と「連続3日！」の札は頼んだとおりでした。月〜日の7列と3つの習慣も入っています。習慣の名前の横には水のしずくや本の小さなアイコンが足されていました。
ただ「＋習慣を追加」のボタンは、頼んだ下ではなく上の右に「＋追加」として置かれていました。チェックの付いたマスもスケッチとは違う並びでした。文章ではチェックの位置を伝えていないので、これは当然の結果です。
スケッチありと文章だけの違いは見た目と置き場所に出た
同じ習慣トラッカーを、スケッチの写真と文章だけの2通りで頼んだ結果を並べます。要素を9つに分けました。プレビューに出ていれば○で、ずれていれば△です。押して動くかは試していないので、その2項目は「未確認」です。
スケッチありと文章だけの版の違い
| 要素 | スケッチから（19.1秒） | 文章だけ（22.2秒） |
|---|---|---|
| タイトル「習慣トラッカー」 | ○ | △ 英語のHABIT TRACKER |
| 11月 | ○ | ○ |
| 連続3日 | △ 日数が別 | ○ |
| 曜日7列 | ○ | ○ |
| 習慣3つ | ○ | ○ アイコン付き |
| □を押すとチェック | 未確認 | 未確認 |
| もう一回で外す | 未確認 | 未確認 |
| ＋習慣を追加 | ○ 下に大きく | △ 上の右に＋追加 |
| 今週の達成率 | ○ 48% | ○ バーあり |
違いがはっきり出たのは見た目です。スケッチ版は罫線のノートに手描き風の枠で、「連続」の札と達成率の数字を赤で出していました。スケッチで赤く書いた所を赤のまま写しています。文章版は紫の帯とアイコンの、よくあるアプリの見た目でした。
置き場所もスケッチ版のほうが正確でした。「＋習慣を追加」は、スケッチ版では大きなボタンとしてチェック欄の下にありました。文章版では「下に」と書いたのに上へ移っていました。秒数はスケッチ版が19.1秒で文章版が22.2秒でした。大きな差はありません。
文章版のほうが良かった点もあります。「連続3日！」は、文章で日数を書いたとおりに出ました。スケッチ版は、手描きで3日と書いたのに別の日数を出していました。決まった数字を出したいときは、スケッチに加えて文で書き添えると確実です。
まとめると、絵で伝えたほうが早い所はスケッチに任せます。数字や決まりは文章で書くのがよさそうです。スケッチは見た目と配置を一度に伝えられます。習慣の数やボタンの位置を文で細かく書くより、描いて渡すほうが手間も少なく済みます。
秒数を測れた4回は19.1〜25.1秒でプレビューまで出た
5つの頼みの結果を表にまとめます。合格の線は、プレビューに動くアプリの画面が出ることと決めました。この線では、編集部が秒数を測れた4回はすべて合格です。測れなかった1回も、画面にはプレビューが出ていました。
5つの頼みの秒数と結果
| 頼んだこと | Canvas | かかった秒 | 返事の字数 | 結果 |
|---|---|---|---|---|
| 習慣表のスケッチ（1回目） | 選べず | 測れず | 測れず | ○ 2つの回答案とプレビュー |
| 色とフォントと達成率の直し | 選べず | 19.1秒 | 138字 | ○ 緑と丸ゴシック風に |
| すごろくのスケッチ | 選んだ | 25.1秒 | 205字 | △ 2段目の順番がずれた |
| 文章だけの習慣表 | 選んだ | 22.2秒 | 209字 | △ 返事が英語 |
| 習慣表のスケッチ（2回目） | 選ばず | 19.1秒 | 81字 | ○ チェック位置と48% |
秒数は19.1秒から25.1秒の間でした。いちばん時間がかかったのは、ルールの多いすごろくの25.1秒です。習慣トラッカーをスケッチから作った回と色とフォントを直した回は、どちらも19.1秒でした。返事の文字数はスケッチ版の81字がいちばん短く、文章だけの版は209字でした。
返事の文は短く、どれも数行で終わっています。中身はプレビューに任せる作りです。返事の文だけを読んで「完全再現しました」と受け取ると、すごろくの順番のずれを見落とします。プレビューは必ず自分の目で見てください。
この検証では、5回とも画面のモデル表示はFlash-Liteでした。別のモデルに切り替えると結果が変わるかは試していません。
今回わかった使いどころは、社内や家庭で使う小さな道具の試作です。チェック表や当番表のように、画面の形が先に頭にあるものほど向いています。紙に描いてから文章で説明し直す手間が、写真1枚で済みます。
Geminiの手書きアプリ化で気をつける3つのこと
手描きの絵はかなり正確に読まれます。そのぶん、描いたものが全部アプリに入ると考えて描くのが大事です。検証で分かった注意を3つにまとめます。
欄外のメモもアプリの文字になる
習慣トラッカーの色を直した版では、欄外に書いた「（スマホの画面のつもり）」が見出しの下に入りました。描いた人へのメモや下書きの書き込みは、写真を撮る前に消すか枠の外に大きく離すのが安全です。
マスの進む順番は絵だけでは伝わらない
すごろくでは、2段目が右から左へ進むことを読めていませんでした。見た目の位置は写せても、進む順番という意味までは読み取れていません。盤や手順のような順番のあるものは矢印か番号をはっきり描きます。そのうえで文でも順番を書き添えてください。
返事の言葉と数字はプレビューで確かめる
文章だけの回では、日本語で頼んでも英語の返事が来ました。すごろくでは「完全再現しました」と書いてあっても順番がずれていました。返事の文はうのみにせず、プレビューで1つずつ見ていくのが確実です。
料金とプランの条件は、公式ブログには書かれていません。今回はGoogle AI Proのアカウントでだけ試しました。無料版で同じことができるかは、この検証では確かめていません。
プレビューの窓には「エクスポート」と共有のボタンがありました。作ったアプリをスマホのホーム画面に置いて毎日使えるかは、今回は試していません。書き出したコードがそのまま動くかも未確認です。Googleの紹介ページは、Canvasをアイデアをアプリやゲームに変える場所として説明しています。
Canvasで文書やスライドを作る使い方は、Canvasの比較の記事でも試しています。Gemini全体の使い方を先に知りたい人は、ジェミニの初心者向けの使い方から読むと流れがつかめます。
関連する記事とツール
- Gemini（AIツールの個別ページ）
- Geminiのpdf作成の使い方と数字を確かめる場所
- Geminiでクイズ作成する方法とそのまま使えるプロンプト3つ
- Canvasを比較！文書とスライドをAIに頼むプロンプト3つ
- Google、Geminiで7種類の資料編集を開放 スマホはPDFだけだ
手描きの絵がチェックの位置や赤い字まで写ったのは、AInformation編集部も驚きました。社内の小さな道具なら、紙に描いて渡すだけで動く試作が19.1秒で出ました。一方で、すごろくの進む順番のような意味は読み違えていました。返事の文は「完全再現しました」と書いていても、プレビューで1つずつ確かめる手間は省けません。見た目は絵で伝えて数字と決まりは文で書き添えるのが、今いちばん失敗の少ない頼み方です。
- Geminiで手書きの絵からアプリは作れますか？
- 作れます。AInformation編集部が2026年11月6日に習慣トラッカーのスケッチを送ると、19.1秒でアプリのプレビューが開きました。チェックの付いたマスも手描きのとおりで、達成率はチェックの数から約48%と出ました。写真を上げて「このアプリをコードにできますか？」と送るだけで、コードを書く必要はありません。
- Canvasを選ばないとアプリになりませんか？
- 今回の検証では、Canvasを選ばない普通の会話でもプレビューが開きました。同じスケッチと同じ文を送り、19.1秒で81字の返事とアプリの窓が出ています。ただしGoogleの公式ブログはCanvasを選ぶ手順を案内しているので、うまく開かないときはCanvasを選んでから送り直してください。
- 無料版のGeminiでも使えますか？
- この検証では確かめていません。AInformation編集部はGoogle AI Proのアカウントだけで試しました。2026年11月5日の公式ブログにも、使えるプランの条件は書かれていません。無料版で試すときは、まず短いスケッチで送ってプレビューが開くかを見るのが早いです。
- 手書きの日本語の文字はちゃんと読めますか？
- 習慣の名前や11月・曜日・ボタンの文字は正しく読めていました。一方で欄外に書いた「（スマホの画面のつもり）」というメモまでアプリの文字として入りました。すごろくでは、マスの字は読めても2段目が右から左へ進む順番は読み違えていました。順番のあるものは矢印や番号を描き、文でも書き添えてください。
- 作ったアプリの見た目はあとから直せますか？
- 直せます。同じ会話で色を緑系にして文字を丸ゴシックっぽくと頼むと、19.1秒・138字の返事とともにプレビューが更新されました。枠線とチェックは深い緑に、見出しは丸みのある書体に変わりました。なお書き出しや共有のボタンは画面にありましたが、この検証では使っていません。
