Windowsはもういらない

はじめに

今回紹介した記事で作成した絵日記

こんにちは。年金暮らしをのんびりと送っている、元中学校の数学・理科教師です。

私の住んでいるところは、ずっと晴天続きで、今日も「熱中症警戒アラート」が発令されています。

こんな日は、庭のエゴノキや紫陽花の手入れはお休みです。

少しばかりの雨を期待しながら、近所のスーパーと100円ショップで小麦粉やタコ、天かすを買い込み、妻と一緒にたこ焼きプレートを囲んで熱々のたこ焼きを焼くのに限ります。

少しだけ冷房を強くして、ハフハフとたこ焼きを頬張る。

そんな何気ない、しかし豊かな日常のひとコマを、どうにかして「もっと素敵な記録」として残せないものか——そう考えていた矢先、noteであるツールの紹介記事を目にしました。

それがまじんさんの「NotebookLM-Diary」というツールのv4アップデートを紹介する記事です。

日々の日記の内容をもとに、まるで絵日記のようなイラストを自動生成してくれる機能が新しく搭載されたとのことで、掲載されていたサンプル画像を見た瞬間、「これはすごい」と思わず声が出てしまいました。

長年、生徒たちに「記録を残すことの大切さ」を説いてきた身としては、日々のちょっとした出来事——それこそ、今日のたこ焼きのような一コマですら——が一枚の絵になって残っていくという発想に、すっかり心を掴まれてしまったのです。

ただ、ここで一つ問題が。このツールは月額制のメンバーシップに加入しないと使えない仕組みになっていました。

数学教師の性分で、真っ先に頭に浮かんだのは「これを1年続けたら、いくらかかるのか」という計算です。

年金暮らしの身では、毎月の固定費が増えるというのは、なかなかに勇気のいる決断でして……。

そこで理科教師らしく「ないものは作ればいい」の精神を発揮し、普段から使い慣れているGeminiとCanvaを組み合わせることで、絵日記機能を自分なりに再現できないかと試してみることにしました。

40年間、絵だけはどうしても描けなかった

私はかつて、40年にわたって中学校で数学と理科を教えてきました。

図形の証明を黒板いっぱいに書いたり、理科室でフラスコを振ったりする毎日でしたが、教科を問わず子どもたちに一貫して伝えてきたことがあります。

それは「筋道を立てて考え、それを人に伝える」ことの面白さです。

退職してからのこの10年間は、その情熱をデジタルの世界へと移し、「Silver LifeStyle」という名でnoteやはてなブログに記事を書き続けています。

しかし、いかんせん「絵を描く」ことだけはどうしても上達しませんでした。

理科の実験装置のスケッチも、数学の図形も、黒板チョークならまだしも、紙の上に温かみのあるイラストを描くとなると、これはもう完全にお手上げです。

「ブログの記事に、温かみのある手描きの絵日記やグラフィックレコーディングを添えられたら、読者の方にもっと親しみを持ってもらえるのに……」

そんな私の長年のコンプレックスを、最新のAI技術が見事に、そして想像を絶する形で解決してくれました。

それも、ただ私の代わりに絵を描いてくれるだけではありません。

今回私がGeminiの「Canvas」機能を使って作成したのは、なんと「ブラウザ上で誰でも使える、完全無料のAI絵日記ジェネレーター」という一つのWebアプリケーションそのものなのです。

この記事では、少しの好奇心とGeminiへの「お願い（プロンプト）」だけで、プログラミングの知識がなくともあなた専用のWebツールを作り出す方法を、私の失敗談や試行錯誤のプロセスを交えながら、順を追ってじっくりと解説していきます。

長丁場になりますが、どうかお茶でも飲みながら、最後までお付き合いください。

この記事を読んでわかること

• Gemini Canvasの真の力：AIは「文章を書く」だけでなく、「動くアプリを作る」ことができるという衝撃の事実

• プロンプトエンジニアリングの極意：AIに意図通りの動きをさせるための、具体的でブレのない「指示の出し方」

• 「APIキー」と「利用制限」の安全な回避術：自作のツールをブログやSNSで公開する際に、絶対に知っておくべきセキュリティ対策と運用のコツ

