前回、Gemini Canvasで割り勘アプリを実機検証したところ、「文章だけでここまで作れるのか」と驚かされました。では——もう一方の雄、ChatGPTならどうなのか？

というわけで今回は、まったく同じ1文の指示で、GeminiとChatGPTに同じ割り勘アプリを作らせ、編集部で正面から比較しました。出力のされ方・機能・コードの質・そして計算が本当に合っているかまで、忖度なしで見ていきます。

検証は2026年7月、編集部が実機で実施。Gemini＝無料の「Flash」＋Canvas、ChatGPT＝有料Plusの高性能モデルを使用。AIの出力は日々変わるため、細部は時期・モデルにより異なります。

この記事の前提：GeminiまたはChatGPTのアカウントを持っていて、チャット画面で指示文（プロンプト）を打てる人を想定しています。「アプリを作って」と日本語で頼むだけで動くものが出てくる開発スタイル（vibe coding／バイブコーディングと呼ばれます）の入門としても読めます。用語の基礎から知りたい場合は、先にvibe coding（バイブコーディング）とはを読むと理解しやすくなります。

検証のルール（フェアにやります）

両方に、次の同じ1文を投げました。

シンプルな割り勘計算アプリを作って。合計金額と人数を入力すると1人あたりの金額が計算される。端数（割り切れない分）を誰か1人が多めに払う設定も選べるようにして。日本語UI、スマホでも使いやすいレイアウト、やさしい配色で。

いちばん大きな違い：「その場で動く」か「ファイルで渡す」か

ここが両者の性格を最もよく表していました。

  • Gemini（Canvas）：送信すると、画面の右側にその場で動くプレビューが出現。すぐ触れて、完成をその場で確認できる（「Canvas」は、チャットの隣にコードの実行結果やプレビューを表示する画面のことです）。
  • ChatGPT（高性能モデル）：内部でプログラム（Python）を実行してHTMLファイルを生成し、「ダウンロードして開いてください」という渡し方。チャット内で即プレビュー、とはならず、ファイルを開く一手間が入る。

“作った感”のわかりやすさ・手軽さは、明確にGeminiに軍配。思いついた瞬間に動くものが見えるインパクトは大きいです。

（※ChatGPTにも「Canvas」機能はありますが、今回のように普通に頼むと、高性能モデルはコード実行→ファイル生成の道を選ぶことがあります。渡され方が変わる点は知っておくと良いポイントです。）

機能：作り込みはGeminiが上、堅さはChatGPT

観点 Gemini（Canvas・無料Flash） ChatGPT（高性能モデル・Plus）
出力方式 その場で動くプレビュー Pythonでファイル生成→ダウンロード
端数の分け方 3モード＋丸め単位(1/10/100/1000円) 2モード（均等／1人がまとめて）
うれしい追加機能 金額クイック入力・LINE用コピー 入力エラー検証・アクセシビリティ配慮・プライバシー注記・リセット
コード 単一HTML（Tailwind CDNを利用） 単一HTML（外部依存ゼロ＝完全オフライン可）
計算の検証 プレビュー主体で今回は厳密検証まで踏み込めず コードを精査し正確と確認（後述）

Geminiは、頼んでいない「丸め単位」や3つ目の端数モードまで気を利かせて足してくるサービス精神が魅力。ChatGPTは派手さこそ控えめですが、入力チェック・アクセシビリティ・「データは外部送信しません」の注記まで入れてくる几帳面さが光りました。

現役エンジニア視点：計算は本当に合っているか

レビューメディアとして、ここは外せません。“それっぽく動く”と“正しく動く”は別物だからです。

ChatGPTはHTMLファイルとしてコードを丸ごと渡してくれるので、中身を精査できました。割り勘の核心は次の2行です。

const base = Math.floor(total / people); // 1人あたりの基本額
const remainder = total % people;        // 割り切れない余り
  • 「1人がまとめて払う」→ 1人が base + remainder、残りは base。
  • 「均等に分ける」→ 余りの人数だけ base + 1、残りは base。

いずれも合計が元の金額とピタリ一致する正しい実装で、人数1人・割り切れる場合などの端のケースもきちんと処理されていました。合格です。

一方のGeminiは、その場で動くプレビューが主体で、今回は自動検証の都合上、あらゆる金額での計算値までは詰め切れませんでした（人が実際に触る分には問題なく動作）。コードを手元で受け取って検証したいなら、ファイルで渡すChatGPTのほうが向いている、とも言えます。

いずれにせよ結論は同じ：AIが出したロジックは、公開・実運用の前に人が必ず確認すること。 これは両者共通の鉄則です。