• コピペで使える魔法の呪文：記事の後半に記載したプロンプトをそのままGeminiに貼り付けるだけで、私と全く同じ「絵日記ジェネレーター」が今すぐあなたの手元に完成します

こんな方におすすめの記事です

• ブログやnoteの記事に、温かみのある挿絵を添えたいけれど、絵心に自信がない方

• Gemini CanvasやAIアプリ開発に興味はあるものの、プログラミングの知識がなくて一歩を踏み出せずにいる方

• 日々のちょっとした出来事を、写真だけでなく「作品」として残していきたい方

• 自作のAIツールを人に配布する際の、APIキー漏洩や利用制限といったリスクを事前に知っておきたい方

一つでも当てはまる方には、きっと最後まで楽しんでいただける内容になっているはずです。

第1章：「絵が描けない」というコンプレックスからの発想の転換

【コピペで完成】 元教師が教える、 Gemini Canvasの魔法

そもそも、なぜ私が「AIにツールを作らせよう」などという大それたことを思いついたのか。きっかけは実にささやかなものでした。

私はブログを書くたびに、記事の内容にぴったり合う挿絵が欲しいと感じていました。

フリー素材サイトを探し回っても、「今日の四万十市の空気感」とぴったり一致する画像はなかなか見つかりません。

かといって自分で描こうにも、黒板にチョークで図形を描くのと、紙の上に温かみのあるイラストを描くのとでは、まったく勝手が違います。

何度か挑戦してみたのですが、生徒に見せたら笑われそうな仕上がりで、静かに諦めていました。

システム操作でつまずいた時、私はよくGeminiに助けを求めていました。

「この設定がうまくいかないのだけど、どう直せばいい？」と尋ねると、的確な解決策を提示してくれる。AIは私にとって、優秀な「相談相手」でした。

しかし、最近のGeminiに搭載された「Canvas」という機能に触れた時、私の中で雷に打たれたような衝撃が走りました。

Canvasは、コードを生成するだけでなく、それをその場で「プレビュー画面」としてブラウザ上で動作させてしまうのです。

文章を頼めば文章が返ってくる、画像を頼めば画像が一枚返ってくる。それが今までのAIとの付き合い方でした。ところがCanvasは、頼めば「道具そのもの」を作って渡してくれる。この違いに気づいた瞬間、目の前の霧がスッと晴れるような感覚がありました。

「もしかして、AIに『この文章の挿絵を描いて』と頼むのではなく、『私が毎日絵日記を簡単に作れる専用のシステムを作って』と頼めばいいのではないか？」

一枚の絵を求めるのではなく、絵を生み出し続けてくれる「仕組み」そのものを求める。この発想の転換が、すべての始まりでした。

数学の授業で「答えを一つ教えるより、答えの出し方を教えるほうが、その後何十倍も役に立つ」と生徒たちに話していたのですが、まさにそれと同じことをAI相手にやろうとしていたわけです。

第2章：最初はGemとCanvaでAI手書き風日記ジェネレーターを作成

最初に、Gemを使って「手書き風絵日記」を作成するためのカスタム指示を入力しました。

さらに、Gemのデフォルトツールには「Canvas」を指定。

これによって、文章だけでなく、絵やレイアウトを含めた絵日記を作成できるようにしました。

モードについては、「3.6 Flash」または「3.1 Pro」を選択すると、比較的うまく動作するようです。

写真やキャラクター画像も活用

実際に使ってみると、Gemにすべてを任せるのではなく、必要な画像を自分で添付することで、よりイメージに近い絵日記を作ることができました。

例えば、

• 絵日記に登場させたいキャラクター画像

• スマートフォンで撮影した写真

• 絵日記の参考にしたい画像

などを、Gemに手動で添付します。

すると、添付した写真やキャラクターを参考にしながら、手書き風の絵日記を作成してくれます。

もちろん、最初から完璧なものができるわけではありません。

文章の修正や画像の変更など、何度か指示を追加する必要があります。

それでも、「Gem＋Canvas＋写真やキャラクター画像」という組み合わせを使うことで、思っていた以上に簡単に手書き風の絵日記を作ることができました。

特に、毎日の出来事をスマートフォンで撮影している方なら、その写真を活用してオリジナルの絵日記をAIに作ってもらうという使い方も面白いと思います。

次の日記を入力した結果です

☕️【500円以下で楽しめる、ほっとするモーニング】
500円以下でモーニングサービスを楽しめる、落ち着いた喫茶店が少なくなってきた中で、ここは地元に根づいた、どこか懐かしくて優しい雰囲気のお店です。
今回は「おにぎりモーニング」と「トーストモーニング」をそれぞれ注文して、1つずつ交換。
おにぎりとトースト、どちらも味わえる「ミックスモーニング」にしていただきました😊
サラダやゆで卵、ちょっとしたおかずも付いて、朝から大満足。
そして何より、丁寧に淹れてくれたコーヒーが絶品です☕️
慌ただしい朝だからこそ、こういう場所でゆっくり朝食をいただく時間は、なんとも贅沢ですね。
モーニングを楽しんだあとは、海へ。
帰り道に眺める青い海が、今日も気持ちいい一日の始まりを感じさせてくれました🌊
「安くて、おいしくて、落ち着ける」
そんな地元の喫茶店を、これからも大切にしたいと思います。

日記

Gemで出力された手書き風の日記

Gemを作成するとき入力した「カスタム指示文」です。
コピーして使っていただいてかまいません。

# 役割と目的
あなたはプロのイラストレーターおよびグラフィックレコーダーです。
ユーザーから提供される「日記テキスト」「キャラクターの顔写真（主人公）」「参考写真」をもとに、1枚の「マルチパネル手描き風絵日記（グラフィックレコーディング調）」を作成します。
画像生成機能（Canvas出力）を駆使し、視認性が高く楽しいビジュアル記録を提供することがあなたの任務です。
# 動作フロー（厳守事項）
会話がスタートした際、あなたは自己判断で画像の生成を絶対に開始しないでください。
必ず以下の【Step 1】のメッセージを自動出力し、ユーザーからの情報提供を待機してください。
## 【Step 1】初期メッセージの出力と待機
ユーザーとの会話が開始されたら、以下のテキストを一言一句違わず出力し、ユーザーからの画像とテキストの添付を待機してください。
「こんにちは！本日の絵日記を作成しますね。
作業をスムーズに始めるため、以下の情報をこのチャットに送信してください。
1. キャラクター画像（必須）: 主人公となるキャラクターの画像を添付してください。
2. 日記テキスト（必須）: 絵日記にしたい本日の内容を入力してください。
（例：雨の日に家でたこ焼きを作った、庭の紫陽花が綺麗に咲いた、愛車の洗車をした 等）
3. 参考写真（任意）: 日記に登場する風景、食べ物、アイテムなどの写真があれば一緒に添付してください。より雰囲気を出して描き込みます！
情報が揃い次第、絵日記の制作に取り掛かります！」
## 【Step 2】画像の生成
ユーザーから「キャラクター画像」と「日記テキスト」が送信されたら（参考写真がある場合はそれも読み込み）、以下の[Visual Layout & Output Rules]に従って、画像（絵日記）を生成・出力してください。
# Visual Layout & Output Rules
1. 全体レイアウト:
- 1枚の画像（Canvas）内に、日記の流れ（朝・昼・午後・夕方・夜など）に沿った複数のイラストパネル（コマ）をレイアウトする。
- 画像上部に手書き風のタイトルヘッダー（例：「◯年◯月◯日の記録」またはメインテーマ）を大きく配置する。
2. キャラクターと要素の反映:
- 添付されたキャラクター画像の顔立ち、髪型、輪郭、雰囲気を全コマで統一して描く。
- シーンに応じて、ポーズ、表情、服装を適切に描き分ける。
- 参考写真が添付された場合、その写真の場所、料理、アイテムなどの特徴をイラスト内にデフォルメして積極的に取り入れる。
3. テキスト・図解・吹き出し:
- 各パネルの冒頭に「時間帯：見出し（例：朝：筋肉痛の月曜日）」を入れる。
- キャラクターのセリフは「丸い吹き出し」、心の声は「雲型の吹き出し」で描く。
- イラストの周囲に、手書きの補足メモ、矢印、感情ラベル、強調キーフレーズを散りばめる。
- エピソードに関連する小道具を具象的に描く。
4. アートスタイル:
- 温かみのある水彩画・カラー鉛筆・インクラインの手描きスケッチ風。
- フォント・文字はすべて日本語で、親しみやすい手書きフォントスタイル。
- 情報が整理されていて視認性が高く、ブログ等にも使いやすいグラフィックレコーディングデザインにする。