どっちを選ぶ？（用途で分かれます）

Geminiが向く人

  • とにかく手軽に・無料で、動くたたき台を今すぐ見たい
  • 企画・提案で「こういうイメージ」をその場で見せたい
  • 多機能なプロトタイプを一発で出してほしい

ChatGPTが向く人

  • コードを手元に受け取って中身を確認・改造したい
  • 外部依存なしでオフラインでも動く成果物がほしい
  • 入力チェックやアクセシビリティなど、堅めの実装を重視する

つまり、“見せる・試す”のGemini、“受け取る・作り込む”のChatGPT。どちらも「文章だけで動くものが出る」時代を体現していますが、味付けが違います。まずは無料のGeminiで体験 → 本格的に触りたくなったらChatGPTでコードごと受け取る、という順番が編集部のおすすめです。

つまずきどころ：同じ検証を自分でやると起きること

同じ1文を自分で試すと、次のようなところでつまずきがちです。

症状 原因 対処の順番
ChatGPTが生成したファイルを開いても真っ白 ブラウザがダウンロードをブロックしている、もしくは拡張子が.html以外になっている 1. ダウンロード履歴からファイルの拡張子を確認する 2. .htmlでなければ手動で書き換えて開き直す
Geminiのプレビューが固まって動かない 無料枠（Flash）は同時アクセスやモデルの混雑で応答が遅れることがある 1. 数分待って再送信する 2. それでも動かなければ指示文を短く区切って出し直す
日本語UIのはずが英語表記が混ざる 指示文に「日本語UI」と入れても、AIが一部のラベルを英語のまま出すことがある 1. 該当箇所を具体的に指摘して修正を依頼する 2. 直らない場合は該当行だけ自分で書き換える
端数計算の結果が合計と一致しない AIが生成したロジックにエッジケース（人数1人・端数0円など）の考慮漏れがある 1. 極端な入力（1人、割り切れる金額）で必ず手動テストする 2. 合計と内訳の差分を突き合わせる

やってはいけないこと

  • 出力されたコードを未検証のまま公開・共有する：本文でも触れた通り、AIが出したロジックは人の確認なしに実運用へ出さないでください。特に金額計算のような「間違うと実害が出る」処理は要注意です。
  • 無料枠だけで本番用途を判断する：Geminiの無料「Flash」は挙動が変わりやすく、そのまま業務利用の可否を決める材料にはなりません。
  • 1回の出力だけで優劣を決めつける：AIの出力は同じ指示でも毎回微妙に変わります。気になる点があれば、同じ指示をもう一度送って再現するかを確かめてから判断してください。

よくある質問

Q. GeminiとChatGPT、無料でどこまで試せますか？ A. 本検証ではGeminiは無料の「Flash」で十分に動きました。ChatGPTは有料Plusの高性能モデルを使用しており、無料プランでも同様の結果になるとは限りません。無料の範囲で試したい場合は、まずGeminiから始めるのが手軽です。

Q. 出てきたコードは自分で編集してもいいですか？ A. 問題ありません。特にChatGPTはHTMLファイルとして丸ごと受け取れるため、テキストエディタで開いて手を加えられます。Geminiのプレビューもコード表示に切り替えられる場合が多いです。

Q. スマホだけで同じ検証はできますか？ A. チャットで指示を打つところまではスマホでも可能です。ただしChatGPTのようにファイルをダウンロードして中身を確認する作業は、パソコンのほうがやりやすいです。

Q. 割り勘アプリ以外でも同じ違いは出ますか？ A. 出力方式（その場でプレビューか、ファイルで渡すか）の違いは、他の簡単なアプリでも同様の傾向が見られます。ただし機能の作り込みや計算の正確さは、依頼する内容によって変わるため、毎回同じ結論になるとは限りません。

Q. 「Canvas」と「vibe coding」は同じ意味ですか？ A. 違います。Canvasはチャット画面の隣にプレビューやコードを表示する機能の名前です。vibe coding（バイブコーディング）は、AIに自然言語で指示してソフトウェアを作る開発スタイル全体を指す、より広い言葉です。詳しくはvibe coding（バイブコーディング）とはをご覧ください。

まとめ

  • 同じ1文でも、渡され方が違う：Geminiはその場でプレビュー、ChatGPTはHTMLファイルをダウンロード。
  • 機能の作り込み・手軽さはGemini、コードの堅さ・検証しやすさはChatGPT。
  • ChatGPTのコードは計算ロジックを精査し正確と確認。ただし公開前の人によるチェックは両者とも必須。
  • 使い分け：“見せる・試す”ならGemini、“受け取って作り込む”ならChatGPT。

次に読む