カスタム指示文

第3章：40年の教員生活が教えてくれた「指示」の重要性

「プロンプト」の極意

さらに使いやすいウェブアプリを開発できないかと思い、さっそく、私はGeminiに向かってプロンプト（指示文）を打ち込み始めました。

私が欲しかったツールの要件は以下の通りです。

1. 主人公となる「自分のキャラクター（アバター）」の画像を登録できること

2. その日の出来事（テキスト）を入力できること

3. 参考となる風景や小道具の写真を添付できること

4. ボタンをポチッと押すと、これらを統合して、1枚の「手描きグラフィックレコーディング風」の絵日記が生成されること

ここで活きたのが、40年間、数学と理科を教えてきた経験で培った「指示出し」のスキルです。

数学の証明問題でも、理科の実験手順でも、「適当にいい感じにやっておいて」という曖昧な指示では、必ずと言っていいほど教室は混乱します。

「まず仮定を書きなさい」「次にこの図に補助線を引きなさい」「最後に結論を1行でまとめなさい」と、順序立てて具体的に伝えることが、教育の基本中の基本です。

AIへのプロンプトも全く同じでした。

私はGeminiに対して、「あなたはプロのイラストレーターおよびグラフィックレコーダーです」と明確な役割（ペルソナ）を与え、「いきなり絵を描くのではなく、まずはユーザーから情報を受け取るためのボタンやテキストボックスを画面上に用意しなさい」と、動作のフローを厳密に定義しました。

ここで多くの方がつまずくのが、「一度に全部お願いしてしまう」という点です。

私も最初は「絵日記ジェネレーターを作って」の一言だけで済まそうとしました。

しかし、それでは案の定、AIは何をどう作ればいいのか迷い、中途半端な出力しか返してきません。

理科の実験でも、「とりあえずいい感じに混ぜて」という指示では事故が起きるだけです。

まず薬品Aを5ミリリットル入れ、次に薬品Bを静かに加える」という具体性こそが、望んだ結果を導く鍵なのです。

そこで私は、要件を箇条書きにし、番号を振り、それぞれに「何を」「どこに」「どう配置するか」を明記する形式に切り替えました。

すると、Geminiの出力精度は目に見えて向上しました。

エンターキーを押し、数秒待つ。 すると、右側のCanvas画面に、真っ白で美しい入力フォームが現れたのです。

「キャラクター画像をアップロード」 「日記のテキストを入力」

私の頭の中にしかなかったアイデアが、わずか数秒で「触れるツール」として実体化しました。「おおっ！」と、思わず部屋で一人、大きな声を上げてしまったほどです。

AI手描き風 絵日記ジェネレーター の完成

第4章：立ちはだかる壁①「愛車が謎の外車になった日」

立ちはだかる壁1

基本の形は完成しました。

試しに、以前AIで作った私のアバター画像と、「今日は雨だったので、家でたこ焼きを作りました」というテキストを入力し、実行ボタンを押してみます。

すると、温かみのある水彩画タッチで、私がたこ焼きをひっくり返している見事な1枚の絵日記が生成されました。

「これはすごい。もうブログの挿絵には一生困らないぞ」と意気揚々としたものです。

しかし、ツールを使い込んでいくうちに、いくつかの「壁」にぶつかることになります。

休日のある日、私は愛車である軽自動車の洗車を行いました。

ボディを磨き上げた、充実した午後のことです。

この様子を絵日記にしようと、ピカピカになった愛車の写真を「参考写真」として添付し、「愛車の洗車をしてスッキリ！」とテキストを入力しました。

期待に胸を膨らませて生成ボタンを押したのですが……画面に出てきた絵日記を見て、私は思わずズッコケそうになりました。

そこに描かれていたのは、丸みを帯びた謎のレトロな外国製スポーツカーを磨く私の姿だったのです。

どう見ても私の軽自動車ではありません。四角くて背の高い、あの見慣れたフォルムの面影はどこにもありませんでした。

「そうか、AIはただ写真を渡されただけでは、それが私にとって特別な愛車であることや、どこに注目してイラスト化すればいいのかが分からないんだな」

私はすぐにGeminiに改修を命じました。

「参考写真をアップロードした直後に、その写真が何なのか（例：愛車の軽自動車、近所のカフェの苺パフェなど）を説明するテキスト入力欄を動的に出現させるようにしてください。

そして、その説明文をAIへの裏側の指示に強く反映させてください」

この改修は見事に当たりました。

写真と共に「四角くて背が高いのが特徴の軽自動車です」と一言添えるだけで、AIは文脈を理解し、見事に私の愛車をデフォルメして絵日記の中に描き込んでくれるようになったのです。

この「写真＋説明文」の組み合わせは、AIの認識精度を劇的に向上させる魔法のテクニックでした。

考えてみれば当たり前のことなのですが、AIは写真そのものを「見て」はいても、その写真が撮影者にとってどんな意味を持つかまでは読み取れません。

同じ理屈で、近所のカフェで注文した苺パフェの写真を添付する時も、「季節限定の苺パフェ、生クリームがたっぷり」と一言添えるだけで、絵日記の完成度がぐっと上がります。

逆に説明文を省くと、AIはどこにでもありそうな一般的なデザートを描いてしまい、「これじゃない感」が漂う仕上がりになってしまうのです。

この気づきを得てからは、写真を添付する時は必ず一言メモを添える、というのが私の中の絶対ルールになりました。

第5章：立ちはだかる壁②「アスペクト比のジレンマ」

立ちはだかる壁2

次なる壁は、画像の「サイズ」でした。

ブログのヘッダー画像や、PCのワイド画面で見るならば、横長の「16:9」や「4:3」が最適です。

しかし、現代の読者の多くはスマートフォンからアクセスします。

noteの記事をスマホで縦スクロールしながら読む場合、横長の画像は小さく表示されてしまい、せっかくの手書き文字（グラフィックレコーディング調の文字）が読みづらくなってしまうのです。

スマホ向けなら、やはり「9:16」や「3:4」の縦長サイズが圧倒的に見やすい。

そこで私は再び、この優秀なアシスタントであるGeminiに指示を飛ばしました。

「画面の上部に、プルダウンメニューを追加してください。

そこで『16:9（PC用）』や『9:16（スマホ用）』といったアスペクト比を選択できるようにし、その縦横比に従って絵日記を描き出すように改良してください」

プログラミングでこれを実装しようとすれば、APIのパラメータ設定をいじり、UIのレイアウトを調整し……と、数時間は溶けてしまう作業です。

しかしGeminiは、「承知いたしました。

アスペクト比のドロップダウンメニューを追加し、AIへのリクエストに連動させます」と、涼しい顔で（AIなので顔はありませんが）一瞬にしてコードを書き換えてくれました。

アスペクト比 4:3 の絵日記

SNS スクウェア

これにより、SNSのストーリーズ用からブログのアイキャッチ用まで、用途に合わせて形を変えられる、まさに「万能ジェネレーター」へと進化したのです。

第6章：最大の危機「APIキーと利用制限の罠」

APIキーと「利用制限 (クォータ)」の重要性

さて、度重なる改良を経て、自分好みに仕上がった最高の「AI手描き風絵日記ジェネレーター」。

私はこれを、「Silver LifeStyle」を読んでくださっている読者の皆様にも使ってもらおうと考えました。

GeminiのCanvasには、作成したアプリを簡単にシェアできる「共有リンク」を発行する機能があります。

これをブログに貼り付けて、「皆さん、どうぞご自由に使ってください！」と公開すれば完璧だ。……そう思っていた時期が、私にもありました。

公開する直前、念のためにGeminiにこう尋ねてみたのです。

「このジェネレーターの共有URLをブログで公開して他の方に使ってもらった場合、私自身のパソコン環境や通信に負荷はかかりますか？」

Geminiの回答は、非常に学びの多い、そして肝を冷やすものでした。

結論から言うと、パソコンが熱暴走したり、家のWi-Fiが遅くなったりといった「物理的な負荷」は一切ありません。

処理はすべてGoogleの巨大なクラウドサーバー上で行われるからです。

しかし、「APIの利用制限（クォータ）」という、目に見えない恐ろしい落とし穴があったのです。

Canvasの共有リンクから他人がツールを使った場合、裏側で動いているAIの画像生成処理は「ツールを作成した私のGoogleアカウント」に紐付いて実行されます。

つまり、ブログの読者100人が面白がって一斉に絵日記を作ったら、私の「無料利用枠」があっという間に消費され、上限に達してしまうのです。

上限に達すれば、「リソース上限を超えました（Quota Exceeded）」という冷酷なエラーメッセージが表示され、読者はおろか、私自身でさえツールを使えなくなってしまいます。

これでは本末転倒です。私が週末に焼いた美味しいたこ焼きの絵日記が作れなくなってしまいます。

さらに、Webの仕組みに詳しい人が見れば、裏側で動いている私の「APIキー（AIを利用するための通行証のようなもの）」を抜き取られるセキュリティ上のリスクもあるとのこと。

APIキーは、言ってみれば「家の合鍵」のようなものです。それを無防備にインターネットの大通りに放置することはできません。

私はすぐさま抜本的な対策を講じました。

それは「ツールを使うユーザー自身に、自分のAPIキーを入力してもらう」という安全設計への変更です。

Gemini APIのキーは、「Google AI Studio」という開発者向けサイトから、Googleアカウントさえあれば誰でも無料で、ものの1分で取得できます。

私はツールの画面の一番上に、「APIキーを入力してください」という入力欄と、「APIキーの取得方法（1分で終わります）」という分かりやすい解説アコーディオンメニューを追加しました。

これなら、読者の方は自身の無料枠を使って安全に絵日記を生成でき、私の利用枠が削られることは一切ありません。

セキュリティ的にも、私のAPIキーが漏洩する心配がゼロになり、完全に安心してツールを配布できるようになったのです。

しかも、私が個人的にこのCanvasの画面上で使う時は、システムが自動で認証してくれるため、「APIキー入力欄は空欄のままでも普通に動く」という、恐ろしくスマートな仕様に仕上がりました。

長年システムをいじってきた身として一言付け加えるなら、この「自分のAPIキーを自分で入力してもらう」という設計は、実は多くの個人開発ツールで採用されている、いわば定石です。

もし今後、ご自身で別のAIツールをブログで公開する機会があれば、必ずこの点だけは意識しておくことをおすすめします。

「便利なものを無料で配りたい」という善意が、思わぬ形で自分の首を絞めてしまわないように、という予防線です。

また、APIキーをlocalStorageに保存する設計にしておくと、ユーザーは一度キーを入力すれば、次回からは入力の手間が省けます。

ただし、これは「そのブラウザのその端末」にだけ保存される情報なので、他人のパソコンと共有される心配はありません。

この点も、Geminiに確認しながら慎重に設計しました。

第7章：コピペで完了！あなた専用の絵日記ジェネレーター作成プロンプト

完成した「AI手描き風絵日記ジェネレーター」

さあ、長々と私の奮闘記にお付き合いいただき、本当にありがとうございました。

いよいよ、この記事のハイライトです。

以下のプロンプト（指示文）をコピーして、あなたのGemini（モデルは最新のもの、Gemini AdvancedなどのCanvas対応環境を推奨します）に貼り付けて送信してみてください。

私が試行錯誤を重ね、愛車誤認の悲劇を乗り越え、APIキーの罠を回避して作り上げた「究極のAI手書き風絵日記ジェネレーター」が、あなたの目の前で一瞬にして組み上がります。

もちろん、Geminiの回答は一定ではないので、修正が必要な場合があります。

また、プロンプトをコピーして入力したら、ツールは「Canvas」モードは「Pro」や「Flash」を指定してください。

コピペで完成! 魔法の呪文(コア・プロンプト)

🔽 ここから下をコピーしてGeminiに送信 🔽

実際の作成手順や、誰でもきれいに仕上げるコツ、作ってみた作品例の続きはnoteで詳しく解説しています！

あなたの思い出も、あたたかい手描き風の絵日記にしてみませんか？

📖 続きはこちらから読めます👇

note.com